@veracity/vui 3.0.0-beta.5 → 3.0.0-beta.6

package/dist/select/theme.js

@@ -0,0 +1,2 @@
+var e={baseStyle:{},defaultProps:{size:`lg`,variant:`outlined`},parts:[`container`,`button`,`content`,`group`,`option`,`label`],sizes:{sm:{button:{size:`sm`},group:{size:`sm`},option:{size:`sm`},label:{fontSize:`xs`}},md:{button:{size:`md`},group:{size:`md`},option:{size:`md`},label:{fontSize:`sm`}},lg:{button:{size:`lg`},group:{size:`lg`},option:{size:`lg`},label:{fontSize:`md`}},xl:{button:{size:`xl`},group:{size:`xl`},option:{size:`xl`},label:{fontSize:`lg`}}},variants:{outlined:{button:{hoverBg:`white`,activeBg:`white`,borderColor:`sandstone.60`,hoverBorderColor:`sandstone.60`}},text:{button:{hoverBg:`white`,activeBg:`white`,borderColor:`transparent`,hoverBorderColor:`transparent`}}}};export{e as default};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=theme.js.map

package/dist/select/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/select/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  size: 'lg',\n  variant: 'outlined',\n}\n\nconst parts = ['container', 'button', 'content', 'group', 'option', 'label']\n\nconst sizes = {\n  sm: {\n    button: {\n      size: 'sm',\n    },\n    group: {\n      size: 'sm',\n    },\n    option: {\n      size: 'sm',\n    },\n    label: {\n      fontSize: 'xs',\n    },\n  },\n  md: {\n    button: {\n      size: 'md',\n    },\n    group: {\n      size: 'md',\n    },\n    option: {\n      size: 'md',\n    },\n    label: {\n      fontSize: 'sm',\n    },\n  },\n  lg: {\n    button: {\n      size: 'lg',\n    },\n    group: {\n      size: 'lg',\n    },\n    option: {\n      size: 'lg',\n    },\n    label: {\n      fontSize: 'md',\n    },\n  },\n  xl: {\n    button: {\n      size: 'xl',\n    },\n    group: {\n      size: 'xl',\n    },\n    option: {\n      size: 'xl',\n    },\n    label: {\n      fontSize: 'lg',\n    },\n  },\n}\n\nconst variants = {\n  outlined: {\n    button: {\n      hoverBg: 'white',\n      activeBg: 'white',\n      borderColor: 'sandstone.60',\n      hoverBorderColor: 'sandstone.60',\n    },\n  },\n  text: {\n    button: {\n      hoverBg: 'white',\n      activeBg: 'white',\n      borderColor: 'transparent',\n      hoverBorderColor: 'transparent',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":"AAuFA,IAAA,EAAe,CACb,UAxFgB,EAAE,CAyFlB,aAvFmB,CACnB,KAAM,KACN,QAAS,WACV,CAqFC,MAnFY,CAAC,YAAa,SAAU,UAAW,QAAS,SAAU,QAAQ,CAoF1E,MAlFY,CACZ,GAAI,CACF,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,KAAM,KACP,CACD,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,SAAU,KACX,CACF,CACD,GAAI,CACF,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,KAAM,KACP,CACD,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,SAAU,KACX,CACF,CACD,GAAI,CACF,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,KAAM,KACP,CACD,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,SAAU,KACX,CACF,CACD,GAAI,CACF,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,KAAM,KACP,CACD,OAAQ,CACN,KAAM,KACP,CACD,MAAO,CACL,SAAU,KACX,CACF,CACF,CA0BC,SAxBe,CACf,SAAU,CACR,OAAQ,CACN,QAAS,QACT,SAAU,QACV,YAAa,eACb,iBAAkB,eACnB,CACF,CACD,KAAM,CACJ,OAAQ,CACN,QAAS,QACT,SAAU,QACV,YAAa,cACb,iBAAkB,cACnB,CACF,CACF,CAQA"}

package/dist/select/useSelect.d.ts

@@ -0,0 +1,16 @@
+import { ChangeEvent } from "../utils/types.js";
+import { UseSelectProps } from "./useSelect.types.js";
+import { SelectOptionData, SelectValue } from "./select.types.js";
+
+//#region src/select/useSelect.d.ts
+declare const getOptionText: (value: SelectValue, options: SelectOptionData[]) => SelectValue;
+/** Handles controlled/uncontrolled value state. Supports single and multiple values. */
+declare function useSelect(props: UseSelectProps): {
+  onChange: (e: ChangeEvent) => void;
+  value: SelectValue | SelectValue[] | undefined;
+  valueText: SelectValue | undefined;
+};
+type UseSelectReturnType = ReturnType<typeof useSelect>;
+//#endregion
+export { UseSelectReturnType, getOptionText };
+//# sourceMappingURL=useSelect.d.ts.map

package/dist/select/useSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelect.d.ts","names":[],"sources":["../../src/select/useSelect.tsx"],"sourcesContent":[],"mappings":";;;;;cAOa,uBAAwB,sBAAsB,uBAAkB;;AAAhE,iBAOW,SAAA,CAHvB,KAAA,EAGwC,cAHxC,CAAA,EAAA;EAAA,QAAA,EAAA,CAAA,CAAA,EA4BqC,WA5BrC,EAAA,GAAA,IAAA;OAJoC,aAAA,cAAA,EAAA,GAAA,SAAA;WAAsB,aAAA,GAAA,SAAA;;AAI1D,KAiDW,mBAAA,GAAsB,UAjDjC,CAAA,OAiDmD,SAjDnD,CAAA"}

package/dist/select/useSelect.js

@@ -0,0 +1,2 @@
+import{toggleItem as e}from"../utils/array.js";import{useCallbackRef as t}from"../utils/react.js";import{Children as n,isValidElement as r,useState as i}from"react";const a=(e,t)=>t?.find(t=>t?.value===e)?.text||e;function o(o){let{defaultValue:s,isMultiple:c,onChange:l,value:u,options:d=[],selectedText:f,children:p}=o,[m,h]=i(s),g=u!==void 0,_=g?u:m,v=[];n.forEach(p,e=>{if(!r(e))return;let t=e.props;t.text&&t.value&&v.push(t)});let y=t(t=>{l?.(t),g||h(n=>Array.isArray(n)?e(n,t.target.value).sort():t.target.value)}),b=c&&Array.isArray(_)?_[0]?f&&_.length>1?f:`${a(_[0],[...d,...v])}${_.length>1?` (+${_.length-1})`:``}`:void 0:a(_,[...d,...v]);return{onChange:y,value:_,valueText:b}}export{o as default,a as getOptionText};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=useSelect.js.map

package/dist/select/useSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelect.js","names":["dynamicOptions: SelectOptionData[]","option: SelectOptionData","value"],"sources":["../../src/select/useSelect.tsx"],"sourcesContent":["import { Children, isValidElement, useState } from 'react'\n\nimport type { ChangeEvent } from '../utils'\nimport { toggleItem, useCallbackRef } from '../utils'\nimport type { SelectOptionData, SelectValue } from './select.types'\nimport type { UseSelectProps } from './useSelect.types'\n\nexport const getOptionText = (value: SelectValue, options: SelectOptionData[]) => {\n  const option = options?.find((o: SelectOptionData) => o?.value === value)\n\n  return option?.text || value\n}\n\n/** Handles controlled/uncontrolled value state. Supports single and multiple values. */\nexport default function useSelect(props: UseSelectProps) {\n  const {\n    defaultValue,\n    isMultiple,\n    onChange: onChangeProp,\n    value: valueProp,\n    options = [],\n    selectedText,\n    children,\n  } = props\n\n  // Not using useControlled here, because we need custom value setter when uncontrolled\n  const [stateValue, setStateValue] = useState(defaultValue)\n  const isControlled = valueProp !== undefined\n  const value = isControlled ? valueProp : stateValue\n\n  // Iterating over the children to dynamically obtain the list of available options\n  const dynamicOptions: SelectOptionData[] = []\n  Children.forEach(children, element => {\n    if (!isValidElement(element)) return\n    const option: SelectOptionData = element.props as SelectOptionData\n    if (option.text && option.value) dynamicOptions.push(option)\n  })\n\n  /** Sends a change event to the external consumer, but internall keeps the actual value as primitive or array. */\n  const onChange = useCallbackRef((e: ChangeEvent) => {\n    onChangeProp?.(e)\n\n    if (!isControlled)\n      setStateValue(value => (Array.isArray(value) ? toggleItem(value, e.target.value).sort() : e.target.value))\n  })\n\n  const valueText =\n    isMultiple && Array.isArray(value)\n      ? value[0]\n        ? selectedText && value.length > 1\n          ? selectedText\n          : `${getOptionText(value[0], [...options, ...dynamicOptions])}${\n              value.length > 1 ? ` (+${value.length - 1})` : ''\n            }`\n        : undefined\n      : getOptionText(value as SelectValue, [...options, ...dynamicOptions])\n\n  return { onChange, value, valueText }\n}\n\nexport type UseSelectReturnType = ReturnType<typeof useSelect>\n"],"mappings":"qKAOA,MAAa,GAAiB,EAAoB,IACjC,GAAS,KAAM,GAAwB,GAAG,QAAU,EAAM,EAE1D,MAAQ,EAIzB,SAAwB,EAAU,EAAuB,CACvD,GAAM,CACJ,eACA,aACA,SAAU,EACV,MAAO,EACP,UAAU,EAAE,CACZ,eACA,YACE,EAGE,CAAC,EAAY,GAAiB,EAAS,EAAa,CACpD,EAAe,IAAc,IAAA,GAC7B,EAAQ,EAAe,EAAY,EAGnCA,EAAqC,EAAE,CAC7C,EAAS,QAAQ,EAAU,GAAW,CACpC,GAAI,CAAC,EAAe,EAAQ,CAAE,OAC9B,IAAMC,EAA2B,EAAQ,MACrC,EAAO,MAAQ,EAAO,OAAO,EAAe,KAAK,EAAO,EAC5D,CAGF,IAAM,EAAW,EAAgB,GAAmB,CAClD,IAAe,EAAE,CAEZ,GACH,EAAc,GAAU,MAAM,QAAQC,EAAM,CAAG,EAAWA,EAAO,EAAE,OAAO,MAAM,CAAC,MAAM,CAAG,EAAE,OAAO,MAAO,EAC5G,CAEI,EACJ,GAAc,MAAM,QAAQ,EAAM,CAC9B,EAAM,GACJ,GAAgB,EAAM,OAAS,EAC7B,EACA,GAAG,EAAc,EAAM,GAAI,CAAC,GAAG,EAAS,GAAG,EAAe,CAAC,GACzD,EAAM,OAAS,EAAI,MAAM,EAAM,OAAS,EAAE,GAAK,KAEnD,IAAA,GACF,EAAc,EAAsB,CAAC,GAAG,EAAS,GAAG,EAAe,CAAC,CAE1E,MAAO,CAAE,WAAU,QAAO,YAAW"}

package/dist/select/useSelect.types.d.ts

@@ -0,0 +1,32 @@
+import { ChangeEvent } from "../utils/types.js";
+import { ButtonProps } from "../button/button.types.js";
+import { SelectOptionData, SelectValue } from "./select.types.js";
+import { ReactNode } from "react";
+
+//#region src/select/useSelect.types.d.ts
+type UseSelectProps = {
+  /** Currently selected value in controlled mode. */
+  value?: SelectValue | SelectValue[];
+  /** Provides initial value in uncontrolled mode. */
+  defaultValue?: SelectValue | SelectValue[];
+  /** Allows choosing multiple values. Popover won't close automatically on item click. */
+  isMultiple?: boolean;
+  /** List of all available options */
+  options?: SelectOptionData[];
+  /** Select children elements for dynamic handling */
+  children?: ReactNode;
+  /** Props added to the select button */
+  selectButtonProps?: ButtonProps;
+  /** Displayed inside the trigger when multiple options selected. */
+  selectedText?: string;
+  /**
+   * Callback triggered when an option is selected.
+   *
+   * WARNING: In reality it's a click event extended with our own 'value' and 'name' on e.target.
+   * It's this way to support external form libraries and typed as input ChangeEvent to avoid type conflicts.
+   */
+  onChange?: (e: ChangeEvent) => void;
+};
+//#endregion
+export { UseSelectProps };
+//# sourceMappingURL=useSelect.types.d.ts.map

package/dist/select/useSelect.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelect.types.d.ts","names":[],"sources":["../../src/select/useSelect.types.ts"],"sourcesContent":[],"mappings":";;;;;;KAMY,cAAA;;EAAA,KAAA,CAAA,EAEF,WAFgB,GAEF,WAFE,EAAA;EAAA;cAEhB,CAAA,EAEO,WAFP,GAEqB,WAFrB,EAAA;;YAEO,CAAA,EAAA,OAAA;;SAIL,CAAA,EAAA,gBAAA,EAAA;;UAIU,CAAA,EAFT,SAES;;EASM,iBAAA,CAAA,EATN,WASM;;;;;;;;;iBAAX"}

package/dist/sidemenu/consts.js

@@ -0,0 +1,2 @@
+const e=52,t=240;export{e as collapsedWidth,t as expandedWidth};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=consts.js.map

package/dist/sidemenu/consts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.js","names":[],"sources":["../../src/sidemenu/consts.ts"],"sourcesContent":["export const collapsedWidth = 52\n\nexport const expandedWidth = 240\n"],"mappings":"AAAA,MAAa,EAAiB,GAEjB,EAAgB"}

package/dist/sidemenu/context.js

@@ -0,0 +1,2 @@
+import{createContext as e}from"../utils/react.js";const[t,n]=e({isOptional:!0});export{t as SidemenuProvider,n as useSidemenuContext};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=context.js.map

package/dist/sidemenu/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":[],"sources":["../../src/sidemenu/context.ts"],"sourcesContent":["import type { Dict } from '../utils'\nimport { createContext } from '../utils'\n\nconst [SidemenuProvider, useSidemenuContext] = createContext<Dict>({ isOptional: true })\n\nexport { SidemenuProvider, useSidemenuContext }\n"],"mappings":"kDAGA,KAAM,CAAC,EAAkB,GAAsB,EAAoB,CAAE,WAAY,GAAM,CAAC"}

package/dist/sidemenu/sidemenu.d.ts

@@ -0,0 +1,14 @@
+import { VuiComponent } from "../core/vui.js";
+import { SidemenuProps } from "./sidemenu.types.js";
+import { SidemenuItem } from "./sidemenuItem.js";
+import { SidemenuTop } from "./sidemenuTop.js";
+
+//#region src/sidemenu/sidemenu.d.ts
+/** A collapsible side menu for navigation. */
+declare const Sidemenu: VuiComponent<"div", SidemenuProps> & {
+  Top: typeof SidemenuTop;
+  Item: typeof SidemenuItem;
+};
+//#endregion
+export { Sidemenu };
+//# sourceMappingURL=sidemenu.d.ts.map

package/dist/sidemenu/sidemenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenu.d.ts","names":[],"sources":["../../src/sidemenu/sidemenu.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAea,UA6FP,oBAAoB;EA7Fb,GAAA,EAAA,OA8FC,WAEb;EAAA,IAAA,EAAA,OADc,YACd"}

package/dist/sidemenu/sidemenu.js

@@ -0,0 +1,2 @@
+import{filterUndefined as e}from"../utils/object.js";import{cs as t}from"../utils/styles.js";import{isActivePath as n}from"../utils/window.js";import{useStyleConfig as r}from"../core/theme.js";import{vui as i}from"../core/vui.js";import a from"../box/box.js";import o from"../icon/icon.js";import s from"../button/button.js";import{collapsedWidth as c,expandedWidth as l}from"./consts.js";import{SidemenuProvider as u}from"./context.js";import d from"./sidemenuItem.js";import f from"./sidemenuTop.js";import{useEffect as p,useMemo as m,useState as h}from"react";import{jsx as g,jsxs as _}from"react/jsx-runtime";const v=i((i,f)=>{let{children:v,className:y,items:b,isExpanded:x=!1,isSticky:S=!1,size:C,variant:w,width:T=l,onNavigate:E,...D}=i,[O,k]=h(x),A=m(()=>e({size:C,variant:w,isExpandedHorizontally:O}),[C,w,O]),j=r(`Sidemenu`,i),M=w===`dark`;p(()=>{k(x)},[x]);let N=()=>k(!O),P=O?T:c,F=`falArrow${O?`Left`:`Right`}`,I=O?`flex-end`:`center`;function L(e){e?.onClick?.(),e?.path&&E?.(e.path)}return g(u,{value:A,children:_(a,{className:t(`vui-sidemenu`,y),elevation:`3`,flexDirection:`column`,minWidth:0,overflowX:`hidden`,position:S?`sticky`:`static`,ref:f,top:S?top||0:`auto`,transitionDuration:`normal`,w:P,...j.container,...D,children:[g(a,{flexDirection:`column`,flexGrow:1,justifyContent:`flex-start`,minW:l,overflowX:`hidden`,overflowY:`auto`,w:`100%`,children:b?b?.map?.((e,t)=>g(d,{isActive:n(e?.path),...e,onClick:()=>L(e)},t)):v}),g(a,{className:`vui-sidemenu-bottom`,w:`100%`,...j.bottom,children:g(s,{"aria-label":O?`Collapse`:`Expand`,borderRadius:0,justifyContent:I,minH:C===`lg`?`56px`:`40px`,onClick:N,pl:0,size:`md`,variant:M?`tertiaryLight`:`tertiaryDark`,w:`100%`,children:g(o,{name:F})})})]})})});v.Top=f,v.Item=d,v.displayName=`Sidemenu`;export{v as Sidemenu};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=sidemenu.js.map

package/dist/sidemenu/sidemenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenu.js","names":["Box","SidemenuItem","Button","Icon","SidemenuTop"],"sources":["../../src/sidemenu/sidemenu.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react'\n\nimport Box from '../box'\nimport Button from '../button'\nimport type { VuiComponent } from '../core'\nimport { useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport { cs, filterUndefined, isActivePath } from '../utils'\nimport { collapsedWidth, expandedWidth } from './consts'\nimport { SidemenuProvider } from './context'\nimport type { SidemenuItemProps, SidemenuProps } from './sidemenu.types'\nimport SidemenuItem from './sidemenuItem'\nimport SidemenuTop from './sidemenuTop'\n\n/** A collapsible side menu for navigation. */\nexport const Sidemenu = vui<'div', SidemenuProps>((props, ref) => {\n  const {\n    children,\n    className,\n    items,\n    isExpanded = false,\n    isSticky = false,\n    size,\n    variant,\n    width = expandedWidth,\n    onNavigate,\n    ...rest\n  } = props\n\n  const [isExpandedHorizontally, setIsExpandedHorizontally] = useState(isExpanded)\n  const context = useMemo(\n    () => filterUndefined({ size, variant, isExpandedHorizontally }),\n    [size, variant, isExpandedHorizontally],\n  )\n\n  const styles = useStyleConfig('Sidemenu', props)\n\n  const isDark = variant === 'dark'\n\n  useEffect(() => {\n    setIsExpandedHorizontally(isExpanded)\n  }, [isExpanded])\n\n  const onToggle = () => setIsExpandedHorizontally(!isExpandedHorizontally)\n\n  const w = isExpandedHorizontally ? width : collapsedWidth\n  const icon = `falArrow${isExpandedHorizontally ? 'Left' : 'Right'}`\n  const justifyContent = isExpandedHorizontally ? 'flex-end' : 'center'\n\n  function onItemClick(item: SidemenuItemProps) {\n    item?.onClick?.()\n    if (item?.path) onNavigate?.(item.path)\n  }\n\n  return (\n    <SidemenuProvider value={context}>\n      <Box\n        className={cs('vui-sidemenu', className)}\n        elevation=\"3\"\n        flexDirection=\"column\"\n        minWidth={0}\n        overflowX=\"hidden\"\n        position={isSticky ? 'sticky' : 'static'}\n        ref={ref}\n        top={isSticky ? (top ? top : 0) : 'auto'}\n        transitionDuration=\"normal\"\n        w={w}\n        {...styles.container}\n        {...rest}\n      >\n        <Box\n          flexDirection=\"column\"\n          flexGrow={1}\n          justifyContent=\"flex-start\"\n          minW={expandedWidth}\n          overflowX=\"hidden\"\n          overflowY=\"auto\"\n          w=\"100%\"\n        >\n          {items\n            ? items?.map?.((item: SidemenuItemProps, key: number) => (\n                <SidemenuItem\n                  isActive={isActivePath(item?.path)}\n                  key={key}\n                  {...item}\n                  onClick={() => onItemClick(item)}\n                />\n              ))\n            : children}\n        </Box>\n        <Box className=\"vui-sidemenu-bottom\" w=\"100%\" {...styles.bottom}>\n          <Button\n            aria-label={isExpandedHorizontally ? 'Collapse' : 'Expand'}\n            borderRadius={0}\n            justifyContent={justifyContent}\n            minH={size === 'lg' ? '56px' : '40px'}\n            onClick={onToggle}\n            pl={0}\n            size=\"md\"\n            variant={isDark ? 'tertiaryLight' : 'tertiaryDark'}\n            w=\"100%\"\n          >\n            <Icon name={icon} />\n          </Button>\n        </Box>\n      </Box>\n    </SidemenuProvider>\n  )\n}) as VuiComponent<'div', SidemenuProps> & {\n  Top: typeof SidemenuTop\n  Item: typeof SidemenuItem\n}\n\nSidemenu.Top = SidemenuTop\nSidemenu.Item = SidemenuItem\nSidemenu.displayName = 'Sidemenu'\n\nexport default Sidemenu\n"],"mappings":"qmBAeA,MAAa,EAAW,GAA2B,EAAO,IAAQ,CAChE,GAAM,CACJ,WACA,YACA,QACA,aAAa,GACb,WAAW,GACX,OACA,UACA,QAAQ,EACR,aACA,GAAG,GACD,EAEE,CAAC,EAAwB,GAA6B,EAAS,EAAW,CAC1E,EAAU,MACR,EAAgB,CAAE,OAAM,UAAS,yBAAwB,CAAC,CAChE,CAAC,EAAM,EAAS,EAAuB,CACxC,CAEK,EAAS,EAAe,WAAY,EAAM,CAE1C,EAAS,IAAY,OAE3B,MAAgB,CACd,EAA0B,EAAW,EACpC,CAAC,EAAW,CAAC,CAEhB,IAAM,MAAiB,EAA0B,CAAC,EAAuB,CAEnE,EAAI,EAAyB,EAAQ,EACrC,EAAO,WAAW,EAAyB,OAAS,UACpD,EAAiB,EAAyB,WAAa,SAE7D,SAAS,EAAY,EAAyB,CAC5C,GAAM,WAAW,CACb,GAAM,MAAM,IAAa,EAAK,KAAK,CAGzC,OACE,EAAC,EAAA,CAAiB,MAAO,WACvB,EAACA,EAAAA,CACC,UAAW,EAAG,eAAgB,EAAU,CACxC,UAAU,IACV,cAAc,SACd,SAAU,EACV,UAAU,SACV,SAAU,EAAW,SAAW,SAC3B,MACL,IAAK,EAAY,KAAY,EAAK,OAClC,mBAAmB,SAChB,IACH,GAAI,EAAO,UACX,GAAI,YAEJ,EAACA,EAAAA,CACC,cAAc,SACd,SAAU,EACV,eAAe,aACf,KAAM,EACN,UAAU,SACV,UAAU,OACV,EAAE,gBAED,EACG,GAAO,OAAO,EAAyB,IACrC,EAACC,EAAAA,CACC,SAAU,EAAa,GAAM,KAAK,CAElC,GAAI,EACJ,YAAe,EAAY,EAAK,EAF3B,EAGL,CACF,CACF,GACA,CACN,EAACD,EAAAA,CAAI,UAAU,sBAAsB,EAAE,OAAO,GAAI,EAAO,gBACvD,EAACE,EAAAA,CACC,aAAY,EAAyB,WAAa,SAClD,aAAc,EACE,iBAChB,KAAM,IAAS,KAAO,OAAS,OAC/B,QAAS,EACT,GAAI,EACJ,KAAK,KACL,QAAS,EAAS,gBAAkB,eACpC,EAAE,gBAEF,EAACC,EAAAA,CAAK,KAAM,EAAA,CAAQ,EACb,EACL,CAAA,EACF,EACW,EAErB,CAKF,EAAS,IAAMC,EACf,EAAS,KAAOH,EAChB,EAAS,YAAc"}

package/dist/sidemenu/sidemenu.types.d.ts

@@ -0,0 +1,54 @@
+import { ThemingProps } from "../theme/types.js";
+import { SystemProps } from "../system/system.js";
+import { BoxProps } from "../box/box.types.js";
+import { IconProp } from "../icon/icon.types.js";
+import { ReactNode } from "react";
+
+//#region src/sidemenu/sidemenu.types.d.ts
+type SidemenuOrientation = 'vertical' | 'horizontal';
+type SidemenuProps = SystemProps & ThemingProps<'Sidemenu'> & {
+  /** Collection of menu items  */
+  items?: SidemenuItemProps[];
+  /** Whether the menu is expanded @default false  */
+  isExpanded?: boolean;
+  isSticky?: boolean;
+  /** External callback for navigation to the item path, could be a custom function or React Router hook: https://reactrouter.com/en/main/hooks/use-navigate  */
+  onNavigate?: (to: string) => void;
+  /** With of the container when the side menu is expanded @default 280  */
+  width?: number;
+};
+type SidemenuItemProps = BoxProps & {
+  /** Custom class name */
+  className?: string;
+  /** Children */
+  children?: ReactNode;
+  /** Custom class name */
+  icon?: IconProp;
+  /** Icon size @default md  */
+  iconSize?: 'md' | 'sm';
+  /** Whether the item is active */
+  isActive?: boolean;
+  /** Whether the item is expanded vertically */
+  isExpanded?: boolean;
+  /** On click callback */
+  onClick?: () => void;
+  /** On collapse callback @default true */
+  onCollapse?: () => void;
+  /** On expand callback */
+  onExpand?: () => void;
+  /** Router path */
+  path?: string;
+  /** Title */
+  title: string;
+};
+type SidemenuTopProps = BoxProps & {
+  /** Custom class name */
+  className?: string;
+  /** Left slod (always visible) */
+  leftSlot?: ReactNode;
+  /** Right slod (hiden if the sidemenu is collapsed) */
+  rightSlot?: ReactNode;
+};
+//#endregion
+export { SidemenuItemProps, SidemenuOrientation, SidemenuProps, SidemenuTopProps };
+//# sourceMappingURL=sidemenu.types.d.ts.map

package/dist/sidemenu/sidemenu.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenu.types.d.ts","names":[],"sources":["../../src/sidemenu/sidemenu.types.ts"],"sourcesContent":[],"mappings":";;;;;;;KAOY,mBAAA;KAEA,aAAA,GAAgB,cAC1B;EAHU;EAEA,KAAA,CAAA,EAGA,iBAHa,EAAA;EAAA;YAAG,CAAA,EAAA,OAAA;UAC1B,CAAA,EAAA,OAAA;;EAE2B,UAAA,CAAA,EAAA,CAAA,EAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAUjB;EAAiB,KAAA,CAAA,EAAA,MAAA;;AAIhB,KAJD,iBAAA,GAAoB,QAInB,GAAA;;EAEI,SAAA,CAAA,EAAA,MAAA;EAmBL;EAAgB,QAAA,CAAA,EArBf,SAqBe;;MAIf,CAAA,EAvBJ,QAuBI;;EAEU,QAAA,CAAA,EAAA,IAAA,GAAA,IAAA;;;;;;;;;;;;;;;;KANX,gBAAA,GAAmB;;;;aAIlB;;cAEC"}

package/dist/sidemenu/sidemenuItem.d.ts

@@ -0,0 +1,9 @@
+import { VuiComponent } from "../core/vui.js";
+import { SidemenuItemProps } from "./sidemenu.types.js";
+
+//#region src/sidemenu/sidemenuItem.d.ts
+/** A menu item. */
+declare const SidemenuItem: VuiComponent<"div", SidemenuItemProps>;
+//#endregion
+export { SidemenuItem };
+//# sourceMappingURL=sidemenuItem.d.ts.map

package/dist/sidemenu/sidemenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuItem.d.ts","names":[],"sources":["../../src/sidemenu/sidemenuItem.tsx"],"sourcesContent":[],"mappings":";;;;;cAgBa,cAqGP,oBAAoB"}

package/dist/sidemenu/sidemenuItem.js

@@ -0,0 +1,2 @@
+import{cs as e}from"../utils/styles.js";import{omitThemingProps as t}from"../core/theme.js";import{vui as n}from"../core/vui.js";import r from"../box/box.js";import i from"../icon/icon.js";import a from"../t/t.js";import o from"../button/button.js";import s from"../popover/popover.js";import{collapsedWidth as c,expandedWidth as l}from"./consts.js";import u from"./useSidemenuItem.js";import{useEffect as d}from"react";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m=n((n,m)=>{let{className:h,children:g,icon:_,iconSize:v=`md`,isActive:y,isExpanded:b=!0,pl:x=0,py:S=0,onClick:C,onCollapse:w,onExpand:T,title:E,...D}=t(n),{isExpandedVertically:O,setIsExpandedVertically:k,isDark:A,size:j,isExpandedHorizontally:M,styles:N}=u(b);d(()=>{O&&T?.(),O||w?.()},[O]);let P=!!g&&M,F=()=>p(r,{centerV:!0,px:1.5,py:1,w:`100%`,whiteSpace:`pre`,children:[f(i,{ml:v===`sm`?`4px`:0,name:_,size:v}),f(a,{isTruncated:!0,ml:2,children:E})]}),I=e=>{e.preventDefault(),e.stopPropagation(),k(!O)},L={alignItems:`center`,border:`none`,borderRadius:0,borderLeft:!P&&g?`none`:`3px solid transparent`,borderLeftColor:y?A?`digiGreen.main`:`seaBlue.main`:void 0,bg:A?`darkBlue.main`:y?`skyBlue.95`:`white`,color:P?`seaBlue.main`:A?`digiGreen.main`:`sandstone.10`,h:`auto`,justifyContent:`space-between`,onClick:()=>C?.(),pl:x,py:S,size:`md`,variant:A?`tertiaryLight`:`tertiaryDark`,w:`100%`,...N.item,minH:j===`lg`?`56px`:`40px`,hoverBg:A?`seaBlue.main`:`skyBlue.90`,...D};return p(r,{flexDirection:`column`,ref:m,w:`100%`,children:[!P&&g?p(s,{offset:[0,c-l-2],placement:`right-start`,trigger:`mouseenter`,children:[f(s.Trigger,{as:r,className:e(`vui-sidemenu-item-popover`,h),children:f(r,{...L,borderLeft:`3px solid ${A?`digiGreen.main`:`seaBlue.main`}`,children:f(F,{})})}),f(s.Content,{elevation:`none`,children:f(r,{flexDirection:`column`,justifyContent:`start`,w:`100%`,children:g})})]}):p(o,{className:e(`vui-sidemenu-item`,h),...L,children:[f(F,{}),P&&f(o,{"aria-label":O?`Collapse`:`Expand`,className:`vui-sidemenu-item-expand`,icon:O?`falChevronUp`:`falChevronDown`,onClick:I,size:`sm`,variant:A?`tertiaryLight`:`tertiaryDark`})]}),!!g&&P&&O&&f(r,{flexDirection:`column`,justifyContent:`start`,w:`100%`,children:g})]})});m.displayName=`SidemenuItem`;var h=m;export{m as SidemenuItem,h as default};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=sidemenuItem.js.map

package/dist/sidemenu/sidemenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuItem.js","names":["useSidemenuItem","Box","Icon","T","Button"],"sources":["../../src/sidemenu/sidemenuItem.tsx"],"sourcesContent":["import type { MouseEvent } from 'react'\nimport { useEffect } from 'react'\n\nimport Box from '../box'\nimport Button from '../button'\nimport type { VuiComponent } from '../core'\nimport { omitThemingProps, vui } from '../core'\nimport Icon from '../icon'\nimport { Popover } from '../popover'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { collapsedWidth, expandedWidth } from './consts'\nimport type { SidemenuItemProps } from './sidemenu.types'\nimport useSidemenuItem from './useSidemenuItem'\n\n/** A menu item. */\nexport const SidemenuItem = vui<'button', SidemenuItemProps>((props, ref) => {\n  const {\n    className,\n    children,\n    icon,\n    iconSize = 'md',\n    isActive,\n    isExpanded = true,\n    pl = 0,\n    py = 0,\n    onClick,\n    onCollapse,\n    onExpand,\n    title,\n    ...rest\n  } = omitThemingProps(props)\n\n  const { isExpandedVertically, setIsExpandedVertically, isDark, size, isExpandedHorizontally, styles } =\n    useSidemenuItem(isExpanded)\n\n  useEffect(() => {\n    if (isExpandedVertically) onExpand?.()\n    if (!isExpandedVertically) onCollapse?.()\n  }, [isExpandedVertically])\n\n  const hasChildrenExpanded = !!children && isExpandedHorizontally\n\n  const InnerContent = () => (\n    <Box centerV px={1.5} py={1} w=\"100%\" whiteSpace=\"pre\">\n      <Icon ml={iconSize === 'sm' ? '4px' : 0} name={icon} size={iconSize} />\n      <T isTruncated ml={2}>\n        {title}\n      </T>\n    </Box>\n  )\n\n  const toggle = (e: MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setIsExpandedVertically(!isExpandedVertically)\n  }\n\n  const buttonStyles = {\n    alignItems: 'center',\n    border: 'none',\n    borderRadius: 0,\n    borderLeft: !hasChildrenExpanded && children ? 'none' : '3px solid transparent',\n    borderLeftColor: isActive ? (isDark ? 'digiGreen.main' : 'seaBlue.main') : undefined,\n    bg: isDark ? 'darkBlue.main' : isActive ? 'skyBlue.95' : 'white',\n    color: hasChildrenExpanded ? 'seaBlue.main' : isDark ? 'digiGreen.main' : 'sandstone.10',\n    h: 'auto',\n    justifyContent: 'space-between',\n    onClick: () => onClick?.(),\n    pl,\n    py,\n    size: 'md',\n    variant: isDark ? 'tertiaryLight' : 'tertiaryDark',\n    w: '100%',\n    ...styles.item,\n    minH: size === 'lg' ? '56px' : '40px',\n    hoverBg: isDark ? 'seaBlue.main' : 'skyBlue.90',\n    ...rest,\n  }\n\n  return (\n    <Box flexDirection=\"column\" ref={ref} w=\"100%\">\n      {!hasChildrenExpanded && children ? (\n        <Popover offset={[0, collapsedWidth - expandedWidth - 2]} placement=\"right-start\" trigger=\"mouseenter\">\n          <Popover.Trigger as={Box} className={cs('vui-sidemenu-item-popover', className)}>\n            <Box {...buttonStyles} borderLeft={`3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}`}>\n              <InnerContent />\n            </Box>\n          </Popover.Trigger>\n          <Popover.Content elevation=\"none\">\n            <Box flexDirection=\"column\" justifyContent=\"start\" w=\"100%\">\n              {children}\n            </Box>\n          </Popover.Content>\n        </Popover>\n      ) : (\n        <Button className={cs('vui-sidemenu-item', className)} {...buttonStyles}>\n          <InnerContent />\n          {hasChildrenExpanded && (\n            <Button\n              aria-label={isExpandedVertically ? 'Collapse' : 'Expand'}\n              className=\"vui-sidemenu-item-expand\"\n              icon={isExpandedVertically ? 'falChevronUp' : 'falChevronDown'}\n              onClick={toggle}\n              size=\"sm\"\n              variant={isDark ? 'tertiaryLight' : 'tertiaryDark'}\n            />\n          )}\n        </Button>\n      )}\n      {!!children && hasChildrenExpanded && isExpandedVertically && (\n        <Box flexDirection=\"column\" justifyContent=\"start\" w=\"100%\">\n          {children}\n        </Box>\n      )}\n    </Box>\n  )\n}) as VuiComponent<'div', SidemenuItemProps>\n\nSidemenuItem.displayName = 'SidemenuItem'\n\nexport default SidemenuItem\n"],"mappings":"sdAgBA,MAAa,EAAe,GAAkC,EAAO,IAAQ,CAC3E,GAAM,CACJ,YACA,WACA,OACA,WAAW,KACX,WACA,aAAa,GACb,KAAK,EACL,KAAK,EACL,UACA,aACA,WACA,QACA,GAAG,GACD,EAAiB,EAAM,CAErB,CAAE,uBAAsB,0BAAyB,SAAQ,OAAM,yBAAwB,UAC3FA,EAAgB,EAAW,CAE7B,MAAgB,CACV,GAAsB,KAAY,CACjC,GAAsB,KAAc,EACxC,CAAC,EAAqB,CAAC,CAE1B,IAAM,EAAsB,CAAC,CAAC,GAAY,EAEpC,MACJ,EAACC,EAAAA,CAAI,QAAA,GAAQ,GAAI,IAAK,GAAI,EAAG,EAAE,OAAO,WAAW,gBAC/C,EAACC,EAAAA,CAAK,GAAI,IAAa,KAAO,MAAQ,EAAG,KAAM,EAAM,KAAM,GAAY,CACvE,EAACC,EAAAA,CAAE,YAAA,GAAY,GAAI,WAChB,GACC,CAAA,EACA,CAGF,EAAU,GAAqC,CACnD,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CACnB,EAAwB,CAAC,EAAqB,EAG1C,EAAe,CACnB,WAAY,SACZ,OAAQ,OACR,aAAc,EACd,WAAY,CAAC,GAAuB,EAAW,OAAS,wBACxD,gBAAiB,EAAY,EAAS,iBAAmB,eAAkB,IAAA,GAC3E,GAAI,EAAS,gBAAkB,EAAW,aAAe,QACzD,MAAO,EAAsB,eAAiB,EAAS,iBAAmB,eAC1E,EAAG,OACH,eAAgB,gBAChB,YAAe,KAAW,CAC1B,KACA,KACA,KAAM,KACN,QAAS,EAAS,gBAAkB,eACpC,EAAG,OACH,GAAG,EAAO,KACV,KAAM,IAAS,KAAO,OAAS,OAC/B,QAAS,EAAS,eAAiB,aACnC,GAAG,EACJ,CAED,OACE,EAACF,EAAAA,CAAI,cAAc,SAAc,MAAK,EAAE,iBACrC,CAAC,GAAuB,EACvB,EAAC,EAAA,CAAQ,OAAQ,CAAC,EAAG,EAAiB,EAAgB,EAAE,CAAE,UAAU,cAAc,QAAQ,uBACxF,EAAC,EAAQ,QAAA,CAAQ,GAAIA,EAAK,UAAW,EAAG,4BAA6B,EAAU,UAC7E,EAACA,EAAAA,CAAI,GAAI,EAAc,WAAY,aAAa,EAAS,iBAAmB,0BAC1E,EAAC,EAAA,EAAA,CAAe,EACZ,EACU,CAClB,EAAC,EAAQ,QAAA,CAAQ,UAAU,gBACzB,EAACA,EAAAA,CAAI,cAAc,SAAS,eAAe,QAAQ,EAAE,OAClD,YACG,EACU,CAAA,EACV,CAEV,EAACG,EAAAA,CAAO,UAAW,EAAG,oBAAqB,EAAU,CAAE,GAAI,YACzD,EAAC,EAAA,EAAA,CAAe,CACf,GACC,EAACA,EAAAA,CACC,aAAY,EAAuB,WAAa,SAChD,UAAU,2BACV,KAAM,EAAuB,eAAiB,iBAC9C,QAAS,EACT,KAAK,KACL,QAAS,EAAS,gBAAkB,gBACpC,CAAA,EAEG,CAEV,CAAC,CAAC,GAAY,GAAuB,GACpC,EAACH,EAAAA,CAAI,cAAc,SAAS,eAAe,QAAQ,EAAE,OAClD,YACG,CAAA,EAEJ,EAER,CAEF,EAAa,YAAc,eAE3B,IAAA,EAAe"}

package/dist/sidemenu/sidemenuTop.d.ts

@@ -0,0 +1,12 @@
+import { SidemenuTopProps } from "./sidemenu.types.js";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
+
+//#region src/sidemenu/sidemenuTop.d.ts
+/** Top container. */
+declare const SidemenuTop: {
+  (props: SidemenuTopProps): react_jsx_runtime7.JSX.Element | null;
+  displayName: string;
+};
+//#endregion
+export { SidemenuTop };
+//# sourceMappingURL=sidemenuTop.d.ts.map

package/dist/sidemenu/sidemenuTop.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuTop.d.ts","names":[],"sources":["../../src/sidemenu/sidemenuTop.tsx"],"sourcesContent":[],"mappings":";;;;;cAOa;UAAsB,mBAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA;EAAtC,WAAA,EAAA,MAgBZ;CAAA"}

package/dist/sidemenu/sidemenuTop.js

@@ -0,0 +1,2 @@
+import{cs as e}from"../utils/styles.js";import{omitThemingProps as t,useStyleConfig as n}from"../core/theme.js";import{Box as r}from"../box/box.js";import{collapsedWidth as i}from"./consts.js";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=s=>{let{className:c,leftSlot:l,rightSlot:u,...d}=t(s),f=n(`Sidemenu`,s);return!l&&!u?null:o(r,{className:e(`vui-sidemenu-top`,c),mb:1,w:`100%`,...f.sidemenuTop,...d,children:[!!l&&a(r,{alignItems:`center`,className:`vui-sidemenu-top-left`,minW:i,children:l}),!!u&&a(r,{className:`vui-sidemenu-top-left`,children:u})]})};s.displayName=`SidemenuTop`;var c=s;export{s as SidemenuTop,c as default};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=sidemenuTop.js.map

package/dist/sidemenu/sidemenuTop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuTop.js","names":[],"sources":["../../src/sidemenu/sidemenuTop.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { omitThemingProps, useStyleConfig } from '../core'\nimport { cs } from '../utils'\nimport { collapsedWidth } from './consts'\nimport type { SidemenuTopProps } from './sidemenu.types'\n\n/** Top container. */\nexport const SidemenuTop = (props: SidemenuTopProps) => {\n  const { className, leftSlot, rightSlot, ...rest } = omitThemingProps(props)\n  const styles = useStyleConfig('Sidemenu', props)\n\n  if (!leftSlot && !rightSlot) return null\n\n  return (\n    <Box className={cs('vui-sidemenu-top', className)} mb={1} w=\"100%\" {...styles.sidemenuTop} {...rest}>\n      {!!leftSlot && (\n        <Box alignItems=\"center\" className=\"vui-sidemenu-top-left\" minW={collapsedWidth}>\n          {leftSlot}\n        </Box>\n      )}\n      {!!rightSlot && <Box className=\"vui-sidemenu-top-left\">{rightSlot}</Box>}\n    </Box>\n  )\n}\n\nSidemenuTop.displayName = 'SidemenuTop'\n\nexport default SidemenuTop\n"],"mappings":"mPAOA,MAAa,EAAe,GAA4B,CACtD,GAAM,CAAE,YAAW,WAAU,YAAW,GAAG,GAAS,EAAiB,EAAM,CACrE,EAAS,EAAe,WAAY,EAAM,CAIhD,MAFI,CAAC,GAAY,CAAC,EAAkB,KAGlC,EAAC,EAAA,CAAI,UAAW,EAAG,mBAAoB,EAAU,CAAE,GAAI,EAAG,EAAE,OAAO,GAAI,EAAO,YAAa,GAAI,YAC5F,CAAC,CAAC,GACD,EAAC,EAAA,CAAI,WAAW,SAAS,UAAU,wBAAwB,KAAM,WAC9D,GACG,CAEP,CAAC,CAAC,GAAa,EAAC,EAAA,CAAI,UAAU,iCAAyB,GAAgB,CAAA,EACpE,EAIV,EAAY,YAAc,cAE1B,IAAA,EAAe"}

package/dist/sidemenu/theme.js

@@ -0,0 +1,2 @@
+var e={baseStyle:{},defaultProps:{size:`md`,variant:`light`},parts:[`container`,`item`,`sidemenuTop`,`bottom`],sizes:{md:{item:{minH:`40px`}},lg:{item:{minH:`56px`}}},variants:{light:{container:{bg:`white`},bottom:{borderTop:`1px solid lightgray`},sidemenuTop:{borderBottom:`1px solid lightgray`},item:{}},dark:{container:{bg:`darkBlue.main`,color:`white`},bottom:{borderTop:`1px solid black`},sidemenuTop:{borderBottom:`1px solid black`},item:{}}}};export{e as default};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=theme.js.map

package/dist/sidemenu/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/sidemenu/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'light',\n}\n\nconst parts = ['container', 'item', 'sidemenuTop', 'bottom']\n\nconst sizes = {\n  md: {\n    item: {\n      minH: '40px',\n    },\n  },\n  lg: {\n    item: {\n      minH: '56px',\n    },\n  },\n}\nconst variants = {\n  light: {\n    container: {\n      bg: 'white',\n    },\n    bottom: {\n      borderTop: '1px solid lightgray',\n    },\n    sidemenuTop: {\n      borderBottom: '1px solid lightgray',\n    },\n    item: {},\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n      color: 'white',\n    },\n    bottom: {\n      borderTop: '1px solid black',\n    },\n    sidemenuTop: {\n      borderBottom: '1px solid black',\n    },\n    item: {},\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":"AAiDA,IAAA,EAAe,CACb,UAlDgB,EAAE,CAmDlB,aAjDmB,CACnB,KAAM,KACN,QAAS,QACV,CA+CC,MA7CY,CAAC,YAAa,OAAQ,cAAe,SAAS,CA8C1D,MA5CY,CACZ,GAAI,CACF,KAAM,CACJ,KAAM,OACP,CACF,CACD,GAAI,CACF,KAAM,CACJ,KAAM,OACP,CACF,CACF,CAkCC,SAjCe,CACf,MAAO,CACL,UAAW,CACT,GAAI,QACL,CACD,OAAQ,CACN,UAAW,sBACZ,CACD,YAAa,CACX,aAAc,sBACf,CACD,KAAM,EAAE,CACT,CACD,KAAM,CACJ,UAAW,CACT,GAAI,gBACJ,MAAO,QACR,CACD,OAAQ,CACN,UAAW,kBACZ,CACD,YAAa,CACX,aAAc,kBACf,CACD,KAAM,EAAE,CACT,CACF,CAQA"}

package/dist/sidemenu/useSidemenuItem.js

@@ -0,0 +1,2 @@
+import{useStyleConfig as e}from"../core/theme.js";import{useSidemenuContext as t}from"./context.js";import{useEffect as n,useState as r}from"react";var i=i=>{let[a,o]=r(i),{variant:s,size:c,isExpandedHorizontally:l}=t(),u=e(`Sidemenu`,t);return n(()=>{i!==a&&o(i)},[i]),{isExpandedVertically:a,isDark:s===`dark`,size:c,isExpandedHorizontally:l,styles:u,setIsExpandedVertically:o}};export{i as default};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=useSidemenuItem.js.map

package/dist/sidemenu/useSidemenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSidemenuItem.js","names":[],"sources":["../../src/sidemenu/useSidemenuItem.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nimport { useStyleConfig } from '../core'\nimport { useSidemenuContext } from './context'\n\nconst useSidemenuItem = (isExpanded: boolean) => {\n  const [isExpandedVertically, setIsExpandedVertically] = useState(isExpanded)\n  const { variant, size, isExpandedHorizontally } = useSidemenuContext()\n  const styles = useStyleConfig('Sidemenu', useSidemenuContext)\n\n  useEffect(() => {\n    if (isExpanded !== isExpandedVertically) setIsExpandedVertically(isExpanded)\n  }, [isExpanded])\n\n  return {\n    isExpandedVertically,\n    isDark: variant === 'dark',\n    size,\n    isExpandedHorizontally,\n    styles,\n    setIsExpandedVertically,\n  }\n}\n\nexport default useSidemenuItem\n"],"mappings":"oJAwBA,IAAA,EAnByB,GAAwB,CAC/C,GAAM,CAAC,EAAsB,GAA2B,EAAS,EAAW,CACtE,CAAE,UAAS,OAAM,0BAA2B,GAAoB,CAChE,EAAS,EAAe,WAAY,EAAmB,CAM7D,OAJA,MAAgB,CACV,IAAe,GAAsB,EAAwB,EAAW,EAC3E,CAAC,EAAW,CAAC,CAET,CACL,uBACA,OAAQ,IAAY,OACpB,OACA,yBACA,SACA,0BACD"}

package/dist/sidemenuV2/consts.js

@@ -0,0 +1,2 @@
+const e=52,t=240;export{e as collapsedWidth,t as expandedWidth};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=consts.js.map

package/dist/sidemenuV2/consts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.js","names":[],"sources":["../../src/sidemenuV2/consts.ts"],"sourcesContent":["export const collapsedWidth = 52\n\nexport const expandedWidth = 240\n"],"mappings":"AAAA,MAAa,EAAiB,GAEjB,EAAgB"}

package/dist/sidemenuV2/context.d.ts

@@ -0,0 +1,39 @@
+import { Dict } from "../utils/types.js";
+import * as react960 from "react";
+import { ReactNode } from "react";
+import * as react_jsx_runtime15 from "react/jsx-runtime";
+
+//#region src/sidemenuV2/context.d.ts
+interface SidemenuContextValue extends Dict {
+  variant?: string;
+  size?: string;
+  isMenuExpanded?: boolean;
+  submenuStates?: Record<string, boolean>;
+  setSubmenuState?: (itemId: string, isOpen: boolean) => void;
+  toggleSubmenu?: (itemId: string) => void;
+  setIsExpanded?: (isExpanded: boolean) => void;
+  onExpandedChange?: (isExpanded: boolean) => void;
+  resetAllStates?: () => void;
+  resetExpansionOnly?: () => void;
+  resetSubmenuOnly?: () => void;
+}
+interface SidemenuStateProviderProps {
+  children: ReactNode;
+  isExpandedInitial?: boolean;
+  onExpandedChange?: (isExpanded: boolean) => void;
+  variant?: string;
+  size?: string;
+  isDark?: boolean;
+}
+declare const SidemenuProvider: react960.Provider<SidemenuContextValue>, useSidemenuContext: () => SidemenuContextValue;
+declare const SidemenuStateProvider: ({
+  children,
+  isExpandedInitial,
+  onExpandedChange,
+  variant,
+  size,
+  isDark
+}: SidemenuStateProviderProps) => react_jsx_runtime15.JSX.Element;
+//#endregion
+export { SidemenuStateProvider, useSidemenuContext };
+//# sourceMappingURL=context.d.ts.map

package/dist/sidemenuV2/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../src/sidemenuV2/context.tsx"],"sourcesContent":[],"mappings":";;;;;;UAMiB,oBAAA,SAA6B;;;;EAA7B,aAAA,CAAA,EAOC,MAPD,CAAqB,MAAA,EAAA,OAAA,CAAA;EAAA,eAAA,CAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,OAAA,EAAA,GAAA,IAAA;eAOpB,CAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,GAAA,IAAA;eAP4B,CAAA,EAAA,CAAA,UAAA,EAAA,OAAA,EAAA,GAAA,IAAA;EAAI,gBAAA,CAAA,EAAA,CAAA,UAAA,EAAA,OAAA,EAAA,GAAA,IAAA;EA4DxC,cAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EASH,kBAAA,CAAgB,EAAA,GAAA,GAAA,IAAA;EAAA,gBAAA,CAAA,EAAA,GAAA,GAAA,IAAA;;UATb,0BAAA,CASa;UAAoB,EAR/B,SAQ+B;EAAlB,iBAAA,CAAA,EAAA,OAAA;EAGZ,gBAAA,CAAA,EAAA,CAAA,UAmFZ,EAAA,OAAA,EAAA,GAAA,IAAA;EAAA,OAAA,CAAA,EAAA,MAAA;MAnFqC,CAAA,EAAA,MAAA;QAAA,CAAA,EAAA,OAAA;;cAH/B,gBAG+B,EAHf,QAAA,CAAA,QAGe,CAHf,oBAGe,CAAA,EAHb,kBAGa,EAAA,GAAA,GAHK,oBAGL;AAAA,cAAzB,qBAAyB,EAAA,CAAA;EAAA,QAAA;EAAA,iBAAA;EAAA,gBAAA;EAAA,OAAA;EAAA,IAAA;EAAA;AAAA,CAAA,EAOnC,0BAPmC,EAAA,GAOT,mBAAA,CAAA,GAAA,CAAA,OAPS"}

package/dist/sidemenuV2/context.js

@@ -0,0 +1,2 @@
+import{createContext as e}from"../utils/react.js";import{useCallback as t,useMemo as n,useReducer as r,useState as i}from"react";import{jsx as a}from"react/jsx-runtime";const o=(e,t)=>{let n;switch(t.type){case`SET_SUBMENU`:if(e[t.itemId]===t.isOpen)return e;n={...e,[t.itemId]:t.isOpen};break;case`TOGGLE_SUBMENU`:{let r=e[t.itemId]||!1;n={...e,[t.itemId]:!r};break}case`RESTORE_STATE`:n=t.state;break;case`RESET_ALL`:n={};break;default:return e}return n},[s,c]=e({isOptional:!0}),l=({children:e,isExpandedInitial:c=!0,onExpandedChange:l,variant:u,size:d,isDark:f})=>{let[p,m]=i(c),[h,g]=r(o,{}),_=t((e,t)=>{g({type:`SET_SUBMENU`,itemId:e,isOpen:t})},[]),v=t(e=>{g({type:`TOGGLE_SUBMENU`,itemId:e})},[]),y=t(e=>{m(e),l?.(e)},[l]),b=t(()=>{g({type:`RESET_ALL`});let e=c;m(e),l?.(e)},[c,l]),x=t(()=>{let e=c;m(e),l?.(e)},[c,l]),S=t(()=>{g({type:`RESET_ALL`})},[]),C=n(()=>({size:d,variant:u,isDark:f,isMenuExpanded:p,submenuStates:h,setSubmenuState:_,toggleSubmenu:v,setIsExpanded:y,onExpandedChange:l,resetAllStates:b,resetExpansionOnly:x,resetSubmenuOnly:S}),[d,u,f,p,h,_,v,y,l,b,x,S]);return a(s,{value:C,children:e})};export{l as SidemenuStateProvider,c as useSidemenuContext};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=context.js.map

package/dist/sidemenuV2/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":["newState: Record<string, boolean>","createContext"],"sources":["../../src/sidemenuV2/context.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useMemo, useState, useCallback, useReducer } from 'react'\n\nimport type { Dict } from '../utils'\nimport { createContext } from '../utils'\n\nexport interface SidemenuContextValue extends Dict {\n  // Existing properties\n  variant?: string\n  size?: string\n  isMenuExpanded?: boolean\n\n  // Submenu state management\n  submenuStates?: Record<string, boolean>\n  setSubmenuState?: (itemId: string, isOpen: boolean) => void\n  toggleSubmenu?: (itemId: string) => void\n\n  // Expansion state management\n  setIsExpanded?: (isExpanded: boolean) => void\n  onExpandedChange?: (isExpanded: boolean) => void\n\n  // Memoized reset functions\n  resetAllStates?: () => void\n  resetExpansionOnly?: () => void\n  resetSubmenuOnly?: () => void\n}\n\n// Submenu state reducer for more stable state management\ntype SubmenuAction =\n  | { type: 'SET_SUBMENU'; itemId: string; isOpen: boolean }\n  | { type: 'TOGGLE_SUBMENU'; itemId: string }\n  | { type: 'RESET_ALL' }\n  | { type: 'RESTORE_STATE'; state: Record<string, boolean> }\n\nconst submenuReducer = (state: Record<string, boolean>, action: SubmenuAction): Record<string, boolean> => {\n  let newState: Record<string, boolean>\n\n  switch (action.type) {\n    case 'SET_SUBMENU': {\n      if (state[action.itemId] === action.isOpen) {\n        return state // Return same reference if no change\n      }\n      newState = { ...state, [action.itemId]: action.isOpen }\n      break\n    }\n    case 'TOGGLE_SUBMENU': {\n      const currentValue = state[action.itemId] || false\n      newState = { ...state, [action.itemId]: !currentValue }\n      break\n    }\n    case 'RESTORE_STATE': {\n      newState = action.state\n      break\n    }\n    case 'RESET_ALL': {\n      newState = {}\n      break\n    }\n    default:\n      return state\n  }\n\n  // Submenu states are now persisted in context only\n  return newState\n}\n\ninterface SidemenuStateProviderProps {\n  children: ReactNode\n  isExpandedInitial?: boolean\n  onExpandedChange?: (isExpanded: boolean) => void\n  variant?: string\n  size?: string\n  isDark?: boolean\n}\n\nconst [SidemenuProvider, useSidemenuContext] = createContext<SidemenuContextValue>({ isOptional: true })\n\n// Enhanced provider that manages state\nexport const SidemenuStateProvider = ({\n  children,\n  isExpandedInitial = true,\n  onExpandedChange,\n  variant,\n  size,\n  isDark,\n}: SidemenuStateProviderProps) => {\n  // Pure uncontrolled state without persistence - context only\n  const [isExpanded, setIsExpanded] = useState(isExpandedInitial)\n\n  // Initialize submenu states as empty - persisted in context only\n  const [submenuStates, dispatchSubmenu] = useReducer(submenuReducer, {})\n\n  // Submenu state management functions using reducer dispatch - memoized\n  const setSubmenuState = useCallback((itemId: string, isOpen: boolean) => {\n    dispatchSubmenu({ type: 'SET_SUBMENU', itemId, isOpen })\n  }, [])\n\n  const toggleSubmenu = useCallback((itemId: string) => {\n    dispatchSubmenu({ type: 'TOGGLE_SUBMENU', itemId })\n  }, [])\n\n  // Enhanced setIsExpanded that handles callbacks - memoized\n  const handleSetIsExpanded = useCallback(\n    (newIsExpanded: boolean) => {\n      setIsExpanded(newIsExpanded)\n      onExpandedChange?.(newIsExpanded)\n    },\n    [onExpandedChange],\n  )\n\n  // Memoized reset functions for external use\n  const resetAllStates = useCallback(() => {\n    dispatchSubmenu({ type: 'RESET_ALL' })\n    const defaultExpanded = isExpandedInitial\n    setIsExpanded(defaultExpanded)\n    onExpandedChange?.(defaultExpanded)\n  }, [isExpandedInitial, onExpandedChange])\n\n  const resetExpansionOnly = useCallback(() => {\n    const defaultExpanded = isExpandedInitial\n    setIsExpanded(defaultExpanded)\n    onExpandedChange?.(defaultExpanded)\n  }, [isExpandedInitial, onExpandedChange])\n\n  const resetSubmenuOnly = useCallback(() => {\n    dispatchSubmenu({ type: 'RESET_ALL' })\n  }, [])\n\n  // Memoized context value with all state management functions\n  const contextValue = useMemo(\n    () => ({\n      size,\n      variant,\n      isDark,\n      isMenuExpanded: isExpanded,\n      submenuStates,\n      setSubmenuState,\n      toggleSubmenu,\n      setIsExpanded: handleSetIsExpanded,\n      onExpandedChange,\n      resetAllStates,\n      resetExpansionOnly,\n      resetSubmenuOnly,\n    }),\n    [\n      size,\n      variant,\n      isDark,\n      isExpanded,\n      submenuStates,\n      setSubmenuState,\n      toggleSubmenu,\n      handleSetIsExpanded,\n      onExpandedChange,\n      resetAllStates,\n      resetExpansionOnly,\n      resetSubmenuOnly,\n    ],\n  )\n\n  return <SidemenuProvider value={contextValue}>{children}</SidemenuProvider>\n}\n\nexport { SidemenuProvider, useSidemenuContext }\n"],"mappings":"yKAkCA,MAAM,GAAkB,EAAgC,IAAmD,CACzG,IAAIA,EAEJ,OAAQ,EAAO,KAAf,CACE,IAAK,cACH,GAAI,EAAM,EAAO,UAAY,EAAO,OAClC,OAAO,EAET,EAAW,CAAE,GAAG,GAAQ,EAAO,QAAS,EAAO,OAAQ,CACvD,MAEF,IAAK,iBAAkB,CACrB,IAAM,EAAe,EAAM,EAAO,SAAW,GAC7C,EAAW,CAAE,GAAG,GAAQ,EAAO,QAAS,CAAC,EAAc,CACvD,MAEF,IAAK,gBACH,EAAW,EAAO,MAClB,MAEF,IAAK,YACH,EAAW,EAAE,CACb,MAEF,QACE,OAAO,EAIX,OAAO,GAYH,CAAC,EAAkB,GAAsBC,EAAoC,CAAE,WAAY,GAAM,CAAC,CAG3F,GAAyB,CACpC,WACA,oBAAoB,GACpB,mBACA,UACA,OACA,YACgC,CAEhC,GAAM,CAAC,EAAY,GAAiB,EAAS,EAAkB,CAGzD,CAAC,EAAe,GAAmB,EAAW,EAAgB,EAAE,CAAC,CAGjE,EAAkB,GAAa,EAAgB,IAAoB,CACvE,EAAgB,CAAE,KAAM,cAAe,SAAQ,SAAQ,CAAC,EACvD,EAAE,CAAC,CAEA,EAAgB,EAAa,GAAmB,CACpD,EAAgB,CAAE,KAAM,iBAAkB,SAAQ,CAAC,EAClD,EAAE,CAAC,CAGA,EAAsB,EACzB,GAA2B,CAC1B,EAAc,EAAc,CAC5B,IAAmB,EAAc,EAEnC,CAAC,EAAiB,CACnB,CAGK,EAAiB,MAAkB,CACvC,EAAgB,CAAE,KAAM,YAAa,CAAC,CACtC,IAAM,EAAkB,EACxB,EAAc,EAAgB,CAC9B,IAAmB,EAAgB,EAClC,CAAC,EAAmB,EAAiB,CAAC,CAEnC,EAAqB,MAAkB,CAC3C,IAAM,EAAkB,EACxB,EAAc,EAAgB,CAC9B,IAAmB,EAAgB,EAClC,CAAC,EAAmB,EAAiB,CAAC,CAEnC,EAAmB,MAAkB,CACzC,EAAgB,CAAE,KAAM,YAAa,CAAC,EACrC,EAAE,CAAC,CAGA,EAAe,OACZ,CACL,OACA,UACA,SACA,eAAgB,EAChB,gBACA,kBACA,gBACA,cAAe,EACf,mBACA,iBACA,qBACA,mBACD,EACD,CACE,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACD,CACF,CAED,OAAO,EAAC,EAAA,CAAiB,MAAO,EAAe,YAA4B"}

package/dist/sidemenuV2/sidemenuItemV2.d.ts

@@ -0,0 +1,11 @@
+import { VuiComponent } from "../core/vui.js";
+import { SidemenuItemV2Props } from "./sidemenuV2.types.js";
+import "styled-components";
+
+//#region src/sidemenuV2/sidemenuItemV2.d.ts
+
+/** A menu item. */
+declare const SidemenuItemV2: VuiComponent<"div", SidemenuItemV2Props>;
+//#endregion
+export { SidemenuItemV2 };
+//# sourceMappingURL=sidemenuItemV2.d.ts.map

package/dist/sidemenuV2/sidemenuItemV2.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuItemV2.d.ts","names":[],"sources":["../../src/sidemenuV2/sidemenuItemV2.tsx"],"sourcesContent":[],"mappings":";;;;;;AAoGA;AAuN8C,cAvNjC,cAuNiC,EAAxC,YAAwC,CAAA,KAAA,EAApB,mBAAoB,CAAA"}

package/dist/sidemenuV2/sidemenuItemV2.js

@@ -0,0 +1,9 @@
+import{generateMenuItemId as e}from"../utils/string.js";import{cs as t}from"../utils/styles.js";import{omitThemingProps as n,th as r}from"../core/theme.js";import{styled as i}from"../core/styled.js";import{vui as a}from"../core/vui.js";import o from"../box/box.js";import s from"../icon/icon.js";import c from"../t/t.js";import l from"../button/button.js";import u from"../badge/badge.js";import d from"../popover/popover.js";import{collapsedWidth as f,expandedWidth as p}from"./consts.js";import m from"./useSidemenuItem.js";import{memo as h,useCallback as g,useEffect as _,useMemo as v}from"react";import{Fragment as y,jsx as b,jsxs as x}from"react/jsx-runtime";const S=h(({icon:e,iconSize:t=`sm`,title:n,isMenuExpanded:r,isInPopover:i,badge:a,badgeLinkUrl:l})=>{let d=13/8;return i?x(y,{children:[b(c,{isTruncated:!0,size:`sm`,display:`inline-block`,fontWeight:`500`,ml:d,children:n}),a&&typeof a==`object`&&typeof a.text==`string`&&a.text.trim()!==``&&b(u,{...a,"data-link":btoa(l??`#`),variant:a.variant??`subtleGreen`,size:`sm`,minW:`32px`,fontSize:`12px`,lineHeight:`16px`,ml:`10px`,mr:`10px`})]}):x(y,{children:[b(o,{ml:d,mr:r?10/8:20/8,w:`20px`,transition:`margin 0.2s ease-in-out`,children:e&&b(s,{name:e,size:t})}),b(c,{isTruncated:!0,size:`sm`,display:`inline-block`,children:n}),a&&typeof a==`object`&&typeof a.text==`string`&&a.text.trim()!==``&&b(u,{...a,"data-link":btoa(l??`#`),variant:a.variant??`subtleGreen`,size:`sm`,minW:`32px`,fontSize:`12px`,lineHeight:`16px`,ml:`10px`,mr:`10px`})]})});S.displayName=`SidemenuItemContent`;const C=i.div`
+  &:hover .vui-sidemenu-item-popover .vui-button.vui-button {
+    background: ${e=>r.color(e.hoverColor)};
+  }
+  &:hover div:last-child .tippy-content .vui-sidemenu-item-content > .vui-box > .vui-button.vui-button {
+    background: ${e=>r.color(e.hoverColor)};
+  }
+`,w=a((r,i)=>{let{children:a,className:s,disabled:c=!1,icon:u,isActive:h=!1,isExpanded:y=!0,itemId:w,level:T=0,onBottom:E=!1,onClick:D,onCollapse:O,onExpand:k,title:A,...j}=n(r),M=w||e(A,T)||`item-${Math.random().toString(36).substr(2,9)}`,{isDark:N,isMenuExpanded:P,styles:F,size:I,isSubmenuOpen:L,toggleSubmenu:R}=m(M),z=h;_(()=>{P&&(L&&k?.(),L||O?.())},[L,k,O,P]);let B=v(()=>{let e=!!a;return{hasChildren:e,hasChildrenCollapsed:e&&!L,hasChildrenExpanded:e&&L&&P,shouldShowExpandButton:e&&P,buttonSize:T<1?`lg`:`md`,iconSize:T<1?`sm`:`xs`,isDisabled:c,shouldShowBorder:!e||L}},[a,L,P,c,I,T]),V=v(()=>({activeColor:N?`digiGreen.main`:`seaBlue.main`,buttonVariant:N?`menuDark`:`menuLight`}),[N]),H=g(e=>{if(!B.isDisabled){let t=e.target;if((t.classList.contains(`vui-tagText`)||t.classList.contains(`vui-tag`))&&typeof window<`u`&&(t.parentElement?.dataset.link||t?.dataset.link)){let e=atob(t.parentElement?.dataset.link??t?.dataset.link??``);window.open(e,`_blank`,`noopener,noreferrer`)}else e?.stopPropagation?.(),D?.()}R?.()},[D,B.isDisabled]),U=v(()=>({...F&&`item`in F&&F.item?F.item:{},borderLeftColor:z?V.activeColor:`transparent`,transitionProperty:`background-color, border-color, color, transform, opacity`,size:B.buttonSize,h:B.buttonSize===`lg`?40:36,iconSize:B.iconSize,variant:V.buttonVariant,onClick:H,disabled:B.isDisabled,role:`button`,tabIndex:B.isDisabled?-1:0,"aria-disabled":B.isDisabled,"aria-pressed":z,...j}),[F,B,z,V,H,j]),W=v(()=>{let e=L,t=e?`falChevronUp`:`falChevronDown`,n=e?`Collapse`:`Expand`;return{"aria-label":n,className:`vui-sidemenu-item-expand`,variant:V.buttonVariant,icon:t,size:`sm`,pl:`4px`,pr:`16px`,ml:`auto`,h:`100%`,border:`none`,bg:`transparent`,hoverBg:`transparent`,activeBg:`transparent`}},[L,V.buttonVariant]);return x(o,{flexDirection:`column`,ref:i,w:`100%`,mt:E?`auto`:0,id:M,children:[!P&&a?b(d,{offset:[0,f-p-2],placement:`right-start`,trigger:`mouseenter`,children:({isOpen:e})=>x(C,{hoverColor:N?`#003591`:`#d3eef8`,children:[b(d.Trigger,{as:o,className:t(`vui-sidemenu-item-popover`,s),children:b(l,{...U,borderLeft:`3px solid ${N?`digiGreen.main`:`seaBlue.main`}`,isActive:z,children:b(S,{icon:u,iconSize:U.iconSize,title:A,isMenuExpanded:P})})}),b(d.Content,{elevation:`none`,className:t(`vui-sidemenu-item-content`,s),children:x(o,{flexDirection:`column`,justifyContent:`start`,w:`100%`,children:[b(l,{...U,borderLeftColor:`transparent!important`,minW:`240px`,isActive:e&&z,children:b(S,{title:A,isInPopover:!0})}),a]})})]})}):x(l,{className:t(`vui-sidemenu-item`,z&&`vui-sidemenu-item--active`,s),...U,isActive:z,children:[b(S,{icon:u,iconSize:U.iconSize,title:A,isMenuExpanded:P,badge:r.badge,badgeLinkUrl:r.badgeLinkUrl}),B.shouldShowExpandButton&&b(l,{...W}),` `]}),B.hasChildrenExpanded&&b(o,{flexDirection:`column`,justifyContent:`start`,w:`100%`,children:a})]})});w.displayName=`SidemenuItemV2`;var T=w;export{T as default};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=sidemenuItemV2.js.map

package/dist/sidemenuV2/sidemenuItemV2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuItemV2.js","names":["T","Badge","Box","Icon","useSidemenuItem","isExpanded","Button"],"sources":["../../src/sidemenuV2/sidemenuItemV2.tsx"],"sourcesContent":["import type { MouseEvent } from 'react'\nimport { useEffect, useMemo, useCallback, memo } from 'react'\n\nimport Badge from '../badge'\nimport type { BadgeProps } from '../badge/badge.types'\nimport Box from '../box'\nimport Button from '../button'\nimport type { VuiComponent } from '../core'\nimport { omitThemingProps, styled, th, vui } from '../core'\nimport Icon from '../icon'\nimport type { IconProp } from '../icon'\nimport Popover from '../popover'\nimport T from '../t'\nimport { cs, generateMenuItemId } from '../utils'\nimport { collapsedWidth, expandedWidth } from './consts'\nimport type { SidemenuItemV2Props } from './sidemenuV2.types'\nimport useSidemenuItem from './useSidemenuItem'\n\n// Internal component for sidemenu item content\ninterface SidemenuItemContentProps {\n  icon?: IconProp\n  iconSize?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  title: string\n  isMenuExpanded?: boolean\n  isInPopover?: boolean\n  badge?: Pick<BadgeProps, 'text' | 'variant'>\n  badgeLinkUrl?: string\n}\n\nconst SidemenuItemContent = memo<SidemenuItemContentProps>(\n  ({ icon, iconSize = 'sm', title, isMenuExpanded, isInPopover, badge, badgeLinkUrl }) => {\n    // Calculate dynamic margins based on menu state\n    const iconBaseMarginLeft = 13 / 8 // 1.625rem (13px)\n    const iconMarginRight = isMenuExpanded\n      ? 10 / 8 // 1.25rem (10px) when expanded\n      : 20 / 8 // 2.5rem (20px) when collapsed\n\n    if (isInPopover)\n      return (\n        <>\n          <T isTruncated size=\"sm\" display=\"inline-block\" fontWeight=\"500\" ml={iconBaseMarginLeft}>\n            {title}\n          </T>\n          {badge && typeof badge === 'object' && typeof badge.text === 'string' && badge.text.trim() !== '' && (\n            <Badge\n              {...badge}\n              data-link={btoa(badgeLinkUrl ?? '#')}\n              variant={badge.variant ?? 'subtleGreen'}\n              size=\"sm\"\n              minW=\"32px\"\n              fontSize=\"12px\"\n              lineHeight=\"16px\"\n              ml=\"10px\"\n              mr=\"10px\"\n            />\n          )}\n        </>\n      )\n\n    return (\n      <>\n        {/* Icon container with responsive margins */}\n        <Box ml={iconBaseMarginLeft} mr={iconMarginRight} w=\"20px\" transition=\"margin 0.2s ease-in-out\">\n          {icon && <Icon name={icon} size={iconSize} />}\n        </Box>\n\n        {/* Menu item title and badge */}\n        <T isTruncated size=\"sm\" display=\"inline-block\">\n          {title}\n        </T>\n        {badge && typeof badge === 'object' && typeof badge.text === 'string' && badge.text.trim() !== '' && (\n          <Badge\n            {...badge}\n            data-link={btoa(badgeLinkUrl ?? '#')}\n            variant={badge.variant ?? 'subtleGreen'}\n            size=\"sm\"\n            minW=\"32px\"\n            fontSize=\"12px\"\n            lineHeight=\"16px\"\n            ml=\"10px\"\n            mr=\"10px\"\n          />\n        )}\n      </>\n    )\n  },\n)\n\nSidemenuItemContent.displayName = 'SidemenuItemContent'\n\nexport const PopoverHovered = styled.div<{ hoverColor: string }>`\n  &:hover .vui-sidemenu-item-popover .vui-button.vui-button {\n    background: ${p => th.color(p.hoverColor)};\n  }\n  &:hover div:last-child .tippy-content .vui-sidemenu-item-content > .vui-box > .vui-button.vui-button {\n    background: ${p => th.color(p.hoverColor)};\n  }\n`\n\n/** A menu item. */\nexport const SidemenuItemV2 = vui<'button', SidemenuItemV2Props>((props, ref) => {\n  const {\n    children,\n    className,\n    disabled = false,\n    icon,\n    isActive = false,\n    isExpanded = true,\n    itemId,\n    level = 0,\n    onBottom = false,\n    onClick,\n    onCollapse,\n    onExpand,\n    title,\n    ...rest\n  } = omitThemingProps(props)\n\n  // Use consistent itemId generation - prioritize provided itemId, then use utility function\n  const computedItemId = itemId || generateMenuItemId(title, level) || `item-${Math.random().toString(36).substr(2, 9)}`\n\n  const { isDark, isMenuExpanded, styles, size, isSubmenuOpen, toggleSubmenu } = useSidemenuItem(computedItemId)\n\n  // Use the isActive prop directly - parent should handle exact path matching\n  const isExactlyActive = isActive\n\n  useEffect(() => {\n    // Only call onExpand/onCollapse if the main menu is expanded\n    // This prevents child items from expanding the main menu when it's collapsed\n    if (isMenuExpanded) {\n      if (isSubmenuOpen) onExpand?.()\n      if (!isSubmenuOpen) onCollapse?.()\n    }\n  }, [isSubmenuOpen, onExpand, onCollapse, isMenuExpanded])\n\n  // Memoized computed values for better performance\n  const computedStates = useMemo(() => {\n    const hasChildren = !!children\n    const isSubmenuCollapsed = hasChildren && !isSubmenuOpen\n    // Only allow submenu expansion when main menu is expanded\n    const isSubmenuExpanded = hasChildren && isSubmenuOpen && isMenuExpanded\n    const shouldShowExpandButton = hasChildren && isMenuExpanded\n    const buttonSize = level < 1 ? ('lg' as const) : ('md' as const)\n    const iconSize = level < 1 ? ('sm' as const) : ('xs' as const)\n\n    const states = {\n      hasChildren,\n      hasChildrenCollapsed: isSubmenuCollapsed,\n      hasChildrenExpanded: isSubmenuExpanded,\n      shouldShowExpandButton,\n      buttonSize,\n      iconSize,\n      isDisabled: disabled,\n      shouldShowBorder: !hasChildren || isSubmenuOpen,\n    }\n\n    return states\n  }, [children, isSubmenuOpen, isMenuExpanded, disabled, size, level])\n\n  // Memoized theme values to prevent recalculation\n  const themeValues = useMemo(\n    () => ({\n      activeColor: isDark ? 'digiGreen.main' : 'seaBlue.main',\n      buttonVariant: isDark ? 'menuDark' : 'menuLight',\n    }),\n    [isDark],\n  )\n\n  // Optimized stable callback\n  const handleClick = useCallback(\n    (event: MouseEvent) => {\n      if (!computedStates.isDisabled) {\n        const targetTag = event.target as HTMLElement\n        if (\n          (targetTag.classList.contains('vui-tagText') || targetTag.classList.contains('vui-tag')) &&\n          typeof window !== 'undefined' &&\n          (targetTag.parentElement?.dataset.link || targetTag?.dataset.link)\n        ) {\n          const url = atob(targetTag.parentElement?.dataset.link ?? targetTag?.dataset.link ?? '')\n          window.open(url, '_blank', 'noopener,noreferrer')\n        } else {\n          event?.stopPropagation?.()\n          onClick?.()\n        }\n      }\n      toggleSubmenu?.()\n    },\n    [onClick, computedStates.isDisabled],\n  )\n\n  // Memoized button styles - Major performance improvement\n  const buttonStyles = useMemo(\n    () => ({\n      // Get base item styles from theme\n      ...(styles && 'item' in styles && styles.item ? styles.item : {}),\n\n      // Dynamic border color based on active state\n      borderLeftColor: isExactlyActive ? themeValues.activeColor : 'transparent',\n\n      // Animation properties (enhanced from theme)\n      transitionProperty: 'background-color, border-color, color, transform, opacity',\n\n      // Button specific properties\n      size: computedStates.buttonSize,\n      h: computedStates.buttonSize === 'lg' ? 40 : 36,\n      iconSize: computedStates.iconSize,\n      variant: themeValues.buttonVariant,\n\n      // Event handlers\n      onClick: handleClick,\n      disabled: computedStates.isDisabled,\n\n      // Accessibility\n      role: 'button',\n      tabIndex: computedStates.isDisabled ? -1 : 0,\n      'aria-disabled': computedStates.isDisabled,\n      'aria-pressed': isExactlyActive,\n\n      // Merge custom props\n      ...rest,\n    }),\n    [\n      // Dependencies grouped logically - simplified since computedStates contains most values\n      styles,\n      computedStates,\n      isExactlyActive,\n      themeValues,\n      handleClick,\n      rest,\n    ],\n  )\n\n  // Memoized expand/collapse button properties\n  const expandButtonProps = useMemo(() => {\n    const isExpanded = isSubmenuOpen\n    const chevronIcon = isExpanded ? 'falChevronUp' : 'falChevronDown'\n    const ariaLabel = isExpanded ? 'Collapse' : 'Expand'\n\n    return {\n      'aria-label': ariaLabel,\n      className: 'vui-sidemenu-item-expand',\n      variant: themeValues.buttonVariant,\n      icon: chevronIcon,\n      size: 'sm' as const,\n      pl: '4px',\n      pr: '16px',\n      ml: 'auto',\n      h: '100%',\n      border: 'none',\n      bg: 'transparent',\n      hoverBg: 'transparent',\n      activeBg: 'transparent',\n    }\n  }, [isSubmenuOpen, themeValues.buttonVariant])\n\n  return (\n    <Box flexDirection=\"column\" ref={ref} w=\"100%\" mt={onBottom ? 'auto' : 0} id={computedItemId}>\n      {!isMenuExpanded && children ? (\n        <Popover offset={[0, collapsedWidth - expandedWidth - 2]} placement=\"right-start\" trigger=\"mouseenter\">\n          {({ isOpen }) => (\n            <PopoverHovered hoverColor={isDark ? '#003591' : '#d3eef8'}>\n              <Popover.Trigger as={Box} className={cs('vui-sidemenu-item-popover', className)}>\n                <Button\n                  {...buttonStyles}\n                  borderLeft={`3px solid ${isDark ? 'digiGreen.main' : 'seaBlue.main'}`}\n                  isActive={isExactlyActive}\n                >\n                  <SidemenuItemContent\n                    icon={icon}\n                    iconSize={buttonStyles.iconSize}\n                    title={title}\n                    isMenuExpanded={isMenuExpanded}\n                  />\n                </Button>\n              </Popover.Trigger>\n              <Popover.Content elevation=\"none\" className={cs('vui-sidemenu-item-content', className)}>\n                <Box flexDirection=\"column\" justifyContent=\"start\" w=\"100%\">\n                  <Button\n                    {...buttonStyles}\n                    borderLeftColor={'transparent!important'}\n                    minW={'240px'}\n                    isActive={isOpen && isExactlyActive}\n                  >\n                    <SidemenuItemContent title={title} isInPopover={true} />\n                  </Button>\n                  {children}\n                </Box>\n              </Popover.Content>\n            </PopoverHovered>\n          )}\n        </Popover>\n      ) : (\n        <Button\n          className={cs('vui-sidemenu-item', isExactlyActive && 'vui-sidemenu-item--active', className)}\n          {...buttonStyles}\n          isActive={isExactlyActive}\n        >\n          <SidemenuItemContent\n            icon={icon}\n            iconSize={buttonStyles.iconSize}\n            title={title}\n            isMenuExpanded={isMenuExpanded}\n            badge={props.badge}\n            badgeLinkUrl={props.badgeLinkUrl}\n          />\n          {computedStates.shouldShowExpandButton && <Button {...expandButtonProps} />} {/* Expand/Collapse button */}\n        </Button>\n      )}\n      {computedStates.hasChildrenExpanded && (\n        <Box flexDirection=\"column\" justifyContent=\"start\" w=\"100%\">\n          {children}\n        </Box>\n      )}\n    </Box>\n  )\n}) as VuiComponent<'div', SidemenuItemV2Props>\n\nSidemenuItemV2.displayName = 'SidemenuItemV2'\n\nexport default SidemenuItemV2\n"],"mappings":"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"}

package/dist/sidemenuV2/sidemenuV2.d.ts

@@ -0,0 +1,13 @@
+import { VuiComponent } from "../core/vui.js";
+import { SidemenuStateProvider, useSidemenuContext } from "./context.js";
+import { SidemenuV2Props } from "./sidemenuV2.types.js";
+import { SidemenuItemV2 } from "./sidemenuItemV2.js";
+
+//#region src/sidemenuV2/sidemenuV2.d.ts
+/** A collapsible side menu for navigation. */
+declare const SidemenuV2: VuiComponent<"div", SidemenuV2Props> & {
+  Item: typeof SidemenuItemV2;
+};
+//#endregion
+export { SidemenuV2 };
+//# sourceMappingURL=sidemenuV2.d.ts.map

package/dist/sidemenuV2/sidemenuV2.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuV2.d.ts","names":[],"sources":["../../src/sidemenuV2/sidemenuV2.tsx"],"sourcesContent":[],"mappings":";;;;;;;AAiBa,cAAA,UAqBZ,EAFK,YAEL,CAAA,KAAA,EAFyB,eAEzB,CAAA,GAAA;EAAA,IAAA,EAAA,OADc,cACd"}

package/dist/sidemenuV2/sidemenuV2.js

@@ -0,0 +1,2 @@
+import{generateMenuItemId as e}from"../utils/string.js";import{cs as t}from"../utils/styles.js";import{isActivePath as n}from"../utils/window.js";import{useStyleConfig as r}from"../core/theme.js";import{vui as i}from"../core/vui.js";import a from"../box/box.js";import o from"../icon/icon.js";import s from"../button/button.js";import{collapsedWidth as c,expandedWidth as l}from"./consts.js";import{SidemenuStateProvider as u,useSidemenuContext as d}from"./context.js";import f from"./sidemenuItemV2.js";import{createElement as p,useCallback as m,useMemo as h}from"react";import{jsx as g,jsxs as _}from"react/jsx-runtime";const v=i((e,t)=>{let{isExpandedInitial:n=!0,size:r,variant:i=`light`,onExpandedChange:a}=e;return g(u,{isExpandedInitial:n,onExpandedChange:a,variant:i,size:r,isDark:i===`dark`,children:g(y,{...e,ref:t})})}),y=i((i,u)=>{let{children:v,className:y,items:b,shouldExpand:x,isSticky:S=!1,size:C,variant:w=`light`,width:T=l,top:E,onNavigate:D,...O}=i,{isMenuExpanded:k=!1,setIsExpanded:A}=d()||{},j=r(`SidemenuV2`,i),M=h(()=>({isDark:w===`dark`,hasItems:!!b,shouldShowItems:!!b&&b.length>0,isMenuSticky:S,isMenuExpanded:k}),[w,b,S,k]),N=h(()=>{let e=j.toggleButton||{},t=C||`md`,n=(j.sizes?.[t]||{}).toggleButton||{},r={baseHeight:n.baseHeight||e.baseHeight||52,basePadding:n.basePadding||e.basePadding||2,expandedPaddingMultiplier:e.expandedPaddingMultiplier||5,expandedWidth:e.expandedWidth||`52px`,collapsedWidth:e.collapsedWidth||`100%`};return{menuWidth:M.isMenuExpanded?T:c,toggleArrowDirection:M.isMenuExpanded?`Left`:`Right`,toggleButtonJustification:M.isMenuExpanded?`flex-end`:`center`,toggleButtonVariant:j.toggleButton?.variant||(M.isDark?`tertiaryLight`:`tertiaryDark`),toggleAriaLabel:M.isMenuExpanded?`Collapse menu`:`Expand menu`,toggleButtonPadding:r.basePadding,toggleButtonVerticalPadding:M.isMenuExpanded?r.basePadding*r.expandedPaddingMultiplier:r.basePadding,toggleButtonHeight:r.baseHeight,toggleButtonWidth:M.isMenuExpanded?r.expandedWidth:r.collapsedWidth,menuPosition:M.isMenuSticky?`sticky`:`static`,menuTopPosition:((e,t)=>e?typeof t==`string`?t:typeof t==`number`?`${t}px`:`0px`:`auto`)(M.isMenuSticky,E)}},[M,T,E,j,C]),P=h(()=>`falArrow${N.toggleArrowDirection}`,[N.toggleArrowDirection]),F=m(()=>{let e=!M.isMenuExpanded;x&&!x(`toggle`,M.isMenuExpanded)||A?.(e)},[M.isMenuExpanded,x,A]),I=m(e=>{if(x&&e?.path){let e=x(`navigation`,M.isMenuExpanded);typeof e==`boolean`&&e!==M.isMenuExpanded&&A?.(e)}e?.onClick?.(),e?.path&&D?.(e.path)},[D,x,M.isMenuExpanded,A]),L=h(()=>(b??[]).reduce((t,n,r)=>{let i=n.itemId||n.path||e(n.title,n.level||0)||`item-${r}`;return t[i]=()=>I(n),t},{}),[b,I]),R=h(()=>M.shouldShowItems?b?.map?.((t,r)=>{let i=t.itemId||t.path||e(t.title,t.level||0)||`item-${r}`,a=t.isActive===void 0?n(t?.path||``):t.isActive;return g(f,{isActive:a,onBottom:t.onBottom,itemId:i,level:t.level||0,...t,onClick:L[i]},i)}):v,[M.shouldShowItems,M.isMenuExpanded,b,v,L]),z=h(()=>t(`vui-sidemenu`,`vui-sidemenu--${w}`,M.isMenuExpanded&&`vui-sidemenu--expanded`,!M.isMenuExpanded&&`vui-sidemenu--collapsed`,M.isDark&&`vui-sidemenu--dark`,M.isMenuSticky&&`vui-sidemenu--sticky`,y),[w,M,y]),B=h(()=>({className:z,flexDirection:`column`,overflowX:`hidden`,position:N.menuPosition,ref:u,top:N.menuTopPosition,transitionDuration:`normal`,transitionProperty:`width`,w:N.menuWidth,...j.container,...O}),[z,N.menuPosition,N.menuTopPosition,N.menuWidth,u,j.container,O]),V=h(()=>({"aria-expanded":M.isMenuExpanded,"aria-label":N.toggleAriaLabel,border:0,borderRadius:0,justifyContent:N.toggleButtonJustification,minHeight:`${N.toggleButtonHeight}px`,minWidth:0,onClick:F,px:N.toggleButtonPadding,py:`${N.toggleButtonVerticalPadding}px`,size:`lg`,variant:N.toggleButtonVariant,w:N.toggleButtonWidth,flexShrink:0,transition:j.toggleButton?.transition||`padding 0.2s ease-in-out, width 0.2s ease-in-out`}),[N.toggleAriaLabel,N.toggleButtonJustification,N.toggleButtonVariant,N.toggleButtonPadding,N.toggleButtonVerticalPadding,N.toggleButtonHeight,N.toggleButtonWidth,M.isMenuExpanded,F,j.toggleButton]);return _(a,{elevation:`3`,...B,children:[g(a,{className:`vui-sidemenu-content`,flexDirection:`column`,flexGrow:1,justifyContent:`flex-start`,minW:l,overflowX:`hidden`,overflowY:`auto`,w:`100%`,role:`navigation`,"aria-label":`Main navigation`,children:R}),g(a,{className:`vui-sidemenu-bottom`,justifyContent:M.isMenuExpanded?`flex-end`:`flex-start`,borderTop:`1px solid sandstone.main`,children:p(s,{...V,key:`sidemenu-toggle-button`},g(o,{name:P,size:`sm`,"aria-hidden":`true`}))})]})});v.Item=f,v.displayName=`SidemenuV2`;export{v as SidemenuV2};globalThis.__vuiVersion__=`3.0.0-beta.6`;
+//# sourceMappingURL=sidemenuV2.js.map

package/dist/sidemenuV2/sidemenuV2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidemenuV2.js","names":["isSticky","SidemenuItemV2","Box","Button","Icon"],"sources":["../../src/sidemenuV2/sidemenuV2.tsx"],"sourcesContent":["import { useMemo, useCallback } from 'react'\n\nimport Box from '../box'\nimport Button from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport type { VuiComponent } from '../core'\nimport Icon from '../icon'\nimport { cs, isActivePath, generateMenuItemId } from '../utils'\nimport { collapsedWidth, expandedWidth } from './consts'\nimport { SidemenuStateProvider, useSidemenuContext } from './context'\nimport SidemenuItemV2 from './sidemenuItemV2'\nimport type { SidemenuItemV2Props, SidemenuV2Props } from './sidemenuV2.types'\n\n// Re-export context provider and hook\nexport { SidemenuStateProvider, useSidemenuContext }\n\n/** A collapsible side menu for navigation. */\nexport const SidemenuV2 = vui<'div', SidemenuV2Props>((props, ref) => {\n  const {\n    isExpandedInitial = true, // Uncontrolled: only affects initial state\n    size,\n    variant = 'light',\n    onExpandedChange,\n  } = props\n\n  return (\n    <SidemenuStateProvider\n      isExpandedInitial={isExpandedInitial}\n      onExpandedChange={onExpandedChange}\n      variant={variant}\n      size={size}\n      isDark={variant === 'dark'}\n    >\n      <SidemenuInner {...props} ref={ref} />\n    </SidemenuStateProvider>\n  )\n}) as VuiComponent<'div', SidemenuV2Props> & {\n  Item: typeof SidemenuItemV2\n}\n\n// Inner component that uses context\nconst SidemenuInner = vui<'div', SidemenuV2Props>((props, ref) => {\n  const {\n    children,\n    className,\n    items,\n    shouldExpand, // Callback: fine-grained control over expansion\n    isSticky = false,\n    size,\n    variant = 'light',\n    width = expandedWidth,\n    top,\n    onNavigate,\n    ...rest\n  } = props\n\n  // Get state from context\n  const context = useSidemenuContext()\n  const { isMenuExpanded = false, setIsExpanded } = context || {}\n\n  // Get styles configuration early\n  const styles = useStyleConfig('SidemenuV2', props)\n\n  // Memoized boolean conditions\n  const conditions = useMemo(\n    () => ({\n      isDark: variant === 'dark',\n      hasItems: !!items,\n      shouldShowItems: !!items && items.length > 0,\n      isMenuSticky: isSticky,\n      isMenuExpanded: isMenuExpanded,\n    }),\n    [variant, items, isSticky, isMenuExpanded],\n  )\n\n  // Memoized computed values for styling and behavior\n  const computedValues = useMemo(() => {\n    // Get toggle button config from theme\n    const toggleButtonTheme = styles.toggleButton || {}\n    const currentSize = size || 'md' // Ensure we have a valid size\n    const sizeStyles = (styles as any).sizes?.[currentSize] || {}\n    const toggleButtonSizeTheme = sizeStyles.toggleButton || {}\n\n    // Merge base theme with size-specific overrides\n    const toggleConfig = {\n      baseHeight: toggleButtonSizeTheme.baseHeight || toggleButtonTheme.baseHeight || 52,\n      basePadding: toggleButtonSizeTheme.basePadding || toggleButtonTheme.basePadding || 2,\n      expandedPaddingMultiplier: toggleButtonTheme.expandedPaddingMultiplier || 5,\n      expandedWidth: toggleButtonTheme.expandedWidth || '52px',\n      collapsedWidth: toggleButtonTheme.collapsedWidth || '100%',\n    }\n\n    // Helper function for consistent top position formatting\n    const getMenuTopPosition = (isSticky: boolean, topValue?: any): string => {\n      if (!isSticky) return 'auto'\n\n      if (typeof topValue === 'string') return topValue\n      if (typeof topValue === 'number') return `${topValue}px`\n\n      return '0px' // fallback for undefined/null/complex types\n    }\n\n    return {\n      menuWidth: conditions.isMenuExpanded ? width : collapsedWidth,\n      toggleArrowDirection: conditions.isMenuExpanded ? 'Left' : 'Right',\n      toggleButtonJustification: conditions.isMenuExpanded ? 'flex-end' : 'center',\n      toggleButtonVariant: styles.toggleButton?.variant || (conditions.isDark ? 'tertiaryLight' : 'tertiaryDark'),\n      toggleAriaLabel: conditions.isMenuExpanded ? 'Collapse menu' : 'Expand menu',\n      toggleButtonPadding: toggleConfig.basePadding,\n      toggleButtonVerticalPadding: conditions.isMenuExpanded\n        ? toggleConfig.basePadding * toggleConfig.expandedPaddingMultiplier\n        : toggleConfig.basePadding,\n      toggleButtonHeight: toggleConfig.baseHeight,\n      toggleButtonWidth: conditions.isMenuExpanded ? toggleConfig.expandedWidth : toggleConfig.collapsedWidth,\n      menuPosition: conditions.isMenuSticky ? 'sticky' : 'static',\n      menuTopPosition: getMenuTopPosition(conditions.isMenuSticky, top),\n    }\n  }, [conditions, width, top, styles, size])\n\n  // Memoized icon name\n  const toggleIcon = useMemo(\n    () => `falArrow${computedValues.toggleArrowDirection}` as const,\n    [computedValues.toggleArrowDirection],\n  )\n\n  // Stable callback for toggle (simplified)\n  const handleToggle = useCallback(() => {\n    const newExpandedState = !conditions.isMenuExpanded\n\n    // Check if expansion should be allowed via callback\n    if (shouldExpand && !shouldExpand('toggle', conditions.isMenuExpanded)) {\n      return // Block the toggle\n    }\n\n    // Update state via context\n    setIsExpanded?.(newExpandedState)\n  }, [conditions.isMenuExpanded, shouldExpand, setIsExpanded])\n\n  // Stable callback for item click - with expansion control\n  const handleItemClick = useCallback(\n    (item: SidemenuItemV2Props) => {\n      // Early return for clarity\n      if (shouldExpand && item?.path) {\n        const shouldExpandOnNav = shouldExpand('navigation', conditions.isMenuExpanded)\n        if (typeof shouldExpandOnNav === 'boolean' && shouldExpandOnNav !== conditions.isMenuExpanded) {\n          setIsExpanded?.(shouldExpandOnNav)\n        }\n      }\n      // Call item click handler\n      item?.onClick?.()\n      // Navigate if path exists\n      if (item?.path) onNavigate?.(item.path)\n    },\n    [onNavigate, shouldExpand, conditions.isMenuExpanded, setIsExpanded],\n  )\n\n  // Create stable item click handlers\n  const itemClickHandlers = useMemo(() => {\n    return (items ?? []).reduce<Record<string, () => void>>((handlers, item, index) => {\n      const itemId = item.itemId || item.path || generateMenuItemId(item.title, item.level || 0) || `item-${index}`\n      handlers[itemId] = () => handleItemClick(item)\n      return handlers\n    }, {})\n  }, [items, handleItemClick])\n\n  // Memoized items rendering\n  const renderedItems = useMemo(() => {\n    if (!conditions.shouldShowItems) return children\n\n    return items?.map?.((item: SidemenuItemV2Props, index: number) => {\n      // Use consistent itemId generation that matches the component's logic\n      const itemId = item.itemId || item.path || generateMenuItemId(item.title, item.level || 0) || `item-${index}`\n\n      // Use explicit isActive prop if provided, otherwise calculate from path\n      const calculatedIsActive = item.isActive !== undefined ? item.isActive : isActivePath(item?.path || '')\n\n      return (\n        <SidemenuItemV2\n          isActive={calculatedIsActive}\n          onBottom={item.onBottom}\n          key={itemId}\n          itemId={itemId}\n          level={item.level || 0}\n          {...item}\n          onClick={itemClickHandlers[itemId]}\n        />\n      )\n    })\n  }, [conditions.shouldShowItems, conditions.isMenuExpanded, items, children, itemClickHandlers])\n\n  // Memoized CSS class names\n  const cssClasses = useMemo(\n    () =>\n      cs(\n        'vui-sidemenu',\n        `vui-sidemenu--${variant}`,\n        conditions.isMenuExpanded && 'vui-sidemenu--expanded',\n        !conditions.isMenuExpanded && 'vui-sidemenu--collapsed',\n        conditions.isDark && 'vui-sidemenu--dark',\n        conditions.isMenuSticky && 'vui-sidemenu--sticky',\n        className,\n      ),\n    [variant, conditions, className],\n  )\n\n  // Memoized container props\n  const containerProps = useMemo(\n    () => ({\n      className: cssClasses,\n      flexDirection: 'column' as const,\n      overflowX: 'hidden' as const,\n      position: computedValues.menuPosition,\n      ref,\n      top: computedValues.menuTopPosition,\n      transitionDuration: 'normal' as const,\n      transitionProperty: 'width' as const,\n      w: computedValues.menuWidth,\n\n      ...styles.container,\n      ...rest,\n    }),\n    [\n      cssClasses,\n      computedValues.menuPosition,\n      computedValues.menuTopPosition,\n      computedValues.menuWidth,\n      ref,\n      styles.container,\n      rest,\n    ],\n  )\n\n  // Memoized toggle button props with complete dependencies\n  const toggleButtonProps = useMemo(\n    () => ({\n      'aria-expanded': conditions.isMenuExpanded,\n      'aria-label': computedValues.toggleAriaLabel,\n      border: 0,\n      borderRadius: 0,\n      justifyContent: computedValues.toggleButtonJustification,\n      minHeight: `${computedValues.toggleButtonHeight}px`,\n      minWidth: 0,\n      onClick: handleToggle,\n      px: computedValues.toggleButtonPadding,\n      py: `${computedValues.toggleButtonVerticalPadding}px`,\n      size: 'lg' as const,\n      variant: computedValues.toggleButtonVariant,\n      w: computedValues.toggleButtonWidth,\n      flexShrink: 0,\n      transition: styles.toggleButton?.transition || 'padding 0.2s ease-in-out, width 0.2s ease-in-out',\n    }),\n    [\n      computedValues.toggleAriaLabel,\n      computedValues.toggleButtonJustification,\n      computedValues.toggleButtonVariant,\n      computedValues.toggleButtonPadding,\n      computedValues.toggleButtonVerticalPadding,\n      computedValues.toggleButtonHeight,\n      computedValues.toggleButtonWidth,\n      conditions.isMenuExpanded,\n      handleToggle,\n      styles.toggleButton,\n    ],\n  )\n\n  return (\n    <Box elevation=\"3\" {...containerProps}>\n      <Box\n        className=\"vui-sidemenu-content\"\n        flexDirection=\"column\"\n        flexGrow={1}\n        justifyContent=\"flex-start\"\n        minW={expandedWidth}\n        overflowX=\"hidden\"\n        overflowY=\"auto\"\n        w=\"100%\"\n        role=\"navigation\"\n        aria-label=\"Main navigation\"\n      >\n        {renderedItems}\n      </Box>\n\n      <Box\n        className=\"vui-sidemenu-bottom\"\n        justifyContent={conditions.isMenuExpanded ? 'flex-end' : 'flex-start'}\n        borderTop=\"1px solid sandstone.main\"\n      >\n        <Button {...toggleButtonProps} key={'sidemenu-toggle-button'}>\n          <Icon name={toggleIcon} size=\"sm\" aria-hidden=\"true\" />\n        </Button>\n      </Box>\n    </Box>\n  )\n}) as VuiComponent<'div', SidemenuV2Props> & {\n  // Top: typeof SidemenuTop\n  Item: typeof SidemenuItemV2\n}\n\nSidemenuV2.Item = SidemenuItemV2\nSidemenuV2.displayName = 'SidemenuV2'\n\nexport default SidemenuV2\n"],"mappings":"8mBAiBA,MAAa,EAAa,GAA6B,EAAO,IAAQ,CACpE,GAAM,CACJ,oBAAoB,GACpB,OACA,UAAU,QACV,oBACE,EAEJ,OACE,EAAC,EAAA,CACoB,oBACD,mBACT,UACH,OACN,OAAQ,IAAY,gBAEpB,EAAC,EAAA,CAAc,GAAI,EAAY,OAAO,EAChB,EAE1B,CAKI,EAAgB,GAA6B,EAAO,IAAQ,CAChE,GAAM,CACJ,WACA,YACA,QACA,eACA,WAAW,GACX,OACA,UAAU,QACV,QAAQ,EACR,MACA,aACA,GAAG,GACD,EAIE,CAAE,iBAAiB,GAAO,iBADhB,GAAoB,EACyB,EAAE,CAGzD,EAAS,EAAe,aAAc,EAAM,CAG5C,EAAa,OACV,CACL,OAAQ,IAAY,OACpB,SAAU,CAAC,CAAC,EACZ,gBAAiB,CAAC,CAAC,GAAS,EAAM,OAAS,EAC3C,aAAc,EACE,iBACjB,EACD,CAAC,EAAS,EAAO,EAAU,EAAe,CAC3C,CAGK,EAAiB,MAAc,CAEnC,IAAM,EAAoB,EAAO,cAAgB,EAAE,CAC7C,EAAc,GAAQ,KAEtB,GADc,EAAe,QAAQ,IAAgB,EAAE,EACpB,cAAgB,EAAE,CAGrD,EAAe,CACnB,WAAY,EAAsB,YAAc,EAAkB,YAAc,GAChF,YAAa,EAAsB,aAAe,EAAkB,aAAe,EACnF,0BAA2B,EAAkB,2BAA6B,EAC1E,cAAe,EAAkB,eAAiB,OAClD,eAAgB,EAAkB,gBAAkB,OACrD,CAYD,MAAO,CACL,UAAW,EAAW,eAAiB,EAAQ,EAC/C,qBAAsB,EAAW,eAAiB,OAAS,QAC3D,0BAA2B,EAAW,eAAiB,WAAa,SACpE,oBAAqB,EAAO,cAAc,UAAY,EAAW,OAAS,gBAAkB,gBAC5F,gBAAiB,EAAW,eAAiB,gBAAkB,cAC/D,oBAAqB,EAAa,YAClC,4BAA6B,EAAW,eACpC,EAAa,YAAc,EAAa,0BACxC,EAAa,YACjB,mBAAoB,EAAa,WACjC,kBAAmB,EAAW,eAAiB,EAAa,cAAgB,EAAa,eACzF,aAAc,EAAW,aAAe,SAAW,SACnD,kBAtB0B,EAAmB,IACxCA,EAED,OAAO,GAAa,SAAiB,EACrC,OAAO,GAAa,SAAiB,GAAG,EAAS,IAE9C,MALe,QAqBc,EAAW,aAAc,EAAI,CAClE,EACA,CAAC,EAAY,EAAO,EAAK,EAAQ,EAAK,CAAC,CAGpC,EAAa,MACX,WAAW,EAAe,uBAChC,CAAC,EAAe,qBAAqB,CACtC,CAGK,EAAe,MAAkB,CACrC,IAAM,EAAmB,CAAC,EAAW,eAGjC,GAAgB,CAAC,EAAa,SAAU,EAAW,eAAe,EAKtE,IAAgB,EAAiB,EAChC,CAAC,EAAW,eAAgB,EAAc,EAAc,CAAC,CAGtD,EAAkB,EACrB,GAA8B,CAE7B,GAAI,GAAgB,GAAM,KAAM,CAC9B,IAAM,EAAoB,EAAa,aAAc,EAAW,eAAe,CAC3E,OAAO,GAAsB,WAAa,IAAsB,EAAW,gBAC7E,IAAgB,EAAkB,CAItC,GAAM,WAAW,CAEb,GAAM,MAAM,IAAa,EAAK,KAAK,EAEzC,CAAC,EAAY,EAAc,EAAW,eAAgB,EAAc,CACrE,CAGK,EAAoB,OAChB,GAAS,EAAE,EAAE,QAAoC,EAAU,EAAM,IAAU,CACjF,IAAM,EAAS,EAAK,QAAU,EAAK,MAAQ,EAAmB,EAAK,MAAO,EAAK,OAAS,EAAE,EAAI,QAAQ,IAEtG,MADA,GAAS,OAAgB,EAAgB,EAAK,CACvC,GACN,EAAE,CAAC,CACL,CAAC,EAAO,EAAgB,CAAC,CAGtB,EAAgB,MACf,EAAW,gBAET,GAAO,OAAO,EAA2B,IAAkB,CAEhE,IAAM,EAAS,EAAK,QAAU,EAAK,MAAQ,EAAmB,EAAK,MAAO,EAAK,OAAS,EAAE,EAAI,QAAQ,IAGhG,EAAqB,EAAK,WAAa,IAAA,GAA4B,EAAa,GAAM,MAAQ,GAAG,CAA9C,EAAK,SAE9D,OACE,EAACC,EAAAA,CACC,SAAU,EACV,SAAU,EAAK,SAEP,SACR,MAAO,EAAK,OAAS,EACrB,GAAI,EACJ,QAAS,EAAkB,IAJtB,EAKL,EAEJ,CApBsC,EAqBvC,CAAC,EAAW,gBAAiB,EAAW,eAAgB,EAAO,EAAU,EAAkB,CAAC,CAGzF,EAAa,MAEf,EACE,eACA,iBAAiB,IACjB,EAAW,gBAAkB,yBAC7B,CAAC,EAAW,gBAAkB,0BAC9B,EAAW,QAAU,qBACrB,EAAW,cAAgB,uBAC3B,EACD,CACH,CAAC,EAAS,EAAY,EAAU,CACjC,CAGK,EAAiB,OACd,CACL,UAAW,EACX,cAAe,SACf,UAAW,SACX,SAAU,EAAe,aACzB,MACA,IAAK,EAAe,gBACpB,mBAAoB,SACpB,mBAAoB,QACpB,EAAG,EAAe,UAElB,GAAG,EAAO,UACV,GAAG,EACJ,EACD,CACE,EACA,EAAe,aACf,EAAe,gBACf,EAAe,UACf,EACA,EAAO,UACP,EACD,CACF,CAGK,EAAoB,OACjB,CACL,gBAAiB,EAAW,eAC5B,aAAc,EAAe,gBAC7B,OAAQ,EACR,aAAc,EACd,eAAgB,EAAe,0BAC/B,UAAW,GAAG,EAAe,mBAAmB,IAChD,SAAU,EACV,QAAS,EACT,GAAI,EAAe,oBACnB,GAAI,GAAG,EAAe,4BAA4B,IAClD,KAAM,KACN,QAAS,EAAe,oBACxB,EAAG,EAAe,kBAClB,WAAY,EACZ,WAAY,EAAO,cAAc,YAAc,mDAChD,EACD,CACE,EAAe,gBACf,EAAe,0BACf,EAAe,oBACf,EAAe,oBACf,EAAe,4BACf,EAAe,mBACf,EAAe,kBACf,EAAW,eACX,EACA,EAAO,aACR,CACF,CAED,OACE,EAACC,EAAAA,CAAI,UAAU,IAAI,GAAI,YACrB,EAACA,EAAAA,CACC,UAAU,uBACV,cAAc,SACd,SAAU,EACV,eAAe,aACf,KAAM,EACN,UAAU,SACV,UAAU,OACV,EAAE,OACF,KAAK,aACL,aAAW,2BAEV,GACG,CAEN,EAACA,EAAAA,CACC,UAAU,sBACV,eAAgB,EAAW,eAAiB,WAAa,aACzD,UAAU,oCAEV,EAACC,EAAAA,CAAO,GAAI,EAAmB,IAAK,0BAClC,EAACC,EAAAA,CAAK,KAAM,EAAY,KAAK,KAAK,cAAY,QAAS,CAChD,EACL,CAAA,EACF,EAER,CAKF,EAAW,KAAOH,EAClB,EAAW,YAAc"}