@uiw/react-layout/esm/Layout.js

React components that handle the overall layout of the page.

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
var _excluded = ["prefixCls", "className", "hasSider", "children"];
import React, { useState } from 'react';
import { jsx as _jsx } from "react/jsx-runtime";
export var LayoutContext = /*#__PURE__*/React.createContext({
  addSider: () => null,
  removeSider: () => null
});
var Layout = /*#__PURE__*/React.forwardRef((props, ref) => {
  var {
      prefixCls = 'w-layout',
      className,
      hasSider,
      children
    } = props,
    other = _objectWithoutPropertiesLoose(props, _excluded);
  var [siders, setSiders] = useState([]);
  var addSider = id => {
    setSiders(state => [...state, id]);
  };
  var removeSider = id => {
    setSiders(state => [...state.filter(currentId => currentId !== id)]);
  };
  var cls = [prefixCls, className, typeof hasSider === 'boolean' && hasSider || siders.length > 0 ? prefixCls + "-has-sider" : null].filter(Boolean).join(' ').trim();
  return /*#__PURE__*/_jsx(LayoutContext.Provider, {
    value: {
      addSider,
      removeSider
    },
    children: /*#__PURE__*/_jsx("section", _extends({
      ref: ref,
      className: cls
    }, other, {
      children: children
    }))
  });
});
Layout.displayName = 'Layout';
export default Layout;