@antdp/basic-layouts
Version:
162 lines • 8.7 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import { AuthorizedConfigProvider } from '@antdp/authorized';
import { App, ConfigProvider, Layout, theme as th } from 'antd';
import React, { useMemo } from 'react';
import WarpContent from './Content';
import Header from './Header';
import { LayoutsProvider } from './hooks';
import './index.css';
import { LayoutModel } from './interface';
import Message from './Message';
import SiderMenus from './Sider';
import { defaultThemeColors } from './utils';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export * from './Breadcrumb';
export { default as Breadcrumb } from './Breadcrumb';
export * from './Content';
export { default as WarpContent } from './Content';
export * from './Header';
export { default as Header } from './Header';
export * from './HeaderMenus';
export { default as HeaderMenus } from './HeaderMenus';
export * from './hooks';
export * from './Logo';
export { default as Logo } from './Logo';
export { message, modal, notification } from './Message';
export * from './Sider';
export { default as Sider } from './Sider';
export { default as TopRight } from './TopRight';
export * from './utils';
var BasicLayouts = props => {
var _token$menu, _token$menu2, _token$menu3, _token$header, _token$header2, _token$menu4, _token$menu5, _token$menu6, _token$menu7, _token$menu8, _token$menu9, _token$menu10, _token$menu11, _token$menu12, _token$menu13;
var {
theme = 'light',
token = undefined
} = props;
var layout = props.layout || LayoutModel.MIX;
var render = useMemo(() => {
if (layout === LayoutModel.TOPLEFT) {
return /*#__PURE__*/_jsxs(React.Fragment, {
children: [ANTD_HEAD_IS_SHOW && /*#__PURE__*/_jsx(Layout.Header, {
className: "antdp-basic-layouts-header",
children: /*#__PURE__*/_jsx(Header, {})
}), /*#__PURE__*/_jsxs(Layout, {
children: [ANTD_MENU_IS_SHOW && /*#__PURE__*/_jsx(SiderMenus, {
menuProps: props.menuProps,
theme: theme
}), /*#__PURE__*/_jsx(Layout.Content, {
className: "antdp-basic-layouts-content",
children: /*#__PURE__*/_jsxs(App, {
children: [/*#__PURE__*/_jsx(WarpContent, {}), /*#__PURE__*/_jsx(Message, {})]
})
})]
})]
});
} else if (layout === LayoutModel.SLIDER) {
return /*#__PURE__*/_jsxs(React.Fragment, {
children: [ANTD_MENU_IS_SHOW && /*#__PURE__*/_jsx(SiderMenus, {
menuProps: props.menuProps,
theme: theme
}), /*#__PURE__*/_jsxs(Layout, {
children: [ANTD_HEAD_IS_SHOW && /*#__PURE__*/_jsx(Layout.Header, {
className: "antdp-basic-layouts-header",
children: /*#__PURE__*/_jsx(Header, {})
}), /*#__PURE__*/_jsx(Layout.Content, {
className: "antdp-basic-layouts-content",
children: /*#__PURE__*/_jsxs(App, {
children: [/*#__PURE__*/_jsx(WarpContent, {}), /*#__PURE__*/_jsx(Message, {})]
})
})]
})]
});
} else {
return /*#__PURE__*/_jsx(React.Fragment, {
children: /*#__PURE__*/_jsxs(Layout, {
children: [ANTD_HEAD_IS_SHOW && /*#__PURE__*/_jsx(Layout.Header, {
className: "antdp-basic-layouts-header",
children: /*#__PURE__*/_jsx(Header, {})
}), /*#__PURE__*/_jsxs(Layout, {
children: [ANTD_MENU_IS_SHOW && /*#__PURE__*/_jsx(SiderMenus, {
menuProps: props.menuProps,
theme: theme
}), /*#__PURE__*/_jsx(Layout.Content, {
className: "antdp-basic-layouts-content",
children: /*#__PURE__*/_jsxs(App, {
children: [/*#__PURE__*/_jsx(WarpContent, {}), /*#__PURE__*/_jsx(Message, {})]
})
})]
})]
})
});
}
}, [theme, layout]);
var newData = useMemo(() => {
if (typeof ANTD_AUTH_CONF === 'boolean') {
return {
auth_menu: 'authMenu',
auth_btn: 'authBtn',
auth_check_url: 'menuUrl',
isCheckAuth: true
};
}
if (typeof ANTD_AUTH_CONF === 'object' && ANTD_AUTH_CONF) {
return _extends({
auth_menu: 'authMenu',
auth_btn: 'authBtn',
auth_check_url: 'menuUrl'
}, ANTD_AUTH_CONF || {}, {
isCheckAuth: true
});
}
return {
isCheckAuth: false
};
}, [ANTD_AUTH_CONF]);
var style = {
['--primary-slider-bg']: (token == null || (_token$menu = token.menu) == null ? void 0 : _token$menu.colorMenuBackground) || defaultThemeColors(layout)[theme]['--primary-slider-bg'],
['--primary-slider-trigger-border']: (token == null || (_token$menu2 = token.menu) == null ? void 0 : _token$menu2.triggerColor) || defaultThemeColors(layout)[theme]['--primary-slider-trigger-border'],
['--primary-sider-trigger-text-color']: (token == null || (_token$menu3 = token.menu) == null ? void 0 : _token$menu3.triggerTextColor) || defaultThemeColors(layout)[theme]['--primary-sider-trigger-text-color'],
['--primary-header-bg']: (token == null || (_token$header = token.header) == null ? void 0 : _token$header.colorHeaderBackground) || defaultThemeColors(layout)[theme]['--primary-header-bg'],
['--primary-header-text-color']: (token == null || (_token$header2 = token.header) == null ? void 0 : _token$header2.headerTextColor) || defaultThemeColors(layout)[theme]['--primary-header-text-color'],
['--primary-shadow']: (token == null ? void 0 : token.shadowColor) || defaultThemeColors(layout)[theme]['--primary-shadow'],
['--primary-title-text-color']: (token == null ? void 0 : token.titleColor) || defaultThemeColors(layout)[theme]['--primary-title-text-color'],
['--primary-content-bg']: (token == null ? void 0 : token.contentBackground) || defaultThemeColors(layout)[theme]['--primary-content-bg']
};
return /*#__PURE__*/_jsx(AuthorizedConfigProvider, _extends({}, newData, {
children: /*#__PURE__*/_jsx(LayoutsProvider, _extends({}, props, {
children: /*#__PURE__*/_jsx(ConfigProvider, {
theme: {
algorithm: theme === 'dark' ? th.darkAlgorithm : th.defaultAlgorithm,
components: {
Layout: {
colorBgHeader: 'transparent',
colorBgBody: 'transparent'
},
Menu: {
itemBg: (token == null || (_token$menu4 = token.menu) == null ? void 0 : _token$menu4.colorMenuBackground) || defaultThemeColors(layout)[theme]['--primary-slider-bg'],
subMenuItemBg: (token == null || (_token$menu5 = token.menu) == null ? void 0 : _token$menu5.colorMenuBackground) || defaultThemeColors(layout)[theme]['--primary-slider-bg'],
itemBorderRadius: 4,
itemSelectedBg: (token == null || (_token$menu6 = token.menu) == null ? void 0 : _token$menu6.colorBgMenuItemSelected) || defaultThemeColors(layout)[theme]['itemSelectedBg'],
colorItemBgSelected: (token == null || (_token$menu7 = token.menu) == null ? void 0 : _token$menu7.colorBgMenuItemSelected) || defaultThemeColors(layout)[theme]['colorItemBgSelected'],
itemActiveBg: (token == null || (_token$menu8 = token.menu) == null ? void 0 : _token$menu8.colorBgMenuItemHover) || defaultThemeColors(layout)[theme]['itemActiveBg'],
horizontalItemSelectedBg: (token == null || (_token$menu9 = token.menu) == null ? void 0 : _token$menu9.colorBgMenuItemSelected) || defaultThemeColors(layout)[theme]['horizontalItemSelectedBg'],
colorActiveBarWidth: 0,
colorActiveBarHeight: 0,
colorActiveBarBorderSize: 0,
itemColor: (token == null || (_token$menu10 = token.menu) == null ? void 0 : _token$menu10.colorTextMenu) || defaultThemeColors(layout)[theme]['itemColor'],
itemHoverColor: (token == null || (_token$menu11 = token.menu) == null ? void 0 : _token$menu11.colorTextMenuActive) || defaultThemeColors(layout)[theme]['itemHoverColor'],
itemSelectedColor: (token == null || (_token$menu12 = token.menu) == null ? void 0 : _token$menu12.colorTextMenuSelected) || defaultThemeColors(layout)[theme]['itemSelectedColor'],
colorBgElevated: (token == null || (_token$menu13 = token.menu) == null ? void 0 : _token$menu13.colorBgMenuItemCollapsedElevated) || defaultThemeColors(layout)[theme]['colorBgElevated']
}
}
},
children: /*#__PURE__*/_jsx(Layout, {
className: "antdp-basic-layouts " + props.className,
style: style,
children: render
})
})
}))
}));
};
export default BasicLayouts;