UNPKG

@worktif/purei

Version:

Work TIF Material UI Theme Provider and Customization Suite for React applications with dark mode support and dynamic color schemes

96 lines 3.91 kB
"use strict"; /* * Business Source License 1.1 * * Copyright (C) 2025 Raman Marozau, raman@worktif.com * Use of this software is governed by the Business Source License included in the LICENSE file and at www.mariadb.com/bsl11. * * Change Date: Never * On the date above, in accordance with the Business Source License, use of this software will be governed by the open source license specified in the LICENSE file. * Additional Use Grant: Free for personal and non-commercial research use only. * * * SPDX-License-Identifier: BUSL-1.1 */ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { if (k2 === undefined) k2 = k; var desc = Object.getOwnPropertyDescriptor(m, k); if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { desc = { enumerable: true, get: function() { return m[k]; } }; } Object.defineProperty(o, k2, desc); }) : (function(o, m, k, k2) { if (k2 === undefined) k2 = k; o[k2] = m[k]; })); var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) { Object.defineProperty(o, "default", { enumerable: true, value: v }); }) : function(o, v) { o["default"] = v; }); var __importStar = (this && this.__importStar) || (function () { var ownKeys = function(o) { ownKeys = Object.getOwnPropertyNames || function (o) { var ar = []; for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k; return ar; }; return ownKeys(o); }; return function (mod) { if (mod && mod.__esModule) return mod; var result = {}; if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]); __setModuleDefault(result, mod); return result; }; })(); Object.defineProperty(exports, "__esModule", { value: true }); exports.WorkTifLayout = void 0; const React = __importStar(require("react")); const react_1 = require("react"); const material_1 = require("@mui/material"); const styles_1 = require("@mui/styles"); const utils_1 = require("../../../../utils"); const useStyles = (0, styles_1.makeStyles)((theme) => ({ animateIn: { opacity: 1, transform: 'scale(1)', }, animateOut: { opacity: 0, transform: 'scale(0.9)', filter: 'blur(5px)', }, })); /** * Function component representing a base-layout for displaying work-related content in a web application. * This base-layout includes a navigation bar, search field, category tabs, and cards for displaying content. * @param {Object} props - The props for the WorkTifLayout component. * @param {any} props.children - The children elements to be rendered within the base-layout. * @returns {JSX.Element} A React functional component representing the work base-layout. */ const WorkTifLayout = ({ children }) => { const classes = useStyles(); const [pageShade, setPageShade] = (0, react_1.useState)(0); const [shouldPageRefreshed, setShouldPageRefreshed] = (0, react_1.useState)(false); React.useEffect(() => { setPageShade(utils_1.EMPTY_NUMBER); }, []); React.useEffect(() => { if (pageShade > 0) { setShouldPageRefreshed(true); } }, []); return (React.createElement(material_1.Box, { sx: (theme) => ({ display: 'flex', flexDirection: 'column', minHeight: '100vh', }) }, React.createElement(material_1.Box, { sx: (theme) => ({ transition: 'opacity 1s ease, transform 0.7s ease', position: 'relative', }), className: shouldPageRefreshed ? classes.animateOut : classes.animateIn }, children))); }; exports.WorkTifLayout = WorkTifLayout; //# sourceMappingURL=layout-worktif.js.map