@rio-cloud/rio-uikit 2.0.0-beta.1 → 2.0.0-beta.2

package/components/applicationHeader/NavItems.js

@@ -1,122 +1,66 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useState, useEffect, useLayoutEffect, useRef } from 'react';
-import classNames from 'classnames';
-import { isEmpty } from 'es-toolkit/compat';
-import useClickOutside from "../../hooks/useClickOutside.js";
-import CollapsedNavItem from "./CollapsedNavItem.js";
-const collapsedDropdownWidth = 50;
-const paddingLeft = 15;
-export const NavItems = (props) => {
-    const { navItems: externalNavItems = [], actionBarItems = [], containerWidth } = props;
-    const [isCollapsedNavItemOpen, setIsCollapsedNavItemOpen] = useState(false);
-    const [collapsedNavItems, setCollapsedNavItems] = useState([]);
-    const [visibleNavItems, setVisibleNavItems] = useState([]);
-    const collapsedDropdownRef = useClickOutside(() => setIsCollapsedNavItemOpen(false));
-    const navigationRef = useRef(null);
-    const isOffscreen = useRef(true);
-    // console.log({ containerWidth });
-    // Before any new changes are applied
-    useEffect(() => {
-        // After the component received new props, every nav item has to be rendered offscreen
-        // again without collapsing them into the dropdown to measure its width
-        isOffscreen.current = true;
-    }, [externalNavItems, actionBarItems, containerWidth]);
-    // After the component has been rendered
-    useLayoutEffect(() => {
-        // After every nav item was rendered offscreen again we need to recalculate the width
-        // of the items again and render the result with possible collapsible dropdown.
-        if (isOffscreen.current) {
-            computeNavItems();
-        }
-    });
-    const getAvailableWidth = (element) => {
-        // Get relevant elements
-        // const parent = element.parentNode;
-        // const actionBar = head(parent.getElementsByClassName('ApplicationActionBar'));
-        // const actionBarWidth = actionBar && actionBar.childElementCount > 0 ? actionBar.scrollWidth : 0;
-        // Since the collapsed dropdown has not been rendered yet,
-        // use the fixed with for it to compute available width
-        const availableWidth = element.scrollWidth - collapsedDropdownWidth - paddingLeft;
-        return availableWidth;
-    };
-    const computeNavItems = () => {
-        const element = navigationRef.current;
-        if (!element) {
-            return;
-        }
-        const navItems = [...(element.children || [])];
-        const availableWidth = getAvailableWidth(element);
-        if (availableWidth < 0) {
-            return;
-        }
-        // Iterate over all rendered navItems to figure out their widths in order to figure out
-        // which navItems need to be rendered in the collapsed dropdown
-        let requiredNavItemsSize = 0;
-        const updatedVisibleItems = [];
-        const updatedCollapsedItems = [];
-        navItems.forEach(item => {
-            if (!item.className) {
-                return;
-            }
-            // Calculate the remaining width
-            requiredNavItemsSize = requiredNavItemsSize + item.scrollWidth;
-            // console.log({ requiredNavItemsSize });
-            // Use the navItems.key to find corresponding navItems for each DOM node
-            const matchedNavItem = externalNavItems.find(navItem => {
-                const dataAttr = item.attributes.getNamedItem('data-nav-item-key');
-                return dataAttr && navItem.key === dataAttr.value;
-            });
-            if (!matchedNavItem) {
-                return;
-            }
-            // Add navItems to the visible group until the available with exceeds.
-            // All other navItems will be added to the collapsed group
-            if (availableWidth > requiredNavItemsSize) {
-                updatedVisibleItems.push(matchedNavItem);
-            }
-            else {
-                updatedCollapsedItems.push(matchedNavItem);
-            }
-        });
-        // Set the state to render the navItems again
-        isOffscreen.current = false;
-        setVisibleNavItems(updatedVisibleItems);
-        setCollapsedNavItems(updatedCollapsedItems);
-    };
-    const handleCollapsedDropdown = () => {
-        // When the dropdown is open, set showCollapsedNavItems to false so all submodule items
-        // are rendered and their size can be computed
-        if (isCollapsedNavItemOpen) {
-            setIsCollapsedNavItemOpen(false);
-        }
-        else {
-            // When the dropdown is closed, just set the flag to open is enough
-            setIsCollapsedNavItemOpen(true);
-        }
-    };
-    const handleCollapsedNavItemSelected = () => {
-        // Close collapsed dropdown on item select
-        if (isCollapsedNavItemOpen) {
-            setIsCollapsedNavItemOpen(false);
-        }
-    };
-    const renderNavItem = (navItem, isItemOffscreen) => {
-        return (_jsx("li", { className: `submodule ${isItemOffscreen ? 'offscreen' : ''}`, "data-nav-item-key": navItem.key, children: navItem.route }, navItem.key));
-    };
-    const renderNavItems = () => {
-        if (!isOffscreen.current && !isEmpty(collapsedNavItems)) {
-            const visibleItems = visibleNavItems.map(navItem => renderNavItem(navItem, isOffscreen.current));
-            return [
-                ...visibleItems,
-                _jsx(CollapsedNavItem, { ref: collapsedDropdownRef, show: isCollapsedNavItemOpen, navItems: collapsedNavItems, actionBarItems: actionBarItems, onDropdownClick: handleCollapsedDropdown, onItemClick: handleCollapsedNavItemSelected }, 'CollapsedNavItem'),
-            ];
-        }
-        return externalNavItems.map(navItem => renderNavItem(navItem, isOffscreen.current));
-    };
-    // As all navItems need to be added to the DOM first in order to get their real size
-    // the computation whether a navItem need to be shown under the collapsed dropdown or not
-    // needs to be done after the component did mount to the DOM.
-    const classes = classNames('SubmoduleNavigation', 'nav');
-    return (_jsx("ul", { className: classes, ref: navigationRef, children: renderNavItems() }));
+import { jsx as i } from "react/jsx-runtime";
+import { useState as m, useRef as b, useEffect as L, useLayoutEffect as V } from "react";
+import j from "classnames";
+import { isEmpty as q } from "es-toolkit/compat";
+import z from "../../hooks/useClickOutside.js";
+import B from "./CollapsedNavItem.js";
+const $ = 50, F = 15, Q = (C) => {
+  const { navItems: r = [], actionBarItems: d = [], containerWidth: k } = C, [n, a] = m(!1), [u, W] = m([]), [y, g] = m([]), w = z(() => a(!1)), f = b(null), t = b(!0);
+  L(() => {
+    t.current = !0;
+  }, [r, d, k]), V(() => {
+    t.current && E();
+  });
+  const D = (e) => e.scrollWidth - $ - F, E = () => {
+    const e = f.current;
+    if (!e)
+      return;
+    const s = [...e.children || []], v = D(e);
+    if (v < 0)
+      return;
+    let o = 0;
+    const I = [], N = [];
+    s.forEach((l) => {
+      if (!l.className)
+        return;
+      o = o + l.scrollWidth;
+      const c = r.find((A) => {
+        const h = l.attributes.getNamedItem("data-nav-item-key");
+        return h && A.key === h.value;
+      });
+      c && (v > o ? I.push(c) : N.push(c));
+    }), t.current = !1, g(I), W(N);
+  }, O = () => {
+    a(!n);
+  }, S = () => {
+    n && a(!1);
+  }, p = (e, s) => /* @__PURE__ */ i(
+    "li",
+    {
+      className: `submodule ${s ? "offscreen" : ""}`,
+      "data-nav-item-key": e.key,
+      children: e.route
+    },
+    e.key
+  ), x = () => !t.current && !q(u) ? [
+    ...y.map((s) => p(s, t.current)),
+    /* @__PURE__ */ i(
+      B,
+      {
+        ref: w,
+        show: n,
+        navItems: u,
+        actionBarItems: d,
+        onDropdownClick: O,
+        onItemClick: S
+      },
+      "CollapsedNavItem"
+    )
+  ] : r.map((e) => p(e, t.current)), R = j("SubmoduleNavigation", "nav");
+  return /* @__PURE__ */ i("ul", { className: R, ref: f, children: x() });
 };
-export default NavItems;
+export {
+  Q as NavItems,
+  Q as default
+};
+//# sourceMappingURL=NavItems.js.map

package/components/applicationHeader/NavItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavItems.js","sources":["../../../src/components/applicationHeader/NavItems.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState, useEffect, useLayoutEffect, useRef } from 'react';\nimport classNames from 'classnames';\nimport { isEmpty } from 'es-toolkit/compat';\n\nimport useClickOutside from '../../hooks/useClickOutside';\nimport CollapsedNavItem from './CollapsedNavItem';\nimport type { ModulePropType } from './ApplicationHeader';\n\nconst collapsedDropdownWidth = 50;\nconst paddingLeft = 15;\n\nexport type NavItemsProps = {\n    navItems?: ModulePropType[];\n    containerWidth: number;\n    actionBarItems?: React.ReactNode[];\n};\n\nexport const NavItems = (props: NavItemsProps) => {\n    const { navItems: externalNavItems = [], actionBarItems = [], containerWidth } = props;\n\n    const [isCollapsedNavItemOpen, setIsCollapsedNavItemOpen] = useState(false);\n    const [collapsedNavItems, setCollapsedNavItems] = useState<ModulePropType[]>([]);\n    const [visibleNavItems, setVisibleNavItems] = useState<ModulePropType[]>([]);\n\n    const collapsedDropdownRef = useClickOutside(() => setIsCollapsedNavItemOpen(false));\n\n    const navigationRef = useRef(null);\n    const isOffscreen = useRef(true);\n\n    // console.log({ containerWidth });\n\n    // Before any new changes are applied\n    useEffect(() => {\n        // After the component received new props, every nav item has to be rendered offscreen\n        // again without collapsing them into the dropdown to measure its width\n        isOffscreen.current = true;\n    }, [externalNavItems, actionBarItems, containerWidth]);\n\n    // After the component has been rendered\n    useLayoutEffect(() => {\n        // After every nav item was rendered offscreen again we need to recalculate the width\n        // of the items again and render the result with possible collapsible dropdown.\n        if (isOffscreen.current) {\n            computeNavItems();\n        }\n    });\n\n    const getAvailableWidth = (element: HTMLElement) => {\n        // Get relevant elements\n        // const parent = element.parentNode;\n\n        // const actionBar = head(parent.getElementsByClassName('ApplicationActionBar'));\n        // const actionBarWidth = actionBar && actionBar.childElementCount > 0 ? actionBar.scrollWidth : 0;\n\n        // Since the collapsed dropdown has not been rendered yet,\n        // use the fixed with for it to compute available width\n        const availableWidth = element.scrollWidth - collapsedDropdownWidth - paddingLeft;\n        return availableWidth;\n    };\n\n    const computeNavItems = () => {\n        const element: HTMLElement | null = navigationRef.current;\n\n        if (!element) {\n            return;\n        }\n\n        const navItems = [...((element as HTMLElement).children || [])];\n\n        const availableWidth = getAvailableWidth(element);\n\n        if (availableWidth < 0) {\n            return;\n        }\n\n        // Iterate over all rendered navItems to figure out their widths in order to figure out\n        // which navItems need to be rendered in the collapsed dropdown\n        let requiredNavItemsSize = 0;\n\n        const updatedVisibleItems: ModulePropType[] = [];\n        const updatedCollapsedItems: ModulePropType[] = [];\n\n        navItems.forEach(item => {\n            if (!item.className) {\n                return;\n            }\n\n            // Calculate the remaining width\n            requiredNavItemsSize = requiredNavItemsSize + item.scrollWidth;\n\n            // console.log({ requiredNavItemsSize });\n\n            // Use the navItems.key to find corresponding navItems for each DOM node\n            const matchedNavItem = externalNavItems.find(navItem => {\n                const dataAttr = item.attributes.getNamedItem('data-nav-item-key');\n                return dataAttr && navItem.key === dataAttr.value;\n            });\n\n            if (!matchedNavItem) {\n                return;\n            }\n\n            // Add navItems to the visible group until the available with exceeds.\n            // All other navItems will be added to the collapsed group\n            if (availableWidth > requiredNavItemsSize) {\n                updatedVisibleItems.push(matchedNavItem);\n            } else {\n                updatedCollapsedItems.push(matchedNavItem);\n            }\n        });\n\n        // Set the state to render the navItems again\n        isOffscreen.current = false;\n\n        setVisibleNavItems(updatedVisibleItems);\n        setCollapsedNavItems(updatedCollapsedItems);\n    };\n\n    const handleCollapsedDropdown = () => {\n        // When the dropdown is open, set showCollapsedNavItems to false so all submodule items\n        // are rendered and their size can be computed\n        if (isCollapsedNavItemOpen) {\n            setIsCollapsedNavItemOpen(false);\n        } else {\n            // When the dropdown is closed, just set the flag to open is enough\n            setIsCollapsedNavItemOpen(true);\n        }\n    };\n\n    const handleCollapsedNavItemSelected = () => {\n        // Close collapsed dropdown on item select\n        if (isCollapsedNavItemOpen) {\n            setIsCollapsedNavItemOpen(false);\n        }\n    };\n\n    const renderNavItem = (navItem: ModulePropType, isItemOffscreen: boolean) => {\n        return (\n            <li\n                key={navItem.key}\n                className={`submodule ${isItemOffscreen ? 'offscreen' : ''}`}\n                data-nav-item-key={navItem.key}\n            >\n                {navItem.route}\n            </li>\n        );\n    };\n\n    const renderNavItems = () => {\n        if (!isOffscreen.current && !isEmpty(collapsedNavItems)) {\n            const visibleItems = visibleNavItems.map(navItem => renderNavItem(navItem, isOffscreen.current));\n\n            return [\n                ...visibleItems,\n                <CollapsedNavItem\n                    key='CollapsedNavItem'\n                    ref={collapsedDropdownRef}\n                    show={isCollapsedNavItemOpen}\n                    navItems={collapsedNavItems}\n                    actionBarItems={actionBarItems}\n                    onDropdownClick={handleCollapsedDropdown}\n                    onItemClick={handleCollapsedNavItemSelected}\n                />,\n            ];\n        }\n\n        return externalNavItems.map(navItem => renderNavItem(navItem, isOffscreen.current));\n    };\n\n    // As all navItems need to be added to the DOM first in order to get their real size\n    // the computation whether a navItem need to be shown under the collapsed dropdown or not\n    // needs to be done after the component did mount to the DOM.\n\n    const classes = classNames('SubmoduleNavigation', 'nav');\n\n    return (\n        <ul className={classes} ref={navigationRef}>\n            {renderNavItems()}\n        </ul>\n    );\n};\n\nexport default NavItems;\n"],"names":["collapsedDropdownWidth","paddingLeft","NavItems","props","externalNavItems","actionBarItems","containerWidth","isCollapsedNavItemOpen","setIsCollapsedNavItemOpen","useState","collapsedNavItems","setCollapsedNavItems","visibleNavItems","setVisibleNavItems","collapsedDropdownRef","useClickOutside","navigationRef","useRef","isOffscreen","useEffect","useLayoutEffect","computeNavItems","getAvailableWidth","element","navItems","availableWidth","requiredNavItemsSize","updatedVisibleItems","updatedCollapsedItems","item","matchedNavItem","navItem","dataAttr","handleCollapsedDropdown","handleCollapsedNavItemSelected","renderNavItem","isItemOffscreen","jsx","renderNavItems","isEmpty","CollapsedNavItem","classes","classNames"],"mappings":";;;;;;AASA,MAAMA,IAAyB,IACzBC,IAAc,IAQPC,IAAW,CAACC,MAAyB;AAC9C,QAAM,EAAE,UAAUC,IAAmB,CAAA,GAAI,gBAAAC,IAAiB,CAAA,GAAI,gBAAAC,EAAA,IAAmBH,GAE3E,CAACI,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GACpE,CAACC,GAAmBC,CAAoB,IAAIF,EAA2B,CAAA,CAAE,GACzE,CAACG,GAAiBC,CAAkB,IAAIJ,EAA2B,CAAA,CAAE,GAErEK,IAAuBC,EAAgB,MAAMP,EAA0B,EAAK,CAAC,GAE7EQ,IAAgBC,EAAO,IAAI,GAC3BC,IAAcD,EAAO,EAAI;AAK/B,EAAAE,EAAU,MAAM;AAGZ,IAAAD,EAAY,UAAU;AAAA,EAC1B,GAAG,CAACd,GAAkBC,GAAgBC,CAAc,CAAC,GAGrDc,EAAgB,MAAM;AAGlB,IAAIF,EAAY,WACZG,EAAA;AAAA,EAER,CAAC;AAED,QAAMC,IAAoB,CAACC,MASAA,EAAQ,cAAcvB,IAAyBC,GAIpEoB,IAAkB,MAAM;AAC1B,UAAME,IAA8BP,EAAc;AAElD,QAAI,CAACO;AACD;AAGJ,UAAMC,IAAW,CAAC,GAAKD,EAAwB,YAAY,CAAA,CAAG,GAExDE,IAAiBH,EAAkBC,CAAO;AAEhD,QAAIE,IAAiB;AACjB;AAKJ,QAAIC,IAAuB;AAE3B,UAAMC,IAAwC,CAAA,GACxCC,IAA0C,CAAA;AAEhD,IAAAJ,EAAS,QAAQ,CAAAK,MAAQ;AACrB,UAAI,CAACA,EAAK;AACN;AAIJ,MAAAH,IAAuBA,IAAuBG,EAAK;AAKnD,YAAMC,IAAiB1B,EAAiB,KAAK,CAAA2B,MAAW;AACpD,cAAMC,IAAWH,EAAK,WAAW,aAAa,mBAAmB;AACjE,eAAOG,KAAYD,EAAQ,QAAQC,EAAS;AAAA,MAChD,CAAC;AAED,MAAKF,MAMDL,IAAiBC,IACjBC,EAAoB,KAAKG,CAAc,IAEvCF,EAAsB,KAAKE,CAAc;AAAA,IAEjD,CAAC,GAGDZ,EAAY,UAAU,IAEtBL,EAAmBc,CAAmB,GACtChB,EAAqBiB,CAAqB;AAAA,EAC9C,GAEMK,IAA0B,MAAM;AAGlC,IACIzB,EADA,CAAAD,CAC+B;AAAA,EAKvC,GAEM2B,IAAiC,MAAM;AAEzC,IAAI3B,KACAC,EAA0B,EAAK;AAAA,EAEvC,GAEM2B,IAAgB,CAACJ,GAAyBK,MAExC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,WAAW,aAAaD,IAAkB,cAAc,EAAE;AAAA,MAC1D,qBAAmBL,EAAQ;AAAA,MAE1B,UAAAA,EAAQ;AAAA,IAAA;AAAA,IAJJA,EAAQ;AAAA,EAAA,GASnBO,IAAiB,MACf,CAACpB,EAAY,WAAW,CAACqB,EAAQ7B,CAAiB,IAG3C;AAAA,IACH,GAHiBE,EAAgB,IAAI,CAAAmB,MAAWI,EAAcJ,GAASb,EAAY,OAAO,CAAC;AAAA,IAI3F,gBAAAmB;AAAA,MAACG;AAAA,MAAA;AAAA,QAEG,KAAK1B;AAAA,QACL,MAAMP;AAAA,QACN,UAAUG;AAAA,QACV,gBAAAL;AAAA,QACA,iBAAiB4B;AAAA,QACjB,aAAaC;AAAA,MAAA;AAAA,MANT;AAAA,IAAA;AAAA,EAOR,IAID9B,EAAiB,IAAI,CAAA2B,MAAWI,EAAcJ,GAASb,EAAY,OAAO,CAAC,GAOhFuB,IAAUC,EAAW,uBAAuB,KAAK;AAEvD,2BACK,MAAA,EAAG,WAAWD,GAAS,KAAKzB,GACxB,eACL;AAER;"}

package/components/applicationLayout/ApplicationLayout.d.ts

@@ -1,7 +1,7 @@
-import { type PropsWithChildren, type MutableRefObject, type RefAttributes, type ForwardRefExoticComponent } from 'react';
-import ApplicationLayoutHeader from './ApplicationLayoutHeader';
-import ApplicationLayoutSidebar from './ApplicationLayoutSidebar';
-import ApplicationLayoutBody from './ApplicationLayoutBody';
+import { PropsWithChildren, MutableRefObject, RefAttributes, ForwardRefExoticComponent } from 'react';
+import { default as ApplicationLayoutHeader } from './ApplicationLayoutHeader';
+import { default as ApplicationLayoutSidebar } from './ApplicationLayoutSidebar';
+import { default as ApplicationLayoutBody } from './ApplicationLayoutBody';
 export type ApplicationLayoutProps = {
     /**
      * A React ref function assigned to the wrapper element.

package/components/applicationLayout/ApplicationLayout.js

@@ -1,20 +1,19 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/* eslint-disable import/order */
-import { forwardRef, } from 'react';
-import classNames from 'classnames';
-import ApplicationLayoutHeader from "./ApplicationLayoutHeader.js";
-import ApplicationLayoutSidebar from "./ApplicationLayoutSidebar.js";
-import ApplicationLayoutBody from "./ApplicationLayoutBody.js";
-import { initDocumentBootstrapping } from "../../utils/init/initDocumentBootstrapping.js";
-// initializes document bootstrapping - keep the import to avoid being tree-shaken
-// noinspection JSIgnoredPromiseFromCall
-initDocumentBootstrapping();
-const ApplicationLayout = forwardRef((props, ref) => {
-    const { className, layoutRef, children, ...remainingProps } = props;
-    const classes = classNames('ApplicationLayout', className);
-    return (_jsx("div", { ...remainingProps, ref: ref || layoutRef, className: classes, children: children }));
+import { jsx as s } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import c from "classnames";
+import f from "./ApplicationLayoutHeader.js";
+import l from "./ApplicationLayoutSidebar.js";
+import d from "./ApplicationLayoutBody.js";
+import { initDocumentBootstrapping as u } from "../../utils/init/initDocumentBootstrapping.js";
+u();
+const o = n((r, t) => {
+  const { className: a, layoutRef: i, children: p, ...e } = r, m = c("ApplicationLayout", a);
+  return /* @__PURE__ */ s("div", { ...e, ref: t || i, className: m, children: p });
 });
-ApplicationLayout.Header = ApplicationLayoutHeader;
-ApplicationLayout.Sidebar = ApplicationLayoutSidebar;
-ApplicationLayout.Body = ApplicationLayoutBody;
-export default ApplicationLayout;
+o.Header = f;
+o.Sidebar = l;
+o.Body = d;
+export {
+  o as default
+};
+//# sourceMappingURL=ApplicationLayout.js.map

package/components/applicationLayout/ApplicationLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationLayout.js","sources":["../../../src/components/applicationLayout/ApplicationLayout.tsx"],"sourcesContent":["/* eslint-disable import/order */\nimport {\n    forwardRef,\n    type PropsWithChildren,\n    type ForwardedRef,\n    type MutableRefObject,\n    type RefAttributes,\n    type ForwardRefExoticComponent,\n} from 'react';\nimport classNames from 'classnames';\n\nimport ApplicationLayoutHeader from './ApplicationLayoutHeader';\nimport ApplicationLayoutSidebar from './ApplicationLayoutSidebar';\nimport ApplicationLayoutBody from './ApplicationLayoutBody';\nimport { initDocumentBootstrapping } from '../../utils/init/initDocumentBootstrapping';\n\n// initializes document bootstrapping - keep the import to avoid being tree-shaken\n// noinspection JSIgnoredPromiseFromCall\ninitDocumentBootstrapping();\n\nexport type ApplicationLayoutProps = {\n    /**\n     * A React ref function assigned to the wrapper element.\n     */\n    layoutRef?: MutableRefObject<HTMLDivElement | null>;\n\n    /**\n     * Additional class names that are added to the respective component\n     */\n    className?: string;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ApplicationLayoutProps>;\n\ntype ApplicationLayoutType = ForwardRefExoticComponent<Props & RefAttributes<HTMLDivElement>> & {\n    Header: typeof ApplicationLayoutHeader;\n    Sidebar: typeof ApplicationLayoutSidebar;\n    Body: typeof ApplicationLayoutBody;\n};\n\nconst ApplicationLayout = forwardRef((props: Props, ref: Ref) => {\n    const { className, layoutRef, children, ...remainingProps } = props;\n\n    const classes = classNames('ApplicationLayout', className);\n\n    return (\n        <div {...remainingProps} ref={ref || layoutRef} className={classes}>\n            {children}\n        </div>\n    );\n}) as ApplicationLayoutType;\n\nApplicationLayout.Header = ApplicationLayoutHeader;\nApplicationLayout.Sidebar = ApplicationLayoutSidebar;\nApplicationLayout.Body = ApplicationLayoutBody;\n\nexport default ApplicationLayout;\n"],"names":["initDocumentBootstrapping","ApplicationLayout","forwardRef","props","ref","className","layoutRef","children","remainingProps","classes","classNames","jsx","ApplicationLayoutHeader","ApplicationLayoutSidebar","ApplicationLayoutBody"],"mappings":";;;;;;;AAkBAA,EAAA;AAuBA,MAAMC,IAAoBC,EAAW,CAACC,GAAcC,MAAa;AAC7D,QAAM,EAAE,WAAAC,GAAW,WAAAC,GAAW,UAAAC,GAAU,GAAGC,MAAmBL,GAExDM,IAAUC,EAAW,qBAAqBL,CAAS;AAEzD,SACI,gBAAAM,EAAC,SAAK,GAAGH,GAAgB,KAAKJ,KAAOE,GAAW,WAAWG,GACtD,UAAAF,EAAA,CACL;AAER,CAAC;AAEDN,EAAkB,SAASW;AAC3BX,EAAkB,UAAUY;AAC5BZ,EAAkB,OAAOa;"}

package/components/applicationLayout/ApplicationLayoutBody.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 export type ApplicationLayoutBodyProps = {
     /**
      * Show scroll to top button after scrolling the content.

package/components/applicationLayout/ApplicationLayoutBody.js

@@ -1,60 +1,65 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle, } from 'react';
-import { debounce } from 'es-toolkit/compat';
-import classNames from 'classnames';
-import SmoothScrollbars from "../smoothScrollbars/SmoothScrollbars.js";
-const RESIZE_THROTTLING = 200;
-const DEFAULT_BOTTOM_BAR_HEIGHT = 54;
-const ApplicationLayoutBody = forwardRef((props, ref) => {
-    const { className, innerClassName, forceScrollbar = true, enableScrollToTop = true, banner, navigation, bottomBar, bottomBarHeight = DEFAULT_BOTTOM_BAR_HEIGHT, scrollResetTrigger, children, ...remainingProps } = props;
-    const [offset, setOffset] = useState(0);
-    const moduleContentRef = useRef(null);
-    const layoutBodyRef = useRef(null);
-    // Use imperative handle to expose the internal layout ref. Usually this is used to
-    // expose internal function without exposing the underlying DOM element.
-    // In this case however, we want access to the element to trigger functions like scrollIntoView()
-    useImperativeHandle(ref, () => layoutBodyRef?.current, []);
-    // Reset scroll position when children are different. This fixes the issue of
-    // changing body content (like in another route) and still having the same scroll position
-    // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>
-    useEffect(() => {
-        if (moduleContentRef.current) {
-            moduleContentRef.current.scrollTop(0);
-            setOffset(0);
-        }
-    }, [scrollResetTrigger]);
-    useEffect(() => {
-        if (layoutBodyRef.current?.parentNode instanceof HTMLElement) {
-            layoutBodyRef.current.parentNode.style.setProperty('--ApplicationLayoutBodyBottomBarHeight', `${bottomBarHeight}px`);
-        }
-    }, [bottomBarHeight]);
-    const handleScroll = debounce(() => {
-        if (moduleContentRef.current) {
-            setOffset(moduleContentRef.current.getScrollTop());
-        }
-    }, RESIZE_THROTTLING);
-    const handleToTop = () => {
-        if (!moduleContentRef.current) {
-            return;
-        }
-        const scrollWrapper = moduleContentRef.current.container;
-        const scrollingElement = scrollWrapper.firstElementChild;
-        const currentScroll = scrollingElement?.scrollTop ?? 0;
-        const scrollThreshold = 10;
-        if (currentScroll > scrollThreshold) {
-            window.requestAnimationFrame(handleToTop);
-            scrollingElement?.scrollTo(0, currentScroll - currentScroll / 5);
-            scrollWrapper.classList.add('is-scrolling-to-top');
-            setOffset(currentScroll);
-        }
-        else {
-            scrollWrapper.classList.remove('is-scrolling-to-top');
-        }
-    };
-    const classes = classNames('ApplicationLayoutBody', bottomBar && 'has-footer', className);
-    const innerClasses = classNames('module-content', innerClassName && innerClassName);
-    const offsetThreshold = window.innerHeight * 0.1;
-    const scrollToTopClasses = classNames('scroll-to-top', offset > offsetThreshold && 'in');
-    return (_jsxs(React.Fragment, { children: [_jsxs("div", { ...remainingProps, ref: layoutBodyRef, className: classes, children: [_jsxs("div", { className: 'module-content-wrapper', children: [navigation && navigation, banner && banner, _jsx(SmoothScrollbars, { ref: moduleContentRef, slideIn: !forceScrollbar, largeTrack: true, trackOffset: true, className: innerClasses, onScroll: handleScroll, children: _jsx("div", { className: 'scrollbar-content', children: children }) })] }), enableScrollToTop && (_jsx("span", { className: scrollToTopClasses, children: _jsx("button", { type: 'button', className: 'btn btn-primary btn-icon-only', onClick: handleToTop, children: _jsx("span", { className: 'rioglyph rioglyph-arrow-up' }) }) }))] }), bottomBar && bottomBar] }));
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import I, { forwardRef as O, useState as x, useRef as h, useImperativeHandle as _, useEffect as T } from "react";
+import { debounce as k } from "es-toolkit/compat";
+import a from "classnames";
+import F from "../smoothScrollbars/SmoothScrollbars.js";
+const j = 200, G = 54, Z = O((g, y) => {
+  const {
+    className: b,
+    innerClassName: i,
+    forceScrollbar: N = !0,
+    enableScrollToTop: B = !0,
+    banner: p,
+    navigation: m,
+    bottomBar: s,
+    bottomBarHeight: u = G,
+    scrollResetTrigger: S,
+    children: R,
+    ...E
+  } = g, [H, n] = x(0), o = h(null), r = h(null);
+  _(y, () => r?.current, []), T(() => {
+    o.current && (o.current.scrollTop(0), n(0));
+  }, [S]), T(() => {
+    r.current?.parentNode instanceof HTMLElement && r.current.parentNode.style.setProperty(
+      "--ApplicationLayoutBodyBottomBarHeight",
+      `${u}px`
+    );
+  }, [u]);
+  const L = k(() => {
+    o.current && n(o.current.getScrollTop());
+  }, j), d = () => {
+    if (!o.current)
+      return;
+    const l = o.current.container, f = l.firstElementChild, t = f?.scrollTop ?? 0;
+    t > 10 ? (window.requestAnimationFrame(d), f?.scrollTo(0, t - t / 5), l.classList.add("is-scrolling-to-top"), n(t)) : l.classList.remove("is-scrolling-to-top");
+  }, w = a("ApplicationLayoutBody", s && "has-footer", b), v = a(
+    "module-content",
+    i && i
+  ), A = window.innerHeight * 0.1, C = a("scroll-to-top", H > A && "in");
+  return /* @__PURE__ */ c(I.Fragment, { children: [
+    /* @__PURE__ */ c("div", { ...E, ref: r, className: w, children: [
+      /* @__PURE__ */ c("div", { className: "module-content-wrapper", children: [
+        m && m,
+        p && p,
+        /* @__PURE__ */ e(
+          F,
+          {
+            ref: o,
+            slideIn: !N,
+            largeTrack: !0,
+            trackOffset: !0,
+            className: v,
+            onScroll: L,
+            children: /* @__PURE__ */ e("div", { className: "scrollbar-content", children: R })
+          }
+        )
+      ] }),
+      B && /* @__PURE__ */ e("span", { className: C, children: /* @__PURE__ */ e("button", { type: "button", className: "btn btn-primary btn-icon-only", onClick: d, children: /* @__PURE__ */ e("span", { className: "rioglyph rioglyph-arrow-up" }) }) })
+    ] }),
+    s && s
+  ] });
 });
-export default ApplicationLayoutBody;
+export {
+  Z as default
+};
+//# sourceMappingURL=ApplicationLayoutBody.js.map

package/components/applicationLayout/ApplicationLayoutBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationLayoutBody.js","sources":["../../../src/components/applicationLayout/ApplicationLayoutBody.tsx"],"sourcesContent":["import React, {\n    useState,\n    useRef,\n    useEffect,\n    forwardRef,\n    useImperativeHandle,\n    type PropsWithChildren,\n    type ForwardedRef,\n} from 'react';\nimport { debounce } from 'es-toolkit/compat';\nimport classNames from 'classnames';\n\nimport type Scrollbars from 'react-custom-scrollbars-4';\n\nimport SmoothScrollbars from '../smoothScrollbars/SmoothScrollbars';\n\nconst RESIZE_THROTTLING = 200;\nconst DEFAULT_BOTTOM_BAR_HEIGHT = 54;\n\nexport type ApplicationLayoutBodyProps = {\n    /**\n     * Show scroll to top button after scrolling the content.\n     *\n     * @default true\n     */\n    enableScrollToTop?: boolean;\n\n    /**\n     * Always show vertical scrollbar to prevent the content from jumping.\n     *\n     * @default true\n     */\n    forceScrollbar?: boolean;\n\n    /**\n     * Prop to trigger scroll reset from outside. This comes in handy when changing the body content\n     * and to reset the scrolling like when the pathname changes from an body internal menu.\n     */\n    scrollResetTrigger?: any;\n\n    /**\n     * The ApplicationLayoutBodyBanner component.\n     */\n    banner?: React.ReactNode;\n\n    /**\n     * The `ApplicationLayoutBodyNavigation` component.\n     */\n    navigation?: React.ReactNode;\n\n    /**\n     * Optional bottom bar component or a simple string.\n     */\n    bottomBar?: React.ReactNode;\n\n    /**\n     * Height of the bottomBar in pixel.\n     *\n     * @default 54\n     */\n    bottomBarHeight?: number;\n\n    /**\n     * Additional class names that are added to the inner module-content component.\n     */\n    innerClassName?: string;\n\n    /**\n     * Additional class names that are added to the respective component.\n     */\n    className?: string;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ApplicationLayoutBodyProps>;\n\nconst ApplicationLayoutBody = forwardRef((props: Props, ref: Ref) => {\n    const {\n        className,\n        innerClassName,\n        forceScrollbar = true,\n        enableScrollToTop = true,\n        banner,\n        navigation,\n        bottomBar,\n        bottomBarHeight = DEFAULT_BOTTOM_BAR_HEIGHT,\n        scrollResetTrigger,\n        children,\n        ...remainingProps\n    } = props;\n\n    const [offset, setOffset] = useState(0);\n    const moduleContentRef = useRef<Scrollbars>(null);\n    const layoutBodyRef = useRef<HTMLDivElement | null>(null);\n\n    // Use imperative handle to expose the internal layout ref. Usually this is used to\n    // expose internal function without exposing the underlying DOM element.\n    // In this case however, we want access to the element to trigger functions like scrollIntoView()\n    useImperativeHandle<HTMLDivElement, any>(ref, () => layoutBodyRef?.current, []);\n\n    // Reset scroll position when children are different. This fixes the issue of\n    // changing body content (like in another route) and still having the same scroll position\n    // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>\n    useEffect(() => {\n        if (moduleContentRef.current) {\n            moduleContentRef.current.scrollTop(0);\n            setOffset(0);\n        }\n    }, [scrollResetTrigger]);\n\n    useEffect(() => {\n        if (layoutBodyRef.current?.parentNode instanceof HTMLElement) {\n            layoutBodyRef.current.parentNode.style.setProperty(\n                '--ApplicationLayoutBodyBottomBarHeight',\n                `${bottomBarHeight}px`\n            );\n        }\n    }, [bottomBarHeight]);\n\n    const handleScroll = debounce(() => {\n        if (moduleContentRef.current) {\n            setOffset(moduleContentRef.current.getScrollTop());\n        }\n    }, RESIZE_THROTTLING);\n\n    const handleToTop = () => {\n        if (!moduleContentRef.current) {\n            return;\n        }\n\n        const scrollWrapper = moduleContentRef.current.container;\n        const scrollingElement = scrollWrapper.firstElementChild;\n        const currentScroll = scrollingElement?.scrollTop ?? 0;\n        const scrollThreshold = 10;\n\n        if (currentScroll > scrollThreshold) {\n            window.requestAnimationFrame(handleToTop);\n            scrollingElement?.scrollTo(0, currentScroll - currentScroll / 5);\n            scrollWrapper.classList.add('is-scrolling-to-top');\n            setOffset(currentScroll);\n        } else {\n            scrollWrapper.classList.remove('is-scrolling-to-top');\n        }\n    };\n\n    const classes = classNames('ApplicationLayoutBody', bottomBar && 'has-footer', className);\n\n    const innerClasses = classNames(\n        'module-content',\n\n        innerClassName && innerClassName\n    );\n\n    const offsetThreshold = window.innerHeight * 0.1;\n\n    const scrollToTopClasses = classNames('scroll-to-top', offset > offsetThreshold && 'in');\n\n    return (\n        <React.Fragment>\n            <div {...remainingProps} ref={layoutBodyRef} className={classes}>\n                <div className='module-content-wrapper'>\n                    {navigation && navigation}\n                    {banner && banner}\n\n                    <SmoothScrollbars\n                        ref={moduleContentRef}\n                        slideIn={!forceScrollbar}\n                        largeTrack\n                        trackOffset\n                        className={innerClasses}\n                        onScroll={handleScroll}\n                    >\n                        <div className='scrollbar-content'>{children}</div>\n                    </SmoothScrollbars>\n                </div>\n\n                {enableScrollToTop && (\n                    <span className={scrollToTopClasses}>\n                        <button type='button' className='btn btn-primary btn-icon-only' onClick={handleToTop}>\n                            <span className='rioglyph rioglyph-arrow-up' />\n                        </button>\n                    </span>\n                )}\n            </div>\n\n            {bottomBar && bottomBar}\n        </React.Fragment>\n    );\n});\n\nexport default ApplicationLayoutBody;\n"],"names":["RESIZE_THROTTLING","DEFAULT_BOTTOM_BAR_HEIGHT","ApplicationLayoutBody","forwardRef","props","ref","className","innerClassName","forceScrollbar","enableScrollToTop","banner","navigation","bottomBar","bottomBarHeight","scrollResetTrigger","children","remainingProps","offset","setOffset","useState","moduleContentRef","useRef","layoutBodyRef","useImperativeHandle","useEffect","handleScroll","debounce","handleToTop","scrollWrapper","scrollingElement","currentScroll","classes","classNames","innerClasses","offsetThreshold","scrollToTopClasses","jsxs","React","jsx","SmoothScrollbars"],"mappings":";;;;;AAgBA,MAAMA,IAAoB,KACpBC,IAA4B,IA2D5BC,IAAwBC,EAAW,CAACC,GAAcC,MAAa;AACjE,QAAM;AAAA,IACF,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC,IAAiB;AAAA,IACjB,mBAAAC,IAAoB;AAAA,IACpB,QAAAC;AAAA,IACA,YAAAC;AAAA,IACA,WAAAC;AAAA,IACA,iBAAAC,IAAkBZ;AAAA,IAClB,oBAAAa;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHZ,GAEE,CAACa,GAAQC,CAAS,IAAIC,EAAS,CAAC,GAChCC,IAAmBC,EAAmB,IAAI,GAC1CC,IAAgBD,EAA8B,IAAI;AAKxD,EAAAE,EAAyClB,GAAK,MAAMiB,GAAe,SAAS,CAAA,CAAE,GAK9EE,EAAU,MAAM;AACZ,IAAIJ,EAAiB,YACjBA,EAAiB,QAAQ,UAAU,CAAC,GACpCF,EAAU,CAAC;AAAA,EAEnB,GAAG,CAACJ,CAAkB,CAAC,GAEvBU,EAAU,MAAM;AACZ,IAAIF,EAAc,SAAS,sBAAsB,eAC7CA,EAAc,QAAQ,WAAW,MAAM;AAAA,MACnC;AAAA,MACA,GAAGT,CAAe;AAAA,IAAA;AAAA,EAG9B,GAAG,CAACA,CAAe,CAAC;AAEpB,QAAMY,IAAeC,EAAS,MAAM;AAChC,IAAIN,EAAiB,WACjBF,EAAUE,EAAiB,QAAQ,cAAc;AAAA,EAEzD,GAAGpB,CAAiB,GAEd2B,IAAc,MAAM;AACtB,QAAI,CAACP,EAAiB;AAClB;AAGJ,UAAMQ,IAAgBR,EAAiB,QAAQ,WACzCS,IAAmBD,EAAc,mBACjCE,IAAgBD,GAAkB,aAAa;AAGrD,IAAIC,IAFoB,MAGpB,OAAO,sBAAsBH,CAAW,GACxCE,GAAkB,SAAS,GAAGC,IAAgBA,IAAgB,CAAC,GAC/DF,EAAc,UAAU,IAAI,qBAAqB,GACjDV,EAAUY,CAAa,KAEvBF,EAAc,UAAU,OAAO,qBAAqB;AAAA,EAE5D,GAEMG,IAAUC,EAAW,yBAAyBpB,KAAa,cAAcN,CAAS,GAElF2B,IAAeD;AAAA,IACjB;AAAA,IAEAzB,KAAkBA;AAAA,EAAA,GAGhB2B,IAAkB,OAAO,cAAc,KAEvCC,IAAqBH,EAAW,iBAAiBf,IAASiB,KAAmB,IAAI;AAEvF,SACI,gBAAAE,EAACC,EAAM,UAAN,EACG,UAAA;AAAA,IAAA,gBAAAD,EAAC,SAAK,GAAGpB,GAAgB,KAAKM,GAAe,WAAWS,GACpD,UAAA;AAAA,MAAA,gBAAAK,EAAC,OAAA,EAAI,WAAU,0BACV,UAAA;AAAA,QAAAzB,KAAcA;AAAA,QACdD,KAAUA;AAAA,QAEX,gBAAA4B;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,KAAKnB;AAAA,YACL,SAAS,CAACZ;AAAA,YACV,YAAU;AAAA,YACV,aAAW;AAAA,YACX,WAAWyB;AAAA,YACX,UAAUR;AAAA,YAEV,UAAA,gBAAAa,EAAC,OAAA,EAAI,WAAU,qBAAqB,UAAAvB,EAAA,CAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MACjD,GACJ;AAAA,MAECN,KACG,gBAAA6B,EAAC,QAAA,EAAK,WAAWH,GACb,UAAA,gBAAAG,EAAC,YAAO,MAAK,UAAS,WAAU,iCAAgC,SAASX,GACrE,UAAA,gBAAAW,EAAC,UAAK,WAAU,8BAA6B,GACjD,EAAA,CACJ;AAAA,IAAA,GAER;AAAA,IAEC1B,KAAaA;AAAA,EAAA,GAClB;AAER,CAAC;"}

package/components/applicationLayout/ApplicationLayoutBodyBanner.d.ts

@@ -19,7 +19,7 @@ export type ApplicationLayoutBodyBannerProps = {
      */
     className?: string;
 };
-declare const ApplicationLayoutBodyBanner: import("react").ForwardRefExoticComponent<ApplicationLayoutBodyBannerProps & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
+declare const ApplicationLayoutBodyBanner: import('react').ForwardRefExoticComponent<ApplicationLayoutBodyBannerProps & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLDivElement>>;
 export default ApplicationLayoutBodyBanner;

package/components/applicationLayout/ApplicationLayoutBodyBanner.js

@@ -1,11 +1,24 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import classNames from 'classnames';
-const DEFAULT_TEXT_COLOR = 'text-color-white';
-const DEFAULT_BACKGROUND_COLOR = 'bg-primary';
-const ApplicationLayoutBodyBanner = forwardRef((props, ref) => {
-    const { textColor = DEFAULT_TEXT_COLOR, backgroundColor = DEFAULT_BACKGROUND_COLOR, isSticky = true, className, children, ...remainingProps } = props;
-    const bannerClasses = classNames('ApplicationLayoutBodyBanner', textColor, backgroundColor, isSticky && 'position-sticky top-0 z-index-3', className);
-    return (_jsx("div", { ...remainingProps, ref: ref, className: bannerClasses, children: children }));
+import { jsx as p } from "react/jsx-runtime";
+import { forwardRef as l } from "react";
+import m from "classnames";
+const d = "text-color-white", y = "bg-primary", L = l((o, t) => {
+  const {
+    textColor: r = d,
+    backgroundColor: s = y,
+    isSticky: a = !0,
+    className: n,
+    children: i,
+    ...e
+  } = o, c = m(
+    "ApplicationLayoutBodyBanner",
+    r,
+    s,
+    a && "position-sticky top-0 z-index-3",
+    n
+  );
+  return /* @__PURE__ */ p("div", { ...e, ref: t, className: c, children: i });
 });
-export default ApplicationLayoutBodyBanner;
+export {
+  L as default
+};
+//# sourceMappingURL=ApplicationLayoutBodyBanner.js.map

package/components/applicationLayout/ApplicationLayoutBodyBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationLayoutBodyBanner.js","sources":["../../../src/components/applicationLayout/ApplicationLayoutBodyBanner.tsx"],"sourcesContent":["import { type PropsWithChildren, type ForwardedRef, forwardRef } from 'react';\nimport classNames from 'classnames';\n\nconst DEFAULT_TEXT_COLOR = 'text-color-white';\nconst DEFAULT_BACKGROUND_COLOR = 'bg-primary';\n\nexport type ApplicationLayoutBodyBannerProps = {\n    /**\n     * One of the `text-color` utility classes.\n     * @default `text-color-white`\n     */\n    textColor?: string;\n    /**\n     * One of the `bg-color` utility classes.\n     * @default `bg-primary`\n     */\n    backgroundColor?: string;\n    /**\n     * Allows sticky banner while scrolling.\n     * @default false\n     */\n    isSticky?: boolean;\n    /**\n     * Additional class names that are added to the respective component.\n     */\n    className?: string;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ApplicationLayoutBodyBannerProps>;\n\nconst ApplicationLayoutBodyBanner = forwardRef((props: Props, ref: Ref) => {\n    const {\n        textColor = DEFAULT_TEXT_COLOR,\n        backgroundColor = DEFAULT_BACKGROUND_COLOR,\n        isSticky = true,\n        className,\n        children,\n        ...remainingProps\n    } = props;\n\n    const bannerClasses = classNames(\n        'ApplicationLayoutBodyBanner',\n        textColor,\n        backgroundColor,\n        isSticky && 'position-sticky top-0 z-index-3',\n        className\n    );\n\n    return (\n        <div {...remainingProps} ref={ref} className={bannerClasses}>\n            {children}\n        </div>\n    );\n});\n\nexport default ApplicationLayoutBodyBanner;\n"],"names":["DEFAULT_TEXT_COLOR","DEFAULT_BACKGROUND_COLOR","ApplicationLayoutBodyBanner","forwardRef","props","ref","textColor","backgroundColor","isSticky","className","children","remainingProps","bannerClasses","classNames"],"mappings":";;;AAGA,MAAMA,IAAqB,oBACrBC,IAA2B,cA2B3BC,IAA8BC,EAAW,CAACC,GAAcC,MAAa;AACvE,QAAM;AAAA,IACF,WAAAC,IAAYN;AAAA,IACZ,iBAAAO,IAAkBN;AAAA,IAClB,UAAAO,IAAW;AAAA,IACX,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHP,GAEEQ,IAAgBC;AAAA,IAClB;AAAA,IACAP;AAAA,IACAC;AAAA,IACAC,KAAY;AAAA,IACZC;AAAA,EAAA;AAGJ,2BACK,OAAA,EAAK,GAAGE,GAAgB,KAAAN,GAAU,WAAWO,GACzC,UAAAF,GACL;AAER,CAAC;"}

package/components/applicationLayout/ApplicationLayoutBodyBottomBar.d.ts

@@ -1,4 +1,4 @@
-import { type PropsWithChildren, type ForwardRefExoticComponent, type RefAttributes } from 'react';
+import { PropsWithChildren, ForwardRefExoticComponent, RefAttributes } from 'react';
 type ButtonAlignmentLeft = 'left';
 type ButtonAlignmentRight = 'right';
 export type ApplicationLayoutBodyBottomBarProps = {

package/components/applicationLayout/ApplicationLayoutBodyBottomBar.js

@@ -1,11 +1,20 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, } from 'react';
-import classNames from 'classnames';
-const ApplicationLayoutBodyBottomBar = forwardRef((props, ref) => {
-    const { className, buttonAlignment, useBodyPaddings = false, children, ...remainingProps } = props;
-    const classes = classNames('ApplicationLayoutBodyBottomBar', buttonAlignment === 'left' && 'justify-content-start', buttonAlignment === 'right' && 'justify-content-end', buttonAlignment !== 'left' && buttonAlignment !== 'right' && 'justify-content-between', useBodyPaddings && 'use-body-padding', className && className);
-    return (_jsx("div", { ref: ref, ...remainingProps, className: classes, children: children }));
+import { jsx as d } from "react/jsx-runtime";
+import { forwardRef as f } from "react";
+import l from "classnames";
+const e = f((s, n) => {
+  const { className: o, buttonAlignment: t, useBodyPaddings: a = !1, children: i, ...r } = s, c = l(
+    "ApplicationLayoutBodyBottomBar",
+    t === "left" && "justify-content-start",
+    t === "right" && "justify-content-end",
+    t !== "left" && t !== "right" && "justify-content-between",
+    a && "use-body-padding",
+    o && o
+  );
+  return /* @__PURE__ */ d("div", { ref: n, ...r, className: c, children: i });
 });
-ApplicationLayoutBodyBottomBar.LEFT = 'left';
-ApplicationLayoutBodyBottomBar.RIGHT = 'right';
-export default ApplicationLayoutBodyBottomBar;
+e.LEFT = "left";
+e.RIGHT = "right";
+export {
+  e as default
+};
+//# sourceMappingURL=ApplicationLayoutBodyBottomBar.js.map

package/components/applicationLayout/ApplicationLayoutBodyBottomBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationLayoutBodyBottomBar.js","sources":["../../../src/components/applicationLayout/ApplicationLayoutBodyBottomBar.tsx"],"sourcesContent":["import {\n    forwardRef,\n    type PropsWithChildren,\n    type ForwardedRef,\n    type ForwardRefExoticComponent,\n    type RefAttributes,\n} from 'react';\nimport classNames from 'classnames';\n\ntype ButtonAlignmentLeft = 'left';\ntype ButtonAlignmentRight = 'right';\n\nexport type ApplicationLayoutBodyBottomBarProps = {\n    /**\n     * Additional class names that are added to the respective component\n     */\n    className?: string;\n    /**\n     * Use same paddings (left and right) as the ApplicationLayoutBody.\n     * @default false\n     */\n    useBodyPaddings?: boolean;\n    /**\n     * Tells the buttons if they are left or right aligned.\n     * Default behavior is: 1st button left and 2nd button right.\n     *\n     * Possible values are:\n     * `ApplicationLayoutBodyBottomBar.LEFT`, `ApplicationLayoutBodyBottomBar.RIGHT` or\n     * `left`, `right`\n     */\n    buttonAlignment?: ButtonAlignmentLeft | ButtonAlignmentRight;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ApplicationLayoutBodyBottomBarProps>;\n\ntype ApplicationLayoutBodyBottomBarType = ForwardRefExoticComponent<Props & RefAttributes<HTMLDivElement>> & {\n    LEFT: ButtonAlignmentLeft;\n    RIGHT: ButtonAlignmentRight;\n};\n\nconst ApplicationLayoutBodyBottomBar = forwardRef((props: Props, ref: Ref) => {\n    const { className, buttonAlignment, useBodyPaddings = false, children, ...remainingProps } = props;\n\n    const classes = classNames(\n        'ApplicationLayoutBodyBottomBar',\n        buttonAlignment === 'left' && 'justify-content-start',\n        buttonAlignment === 'right' && 'justify-content-end',\n        buttonAlignment !== 'left' && buttonAlignment !== 'right' && 'justify-content-between',\n        useBodyPaddings && 'use-body-padding',\n        className && className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={classes}>\n            {children}\n        </div>\n    );\n}) as ApplicationLayoutBodyBottomBarType;\n\nApplicationLayoutBodyBottomBar.LEFT = 'left';\nApplicationLayoutBodyBottomBar.RIGHT = 'right';\n\nexport default ApplicationLayoutBodyBottomBar;\n"],"names":["ApplicationLayoutBodyBottomBar","forwardRef","props","ref","className","buttonAlignment","useBodyPaddings","children","remainingProps","classes","classNames"],"mappings":";;;AAyCA,MAAMA,IAAiCC,EAAW,CAACC,GAAcC,MAAa;AAC1E,QAAM,EAAE,WAAAC,GAAW,iBAAAC,GAAiB,iBAAAC,IAAkB,IAAO,UAAAC,GAAU,GAAGC,MAAmBN,GAEvFO,IAAUC;AAAA,IACZ;AAAA,IACAL,MAAoB,UAAU;AAAA,IAC9BA,MAAoB,WAAW;AAAA,IAC/BA,MAAoB,UAAUA,MAAoB,WAAW;AAAA,IAC7DC,KAAmB;AAAA,IACnBF,KAAaA;AAAA,EAAA;AAGjB,2BACK,OAAA,EAAI,KAAAD,GAAW,GAAGK,GAAgB,WAAWC,GACzC,UAAAF,GACL;AAER,CAAC;AAEDP,EAA+B,OAAO;AACtCA,EAA+B,QAAQ;"}

package/components/applicationLayout/ApplicationLayoutBodyNavigation.d.ts

@@ -4,7 +4,7 @@ export type ApplicationLayoutBodyNavigationProps = {
      */
     className?: string;
 };
-declare const ApplicationLayoutBodyNavigation: import("react").ForwardRefExoticComponent<ApplicationLayoutBodyNavigationProps & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
+declare const ApplicationLayoutBodyNavigation: import('react').ForwardRefExoticComponent<ApplicationLayoutBodyNavigationProps & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLDivElement>>;
 export default ApplicationLayoutBodyNavigation;

package/components/applicationLayout/ApplicationLayoutBodyNavigation.js

@@ -1,9 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import classNames from 'classnames';
-const ApplicationLayoutBodyNavigation = forwardRef((props, ref) => {
-    const { className, children, ...remainingProps } = props;
-    const navigationClasses = classNames('ApplicationLayoutBodyNavigation', className);
-    return (_jsx("div", { ref: ref, ...remainingProps, className: navigationClasses, children: children }));
+import { jsx as n } from "react/jsx-runtime";
+import { forwardRef as e } from "react";
+import m from "classnames";
+const d = e((a, o) => {
+  const { className: i, children: s, ...t } = a, r = m("ApplicationLayoutBodyNavigation", i);
+  return /* @__PURE__ */ n("div", { ref: o, ...t, className: r, children: s });
 });
-export default ApplicationLayoutBodyNavigation;
+export {
+  d as default
+};
+//# sourceMappingURL=ApplicationLayoutBodyNavigation.js.map

package/components/applicationLayout/ApplicationLayoutBodyNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApplicationLayoutBodyNavigation.js","sources":["../../../src/components/applicationLayout/ApplicationLayoutBodyNavigation.tsx"],"sourcesContent":["import { type ForwardedRef, type PropsWithChildren, forwardRef } from 'react';\nimport classNames from 'classnames';\n\nexport type ApplicationLayoutBodyNavigationProps = {\n    /**\n     * Additional class names that are added to the respective component. Example: `has-offset`.\n     */\n    className?: string;\n};\n\ntype Ref = ForwardedRef<HTMLDivElement>;\ntype Props = PropsWithChildren<ApplicationLayoutBodyNavigationProps>;\n\nconst ApplicationLayoutBodyNavigation = forwardRef((props: Props, ref: Ref) => {\n    const { className, children, ...remainingProps } = props;\n\n    const navigationClasses = classNames('ApplicationLayoutBodyNavigation', className);\n\n    return (\n        <div ref={ref} {...remainingProps} className={navigationClasses}>\n            {children}\n        </div>\n    );\n});\n\nexport default ApplicationLayoutBodyNavigation;\n"],"names":["ApplicationLayoutBodyNavigation","forwardRef","props","ref","className","children","remainingProps","navigationClasses","classNames"],"mappings":";;;AAaA,MAAMA,IAAkCC,EAAW,CAACC,GAAcC,MAAa;AAC3E,QAAM,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,MAAmBJ,GAE7CK,IAAoBC,EAAW,mCAAmCJ,CAAS;AAEjF,2BACK,OAAA,EAAI,KAAAD,GAAW,GAAGG,GAAgB,WAAWC,GACzC,UAAAF,GACL;AAER,CAAC;"}

package/components/applicationLayout/ApplicationLayoutHeader.d.ts

@@ -4,7 +4,7 @@ export type ApplicationLayoutHeaderProps = {
      */
     className?: string;
 };
-declare const ApplicationLayoutHeader: import("react").ForwardRefExoticComponent<ApplicationLayoutHeaderProps & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
+declare const ApplicationLayoutHeader: import('react').ForwardRefExoticComponent<ApplicationLayoutHeaderProps & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLDivElement>>;
 export default ApplicationLayoutHeader;