import * as tslib_1 from "tslib";
import * as React from 'react';
import { useState, useContext, useEffect } from 'react';
import classnames from 'classnames';
import Icon from '../icon';
import SiderContext from './sider-context';
var defaultProps = {
    prefixCls: 'ty-layout-sider',
    defaultCollapsed: false,
    width: 200,
    collapsedWidth: 70,
    theme: 'dark',
    trigger: null,
    collapsible: false,
};
var Sider = function (props) {
    var _a;
    var collapsible = props.collapsible, collapsedWidth = props.collapsedWidth, width = props.width, onCollapse = props.onCollapse, theme = props.theme, trigger = props.trigger, prefixCls = props.prefixCls, className = props.className, style = props.style, children = props.children;
    var collapsed;
    if ('collapsed' in props) {
        collapsed = props.collapsed;
    }
    else {
        collapsed = props.defaultCollapsed;
    }
    var _b = useState(collapsed), sideCollapsed = _b[0], setSideCollapsed = _b[1];
    var siderHook = useContext(SiderContext);
    var siderWidth = sideCollapsed ? collapsedWidth : width;
    var outerStyle = tslib_1.__assign({}, style, { width: siderWidth, maxWidth: siderWidth, minWidth: siderWidth });
    var cls = classnames(prefixCls, className, (_a = {},
        _a[prefixCls + "_light"] = theme === 'light',
        _a));
    var _collapseBtnOnClick = function () {
        var collapsedVal = !sideCollapsed;
        if (!('collapsed' in props)) {
            setSideCollapsed(collapsedVal);
        }
        onCollapse && onCollapse(collapsedVal);
    };
    var _renderTrigger = function () {
        if (!collapsible) {
            return null;
        }
        if (trigger) {
            return trigger;
        }
        return (React.createElement("div", { className: prefixCls + "__trigger", onClick: _collapseBtnOnClick },
            React.createElement(Icon, { type: "left", className: prefixCls + "__trigger-icon" })));
    };
    useEffect(function () {
        if ('collapsed' in props) {
            setSideCollapsed(props.collapsed);
        }
        siderHook.addSider();
        return function () {
            siderHook.removeSider();
        };
    });
    return (React.createElement("div", { className: cls, style: outerStyle },
        React.createElement("div", { className: prefixCls + "__children" }, children),
        _renderTrigger()));
};
Sider.defaultProps = defaultProps;
export default Sider;
//# sourceMappingURL=sider.js.map