acinguiux-ds-react-framework 0.1.18 → 0.1.20

package/build/esm/components/NavBar/NavBar.js

@@ -1,140 +1,144 @@
-import { jsxs as S, jsx as l, Fragment as Z } from "react/jsx-runtime";
-import { forwardRef as P, useState as y, useMemo as g, useEffect as D, useCallback as v } from "react";
-import C from "classnames";
-import { Directions as t, Sizes as a, NOOP as I, Contrasts as c, Alignments as ee } from "../../react-base/src/consts/index.js";
-import le from "../Icon/components/LeftNavigation.js";
-import te from "../Icon/components/LeftNavigationSolid.js";
-import se from "./components/LastArea/LastArea.js";
-import re from "./components/FirstArea/FirstArea.js";
-import { Wrapper as ie, Nav as ae, DividerContainer as f, MiddleArea as oe, StyledMenu as _ } from "./NavBar.styles.js";
-import u from "../Divider/Divider.js";
-import { NAV_BAR_CLASS as me } from "../../react-base/src/consts/classes.js";
-const Le = P(
+import { jsxs as f, jsx as l, Fragment as le } from "react/jsx-runtime";
+import { forwardRef as te, useState as y, useMemo as ae, useEffect as z, useCallback as d } from "react";
+import oe from "classnames";
+import { Directions as t, Sizes as i, NOOP as A, Alignments as se, Contrasts as p } from "../../react-base/src/consts/index.js";
+import ne from "../Icon/components/LeftNavigation.js";
+import ie from "../Icon/components/LeftNavigationSolid.js";
+import re from "./components/LastArea/LastArea.js";
+import me from "./components/FirstArea/FirstArea.js";
+import { Wrapper as ce, Nav as fe, MiddleArea as de, StyledMenu as k, DividerContainer as u } from "./NavBar.styles.js";
+import $ from "../Divider/Divider.js";
+import { NAV_BAR_CLASS as pe } from "../../react-base/src/consts/classes.js";
+const be = te(
   ({
-    size: i = `${a.Medium}`,
-    className: j,
+    size: s = `${i.Medium}`,
+    className: E,
     direction: e = `${t.Horizontal}`,
-    elevation: B,
-    collapsed: $ = !1,
-    preventExpand: F = !1,
-    expandedWidth: R = 300,
-    pectenArea: V = "default",
-    lockup: N,
-    urlProps: W,
-    header: w,
-    avatarArea: d,
-    avatarProps: p,
-    items: L,
-    topArea: M,
-    onClick: x,
-    startArea: b,
-    endArea: h,
-    itemsAlignment: z = `${ee.Left}`,
-    expandMode: o = "auto_push",
-    itemRender: K,
-    selectedPath: q,
-    onSelect: E,
-    onCollapsedChange: m,
-    onExpandChange: n,
-    ...G
-  }, J) => {
-    const [r, O] = y(() => $), Q = N ?? V, [k, A] = y(() => !1), s = g(
-      () => e === t.Horizontal || !r || k,
-      [e, r, k]
+    elevation: H,
+    collapsed: r = !1,
+    preventExpand: D = !1,
+    expandedWidth: I = 300,
+    pectenArea: h = "default",
+    lockup: S,
+    urlProps: _,
+    header: j,
+    avatarArea: m,
+    avatarProps: c,
+    items: v,
+    topArea: V,
+    onClick: B,
+    startArea: F,
+    endArea: C,
+    defaultOpenToSelected: R = !1,
+    itemsAlignment: N = `${se.Left}`,
+    expandMode: n = "auto_push",
+    itemRender: W,
+    selectedPath: w,
+    onSelect: K,
+    onCollapsedChange: L,
+    onExpandChange: M,
+    ...P
+  }, q) => {
+    const { indicatorPosition: G, iconPosition: J, type: Q = "default", ...T } = P, [o, O] = y(() => r), U = S ?? h, [b, g] = y(() => !1), a = ae(
+      () => e === t.Horizontal || !o || b,
+      [e, o, b]
     );
-    D(() => {
-      n == null || n(s);
-    }, [s, n]), D(() => O($), [$]);
-    const H = {
+    z(() => {
+      M?.(a);
+    }, [a, M]), z(() => O(r), [r]);
+    const x = {
       vertical: "inline",
       horizontal: "horizontal"
-    }, T = v(() => {
-      O((Y) => !Y), m == null || m(!r);
-    }, [m, r]), U = v(() => A(!0), []), X = v(() => A(!1), []);
-    return /* @__PURE__ */ S(
-      ie,
+    }, X = d(() => {
+      O((ee) => !ee), L?.(!o);
+    }, [L, o]), Y = d(() => g(!0), []), Z = d(() => g(!1), []);
+    return /* @__PURE__ */ f(
+      ce,
       {
-        onMouseLeave: o !== "manual" ? X : I,
-        onMouseEnter: o !== "manual" ? U : I,
+        onMouseLeave: n !== "manual" ? Z : A,
+        onMouseEnter: n !== "manual" ? Y : A,
         $direction: e,
-        $expandMode: o,
-        $size: i,
-        $isCollapsed: e === t.Vertical && r,
+        $expandMode: n,
+        $size: s,
+        $isCollapsed: e === t.Vertical && o,
+        $type: Q,
         children: [
-          !!M && e !== t.Vertical && M,
-          /* @__PURE__ */ S(
-            ae,
+          !!V && e !== t.Vertical && V,
+          /* @__PURE__ */ f(
+            fe,
             {
               as: e === t.Vertical ? "nav" : "header",
-              $size: i,
-              $expandMode: o,
-              className: C(me, j),
+              $size: s,
+              $expandMode: n,
+              className: oe(pe, E),
               $direction: e,
-              $elevation: B,
-              $collapsed: !s,
-              $expandedWidth: R,
-              ref: J,
-              ...G,
+              $elevation: H,
+              $collapsed: !a,
+              $expandedWidth: I,
+              ref: q,
+              ...T,
               children: [
-                Q !== "none" && /* @__PURE__ */ l(
-                  re,
+                U !== "none" && /* @__PURE__ */ l(
+                  me,
                   {
-                    header: w,
-                    pectenArea: V,
-                    lockup: N,
-                    urlProps: W,
-                    onClick: x,
-                    collapsed: !s,
-                    size: i
+                    header: j,
+                    pectenArea: h,
+                    lockup: S,
+                    urlProps: _,
+                    onClick: B,
+                    collapsed: !a,
+                    size: s
                   }
                 ),
-                !!b && e === t.Vertical && /* @__PURE__ */ l(f, { children: /* @__PURE__ */ l(u, { contrast: c.Subtle, size: a.Small }) }),
-                b,
-                /* @__PURE__ */ l(oe, { $direction: e, $collapsed: !s, children: L && /* @__PURE__ */ l(
-                  _,
+                F,
+                /* @__PURE__ */ l(de, { $direction: e, $collapsed: !a, children: v && /* @__PURE__ */ l(
+                  k,
                   {
-                    inlineCollapsed: e === t.Vertical && !s,
-                    items: L,
-                    $itemsAlignment: z,
-                    itemRender: K,
-                    mode: H[e],
-                    selectedPath: q,
-                    onSelect: E,
-                    size: i
+                    inlineCollapsed: e === t.Vertical && !a,
+                    items: v,
+                    $itemsAlignment: N,
+                    itemRender: W,
+                    mode: x[e],
+                    selectedPath: w,
+                    defaultOpenToSelected: R,
+                    onSelect: K,
+                    size: s,
+                    indicatorPosition: G,
+                    iconPosition: J
                   }
                 ) }),
-                !!h && e === t.Vertical && /* @__PURE__ */ l(f, { children: /* @__PURE__ */ l(u, { contrast: c.Subtle, size: a.Small }) }),
-                h,
-                e === t.Vertical && !F && /* @__PURE__ */ S(Z, { children: [
-                  /* @__PURE__ */ l(f, { children: /* @__PURE__ */ l(u, { contrast: c.Subtle, size: a.Small }) }),
+                !!C && e === t.Vertical && /* @__PURE__ */ l(u, { children: /* @__PURE__ */ l($, { contrast: p.Subtle, size: i.Small }) }),
+                C,
+                e === t.Vertical && !D && /* @__PURE__ */ f(le, { children: [
+                  /* @__PURE__ */ l(u, { children: /* @__PURE__ */ l($, { contrast: p.Subtle, size: i.Small }) }),
                   /* @__PURE__ */ l(
-                    _,
+                    k,
                     {
-                      inlineCollapsed: e === t.Vertical && !s,
+                      inlineCollapsed: e === t.Vertical && !a,
                       items: [
                         {
                           key: "expand",
-                          label: r ? "Expand navigation" : "Collapse navigation",
-                          itemIcon: r ? /* @__PURE__ */ l(te, {}) : /* @__PURE__ */ l(le, {})
+                          label: o ? "Expand navigation" : "Collapse navigation",
+                          itemIcon: o ? /* @__PURE__ */ l(ie, {}) : /* @__PURE__ */ l(ne, {})
                         }
                       ],
-                      $itemsAlignment: z,
-                      mode: H[e],
+                      $itemsAlignment: N,
+                      mode: x[e],
                       selectedKeys: [],
                       noAnimate: !0,
-                      onClick: T,
-                      size: i
+                      onClick: X,
+                      size: s
                     }
                   )
                 ] }),
-                e === t.Vertical && (!!d || !!p) && /* @__PURE__ */ l(f, { children: /* @__PURE__ */ l(u, { contrast: c.Subtle, size: a.Small }) }),
-                (!!d || !!p) && /* @__PURE__ */ l(
-                  se,
+                e === t.Vertical && (!!m || !!c) && /* @__PURE__ */ l(u, { children: /* @__PURE__ */ l($, { contrast: p.Subtle, size: i.Small }) }),
+                (!!m || !!c) && /* @__PURE__ */ l(
+                  re,
                   {
-                    size: i,
-                    collapsed: e === t.Vertical && !s,
-                    avatarArea: d,
-                    avatarProps: p
+                    size: s,
+                    collapsed: e === t.Vertical && !a,
+                    avatarArea: m,
+                    avatarProps: c
                   }
                 )
               ]
@@ -146,6 +150,6 @@ const Le = P(
   }
 );
 export {
-  Le as default
+  be as default
 };
 //# sourceMappingURL=NavBar.js.map

package/build/esm/components/NavBar/NavBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.js","sources":["../../../../src/components/NavBar/NavBar.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type MouseEventHandler,\n  type ReactElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport classNames from 'classnames';\nimport { NAV_BAR_CLASS, Sizes, Directions, Contrasts, Alignments, NOOP } from 'acinguiux-ds-react-base/consts';\nimport type { NavBarTypes } from 'acinguiux-ds-react-base/components/NavBar';\n\nimport LeftNavigation from '../Icon/components/LeftNavigation';\nimport LeftNavigationSolid from '../Icon/components/LeftNavigationSolid';\nimport LastArea from './components/LastArea/LastArea';\nimport FirstArea from './components/FirstArea/FirstArea';\nimport { Wrapper, MiddleArea, Nav, StyledMenu, DividerContainer } from './NavBar.styles';\nimport type { INavBarProps } from './NavBar.types';\nimport Divider from '../Divider/Divider';\nimport type { IMenuProps } from '../Menu/Menu.types';\n\nconst NavBar = forwardRef<HTMLElement, INavBarProps>(\n  (\n    {\n      size = `${Sizes.Medium}`,\n      className,\n      direction = `${Directions.Horizontal}`,\n      elevation,\n      collapsed = false,\n      preventExpand = false,\n      expandedWidth = 300,\n      pectenArea = 'default',\n      lockup,\n      urlProps,\n      header,\n      avatarArea,\n      avatarProps,\n      items,\n      topArea,\n      onClick,\n      startArea,\n      endArea,\n      itemsAlignment = `${Alignments.Left}`,\n      expandMode = 'auto_push',\n      itemRender,\n      selectedPath,\n      onSelect,\n      onCollapsedChange,\n      onExpandChange,\n      ...rest\n    },\n    ref,\n  ): ReactElement => {\n    const [isCollapsed, setIsCollapsed] = useState<boolean>(() => collapsed);\n    const lockupArea = lockup ?? pectenArea;\n    const [isHovered, setIsHovered] = useState<boolean>(() => false);\n    const isOpen = useMemo(\n      () => direction === Directions.Horizontal || !isCollapsed || isHovered,\n      [direction, isCollapsed, isHovered],\n    );\n\n    useEffect(() => {\n      onExpandChange?.(isOpen);\n    }, [isOpen, onExpandChange]);\n\n    useEffect(() => setIsCollapsed(collapsed), [collapsed]);\n\n    const menuModeMap: { [Property in NavBarTypes.Direction]: IMenuProps['mode'] } = {\n      vertical: 'inline',\n      horizontal: 'horizontal',\n    };\n\n    const handleOnExpandClick = useCallback(() => {\n      setIsCollapsed((prev) => !prev);\n      onCollapsedChange?.(!isCollapsed);\n    }, [onCollapsedChange, isCollapsed]);\n\n    const handleOnEnter: MouseEventHandler = useCallback(() => setIsHovered(true), []);\n    const handleOnLeave: MouseEventHandler = useCallback(() => setIsHovered(false), []);\n\n    return (\n      <Wrapper\n        onMouseLeave={expandMode !== 'manual' ? handleOnLeave : NOOP}\n        onMouseEnter={expandMode !== 'manual' ? handleOnEnter : NOOP}\n        $direction={direction}\n        $expandMode={expandMode}\n        $size={size}\n        $isCollapsed={direction === Directions.Vertical && isCollapsed}\n      >\n        {!!topArea && direction !== Directions.Vertical && topArea}\n        <Nav\n          as={direction === Directions.Vertical ? 'nav' : 'header'}\n          $size={size}\n          $expandMode={expandMode}\n          className={classNames(NAV_BAR_CLASS, className)}\n          $direction={direction}\n          $elevation={elevation}\n          $collapsed={!isOpen}\n          $expandedWidth={expandedWidth}\n          ref={ref}\n          {...rest}\n        >\n          {lockupArea !== 'none' && (\n            <FirstArea\n              header={header}\n              pectenArea={pectenArea}\n              lockup={lockup}\n              urlProps={urlProps}\n              onClick={onClick}\n              collapsed={!isOpen}\n              size={size}\n            />\n          )}\n          {!!startArea && direction === Directions.Vertical && (\n            <DividerContainer>\n              <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n            </DividerContainer>\n          )}\n          {startArea}\n          <MiddleArea $direction={direction} $collapsed={!isOpen}>\n            {items && (\n              <StyledMenu\n                inlineCollapsed={direction === Directions.Vertical && !isOpen}\n                items={items}\n                $itemsAlignment={itemsAlignment}\n                itemRender={itemRender}\n                mode={menuModeMap[direction] as INavBarProps['direction']}\n                selectedPath={selectedPath}\n                onSelect={onSelect}\n                size={size}\n              />\n            )}\n          </MiddleArea>\n          {!!endArea && direction === Directions.Vertical && (\n            <DividerContainer>\n              <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n            </DividerContainer>\n          )}\n          {endArea}\n          {direction === Directions.Vertical && !preventExpand && (\n            <>\n              <DividerContainer>\n                <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n              </DividerContainer>\n              <StyledMenu\n                inlineCollapsed={direction === Directions.Vertical && !isOpen}\n                items={[\n                  {\n                    key: 'expand',\n                    label: isCollapsed ? 'Expand navigation' : 'Collapse navigation',\n                    itemIcon: isCollapsed ? <LeftNavigationSolid /> : <LeftNavigation />,\n                  },\n                ]}\n                $itemsAlignment={itemsAlignment}\n                mode={menuModeMap[direction] as INavBarProps['direction']}\n                selectedKeys={[]}\n                noAnimate={true}\n                onClick={handleOnExpandClick}\n                size={size}\n              />\n            </>\n          )}\n          {direction === Directions.Vertical && (!!avatarArea || !!avatarProps) && (\n            <DividerContainer>\n              <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n            </DividerContainer>\n          )}\n          {(!!avatarArea || !!avatarProps) && (\n            <LastArea\n              size={size}\n              collapsed={direction === Directions.Vertical && !isOpen}\n              avatarArea={avatarArea}\n              avatarProps={avatarProps}\n            />\n          )}\n        </Nav>\n      </Wrapper>\n    );\n  },\n);\n\nexport default NavBar;\n"],"names":["NavBar","forwardRef","size","Sizes","className","direction","Directions","elevation","collapsed","preventExpand","expandedWidth","pectenArea","lockup","urlProps","header","avatarArea","avatarProps","items","topArea","onClick","startArea","endArea","itemsAlignment","Alignments","expandMode","itemRender","selectedPath","onSelect","onCollapsedChange","onExpandChange","rest","ref","isCollapsed","setIsCollapsed","useState","lockupArea","isHovered","setIsHovered","isOpen","useMemo","useEffect","menuModeMap","handleOnExpandClick","useCallback","prev","handleOnEnter","handleOnLeave","jsxs","Wrapper","NOOP","Nav","classNames","NAV_BAR_CLASS","jsx","FirstArea","DividerContainer","Divider","Contrasts","MiddleArea","StyledMenu","Fragment","LeftNavigationSolid","LeftNavigation","LastArea"],"mappings":"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"}
+{"version":3,"file":"NavBar.js","sources":["../../../../src/components/NavBar/NavBar.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type MouseEventHandler,\n  type ReactElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport classNames from 'classnames';\nimport { NAV_BAR_CLASS, Sizes, Directions, Contrasts, Alignments, NOOP } from 'acinguiux-ds-react-base/consts';\nimport type { NavBarTypes } from 'acinguiux-ds-react-base/components/NavBar';\n\nimport LeftNavigation from '../Icon/components/LeftNavigation';\nimport LeftNavigationSolid from '../Icon/components/LeftNavigationSolid';\nimport LastArea from './components/LastArea/LastArea';\nimport FirstArea from './components/FirstArea/FirstArea';\nimport { Wrapper, MiddleArea, Nav, StyledMenu, DividerContainer } from './NavBar.styles';\nimport { INavBarProps, INavBarPropsImpl } from './NavBar.types';\nimport Divider from '../Divider/Divider';\nimport type { IMenuProps } from '../Menu/Menu.types';\n\nconst NavBar = forwardRef<HTMLElement, INavBarProps>(\n  (\n    {\n      size = `${Sizes.Medium}`,\n      className,\n      direction = `${Directions.Horizontal}`,\n      elevation,\n      collapsed = false,\n      preventExpand = false,\n      expandedWidth = 300,\n      pectenArea = 'default',\n      lockup,\n      urlProps,\n      header,\n      avatarArea,\n      avatarProps,\n      items,\n      topArea,\n      onClick,\n      startArea,\n      endArea,\n      defaultOpenToSelected = false,\n      itemsAlignment = `${Alignments.Left}`,\n      expandMode = 'auto_push',\n      itemRender,\n      selectedPath,\n      onSelect,\n      onCollapsedChange,\n      onExpandChange,\n      ...props\n    },\n    ref,\n  ): ReactElement => {\n    const { indicatorPosition, iconPosition, type = 'default', ...rest } = props as INavBarPropsImpl;\n    const [isCollapsed, setIsCollapsed] = useState<boolean>(() => collapsed);\n    const lockupArea = lockup ?? pectenArea;\n    const [isHovered, setIsHovered] = useState<boolean>(() => false);\n    const isOpen = useMemo(\n      () => direction === Directions.Horizontal || !isCollapsed || isHovered,\n      [direction, isCollapsed, isHovered],\n    );\n\n    useEffect(() => {\n      onExpandChange?.(isOpen);\n    }, [isOpen, onExpandChange]);\n\n    useEffect(() => setIsCollapsed(collapsed), [collapsed]);\n\n    const menuModeMap: { [Property in NavBarTypes.Direction]: IMenuProps['mode'] } = {\n      vertical: 'inline',\n      horizontal: 'horizontal',\n    };\n\n    const handleOnExpandClick = useCallback(() => {\n      setIsCollapsed((prev) => !prev);\n      onCollapsedChange?.(!isCollapsed);\n    }, [onCollapsedChange, isCollapsed]);\n\n    const handleOnEnter: MouseEventHandler = useCallback(() => setIsHovered(true), []);\n    const handleOnLeave: MouseEventHandler = useCallback(() => setIsHovered(false), []);\n\n    return (\n      <Wrapper\n        onMouseLeave={expandMode !== 'manual' ? handleOnLeave : NOOP}\n        onMouseEnter={expandMode !== 'manual' ? handleOnEnter : NOOP}\n        $direction={direction}\n        $expandMode={expandMode}\n        $size={size}\n        $isCollapsed={direction === Directions.Vertical && isCollapsed}\n        $type={type}\n      >\n        {!!topArea && direction !== Directions.Vertical && topArea}\n        <Nav\n          as={direction === Directions.Vertical ? 'nav' : 'header'}\n          $size={size}\n          $expandMode={expandMode}\n          className={classNames(NAV_BAR_CLASS, className)}\n          $direction={direction}\n          $elevation={elevation}\n          $collapsed={!isOpen}\n          $expandedWidth={expandedWidth}\n          ref={ref}\n          {...rest}\n        >\n          {lockupArea !== 'none' && (\n            <FirstArea\n              header={header}\n              pectenArea={pectenArea}\n              lockup={lockup}\n              urlProps={urlProps}\n              onClick={onClick}\n              collapsed={!isOpen}\n              size={size}\n            />\n          )}\n          {startArea}\n          <MiddleArea $direction={direction} $collapsed={!isOpen}>\n            {items && (\n              <StyledMenu\n                inlineCollapsed={direction === Directions.Vertical && !isOpen}\n                items={items}\n                $itemsAlignment={itemsAlignment}\n                itemRender={itemRender}\n                mode={menuModeMap[direction] as INavBarProps['direction']}\n                selectedPath={selectedPath}\n                defaultOpenToSelected={defaultOpenToSelected}\n                onSelect={onSelect}\n                size={size}\n                indicatorPosition={indicatorPosition}\n                iconPosition={iconPosition}\n              />\n            )}\n          </MiddleArea>\n          {!!endArea && direction === Directions.Vertical && (\n            <DividerContainer>\n              <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n            </DividerContainer>\n          )}\n          {endArea}\n          {direction === Directions.Vertical && !preventExpand && (\n            <>\n              <DividerContainer>\n                <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n              </DividerContainer>\n              <StyledMenu\n                inlineCollapsed={direction === Directions.Vertical && !isOpen}\n                items={[\n                  {\n                    key: 'expand',\n                    label: isCollapsed ? 'Expand navigation' : 'Collapse navigation',\n                    itemIcon: isCollapsed ? <LeftNavigationSolid /> : <LeftNavigation />,\n                  },\n                ]}\n                $itemsAlignment={itemsAlignment}\n                mode={menuModeMap[direction] as INavBarProps['direction']}\n                selectedKeys={[]}\n                noAnimate={true}\n                onClick={handleOnExpandClick}\n                size={size}\n              />\n            </>\n          )}\n          {direction === Directions.Vertical && (!!avatarArea || !!avatarProps) && (\n            <DividerContainer>\n              <Divider contrast={Contrasts.Subtle} size={Sizes.Small} />\n            </DividerContainer>\n          )}\n          {(!!avatarArea || !!avatarProps) && (\n            <LastArea\n              size={size}\n              collapsed={direction === Directions.Vertical && !isOpen}\n              avatarArea={avatarArea}\n              avatarProps={avatarProps}\n            />\n          )}\n        </Nav>\n      </Wrapper>\n    );\n  },\n);\n\nexport default NavBar;\n"],"names":["NavBar","forwardRef","size","Sizes","className","direction","Directions","elevation","collapsed","preventExpand","expandedWidth","pectenArea","lockup","urlProps","header","avatarArea","avatarProps","items","topArea","onClick","startArea","endArea","defaultOpenToSelected","itemsAlignment","Alignments","expandMode","itemRender","selectedPath","onSelect","onCollapsedChange","onExpandChange","props","ref","indicatorPosition","iconPosition","type","rest","isCollapsed","setIsCollapsed","useState","lockupArea","isHovered","setIsHovered","isOpen","useMemo","useEffect","menuModeMap","handleOnExpandClick","useCallback","prev","handleOnEnter","handleOnLeave","jsxs","Wrapper","NOOP","Nav","classNames","NAV_BAR_CLASS","jsx","FirstArea","MiddleArea","StyledMenu","DividerContainer","Divider","Contrasts","Fragment","LeftNavigationSolid","LeftNavigation","LastArea"],"mappings":"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"}

package/build/esm/components/NavBar/NavBar.styles.d.ts

@@ -1,9 +1,10 @@
 import type { PickTransient } from '../../react-base/src/types';
 import type { INavBarProps, INavBarPropsWithReqSize } from './NavBar.types';
 import type { IMenuProps } from '../Menu/Menu.types';
-declare const StyledMenu: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<IMenuProps, IMenuProps & PickTransient<INavBarProps, "itemsAlignment">>> & string & Omit<({ className, mode, size, inlineCollapsed, muted, indicatorPosition, iconPosition, noAnimate, items, selectedPath, selectedKeys, itemRender, children, ...rest }: IMenuProps) => import("react").ReactElement, keyof import("react").Component<any, {}, any>>;
+declare const StyledMenu: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<IMenuProps, IMenuProps & PickTransient<INavBarProps, "itemsAlignment">>> & string & Omit<({ className, mode, size, inlineCollapsed, muted, indicatorPosition, iconPosition, noAnimate, items, selectedPath, selectedKeys, defaultOpenToSelected, itemRender, children, ...rest }: IMenuProps) => import("react").ReactElement, keyof import("react").Component<any, {}, any>>;
 declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, PickTransient<INavBarPropsWithReqSize, "size" | "direction" | "expandMode"> & {
     $isCollapsed: boolean;
+    $type: "default" | "mobile";
 }>> & string;
 type NavPropsKeys = 'size' | 'direction' | 'elevation' | 'collapsed' | 'expandMode' | 'expandedWidth';
 type NavProps = PickTransient<INavBarPropsWithReqSize, NavPropsKeys>;

package/build/esm/components/NavBar/NavBar.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBar.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAKnE,OAAO,KAAK,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAE5E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,QAAA,MAAM,UAAU,6cAOf,CAAC;AAeF,QAAA,MAAM,OAAO;kBACmF,OAAO;YAOtG,CAAC;AAEF,KAAK,YAAY,GAAG,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,GAAG,YAAY,GAAG,eAAe,CAAC;AACtG,KAAK,QAAQ,GAAG,aAAa,CAAC,uBAAuB,EAAE,YAAY,CAAC,CAAC;AAErE,QAAA,MAAM,GAAG,uOA+BR,CAAC;AAEF,QAAA,MAAM,UAAU,2RAYf,CAAC;AAEF,QAAA,MAAM,gBAAgB,6NAGrB,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"NavBar.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBar.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAKnE,OAAO,KAAK,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAE5E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,QAAA,MAAM,UAAU,oeAOf,CAAC;AAeF,QAAA,MAAM,OAAO;kBAEK,OAAO;WACd,SAAS,GAAG,QAAQ;YAQ9B,CAAC;AAEF,KAAK,YAAY,GAAG,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,GAAG,YAAY,GAAG,eAAe,CAAC;AACtG,KAAK,QAAQ,GAAG,aAAa,CAAC,uBAAuB,EAAE,YAAY,CAAC,CAAC;AAErE,QAAA,MAAM,GAAG,uOA+BR,CAAC;AAEF,QAAA,MAAM,UAAU,2RAYf,CAAC;AAEF,QAAA,MAAM,gBAAgB,6NAGrB,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC"}

package/build/esm/components/NavBar/NavBar.styles.js

@@ -1,7 +1,7 @@
 import { styled as a, css as r } from "styled-components";
 import { Directions as n, ZIndexes as h } from "../../react-base/src/consts/index.js";
-import { consts as s } from "../../react-base/src/components/NavBar/NavBar.consts.js";
-import { Variables as c } from "../../react-base/src/theme/types/layer.js";
+import { consts as l } from "../../react-base/src/components/NavBar/NavBar.consts.js";
+import { Variables as f } from "../../react-base/src/theme/types/layer.js";
 import { consts as p } from "../../react-base/src/components/Menu/Menu.consts.js";
 import u from "../Menu/Menu.js";
 import { NAV_BAR_CLASS as g } from "../../react-base/src/consts/classes.js";
@@ -13,15 +13,15 @@ const $ = a(u)`
     justify-content: ${x(t)};
     overflow: hidden auto;
   `}
-`, w = (t, i, o, e) => t === n.Vertical ? i === "auto_cover" && e ? `${s[o].height}px` : "auto" : "100%", k = a.div(
-  ({ $direction: t, $expandMode: i, $size: o, $isCollapsed: e }) => r`
+`, w = (t, i, o, e) => t === n.Vertical ? i === "auto_cover" && e ? `${l[o].height}px` : "auto" : "100%", k = a.div(
+  ({ $direction: t, $expandMode: i, $size: o, $isCollapsed: e, $type: s }) => r`
     position: relative;
-    height: ${t === n.Vertical ? "100%" : `${s[o].height}px`};
+    height: ${t === n.Vertical ? "100%" : `${l[o].height[s]}px`};
     width: ${w(t, i, o, e)};
   `
 ), B = a.header(
-  ({ $direction: t, $elevation: i, $collapsed: o, theme: e, $expandedWidth: f, $size: l, $expandMode: m }) => {
-    const d = e.layer({ foundation: "surface" });
+  ({ $direction: t, $elevation: i, $collapsed: o, theme: e, $expandedWidth: s, $size: d, $expandMode: m }) => {
+    const c = e.layer({ foundation: "surface" });
     return r`
       z-index: ${h.NAVBAR};
       position: ${m === "auto_cover" && o ? "absolute" : "relative"};
@@ -31,15 +31,15 @@ const $ = a(u)`
       height: 100%;
       width: 100%;
       filter: ${i ? e.dropShadows.low1 : null};
-      color: ${d[c.TextOnFoundationStrong]};
-      background-color: ${d[c.BackgroundFoundation]};
+      color: ${c[f.TextOnFoundationStrong]};
+      background-color: ${c[f.BackgroundFoundation]};
       transition: width 0.3s ease-out;
 
       ${t === n.Vertical && r`
-        width: ${o ? `${s[l].height}px` : `${f}px`};
+        width: ${o ? `${l[d].height.default}px` : `${s}px`};
 
         ${$} {
-          width: calc(100% + ${o ? 0 : p[l].itemListMarginLeft}px);
+          width: calc(100% + ${o ? 0 : p[d].itemListMarginLeft}px);
         }
 
         .${g}-icon {

package/build/esm/components/NavBar/NavBar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.styles.js","sources":["../../../../src/components/NavBar/NavBar.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { NAV_BAR_CLASS, Directions, ZIndexes } from 'acinguiux-ds-react-base/consts';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { NavBarConsts, NavBarUtils } from 'acinguiux-ds-react-base/components/NavBar';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport type { INavBarProps, INavBarPropsWithReqSize } from './NavBar.types';\nimport Menu from '../Menu/Menu';\nimport type { IMenuProps } from '../Menu/Menu.types';\n\nconst StyledMenu = styled(Menu)<IMenuProps & PickTransient<INavBarProps, 'itemsAlignment'>>`\n  ${({ $itemsAlignment }) => css`\n    flex: 1 1 0;\n    max-height: fit-content;\n    justify-content: ${NavBarUtils.getItemsAlignment($itemsAlignment)};\n    overflow: hidden auto;\n  `}\n`;\n\nconst getWrapperWidth = (\n  direction: INavBarPropsWithReqSize['direction'],\n  expandMode: INavBarPropsWithReqSize['expandMode'],\n  size: INavBarPropsWithReqSize['size'],\n  isCollapsed: boolean,\n): string => {\n  if (direction === Directions.Vertical) {\n    return expandMode === 'auto_cover' && isCollapsed ? `${NavBarConsts.consts[size].height}px` : 'auto';\n  }\n\n  return '100%';\n};\n\nconst Wrapper = styled.div<\n  PickTransient<INavBarPropsWithReqSize, 'direction' | 'expandMode' | 'size'> & { $isCollapsed: boolean }\n>(\n  ({ $direction, $expandMode, $size, $isCollapsed }) => css`\n    position: relative;\n    height: ${$direction === Directions.Vertical ? '100%' : `${NavBarConsts.consts[$size].height}px`};\n    width: ${getWrapperWidth($direction, $expandMode, $size, $isCollapsed)};\n  `,\n);\n\ntype NavPropsKeys = 'size' | 'direction' | 'elevation' | 'collapsed' | 'expandMode' | 'expandedWidth';\ntype NavProps = PickTransient<INavBarPropsWithReqSize, NavPropsKeys>;\n\nconst Nav = styled.header<NavProps>(\n  ({ $direction, $elevation, $collapsed, theme, $expandedWidth, $size, $expandMode }) => {\n    const layer = theme.layer({ foundation: 'surface' });\n\n    return css`\n      z-index: ${ZIndexes.NAVBAR};\n      position: ${$expandMode === 'auto_cover' && $collapsed ? 'absolute' : 'relative'};\n      display: flex;\n      flex-flow: ${$direction === Directions.Horizontal ? 'row' : 'column'} nowrap;\n      align-items: stretch;\n      height: 100%;\n      width: 100%;\n      filter: ${$elevation ? theme.dropShadows.low1 : null};\n      color: ${layer[Variables.TextOnFoundationStrong]};\n      background-color: ${layer[Variables.BackgroundFoundation]};\n      transition: width 0.3s ease-out;\n\n      ${$direction === Directions.Vertical &&\n      css`\n        width: ${$collapsed ? `${NavBarConsts.consts[$size].height}px` : `${$expandedWidth}px`};\n\n        ${StyledMenu} {\n          width: calc(100% + ${$collapsed ? 0 : MenuConsts.consts[$size].itemListMarginLeft}px);\n        }\n\n        .${NAV_BAR_CLASS}-icon {\n          transform: rotate(${$collapsed ? 0 : 180}deg);\n        }\n      `}\n    `;\n  },\n);\n\nconst MiddleArea = styled.div<PickTransient<INavBarProps, 'direction' | 'collapsed'>>(\n  ({ $direction, $collapsed }) => css`\n    position: relative;\n    display: flex;\n    flex-shrink: ${$collapsed ? 0 : 1};\n    flex-grow: 1;\n    flex-direction: ${$direction === Directions.Horizontal ? 'row' : 'column'};\n    align-items: stretch;\n    min-width: 0;\n    z-index: 1;\n    overflow: hidden auto;\n  `,\n);\n\nconst DividerContainer = styled.div`\n  align-items: center;\n  padding: 0 12px;\n`;\n\nexport { Wrapper, Nav, MiddleArea, StyledMenu, DividerContainer };\n"],"names":["StyledMenu","styled","Menu","$itemsAlignment","css","NavBarUtils.getItemsAlignment","getWrapperWidth","direction","expandMode","size","isCollapsed","Directions","NavBarConsts.consts","Wrapper","$direction","$expandMode","$size","$isCollapsed","Nav","$elevation","$collapsed","theme","$expandedWidth","layer","ZIndexes","Variables","MenuConsts.consts","NAV_BAR_CLASS","MiddleArea","DividerContainer"],"mappings":";;;;;;;;AAWA,MAAMA,IAAaC,EAAOC,CAAI;AAAA,IAC1B,CAAC,EAAE,iBAAAC,EAAA,MAAsBC;AAAA;AAAA;AAAA,uBAGNC,EAA8BF,CAAe,CAAC;AAAA;AAAA,GAElE;AAAA,GAGGG,IAAkB,CACtBC,GACAC,GACAC,GACAC,MAEIH,MAAcI,EAAW,WACpBH,MAAe,gBAAgBE,IAAc,GAAGE,EAAoBH,CAAI,EAAE,MAAM,OAAO,SAGzF,QAGHI,IAAUZ,EAAO;AAAA,EAGrB,CAAC,EAAE,YAAAa,GAAY,aAAAC,GAAa,OAAAC,GAAO,cAAAC,QAAmBb;AAAA;AAAA,cAE1CU,MAAeH,EAAW,WAAW,SAAS,GAAGC,EAAoBI,CAAK,EAAE,MAAM,IAAI;AAAA,aACvFV,EAAgBQ,GAAYC,GAAaC,GAAOC,CAAY,CAAC;AAAA;AAE1E,GAKMC,IAAMjB,EAAO;AAAA,EACjB,CAAC,EAAE,YAAAa,GAAY,YAAAK,GAAY,YAAAC,GAAY,OAAAC,GAAO,gBAAAC,GAAgB,OAAAN,GAAO,aAAAD,QAAkB;AACrF,UAAMQ,IAAQF,EAAM,MAAM,EAAE,YAAY,WAAW;AAEnD,WAAOjB;AAAA,iBACMoB,EAAS,MAAM;AAAA,kBACdT,MAAgB,gBAAgBK,IAAa,aAAa,UAAU;AAAA;AAAA,mBAEnEN,MAAeH,EAAW,aAAa,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,gBAI1DQ,IAAaE,EAAM,YAAY,OAAO,IAAI;AAAA,eAC3CE,EAAME,EAAU,sBAAsB,CAAC;AAAA,0BAC5BF,EAAME,EAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,QAGvDX,MAAeH,EAAW,YAC5BP;AAAA,iBACWgB,IAAa,GAAGR,EAAoBI,CAAK,EAAE,MAAM,OAAO,GAAGM,CAAc,IAAI;AAAA;AAAA,UAEpFtB,CAAU;AAAA,+BACWoB,IAAa,IAAIM,EAAkBV,CAAK,EAAE,kBAAkB;AAAA;AAAA;AAAA,WAGhFW,CAAa;AAAA,8BACMP,IAAa,IAAI,GAAG;AAAA;AAAA,OAE3C;AAAA;AAAA,EAEL;AACF,GAEMQ,IAAa3B,EAAO;AAAA,EACxB,CAAC,EAAE,YAAAa,GAAY,YAAAM,EAAA,MAAiBhB;AAAA;AAAA;AAAA,mBAGfgB,IAAa,IAAI,CAAC;AAAA;AAAA,sBAEfN,MAAeH,EAAW,aAAa,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAM7E,GAEMkB,IAAmB5B,EAAO;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"NavBar.styles.js","sources":["../../../../src/components/NavBar/NavBar.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport { NAV_BAR_CLASS, Directions, ZIndexes } from 'acinguiux-ds-react-base/consts';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { NavBarConsts, NavBarUtils } from 'acinguiux-ds-react-base/components/NavBar';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { MenuConsts } from 'acinguiux-ds-react-base/components/Menu';\n\nimport type { INavBarProps, INavBarPropsWithReqSize } from './NavBar.types';\nimport Menu from '../Menu/Menu';\nimport type { IMenuProps } from '../Menu/Menu.types';\n\nconst StyledMenu = styled(Menu)<IMenuProps & PickTransient<INavBarProps, 'itemsAlignment'>>`\n  ${({ $itemsAlignment }) => css`\n    flex: 1 1 0;\n    max-height: fit-content;\n    justify-content: ${NavBarUtils.getItemsAlignment($itemsAlignment)};\n    overflow: hidden auto;\n  `}\n`;\n\nconst getWrapperWidth = (\n  direction: INavBarPropsWithReqSize['direction'],\n  expandMode: INavBarPropsWithReqSize['expandMode'],\n  size: INavBarPropsWithReqSize['size'],\n  isCollapsed: boolean,\n): string => {\n  if (direction === Directions.Vertical) {\n    return expandMode === 'auto_cover' && isCollapsed ? `${NavBarConsts.consts[size].height}px` : 'auto';\n  }\n\n  return '100%';\n};\n\nconst Wrapper = styled.div<\n  PickTransient<INavBarPropsWithReqSize, 'direction' | 'expandMode' | 'size'> & {\n    $isCollapsed: boolean;\n    $type: 'default' | 'mobile';\n  }\n>(\n  ({ $direction, $expandMode, $size, $isCollapsed, $type }) => css`\n    position: relative;\n    height: ${$direction === Directions.Vertical ? '100%' : `${NavBarConsts.consts[$size].height[$type]}px`};\n    width: ${getWrapperWidth($direction, $expandMode, $size, $isCollapsed)};\n  `,\n);\n\ntype NavPropsKeys = 'size' | 'direction' | 'elevation' | 'collapsed' | 'expandMode' | 'expandedWidth';\ntype NavProps = PickTransient<INavBarPropsWithReqSize, NavPropsKeys>;\n\nconst Nav = styled.header<NavProps>(\n  ({ $direction, $elevation, $collapsed, theme, $expandedWidth, $size, $expandMode }) => {\n    const layer = theme.layer({ foundation: 'surface' });\n\n    return css`\n      z-index: ${ZIndexes.NAVBAR};\n      position: ${$expandMode === 'auto_cover' && $collapsed ? 'absolute' : 'relative'};\n      display: flex;\n      flex-flow: ${$direction === Directions.Horizontal ? 'row' : 'column'} nowrap;\n      align-items: stretch;\n      height: 100%;\n      width: 100%;\n      filter: ${$elevation ? theme.dropShadows.low1 : null};\n      color: ${layer[Variables.TextOnFoundationStrong]};\n      background-color: ${layer[Variables.BackgroundFoundation]};\n      transition: width 0.3s ease-out;\n\n      ${$direction === Directions.Vertical &&\n      css`\n        width: ${$collapsed ? `${NavBarConsts.consts[$size].height.default}px` : `${$expandedWidth}px`};\n\n        ${StyledMenu} {\n          width: calc(100% + ${$collapsed ? 0 : MenuConsts.consts[$size].itemListMarginLeft}px);\n        }\n\n        .${NAV_BAR_CLASS}-icon {\n          transform: rotate(${$collapsed ? 0 : 180}deg);\n        }\n      `}\n    `;\n  },\n);\n\nconst MiddleArea = styled.div<PickTransient<INavBarProps, 'direction' | 'collapsed'>>(\n  ({ $direction, $collapsed }) => css`\n    position: relative;\n    display: flex;\n    flex-shrink: ${$collapsed ? 0 : 1};\n    flex-grow: 1;\n    flex-direction: ${$direction === Directions.Horizontal ? 'row' : 'column'};\n    align-items: stretch;\n    min-width: 0;\n    z-index: 1;\n    overflow: hidden auto;\n  `,\n);\n\nconst DividerContainer = styled.div`\n  align-items: center;\n  padding: 0 12px;\n`;\n\nexport { Wrapper, Nav, MiddleArea, StyledMenu, DividerContainer };\n"],"names":["StyledMenu","styled","Menu","$itemsAlignment","css","NavBarUtils.getItemsAlignment","getWrapperWidth","direction","expandMode","size","isCollapsed","Directions","NavBarConsts.consts","Wrapper","$direction","$expandMode","$size","$isCollapsed","$type","Nav","$elevation","$collapsed","theme","$expandedWidth","layer","ZIndexes","Variables","MenuConsts.consts","NAV_BAR_CLASS","MiddleArea","DividerContainer"],"mappings":";;;;;;;;AAWA,MAAMA,IAAaC,EAAOC,CAAI;AAAA,IAC1B,CAAC,EAAE,iBAAAC,EAAA,MAAsBC;AAAA;AAAA;AAAA,uBAGNC,EAA8BF,CAAe,CAAC;AAAA;AAAA,GAElE;AAAA,GAGGG,IAAkB,CACtBC,GACAC,GACAC,GACAC,MAEIH,MAAcI,EAAW,WACpBH,MAAe,gBAAgBE,IAAc,GAAGE,EAAoBH,CAAI,EAAE,MAAM,OAAO,SAGzF,QAGHI,IAAUZ,EAAO;AAAA,EAMrB,CAAC,EAAE,YAAAa,GAAY,aAAAC,GAAa,OAAAC,GAAO,cAAAC,GAAc,OAAAC,QAAYd;AAAA;AAAA,cAEjDU,MAAeH,EAAW,WAAW,SAAS,GAAGC,EAAoBI,CAAK,EAAE,OAAOE,CAAK,CAAC,IAAI;AAAA,aAC9FZ,EAAgBQ,GAAYC,GAAaC,GAAOC,CAAY,CAAC;AAAA;AAE1E,GAKME,IAAMlB,EAAO;AAAA,EACjB,CAAC,EAAE,YAAAa,GAAY,YAAAM,GAAY,YAAAC,GAAY,OAAAC,GAAO,gBAAAC,GAAgB,OAAAP,GAAO,aAAAD,QAAkB;AACrF,UAAMS,IAAQF,EAAM,MAAM,EAAE,YAAY,WAAW;AAEnD,WAAOlB;AAAA,iBACMqB,EAAS,MAAM;AAAA,kBACdV,MAAgB,gBAAgBM,IAAa,aAAa,UAAU;AAAA;AAAA,mBAEnEP,MAAeH,EAAW,aAAa,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,gBAI1DS,IAAaE,EAAM,YAAY,OAAO,IAAI;AAAA,eAC3CE,EAAME,EAAU,sBAAsB,CAAC;AAAA,0BAC5BF,EAAME,EAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,QAGvDZ,MAAeH,EAAW,YAC5BP;AAAA,iBACWiB,IAAa,GAAGT,EAAoBI,CAAK,EAAE,OAAO,OAAO,OAAO,GAAGO,CAAc,IAAI;AAAA;AAAA,UAE5FvB,CAAU;AAAA,+BACWqB,IAAa,IAAIM,EAAkBX,CAAK,EAAE,kBAAkB;AAAA;AAAA;AAAA,WAGhFY,CAAa;AAAA,8BACMP,IAAa,IAAI,GAAG;AAAA;AAAA,OAE3C;AAAA;AAAA,EAEL;AACF,GAEMQ,IAAa5B,EAAO;AAAA,EACxB,CAAC,EAAE,YAAAa,GAAY,YAAAO,EAAA,MAAiBjB;AAAA;AAAA;AAAA,mBAGfiB,IAAa,IAAI,CAAC;AAAA;AAAA,sBAEfP,MAAeH,EAAW,aAAa,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAM7E,GAEMmB,IAAmB7B,EAAO;AAAA;AAAA;AAAA;"}

package/build/esm/components/NavBar/NavBar.types.d.ts

@@ -1,6 +1,17 @@
 import type { NavBarTypes } from '../../react-base/src/components/NavBar';
+import { Positions } from '../../react-base/src/consts';
 import type { FlagName } from '../Flag/Flag.types';
-import type { ItemType } from '../Menu/Menu.types';
+import type { ItemType, MenuItemType } from '../Menu/Menu.types';
 export type INavBarProps = NavBarTypes.IProps<ItemType, FlagName>;
 export type INavBarPropsWithReqSize = NavBarTypes.IPropsWithReqSize<ItemType, FlagName>;
+export type Position = `${Positions.Top | Positions.Bottom}`;
+export type INavBarPropsImpl = {
+    indicatorPosition?: Position;
+    iconPosition?: `${Positions.Top}`;
+    type?: 'default' | 'mobile';
+};
+export type INavbarMobileProps = Pick<INavBarProps, 'size' | 'items' | 'className' | 'selectedPath'> & INavBarPropsImpl;
+export type INavbarVerticalStaticProps = Pick<INavBarProps, 'size' | 'className' | 'urlProps' | 'avatarArea' | 'avatarProps' | 'startArea' | 'endArea' | 'selectedPath' | 'onSelect'> & {
+    items: MenuItemType[];
+};
 //# sourceMappingURL=NavBar.types.d.ts.map

package/build/esm/components/NavBar/NavBar.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.types.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBar.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2CAA2C,CAAC;AAE7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAEnD,MAAM,MAAM,YAAY,GAAG,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAClE,MAAM,MAAM,uBAAuB,GAAG,WAAW,CAAC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC"}
+{"version":3,"file":"NavBar.types.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBar.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2CAA2C,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEjE,MAAM,MAAM,YAAY,GAAG,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAClE,MAAM,MAAM,uBAAuB,GAAG,WAAW,CAAC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAExF,MAAM,MAAM,QAAQ,GAAG,GAAG,SAAS,CAAC,GAAG,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC;AAE7D,MAAM,MAAM,gBAAgB,GAAG;IAC7B,iBAAiB,CAAC,EAAE,QAAQ,CAAC;IAC7B,YAAY,CAAC,EAAE,GAAG,SAAS,CAAC,GAAG,EAAE,CAAC;IAClC,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,GAAG,WAAW,GAAG,cAAc,CAAC,GAAG,gBAAgB,CAAC;AACxH,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,YAAY,EACV,MAAM,GACN,WAAW,GACX,UAAU,GACV,YAAY,GACZ,aAAa,GACb,WAAW,GACX,SAAS,GACT,cAAc,GACd,UAAU,CACb,GAAG;IAAE,KAAK,EAAE,YAAY,EAAE,CAAA;CAAE,CAAC"}

package/build/esm/components/NavBar/NavBarMobile.d.ts

@@ -0,0 +1,5 @@
+import { type FC } from 'react';
+import type { INavbarMobileProps } from './NavBar.types';
+declare const NavBarMobile: FC<INavbarMobileProps>;
+export default NavBarMobile;
+//# sourceMappingURL=NavBarMobile.d.ts.map

package/build/esm/components/NavBar/NavBarMobile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBarMobile.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBarMobile.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,KAAK,EAAgB,kBAAkB,EAAoB,MAAM,gBAAgB,CAAC;AAIzF,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,kBAAkB,CAWxC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/build/esm/components/NavBar/NavBarMobile.js

@@ -0,0 +1,17 @@
+import { jsx as r } from "react/jsx-runtime";
+import n from "./NavBar.js";
+const a = n, l = ({ indicatorPosition: o = "bottom", ...t }) => /* @__PURE__ */ r(
+  a,
+  {
+    ...t,
+    indicatorPosition: o,
+    iconPosition: "top",
+    direction: "horizontal",
+    lockup: "none",
+    type: "mobile"
+  }
+);
+export {
+  l as default
+};
+//# sourceMappingURL=NavBarMobile.js.map

package/build/esm/components/NavBar/NavBarMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBarMobile.js","sources":["../../../../src/components/NavBar/NavBarMobile.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport NavBar from './NavBar';\nimport type { INavBarProps, INavbarMobileProps, INavBarPropsImpl } from './NavBar.types';\n\nconst NavbarInternal = NavBar as FC<INavBarPropsImpl & INavBarProps>;\n\nconst NavBarMobile: FC<INavbarMobileProps> = ({ indicatorPosition = 'bottom', ...navbarProps }) => {\n  return (\n    <NavbarInternal\n      {...navbarProps}\n      indicatorPosition={indicatorPosition}\n      iconPosition=\"top\"\n      direction=\"horizontal\"\n      lockup=\"none\"\n      type=\"mobile\"\n    />\n  );\n};\n\nexport default NavBarMobile;\n"],"names":["NavbarInternal","NavBar","NavBarMobile","indicatorPosition","navbarProps","jsx"],"mappings":";;AAKA,MAAMA,IAAiBC,GAEjBC,IAAuC,CAAC,EAAE,mBAAAC,IAAoB,UAAU,GAAGC,QAE7E,gBAAAC;AAAA,EAACL;AAAA,EAAA;AAAA,IACE,GAAGI;AAAA,IACJ,mBAAAD;AAAA,IACA,cAAa;AAAA,IACb,WAAU;AAAA,IACV,QAAO;AAAA,IACP,MAAK;AAAA,EAAA;AAAA;"}

package/build/esm/components/NavBar/NavBarVerticalStatic.d.ts

@@ -0,0 +1,5 @@
+declare const NavBarVerticalStatic: import("react").ForwardRefExoticComponent<Pick<import("./NavBar.types").INavBarProps, "className" | "size" | "onSelect" | "avatarProps" | "selectedPath" | "urlProps" | "avatarArea" | "startArea" | "endArea"> & {
+    items: import("../Menu/Menu.types").MenuItemType[];
+} & import("react").RefAttributes<HTMLElement>>;
+export default NavBarVerticalStatic;
+//# sourceMappingURL=NavBarVerticalStatic.d.ts.map

package/build/esm/components/NavBar/NavBarVerticalStatic.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBarVerticalStatic.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBarVerticalStatic.tsx"],"names":[],"mappings":"AAWA,QAAA,MAAM,oBAAoB;;+CAgDzB,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/build/esm/components/NavBar/NavBarVerticalStatic.js

@@ -0,0 +1,53 @@
+import { jsx as e, jsxs as S } from "react/jsx-runtime";
+import { forwardRef as A } from "react";
+import N from "classnames";
+import { Sizes as h, Alignments as u } from "../../react-base/src/consts/index.js";
+import { consts as m } from "../../react-base/src/components/NavBar/NavBarVerticalStatic.consts.js";
+import x from "./components/LastArea/LastArea.js";
+import $ from "../Pecten/Pecten.js";
+import { Wrapper as v, Nav as z, PectenUrlWrapper as M, MiddleArea as g, StyledMenu as j } from "./NavBarVerticalStatic.styles.js";
+import { NAV_BAR_CLASS as B } from "../../react-base/src/consts/classes.js";
+const y = A(
+  ({
+    size: r = `${h.Medium}`,
+    className: n,
+    urlProps: a,
+    avatarArea: o,
+    avatarProps: t,
+    items: i,
+    startArea: l,
+    endArea: p,
+    selectedPath: s,
+    onSelect: c,
+    ...d
+  }, f) => /* @__PURE__ */ e(v, { children: /* @__PURE__ */ S(z, { as: "nav", $size: r, className: N(B, n), ref: f, ...d, children: [
+    /* @__PURE__ */ e(M, { rel: "noopener noreferrer", tabIndex: -1, ...a, $size: r, children: /* @__PURE__ */ e($, { size: m[r].pectenSize }) }),
+    l,
+    /* @__PURE__ */ e(g, { children: i && /* @__PURE__ */ e(
+      j,
+      {
+        items: i,
+        $itemsAlignment: u.Center,
+        mode: "vertical",
+        selectedPath: s,
+        onSelect: c,
+        size: r,
+        iconPosition: "top"
+      }
+    ) }),
+    p,
+    (!!o || !!t) && /* @__PURE__ */ e(
+      x,
+      {
+        size: m[r].avatarSize,
+        collapsed: !0,
+        avatarArea: o,
+        avatarProps: t
+      }
+    )
+  ] }) })
+);
+export {
+  y as default
+};
+//# sourceMappingURL=NavBarVerticalStatic.js.map

package/build/esm/components/NavBar/NavBarVerticalStatic.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBarVerticalStatic.js","sources":["../../../../src/components/NavBar/NavBarVerticalStatic.tsx"],"sourcesContent":["import { forwardRef, type ReactElement } from 'react';\n\nimport classNames from 'classnames';\nimport { NAV_BAR_CLASS, Sizes, Alignments } from 'acinguiux-ds-react-base/consts';\nimport { NavBarVerticalStaticConsts } from 'acinguiux-ds-react-base/components/NavBar';\n\nimport LastArea from './components/LastArea/LastArea';\nimport Pecten from '../Pecten/Pecten';\nimport { Wrapper, MiddleArea, Nav, StyledMenu, PectenUrlWrapper } from './NavBarVerticalStatic.styles';\nimport { INavbarVerticalStaticProps } from './NavBar.types';\n\nconst NavBarVerticalStatic = forwardRef<HTMLElement, INavbarVerticalStaticProps>(\n  (\n    {\n      size = `${Sizes.Medium}`,\n      className,\n      urlProps,\n      avatarArea,\n      avatarProps,\n      items,\n      startArea,\n      endArea,\n      selectedPath,\n      onSelect,\n      ...rest\n    },\n    ref,\n  ): ReactElement => (\n    <Wrapper>\n      <Nav as=\"nav\" $size={size} className={classNames(NAV_BAR_CLASS, className)} ref={ref} {...rest}>\n        <PectenUrlWrapper rel=\"noopener noreferrer\" tabIndex={-1} {...urlProps} $size={size}>\n          <Pecten size={NavBarVerticalStaticConsts.consts[size].pectenSize} />\n        </PectenUrlWrapper>\n        {startArea}\n        <MiddleArea>\n          {items && (\n            <StyledMenu\n              items={items}\n              $itemsAlignment={Alignments.Center}\n              mode=\"vertical\"\n              selectedPath={selectedPath}\n              onSelect={onSelect}\n              size={size}\n              iconPosition=\"top\"\n            />\n          )}\n        </MiddleArea>\n        {endArea}\n        {(!!avatarArea || !!avatarProps) && (\n          <LastArea\n            size={NavBarVerticalStaticConsts.consts[size].avatarSize}\n            collapsed={true}\n            avatarArea={avatarArea}\n            avatarProps={avatarProps}\n          />\n        )}\n      </Nav>\n    </Wrapper>\n  ),\n);\n\nexport default NavBarVerticalStatic;\n"],"names":["NavBarVerticalStatic","forwardRef","size","Sizes","className","urlProps","avatarArea","avatarProps","items","startArea","endArea","selectedPath","onSelect","rest","ref","jsx","Wrapper","jsxs","Nav","classNames","NAV_BAR_CLASS","PectenUrlWrapper","Pecten","NavBarVerticalStaticConsts.consts","MiddleArea","StyledMenu","Alignments","LastArea"],"mappings":";;;;;;;;;AAWA,MAAMA,IAAuBC;AAAA,EAC3B,CACE;AAAA,IACE,MAAAC,IAAO,GAAGC,EAAM,MAAM;AAAA,IACtB,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAEA,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAC,EAACC,KAAI,IAAG,OAAM,OAAOhB,GAAM,WAAWiB,EAAWC,GAAehB,CAAS,GAAG,KAAAU,GAAW,GAAGD,GACxF,UAAA;AAAA,IAAA,gBAAAE,EAACM,KAAiB,KAAI,uBAAsB,UAAU,IAAK,GAAGhB,GAAU,OAAOH,GAC7E,UAAA,gBAAAa,EAACO,KAAO,MAAMC,EAAkCrB,CAAI,EAAE,YAAY,GACpE;AAAA,IACCO;AAAA,IACD,gBAAAM,EAACS,KACE,UAAAhB,KACC,gBAAAO;AAAA,MAACU;AAAA,MAAA;AAAA,QACC,OAAAjB;AAAA,QACA,iBAAiBkB,EAAW;AAAA,QAC5B,MAAK;AAAA,QACL,cAAAf;AAAA,QACA,UAAAC;AAAA,QACA,MAAAV;AAAA,QACA,cAAa;AAAA,MAAA;AAAA,IAAA,GAGnB;AAAA,IACCQ;AAAA,KACC,CAAC,CAACJ,KAAc,CAAC,CAACC,MAClB,gBAAAQ;AAAA,MAACY;AAAA,MAAA;AAAA,QACC,MAAMJ,EAAkCrB,CAAI,EAAE;AAAA,QAC9C,WAAW;AAAA,QACX,YAAAI;AAAA,QACA,aAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,EAAA,CAEJ,EAAA,CACF;AAEJ;"}

package/build/esm/components/NavBar/NavBarVerticalStatic.styles.d.ts

@@ -0,0 +1,11 @@
+import type { PickTransient } from '../../react-base/src/types';
+import type { INavBarProps, INavBarPropsWithReqSize } from './NavBar.types';
+import type { IMenuProps } from '../Menu/Menu.types';
+declare const StyledMenu: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<IMenuProps, IMenuProps & PickTransient<INavBarProps, "itemsAlignment">>> & string & Omit<({ className, mode, size, inlineCollapsed, muted, indicatorPosition, iconPosition, noAnimate, items, selectedPath, selectedKeys, defaultOpenToSelected, itemRender, children, ...rest }: IMenuProps) => import("react").ReactElement, keyof import("react").Component<any, {}, any>>;
+declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+type NavProps = PickTransient<INavBarPropsWithReqSize, 'size' | 'elevation'>;
+declare const Nav: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, NavProps>> & string;
+declare const MiddleArea: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+declare const PectenUrlWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, PickTransient<INavBarPropsWithReqSize, "size">>> & string;
+export { Wrapper, Nav, MiddleArea, StyledMenu, PectenUrlWrapper };
+//# sourceMappingURL=NavBarVerticalStatic.styles.d.ts.map

package/build/esm/components/NavBar/NavBarVerticalStatic.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBarVerticalStatic.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/NavBar/NavBarVerticalStatic.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAInE,OAAO,KAAK,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAE5E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGrD,QAAA,MAAM,UAAU,oeAgBf,CAAC;AAEF,QAAA,MAAM,OAAO,6NAIZ,CAAC;AAEF,KAAK,QAAQ,GAAG,aAAa,CAAC,uBAAuB,EAAE,MAAM,GAAG,WAAW,CAAC,CAAC;AAE7E,QAAA,MAAM,GAAG,uOA8BP,CAAC;AAEH,QAAA,MAAM,UAAU,6NAUf,CAAC;AAEF,QAAA,MAAM,gBAAgB,+RAMrB,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC"}