lole-ui/dist/components/Layout/layout.js

React UI Component which like a love letter

var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
        if (ar || !(i in from)) {
            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
            ar[i] = from[i];
        }
    }
    return to.concat(ar || Array.prototype.slice.call(from));
};
import React, { createContext } from "react";
import classNames from "classnames";
export var LayoutContext = createContext({
    siderHook: {
        addSider: function () { return null; },
        removeSider: function () { return null; },
    }
});
function generator(_a) {
    var suffixCls = _a.suffixCls, tagName = _a.tagName, displayName = _a.displayName;
    return function (BasicComponent) {
        var Adapter = function (props) {
            var name = "xiOn-".concat(suffixCls);
            return React.createElement(BasicComponent, __assign({ prefixCls: name, tagName: tagName }, props));
        };
        Adapter.displayName = displayName;
        return Adapter;
    };
}
var Basic = function (props) {
    var prefixCls = props.prefixCls, className = props.className, children = props.children, tagName = props.tagName, others = __rest(props, ["prefixCls", "className", "children", "tagName"]);
    var classString = classNames(prefixCls, className);
    return React.createElement(tagName, __assign({ className: classString }, others), children);
};
var BasicLayout = function (props) {
    var _a;
    var _b = React.useState([]), siders = _b[0], setSiders = _b[1];
    var prefixCls = props.prefixCls, className = props.className, children = props.children, hasSider = props.hasSider, Tag = props.tagName, others = __rest(props, ["prefixCls", "className", "children", "hasSider", "tagName"]);
    var classString = classNames(prefixCls, (_a = {},
        _a["".concat(prefixCls, "-has-sider")] = typeof hasSider === 'boolean' ? hasSider : siders.length > 0,
        _a), className);
    var contextValue = React.useMemo(function () { return ({
        siderHook: {
            addSider: function (id) {
                setSiders(function (prev) { return __spreadArray(__spreadArray([], prev, true), [id], false); });
            },
            removeSider: function (id) {
                setSiders(function (prev) { return prev.filter(function (currentId) { return currentId !== id; }); });
            },
        },
    }); }, []);
    return (React.createElement(LayoutContext.Provider, { value: contextValue },
        React.createElement(Tag, __assign({ className: classString }, others), children)));
};
var Layout = generator({
    suffixCls: 'layout',
    tagName: 'section',
    displayName: 'Layout',
})(BasicLayout);
var Header = generator({
    suffixCls: 'layout-header',
    tagName: 'header',
    displayName: 'Header',
})(Basic);
var Footer = generator({
    suffixCls: 'layout-footer',
    tagName: 'footer',
    displayName: 'Footer',
})(Basic);
var Content = generator({
    suffixCls: 'layout-content',
    tagName: 'main',
    displayName: 'Content',
})(Basic);
export { Header, Footer, Content };
export default Layout;