@veracity/vui 5.0.0-alpha.1 → 5.0.0-alpha.3

package/dist/popover/popover.js

@@ -45,5 +45,5 @@ Popover.displayName = "Popover";
 
 //#endregion
 export { Popover as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=popover.js.map

package/dist/popover/popoverContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popoverContent.d.ts","names":[],"sources":["../../src/popover/popoverContent.tsx"],"mappings":";;;;;;cASa,cAAA,EAAc,YAAA,QAoCzB,QAAA"}
+{"version":3,"file":"popoverContent.d.ts","names":[],"sources":["../../src/popover/popoverContent.tsx"],"mappings":";;;;;;cAUa,cAAA,EAAc,YAAA,QAoCzB,QAAA"}

package/dist/popover/popoverContent.js

@@ -1,5 +1,6 @@
 import { mergeRefs } from "../utils/react.js";
 import { cs } from "../utils/styles.js";
+import zIndices_default from "../theme/foundations/zIndices.js";
 import { useStyleConfig } from "../core/theme.js";
 import vui from "../core/vui.js";
 import Box from "../box/box.js";
@@ -34,7 +35,8 @@ const PopoverContent = vui((props, ref) => {
 			ring: 0,
 			style: {
 				...floatingStyles,
-				...transitionStyles
+				...transitionStyles,
+				zIndex: zIndices_default.popover
 			},
 			...getFloatingProps?.() ?? {},
 			...styles.content,
@@ -47,5 +49,5 @@ PopoverContent.displayName = "PopoverContent";
 
 //#endregion
 export { PopoverContent as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=popoverContent.js.map

package/dist/popover/popoverContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"popoverContent.js","names":[],"sources":["../../src/popover/popoverContent.tsx"],"sourcesContent":["import { FloatingFocusManager, FloatingPortal } from '@floating-ui/react'\n\nimport Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { usePopoverContext } from './context'\nimport type { PopoverContentProps } from './popover.types'\n\n/** Displays provided content in an overlaying wrapper. */\nexport const PopoverContent = vui<'div', PopoverContentProps>((props, ref) => {\n  const { children, className, ...rest } = props\n  const popoverProps = usePopoverContext() ?? {}\n  const { context, floatingStyles, getFloatingProps, isLazy, isMounted, isOpen, setPopper, transitionStyles } =\n    popoverProps\n  const styles = useStyleConfig('Popover', { ...popoverProps, ...props })\n\n  const shouldRenderChildren = isLazy ? isOpen : true\n\n  // Use isMounted for render control - handles transition timing\n  if (!isMounted) {\n    return null\n  }\n\n  return (\n    <FloatingPortal>\n      <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n        <Box\n          bg=\"white\"\n          borderRadius=\"md\"\n          boxShadow=\"2\"\n          className={cs('vui-popoverContent', className)}\n          overflowY=\"auto\"\n          zIndex=\"popover\"\n          ref={mergeRefs(setPopper, ref)}\n          ring={0}\n          style={{ ...floatingStyles, ...transitionStyles }}\n          {...(getFloatingProps?.() ?? {})}\n          {...styles.content}\n          {...rest}\n        >\n          {shouldRenderChildren ? children : null}\n        </Box>\n      </FloatingFocusManager>\n    </FloatingPortal>\n  )\n})\n\nPopoverContent.displayName = 'PopoverContent'\n\nexport default PopoverContent\n"],"mappings":";;;;;;;;;;;AASA,MAAa,iBAAiB,KAAiC,OAAO,QAAQ;CAC5E,MAAM,EAAE,UAAU,WAAW,GAAG,SAAS;CACzC,MAAM,eAAe,mBAAmB,IAAI,EAAE;CAC9C,MAAM,EAAE,SAAS,gBAAgB,kBAAkB,QAAQ,WAAW,QAAQ,WAAW,qBACvF;CACF,MAAM,SAAS,eAAe,WAAW;EAAE,GAAG;EAAc,GAAG;EAAO,CAAC;CAEvE,MAAM,uBAAuB,SAAS,SAAS;AAG/C,KAAI,CAAC,UACH,QAAO;AAGT,QACE,oBAAC,4BACC,oBAAC;EAA8B;EAAS,cAAc;EAAI,OAAO;YAC/D,oBAAC;GACC,IAAG;GACH,cAAa;GACb,WAAU;GACV,WAAW,GAAG,sBAAsB,UAAU;GAC9C,WAAU;GACV,QAAO;GACP,KAAK,UAAU,WAAW,IAAI;GAC9B,MAAM;GACN,OAAO;IAAE,GAAG;IAAgB,GAAG;IAAkB;GACjD,GAAK,oBAAoB,IAAI,EAAE;GAC/B,GAAI,OAAO;GACX,GAAI;aAEH,uBAAuB,WAAW;IAC/B;GACe,GACR;EAEnB;AAEF,eAAe,cAAc"}
+{"version":3,"file":"popoverContent.js","names":["zIndices"],"sources":["../../src/popover/popoverContent.tsx"],"sourcesContent":["import { FloatingFocusManager, FloatingPortal } from '@floating-ui/react'\n\nimport Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { zIndices } from '../theme'\nimport { cs, mergeRefs } from '../utils'\nimport { usePopoverContext } from './context'\nimport type { PopoverContentProps } from './popover.types'\n\n/** Displays provided content in an overlaying wrapper. */\nexport const PopoverContent = vui<'div', PopoverContentProps>((props, ref) => {\n  const { children, className, ...rest } = props\n  const popoverProps = usePopoverContext() ?? {}\n  const { context, floatingStyles, getFloatingProps, isLazy, isMounted, isOpen, setPopper, transitionStyles } =\n    popoverProps\n  const styles = useStyleConfig('Popover', { ...popoverProps, ...props })\n\n  const shouldRenderChildren = isLazy ? isOpen : true\n\n  // Use isMounted for render control - handles transition timing\n  if (!isMounted) {\n    return null\n  }\n\n  return (\n    <FloatingPortal>\n      <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n        <Box\n          bg=\"white\"\n          borderRadius=\"md\"\n          boxShadow=\"2\"\n          className={cs('vui-popoverContent', className)}\n          overflowY=\"auto\"\n          zIndex=\"popover\"\n          ref={mergeRefs(setPopper, ref)}\n          ring={0}\n          style={{ ...floatingStyles, ...transitionStyles, zIndex: zIndices.popover }}\n          {...(getFloatingProps?.() ?? {})}\n          {...styles.content}\n          {...rest}\n        >\n          {shouldRenderChildren ? children : null}\n        </Box>\n      </FloatingFocusManager>\n    </FloatingPortal>\n  )\n})\n\nPopoverContent.displayName = 'PopoverContent'\n\nexport default PopoverContent\n"],"mappings":";;;;;;;;;;;;AAUA,MAAa,iBAAiB,KAAiC,OAAO,QAAQ;CAC5E,MAAM,EAAE,UAAU,WAAW,GAAG,SAAS;CACzC,MAAM,eAAe,mBAAmB,IAAI,EAAE;CAC9C,MAAM,EAAE,SAAS,gBAAgB,kBAAkB,QAAQ,WAAW,QAAQ,WAAW,qBACvF;CACF,MAAM,SAAS,eAAe,WAAW;EAAE,GAAG;EAAc,GAAG;EAAO,CAAC;CAEvE,MAAM,uBAAuB,SAAS,SAAS;AAG/C,KAAI,CAAC,UACH,QAAO;AAGT,QACE,oBAAC,4BACC,oBAAC;EAA8B;EAAS,cAAc;EAAI,OAAO;YAC/D,oBAAC;GACC,IAAG;GACH,cAAa;GACb,WAAU;GACV,WAAW,GAAG,sBAAsB,UAAU;GAC9C,WAAU;GACV,QAAO;GACP,KAAK,UAAU,WAAW,IAAI;GAC9B,MAAM;GACN,OAAO;IAAE,GAAG;IAAgB,GAAG;IAAkB,QAAQA,iBAAS;IAAS;GAC3E,GAAK,oBAAoB,IAAI,EAAE;GAC/B,GAAI,OAAO;GACX,GAAI;aAEH,uBAAuB,WAAW;IAC/B;GACe,GACR;EAEnB;AAEF,eAAe,cAAc"}

package/dist/popover/popoverTrigger.js

@@ -38,5 +38,5 @@ PopoverTrigger.displayName = "PopoverTrigger";
 
 //#endregion
 export { PopoverTrigger as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=popoverTrigger.js.map

package/dist/popover/theme.js

@@ -14,5 +14,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/popover/usePopover.d.ts

@@ -17,9 +17,9 @@ type UsePopoverInternalProps = UsePopoverProps & {
 declare function usePopover(props?: UsePopoverInternalProps): {
   close: () => void;
   context: {
+    placement: Placement$1;
     x: number;
     y: number;
-    placement: Placement$1;
     strategy: Strategy;
     middlewareData: MiddlewareData;
     isPositioned: boolean;

package/dist/popover/usePopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePopover.d.ts","names":[],"sources":["../../src/popover/usePopover.ts"],"mappings":";;;;;;;;KAqBK,uBAAA,GAA0B,eAAA;EAC7B,MAAA;AAAA;;;;;AAHuD;iBAWjC,UAAA,CAAW,KAAA,GAAO,uBAAA;;;;;eAA4B,WAAA;;;;;;;;;;;;;;;;;;;;;;aA+G7B,WAAA;;sCAAW,aAAA;;;;;;;;;KAQxC,cAAA,GAAiB,UAAA,QAAkB,UAAA"}
+{"version":3,"file":"usePopover.d.ts","names":[],"sources":["../../src/popover/usePopover.ts"],"mappings":";;;;;;;;KAqBK,uBAAA,GAA0B,eAAA;EAC7B,MAAA;AAAA;;;;;AAHuD;iBAWjC,UAAA,CAAW,KAAA,GAAO,uBAAA;;;eAA4B,WAAA;;;;;;;;;;;;;;;;;;;;;;;;aA+G7B,WAAA;;sCAAW,aAAA;;;;;;;;;KAQxC,cAAA,GAAiB,UAAA,QAAkB,UAAA"}

package/dist/popover/usePopover.js

@@ -95,5 +95,5 @@ function usePopover(props = {}) {
 
 //#endregion
 export { usePopover as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=usePopover.js.map

package/dist/portal/portal.js

@@ -17,5 +17,5 @@ Portal.displayName = "Portal";
 
 //#endregion
 export { Portal as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=portal.js.map

package/dist/progress/progress.js

@@ -52,5 +52,5 @@ Progress.displayName = "Progress";
 
 //#endregion
 export { ProgressBase, Progress as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=progress.js.map

package/dist/progress/theme.js

@@ -57,5 +57,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/progressCircular/consts.js

@@ -13,5 +13,5 @@ const maxValue = 100;
 
 //#endregion
 export { absCenterStyles, labelBottom, maxValue };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=consts.js.map

package/dist/progressCircular/progressCircular.js

@@ -94,5 +94,5 @@ ProgressCircular.displayName = "ProgressCircular";
 
 //#endregion
 export { ProgressCircularBase, ProgressCircular as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=progressCircular.js.map

package/dist/progressCircular/theme.js

@@ -55,5 +55,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/prose/prose.js

@@ -126,5 +126,5 @@ Prose.displayName = "Prose";
 
 //#endregion
 export { Prose as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=prose.js.map

package/dist/radio/consts.js

@@ -8,5 +8,5 @@ const radioColors = {
 
 //#endregion
 export { radioColors };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=consts.js.map

package/dist/radio/context.js

@@ -5,5 +5,5 @@ const [RadioGroupProvider, useRadioGroupContext] = createContext({ isOptional: t
 
 //#endregion
 export { RadioGroupProvider, useRadioGroupContext };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=context.js.map

package/dist/radio/radio.js

@@ -126,5 +126,5 @@ Radio.displayName = "Radio";
 
 //#endregion
 export { RadioBase, Radio as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=radio.js.map

package/dist/radio/radioGroup.js

@@ -61,5 +61,5 @@ RadioGroup.displayName = "RadioGroup";
 
 //#endregion
 export { RadioGroupBase, RadioGroup as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=radioGroup.js.map

package/dist/radio/theme.js

@@ -45,5 +45,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/range/consts.js

@@ -7,5 +7,5 @@ const rangeColors = {
 
 //#endregion
 export { rangeColors };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=consts.js.map

package/dist/range/range.js

@@ -79,12 +79,12 @@ const Range = vui((props, ref) => {
 			renderTrack: Track,
 			step,
 			value
-		}, `${defaultValue}-${value}-${disabled}-${min}-${max}-${step}`)
+		}, `${disabled}-${min}-${max}-${step}`)
 	});
 });
 Range.displayName = "Range";
 
 //#endregion
 export { Range as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=range.js.map

package/dist/range/range.js.map

@@ -1 +1 @@
-{"version":3,"file":"range.js","names":[],"sources":["../../src/range/range.tsx"],"sourcesContent":["import ReactSlider from 'react-slider'\n\nimport { Box } from '../box'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { Tooltip } from '../tooltip'\nimport { cs, filterUndefined } from '../utils'\nimport { rangeColors } from './consts'\nimport type { RangeProps } from './range.types'\nimport type { RangeTrackKey } from './range.types'\n\nconst SliderBase = styled(ReactSlider)`\n  width: 100%;\n  height: 4px;\n  cursor: pointer;\n  transition-duration: '0s';\n`\n\nconst defaultFormatter = (value: string) => `${value}`\n\n/** Implements a range input. */\nexport const Range = vui<'div', RangeProps>((props, ref) => {\n  const {\n    className,\n    value,\n    defaultValue = 0,\n    disabled,\n    min = 0,\n    minDistance = 0,\n    max = 100,\n    step = 1,\n    showTooltip = false,\n    showValue = false,\n    formatter = defaultFormatter,\n    onChange,\n    ...rest\n  } = props\n\n  const styles = useStyleConfig('Range', props)\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n  })\n  const isSingleValue = typeof defaultValue !== 'object' && typeof value !== 'object'\n  const mainColor = disabled ? rangeColors.disabled : rangeColors.main\n\n  const getTrackColor = (trackProps: any) => {\n    const { key }: { key: RangeTrackKey } = trackProps\n\n    if (isSingleValue) return key === 'track-0' ? mainColor : rangeColors.track\n\n    return key === 'track-2' ? rangeColors.track : key === 'track-1' ? mainColor : rangeColors.track\n  }\n\n  const Thumb = (props: any, state: any) => {\n    const { key, ...thumbProps } = props\n    const thumbKey = key ?? state.index\n    const content = (\n      <Box className=\"vui-range-thumb\" {...styles.thumb} borderColor={mainColor} {...thumbProps}>\n        {showValue && (\n          <Box center className=\"vui-range-thumb-value\" {...styles.thumbValue}>\n            {formatter(state.valueNow)}\n          </Box>\n        )}\n      </Box>\n    )\n    return showValue ? (\n      <Box key={thumbKey}>{content}</Box>\n    ) : (\n      <Tooltip key={thumbKey} disabled={disabled} text={formatter(state.valueNow)} visible={showTooltip}>\n        {content}\n      </Tooltip>\n    )\n  }\n\n  const Track = (\n    props: any,\n    state: {\n      index: number\n      value: number | readonly number[]\n    },\n  ) => {\n    const { key, ...trackProps } = props\n    return (\n      <Box\n        key={key}\n        {...styles.track}\n        bg={getTrackColor(props)}\n        className=\"vui-range-track\"\n        {...trackProps}\n        index={state.index}\n      />\n    )\n  }\n\n  return (\n    <Box\n      className={cs('vui-range', isSingleValue ? 'vui-range-single' : 'vui-range-range', className)}\n      ref={ref}\n      {...styles.container}\n      {...aliasedProps}\n      {...rest}\n    >\n      <SliderBase\n        key={`${defaultValue}-${value}-${disabled}-${min}-${max}-${step}`}\n        className=\"vui-range-slider\"\n        defaultValue={defaultValue}\n        disabled={disabled}\n        max={max}\n        min={min}\n        minDistance={minDistance}\n        onChange={onChange}\n        renderThumb={Thumb}\n        renderTrack={Track}\n        step={step}\n        value={value}\n      />\n    </Box>\n  )\n})\n\nRange.displayName = 'Range'\nexport default Range\n"],"mappings":";;;;;;;;;;;;AAUA,MAAM,aAAa,OAAO,YAAY;;;;;;AAOtC,MAAM,oBAAoB,UAAkB,GAAG;;AAG/C,MAAa,QAAQ,KAAwB,OAAO,QAAQ;CAC1D,MAAM,EACJ,WACA,OACA,eAAe,GACf,UACA,MAAM,GACN,cAAc,GACd,MAAM,KACN,OAAO,GACP,cAAc,OACd,YAAY,OACZ,YAAY,kBACZ,UACA,GAAG,SACD;CAEJ,MAAM,SAAS,eAAe,SAAS,MAAM;CAC7C,MAAM,eAAe,gBAAgB,EACnC,iBAAiB,UAClB,CAAC;CACF,MAAM,gBAAgB,OAAO,iBAAiB,YAAY,OAAO,UAAU;CAC3E,MAAM,YAAY,WAAW,YAAY,WAAW,YAAY;CAEhE,MAAM,iBAAiB,eAAoB;EACzC,MAAM,EAAE,QAAgC;AAExC,MAAI,cAAe,QAAO,QAAQ,YAAY,YAAY,YAAY;AAEtE,SAAO,QAAQ,YAAY,YAAY,QAAQ,QAAQ,YAAY,YAAY,YAAY;;CAG7F,MAAM,SAAS,OAAY,UAAe;EACxC,MAAM,EAAE,KAAK,GAAG,eAAe;EAC/B,MAAM,WAAW,OAAO,MAAM;EAC9B,MAAM,UACJ,oBAAC;GAAI,WAAU;GAAkB,GAAI,OAAO;GAAO,aAAa;GAAW,GAAI;aAC5E,aACC,oBAAC;IAAI;IAAO,WAAU;IAAwB,GAAI,OAAO;cACtD,UAAU,MAAM,SAAS;KACtB;IAEJ;AAER,SAAO,YACL,oBAAC,iBAAoB,WAAX,SAAyB,GAEnC,oBAAC;GAAiC;GAAU,MAAM,UAAU,MAAM,SAAS;GAAE,SAAS;aACnF;KADW,SAEJ;;CAId,MAAM,SACJ,OACA,UAIG;EACH,MAAM,EAAE,KAAK,GAAG,eAAe;AAC/B,SACE,oBAAC;GAEC,GAAI,OAAO;GACX,IAAI,cAAc,MAAM;GACxB,WAAU;GACV,GAAI;GACJ,OAAO,MAAM;KALR,IAML;;AAIN,QACE,oBAAC;EACC,WAAW,GAAG,aAAa,gBAAgB,qBAAqB,mBAAmB,UAAU;EACxF;EACL,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;YAEJ,oBAAC;GAEC,WAAU;GACI;GACJ;GACL;GACA;GACQ;GACH;GACV,aAAa;GACb,aAAa;GACP;GACC;KAXF,GAAG,aAAa,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,OAY3D;GACE;EAER;AAEF,MAAM,cAAc"}
+{"version":3,"file":"range.js","names":[],"sources":["../../src/range/range.tsx"],"sourcesContent":["import ReactSlider from 'react-slider'\n\nimport { Box } from '../box'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { Tooltip } from '../tooltip'\nimport { cs, filterUndefined } from '../utils'\nimport { rangeColors } from './consts'\nimport type { RangeProps } from './range.types'\nimport type { RangeTrackKey } from './range.types'\n\nconst SliderBase = styled(ReactSlider)`\n  width: 100%;\n  height: 4px;\n  cursor: pointer;\n  transition-duration: '0s';\n`\n\nconst defaultFormatter = (value: string) => `${value}`\n\n/** Implements a range input. */\nexport const Range = vui<'div', RangeProps>((props, ref) => {\n  const {\n    className,\n    value,\n    defaultValue = 0,\n    disabled,\n    min = 0,\n    minDistance = 0,\n    max = 100,\n    step = 1,\n    showTooltip = false,\n    showValue = false,\n    formatter = defaultFormatter,\n    onChange,\n    ...rest\n  } = props\n\n  const styles = useStyleConfig('Range', props)\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n  })\n  const isSingleValue = typeof defaultValue !== 'object' && typeof value !== 'object'\n  const mainColor = disabled ? rangeColors.disabled : rangeColors.main\n\n  const getTrackColor = (trackProps: any) => {\n    const { key }: { key: RangeTrackKey } = trackProps\n\n    if (isSingleValue) return key === 'track-0' ? mainColor : rangeColors.track\n\n    return key === 'track-2' ? rangeColors.track : key === 'track-1' ? mainColor : rangeColors.track\n  }\n\n  const Thumb = (props: any, state: any) => {\n    const { key, ...thumbProps } = props\n    const thumbKey = key ?? state.index\n    const content = (\n      <Box className=\"vui-range-thumb\" {...styles.thumb} borderColor={mainColor} {...thumbProps}>\n        {showValue && (\n          <Box center className=\"vui-range-thumb-value\" {...styles.thumbValue}>\n            {formatter(state.valueNow)}\n          </Box>\n        )}\n      </Box>\n    )\n    return showValue ? (\n      <Box key={thumbKey}>{content}</Box>\n    ) : (\n      <Tooltip key={thumbKey} disabled={disabled} text={formatter(state.valueNow)} visible={showTooltip}>\n        {content}\n      </Tooltip>\n    )\n  }\n\n  const Track = (\n    props: any,\n    state: {\n      index: number\n      value: number | readonly number[]\n    },\n  ) => {\n    const { key, ...trackProps } = props\n    return (\n      <Box\n        key={key}\n        {...styles.track}\n        bg={getTrackColor(props)}\n        className=\"vui-range-track\"\n        {...trackProps}\n        index={state.index}\n      />\n    )\n  }\n\n  return (\n    <Box\n      className={cs('vui-range', isSingleValue ? 'vui-range-single' : 'vui-range-range', className)}\n      ref={ref}\n      {...styles.container}\n      {...aliasedProps}\n      {...rest}\n    >\n      <SliderBase\n        key={`${disabled}-${min}-${max}-${step}`}\n        className=\"vui-range-slider\"\n        defaultValue={defaultValue}\n        disabled={disabled}\n        max={max}\n        min={min}\n        minDistance={minDistance}\n        onChange={onChange}\n        renderThumb={Thumb}\n        renderTrack={Track}\n        step={step}\n        value={value}\n      />\n    </Box>\n  )\n})\n\nRange.displayName = 'Range'\nexport default Range\n"],"mappings":";;;;;;;;;;;;AAUA,MAAM,aAAa,OAAO,YAAY;;;;;;AAOtC,MAAM,oBAAoB,UAAkB,GAAG;;AAG/C,MAAa,QAAQ,KAAwB,OAAO,QAAQ;CAC1D,MAAM,EACJ,WACA,OACA,eAAe,GACf,UACA,MAAM,GACN,cAAc,GACd,MAAM,KACN,OAAO,GACP,cAAc,OACd,YAAY,OACZ,YAAY,kBACZ,UACA,GAAG,SACD;CAEJ,MAAM,SAAS,eAAe,SAAS,MAAM;CAC7C,MAAM,eAAe,gBAAgB,EACnC,iBAAiB,UAClB,CAAC;CACF,MAAM,gBAAgB,OAAO,iBAAiB,YAAY,OAAO,UAAU;CAC3E,MAAM,YAAY,WAAW,YAAY,WAAW,YAAY;CAEhE,MAAM,iBAAiB,eAAoB;EACzC,MAAM,EAAE,QAAgC;AAExC,MAAI,cAAe,QAAO,QAAQ,YAAY,YAAY,YAAY;AAEtE,SAAO,QAAQ,YAAY,YAAY,QAAQ,QAAQ,YAAY,YAAY,YAAY;;CAG7F,MAAM,SAAS,OAAY,UAAe;EACxC,MAAM,EAAE,KAAK,GAAG,eAAe;EAC/B,MAAM,WAAW,OAAO,MAAM;EAC9B,MAAM,UACJ,oBAAC;GAAI,WAAU;GAAkB,GAAI,OAAO;GAAO,aAAa;GAAW,GAAI;aAC5E,aACC,oBAAC;IAAI;IAAO,WAAU;IAAwB,GAAI,OAAO;cACtD,UAAU,MAAM,SAAS;KACtB;IAEJ;AAER,SAAO,YACL,oBAAC,iBAAoB,WAAX,SAAyB,GAEnC,oBAAC;GAAiC;GAAU,MAAM,UAAU,MAAM,SAAS;GAAE,SAAS;aACnF;KADW,SAEJ;;CAId,MAAM,SACJ,OACA,UAIG;EACH,MAAM,EAAE,KAAK,GAAG,eAAe;AAC/B,SACE,oBAAC;GAEC,GAAI,OAAO;GACX,IAAI,cAAc,MAAM;GACxB,WAAU;GACV,GAAI;GACJ,OAAO,MAAM;KALR,IAML;;AAIN,QACE,oBAAC;EACC,WAAW,GAAG,aAAa,gBAAgB,qBAAqB,mBAAmB,UAAU;EACxF;EACL,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;YAEJ,oBAAC;GAEC,WAAU;GACI;GACJ;GACL;GACA;GACQ;GACH;GACV,aAAa;GACb,aAAa;GACP;GACC;KAXF,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,OAYlC;GACE;EAER;AAEF,MAAM,cAAc"}

package/dist/range/theme.js

@@ -47,5 +47,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/rating/rating.js

@@ -124,5 +124,5 @@ Rating.displayName = "Rating";
 
 //#endregion
 export { Rating as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=rating.js.map

package/dist/rating/theme.js

@@ -24,5 +24,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/select/context.js

@@ -5,5 +5,5 @@ const [SelectProvider, useSelectContext] = createContext({ isOptional: true });
 
 //#endregion
 export { SelectProvider, useSelectContext };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=context.js.map

package/dist/select/select.js

@@ -75,7 +75,7 @@ function Select(props) {
 					children: /* @__PURE__ */ jsxs(Fragment$1, { children: [selectButton ?? /* @__PURE__ */ jsx(SelectButton, { ...selectButtonProps }), /* @__PURE__ */ jsxs(SelectContent, {
 						overflow: "hidden",
 						children: [showOptionsFilter && /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Input, {
-							iconLeft: "uiSearch",
+							startIcon: "uiSearch",
 							id,
 							m: 1,
 							mt: 0,
@@ -117,5 +117,5 @@ Select.displayName = "Select";
 
 //#endregion
 export { Select as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=select.js.map

package/dist/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","names":[],"sources":["../../src/select/select.tsx"],"sourcesContent":["import { useEffect, useId, useState } from 'react'\n\nimport { Box } from '../box'\nimport { Input } from '../input'\nimport { helpTextSize } from '../input/consts'\nimport HelpText from '../input/helpText'\nimport { Popover } from '../popover'\nimport { __DEV__ } from '../utils'\nimport type { ChangeEvent } from '../utils'\nimport { SelectProvider } from './context'\nimport type { SelectOptionData, SelectProps } from './select.types'\nimport SelectButton from './selectButton'\nimport SelectContent from './selectContent'\nimport SelectGroup from './selectGroup'\nimport SelectLabel from './selectLabel'\nimport SelectOption from './selectOption'\nimport useSelect from './useSelect'\n\n/**\n * Wraps trigger and content elements, providing them with context.\n * When no children are provided, content can be displayed based on 'options' data prop.\n * Supports single select and multi select, as well as controlled and uncontrolled modes.\n */\nexport function Select(props: SelectProps) {\n  const {\n    children,\n    defaultValue,\n    disabled,\n    errorText,\n    closeOnScroll,\n    helpText,\n    id: idProp,\n    isInvalid,\n    isMultiple,\n    label,\n    labelMarkOptional,\n    labelTooltipText,\n    maxHeight,\n    name,\n    onChange,\n    onClose,\n    onOpen,\n    options,\n    matchWidth = true,\n    placeholder = 'Please select',\n    selectedText,\n    readOnly,\n    selectButton,\n    selectButtonProps,\n    showOptionsFilter,\n    size = 'lg',\n    value,\n    variant,\n    ...rest\n  } = props\n\n  const selectProps = useSelect({ defaultValue, isMultiple, onChange, value, options, selectedText, children })\n\n  if (__DEV__ && isMultiple && !Array.isArray(selectProps.value))\n    console.error('<Select /> is used with isMultiple but its value is not an array: ', value)\n\n  const generatedId = useId()\n  const [query, setQuery] = useState<string>('')\n  const [filteredOptions, setFilteredOptions] = useState(options)\n\n  const id = idProp || generatedId\n\n  const context = {\n    disabled,\n    isInvalid,\n    isMultiple,\n    name,\n    options,\n    placeholder,\n    selectedText,\n    readOnly,\n    size,\n    variant,\n    ...selectProps,\n  }\n  const onQueryChange = (e: ChangeEvent) => setQuery(e.target.value?.toLowerCase())\n\n  const filterOptions = (i: SelectOptionData) =>\n    !showOptionsFilter || !query?.length ? true : i?.text?.toLowerCase()?.includes(query)\n\n  useEffect(() => {\n    setFilteredOptions(options?.filter(filterOptions))\n  }, [query, options])\n\n  return (\n    <SelectProvider value={context}>\n      <Box className=\"vui-selectContainer\" column {...rest}>\n        {!!label && (\n          <SelectLabel\n            disabled={disabled}\n            id={id}\n            label={label}\n            labelMarkOptional={labelMarkOptional}\n            labelTooltipText={labelTooltipText}\n          />\n        )}\n        <Popover matchWidth={matchWidth} onClose={onClose} onOpen={onOpen}>\n          <>\n            {selectButton ?? <SelectButton {...selectButtonProps} />}\n            <SelectContent overflow=\"hidden\">\n              {showOptionsFilter && (\n                <Box>\n                  <Input\n                    iconLeft=\"uiSearch\"\n                    id={id}\n                    m={1}\n                    mt={0}\n                    onChange={onQueryChange}\n                    placeholder=\"Filter…\"\n                    size={size}\n                    value={query}\n                    w=\"100%\"\n                  />\n                </Box>\n              )}\n              <SelectGroup maxH={maxHeight} overflowY=\"auto\" tabIndex={1000}>\n                {children ??\n                  filteredOptions?.map?.(option => (\n                    <SelectOption closeOnScroll={closeOnScroll} key={option.value} title={option.text} {...option} />\n                  ))}\n              </SelectGroup>\n            </SelectContent>\n          </>\n        </Popover>\n        {!!helpText && <HelpText size={helpTextSize[size]}>{helpText}</HelpText>}\n        {!!errorText && (\n          <HelpText isError size={helpTextSize[size]}>\n            {errorText}\n          </HelpText>\n        )}\n      </Box>\n    </SelectProvider>\n  )\n}\n\nSelect.Button = SelectButton\nSelect.Content = SelectContent\nSelect.Group = SelectGroup\nSelect.Option = SelectOption\nSelect.displayName = 'Select'\n\nexport default Select\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuBA,SAAgB,OAAO,OAAoB;CACzC,MAAM,EACJ,UACA,cACA,UACA,WACA,eACA,UACA,IAAI,QACJ,WACA,YACA,OACA,mBACA,kBACA,WACA,MACA,UACA,SACA,QACA,SACA,aAAa,MACb,cAAc,iBACd,cACA,UACA,cACA,mBACA,mBACA,OAAO,MACP,OACA,SACA,GAAG,SACD;CAEJ,MAAM,cAAc,UAAU;EAAE;EAAc;EAAY;EAAU;EAAO;EAAS;EAAc;EAAU,CAAC;AAE7G,KAAI,WAAW,cAAc,CAAC,MAAM,QAAQ,YAAY,MAAM,CAC5D,SAAQ,MAAM,sEAAsE,MAAM;CAE5F,MAAM,cAAc,OAAO;CAC3B,MAAM,CAAC,OAAO,YAAY,SAAiB,GAAG;CAC9C,MAAM,CAAC,iBAAiB,sBAAsB,SAAS,QAAQ;CAE/D,MAAM,KAAK,UAAU;CAErB,MAAM,UAAU;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,GAAG;EACJ;CACD,MAAM,iBAAiB,MAAmB,SAAS,EAAE,OAAO,OAAO,aAAa,CAAC;CAEjF,MAAM,iBAAiB,MACrB,CAAC,qBAAqB,CAAC,OAAO,SAAS,OAAO,GAAG,MAAM,aAAa,EAAE,SAAS,MAAM;AAEvF,iBAAgB;AACd,qBAAmB,SAAS,OAAO,cAAc,CAAC;IACjD,CAAC,OAAO,QAAQ,CAAC;AAEpB,QACE,oBAAC;EAAe,OAAO;YACrB,qBAAC;GAAI,WAAU;GAAsB;GAAO,GAAI;;IAC7C,CAAC,CAAC,SACD,oBAAC;KACW;KACN;KACG;KACY;KACD;MAClB;IAEJ,oBAAC;KAAoB;KAAqB;KAAiB;eACzD,8CACG,gBAAgB,oBAAC,gBAAa,GAAI,oBAAqB,EACxD,qBAAC;MAAc,UAAS;iBACrB,qBACC,oBAAC,iBACC,oBAAC;OACC,UAAS;OACL;OACJ,GAAG;OACH,IAAI;OACJ,UAAU;OACV,aAAY;OACN;OACN,OAAO;OACP,GAAE;QACF,GACE,EAER,oBAAC;OAAY,MAAM;OAAW,WAAU;OAAO,UAAU;iBACtD,YACC,iBAAiB,OAAM,WACrB,oBAAC;QAA4B;QAAkC,OAAO,OAAO;QAAM,GAAI;UAAtC,OAAO,MAAyC,CACjG;QACQ;OACA,IACf;MACK;IACT,CAAC,CAAC,YAAY,oBAAC;KAAS,MAAM,aAAa;eAAQ;MAAoB;IACvE,CAAC,CAAC,aACD,oBAAC;KAAS;KAAQ,MAAM,aAAa;eAClC;MACQ;;IAET;GACS;;AAIrB,OAAO,SAAS;AAChB,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,SAAS;AAChB,OAAO,cAAc"}
+{"version":3,"file":"select.js","names":[],"sources":["../../src/select/select.tsx"],"sourcesContent":["import { useEffect, useId, useState } from 'react'\n\nimport { Box } from '../box'\nimport { Input } from '../input'\nimport { helpTextSize } from '../input/consts'\nimport HelpText from '../input/helpText'\nimport { Popover } from '../popover'\nimport { __DEV__ } from '../utils'\nimport type { ChangeEvent } from '../utils'\nimport { SelectProvider } from './context'\nimport type { SelectOptionData, SelectProps } from './select.types'\nimport SelectButton from './selectButton'\nimport SelectContent from './selectContent'\nimport SelectGroup from './selectGroup'\nimport SelectLabel from './selectLabel'\nimport SelectOption from './selectOption'\nimport useSelect from './useSelect'\n\n/**\n * Wraps trigger and content elements, providing them with context.\n * When no children are provided, content can be displayed based on 'options' data prop.\n * Supports single select and multi select, as well as controlled and uncontrolled modes.\n */\nexport function Select(props: SelectProps) {\n  const {\n    children,\n    defaultValue,\n    disabled,\n    errorText,\n    closeOnScroll,\n    helpText,\n    id: idProp,\n    isInvalid,\n    isMultiple,\n    label,\n    labelMarkOptional,\n    labelTooltipText,\n    maxHeight,\n    name,\n    onChange,\n    onClose,\n    onOpen,\n    options,\n    matchWidth = true,\n    placeholder = 'Please select',\n    selectedText,\n    readOnly,\n    selectButton,\n    selectButtonProps,\n    showOptionsFilter,\n    size = 'lg',\n    value,\n    variant,\n    ...rest\n  } = props\n\n  const selectProps = useSelect({ defaultValue, isMultiple, onChange, value, options, selectedText, children })\n\n  if (__DEV__ && isMultiple && !Array.isArray(selectProps.value))\n    console.error('<Select /> is used with isMultiple but its value is not an array: ', value)\n\n  const generatedId = useId()\n  const [query, setQuery] = useState<string>('')\n  const [filteredOptions, setFilteredOptions] = useState(options)\n\n  const id = idProp || generatedId\n\n  const context = {\n    disabled,\n    isInvalid,\n    isMultiple,\n    name,\n    options,\n    placeholder,\n    selectedText,\n    readOnly,\n    size,\n    variant,\n    ...selectProps,\n  }\n  const onQueryChange = (e: ChangeEvent) => setQuery(e.target.value?.toLowerCase())\n\n  const filterOptions = (i: SelectOptionData) =>\n    !showOptionsFilter || !query?.length ? true : i?.text?.toLowerCase()?.includes(query)\n\n  useEffect(() => {\n    setFilteredOptions(options?.filter(filterOptions))\n  }, [query, options])\n\n  return (\n    <SelectProvider value={context}>\n      <Box className=\"vui-selectContainer\" column {...rest}>\n        {!!label && (\n          <SelectLabel\n            disabled={disabled}\n            id={id}\n            label={label}\n            labelMarkOptional={labelMarkOptional}\n            labelTooltipText={labelTooltipText}\n          />\n        )}\n        <Popover matchWidth={matchWidth} onClose={onClose} onOpen={onOpen}>\n          <>\n            {selectButton ?? <SelectButton {...selectButtonProps} />}\n            <SelectContent overflow=\"hidden\">\n              {showOptionsFilter && (\n                <Box>\n                  <Input\n                    startIcon=\"uiSearch\"\n                    id={id}\n                    m={1}\n                    mt={0}\n                    onChange={onQueryChange}\n                    placeholder=\"Filter…\"\n                    size={size}\n                    value={query}\n                    w=\"100%\"\n                  />\n                </Box>\n              )}\n              <SelectGroup maxH={maxHeight} overflowY=\"auto\" tabIndex={1000}>\n                {children ??\n                  filteredOptions?.map?.(option => (\n                    <SelectOption closeOnScroll={closeOnScroll} key={option.value} title={option.text} {...option} />\n                  ))}\n              </SelectGroup>\n            </SelectContent>\n          </>\n        </Popover>\n        {!!helpText && <HelpText size={helpTextSize[size]}>{helpText}</HelpText>}\n        {!!errorText && (\n          <HelpText isError size={helpTextSize[size]}>\n            {errorText}\n          </HelpText>\n        )}\n      </Box>\n    </SelectProvider>\n  )\n}\n\nSelect.Button = SelectButton\nSelect.Content = SelectContent\nSelect.Group = SelectGroup\nSelect.Option = SelectOption\nSelect.displayName = 'Select'\n\nexport default Select\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuBA,SAAgB,OAAO,OAAoB;CACzC,MAAM,EACJ,UACA,cACA,UACA,WACA,eACA,UACA,IAAI,QACJ,WACA,YACA,OACA,mBACA,kBACA,WACA,MACA,UACA,SACA,QACA,SACA,aAAa,MACb,cAAc,iBACd,cACA,UACA,cACA,mBACA,mBACA,OAAO,MACP,OACA,SACA,GAAG,SACD;CAEJ,MAAM,cAAc,UAAU;EAAE;EAAc;EAAY;EAAU;EAAO;EAAS;EAAc;EAAU,CAAC;AAE7G,KAAI,WAAW,cAAc,CAAC,MAAM,QAAQ,YAAY,MAAM,CAC5D,SAAQ,MAAM,sEAAsE,MAAM;CAE5F,MAAM,cAAc,OAAO;CAC3B,MAAM,CAAC,OAAO,YAAY,SAAiB,GAAG;CAC9C,MAAM,CAAC,iBAAiB,sBAAsB,SAAS,QAAQ;CAE/D,MAAM,KAAK,UAAU;CAErB,MAAM,UAAU;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,GAAG;EACJ;CACD,MAAM,iBAAiB,MAAmB,SAAS,EAAE,OAAO,OAAO,aAAa,CAAC;CAEjF,MAAM,iBAAiB,MACrB,CAAC,qBAAqB,CAAC,OAAO,SAAS,OAAO,GAAG,MAAM,aAAa,EAAE,SAAS,MAAM;AAEvF,iBAAgB;AACd,qBAAmB,SAAS,OAAO,cAAc,CAAC;IACjD,CAAC,OAAO,QAAQ,CAAC;AAEpB,QACE,oBAAC;EAAe,OAAO;YACrB,qBAAC;GAAI,WAAU;GAAsB;GAAO,GAAI;;IAC7C,CAAC,CAAC,SACD,oBAAC;KACW;KACN;KACG;KACY;KACD;MAClB;IAEJ,oBAAC;KAAoB;KAAqB;KAAiB;eACzD,8CACG,gBAAgB,oBAAC,gBAAa,GAAI,oBAAqB,EACxD,qBAAC;MAAc,UAAS;iBACrB,qBACC,oBAAC,iBACC,oBAAC;OACC,WAAU;OACN;OACJ,GAAG;OACH,IAAI;OACJ,UAAU;OACV,aAAY;OACN;OACN,OAAO;OACP,GAAE;QACF,GACE,EAER,oBAAC;OAAY,MAAM;OAAW,WAAU;OAAO,UAAU;iBACtD,YACC,iBAAiB,OAAM,WACrB,oBAAC;QAA4B;QAAkC,OAAO,OAAO;QAAM,GAAI;UAAtC,OAAO,MAAyC,CACjG;QACQ;OACA,IACf;MACK;IACT,CAAC,CAAC,YAAY,oBAAC;KAAS,MAAM,aAAa;eAAQ;MAAoB;IACvE,CAAC,CAAC,aACD,oBAAC;KAAS;KAAQ,MAAM,aAAa;eAClC;MACQ;;IAET;GACS;;AAIrB,OAAO,SAAS;AAChB,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,SAAS;AAChB,OAAO,cAAc"}

package/dist/select/selectButton.js

@@ -50,7 +50,7 @@ const SelectButton = vui((props, ref) => {
 		disabled,
 		focusRing: 2,
 		fontWeight: "regular",
-		iconRight: /* @__PURE__ */ jsx(Button.Icon, {
+		endIcon: /* @__PURE__ */ jsx(Button.Icon, {
 			color: iconColor,
 			ml: "auto",
 			name: "uiAngleDown"
@@ -75,5 +75,5 @@ SelectButton.displayName = "SelectButton";
 
 //#endregion
 export { SelectButton as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=selectButton.js.map

package/dist/select/selectButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"selectButton.js","names":[],"sources":["../../src/select/selectButton.tsx"],"sourcesContent":["import Button, { LineButton } from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport { inputColors } from '../input/consts'\nimport { PopoverTrigger } from '../popover'\nimport { cs, ellipsisOverflow } from '../utils'\nimport { useSelectContext } from './context'\nimport type { SelectButtonProps } from './select.types'\n\n/**\n * Displays a custom button component, which opens a popover on click.\n * Text within the button is either selected value or placeholder.\n * Includes special styling for disabled, readOnly and invalid states.\n */\nexport const SelectButton = vui<'button', SelectButtonProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { disabled, isInvalid, placeholder, readOnly, valueText } = useSelectContext() ?? {}\n  const styles = useStyleConfig('Select', useSelectContext())\n\n  const text = valueText || placeholder\n\n  const disabledProps = disabled\n    ? {\n        activeBg: 'sandstone.79',\n        cursor: 'not-allowed',\n        backgroundColor: 'sandstone.79',\n        borderColor: 'sandstone.79',\n        hoverBg: 'sandstone.79',\n        hoverBorderColor: 'sandstone.79',\n        activeBorderColor: 'sandstone.79',\n      }\n    : undefined\n\n  const readOnlyProps = readOnly\n    ? {\n        activeBg: 'sandstone.95',\n        bg: 'sandstone.95',\n        color: 'seaBlue.main',\n        cursor: 'auto',\n        disabled: true,\n        hoverBg: 'sandstone.95',\n        opacity: 1,\n      }\n    : undefined\n\n  const isInvalidProps = isInvalid\n    ? {\n        borderColor: 'energyRed.45',\n        hoverBorderColor: 'energyRed.45',\n      }\n    : undefined\n\n  const textColor = inputColors.inputText\n  const iconColor = disabled ? inputColors.inputText : 'seaBlue.main'\n\n  return (\n    <PopoverTrigger\n      as={LineButton}\n      bg=\"white\"\n      className={cs('vui-selectButton', className)}\n      disabled={disabled}\n      focusRing={2}\n      fontWeight=\"regular\"\n      iconRight={<Button.Icon color={iconColor} ml=\"auto\" name=\"uiAngleDown\" />}\n      isFullWidth\n      px={1}\n      ref={ref}\n      text={\n        <Button.Text color={textColor} {...ellipsisOverflow}>\n          {text}\n        </Button.Text>\n      }\n      userSelect=\"text\"\n      {...styles.button}\n      {...disabledProps}\n      {...readOnlyProps}\n      {...isInvalidProps}\n      {...rest}\n    />\n  )\n})\n\nSelectButton.displayName = 'SelectButton'\nexport default SelectButton\n"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAa,eAAe,KAAkC,OAAO,QAAQ;CAC3E,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,UAAU,WAAW,aAAa,UAAU,cAAc,kBAAkB,IAAI,EAAE;CAC1F,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,OAAO,aAAa;CAE1B,MAAM,gBAAgB,WAClB;EACE,UAAU;EACV,QAAQ;EACR,iBAAiB;EACjB,aAAa;EACb,SAAS;EACT,kBAAkB;EAClB,mBAAmB;EACpB,GACD;CAEJ,MAAM,gBAAgB,WAClB;EACE,UAAU;EACV,IAAI;EACJ,OAAO;EACP,QAAQ;EACR,UAAU;EACV,SAAS;EACT,SAAS;EACV,GACD;CAEJ,MAAM,iBAAiB,YACnB;EACE,aAAa;EACb,kBAAkB;EACnB,GACD;CAEJ,MAAM,YAAY,YAAY;CAC9B,MAAM,YAAY,WAAW,YAAY,YAAY;AAErD,QACE,oBAAC;EACC,IAAI;EACJ,IAAG;EACH,WAAW,GAAG,oBAAoB,UAAU;EAClC;EACV,WAAW;EACX,YAAW;EACX,WAAW,oBAAC,OAAO;GAAK,OAAO;GAAW,IAAG;GAAO,MAAK;IAAgB;EACzE;EACA,IAAI;EACC;EACL,MACE,oBAAC,OAAO;GAAK,OAAO;GAAW,GAAI;aAChC;IACW;EAEhB,YAAW;EACX,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,GAAI;GACJ;EAEJ;AAEF,aAAa,cAAc"}
+{"version":3,"file":"selectButton.js","names":[],"sources":["../../src/select/selectButton.tsx"],"sourcesContent":["import Button, { LineButton } from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport { inputColors } from '../input/consts'\nimport { PopoverTrigger } from '../popover'\nimport { cs, ellipsisOverflow } from '../utils'\nimport { useSelectContext } from './context'\nimport type { SelectButtonProps } from './select.types'\n\n/**\n * Displays a custom button component, which opens a popover on click.\n * Text within the button is either selected value or placeholder.\n * Includes special styling for disabled, readOnly and invalid states.\n */\nexport const SelectButton = vui<'button', SelectButtonProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { disabled, isInvalid, placeholder, readOnly, valueText } = useSelectContext() ?? {}\n  const styles = useStyleConfig('Select', useSelectContext())\n\n  const text = valueText || placeholder\n\n  const disabledProps = disabled\n    ? {\n        activeBg: 'sandstone.79',\n        cursor: 'not-allowed',\n        backgroundColor: 'sandstone.79',\n        borderColor: 'sandstone.79',\n        hoverBg: 'sandstone.79',\n        hoverBorderColor: 'sandstone.79',\n        activeBorderColor: 'sandstone.79',\n      }\n    : undefined\n\n  const readOnlyProps = readOnly\n    ? {\n        activeBg: 'sandstone.95',\n        bg: 'sandstone.95',\n        color: 'seaBlue.main',\n        cursor: 'auto',\n        disabled: true,\n        hoverBg: 'sandstone.95',\n        opacity: 1,\n      }\n    : undefined\n\n  const isInvalidProps = isInvalid\n    ? {\n        borderColor: 'energyRed.45',\n        hoverBorderColor: 'energyRed.45',\n      }\n    : undefined\n\n  const textColor = inputColors.inputText\n  const iconColor = disabled ? inputColors.inputText : 'seaBlue.main'\n\n  return (\n    <PopoverTrigger\n      as={LineButton}\n      bg=\"white\"\n      className={cs('vui-selectButton', className)}\n      disabled={disabled}\n      focusRing={2}\n      fontWeight=\"regular\"\n      endIcon={<Button.Icon color={iconColor} ml=\"auto\" name=\"uiAngleDown\" />}\n      isFullWidth\n      px={1}\n      ref={ref}\n      text={\n        <Button.Text color={textColor} {...ellipsisOverflow}>\n          {text}\n        </Button.Text>\n      }\n      userSelect=\"text\"\n      {...styles.button}\n      {...disabledProps}\n      {...readOnlyProps}\n      {...isInvalidProps}\n      {...rest}\n    />\n  )\n})\n\nSelectButton.displayName = 'SelectButton'\nexport default SelectButton\n"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAa,eAAe,KAAkC,OAAO,QAAQ;CAC3E,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,UAAU,WAAW,aAAa,UAAU,cAAc,kBAAkB,IAAI,EAAE;CAC1F,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,OAAO,aAAa;CAE1B,MAAM,gBAAgB,WAClB;EACE,UAAU;EACV,QAAQ;EACR,iBAAiB;EACjB,aAAa;EACb,SAAS;EACT,kBAAkB;EAClB,mBAAmB;EACpB,GACD;CAEJ,MAAM,gBAAgB,WAClB;EACE,UAAU;EACV,IAAI;EACJ,OAAO;EACP,QAAQ;EACR,UAAU;EACV,SAAS;EACT,SAAS;EACV,GACD;CAEJ,MAAM,iBAAiB,YACnB;EACE,aAAa;EACb,kBAAkB;EACnB,GACD;CAEJ,MAAM,YAAY,YAAY;CAC9B,MAAM,YAAY,WAAW,YAAY,YAAY;AAErD,QACE,oBAAC;EACC,IAAI;EACJ,IAAG;EACH,WAAW,GAAG,oBAAoB,UAAU;EAClC;EACV,WAAW;EACX,YAAW;EACX,SAAS,oBAAC,OAAO;GAAK,OAAO;GAAW,IAAG;GAAO,MAAK;IAAgB;EACvE;EACA,IAAI;EACC;EACL,MACE,oBAAC,OAAO;GAAK,OAAO;GAAW,GAAI;aAChC;IACW;EAEhB,YAAW;EACX,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,GAAI;GACJ;EAEJ;AAEF,aAAa,cAAc"}

package/dist/select/selectContent.js

@@ -23,5 +23,5 @@ SelectContent.displayName = "SelectContent";
 
 //#endregion
 export { SelectContent as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=selectContent.js.map

package/dist/select/selectGroup.js

@@ -25,5 +25,5 @@ SelectGroup.displayName = "SelectGroup";
 
 //#endregion
 export { SelectGroup as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=selectGroup.js.map

package/dist/select/selectLabel.js

@@ -22,5 +22,5 @@ SelectLabel.displayName = "SelectLabel";
 
 //#endregion
 export { SelectLabel as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=selectLabel.js.map

package/dist/select/selectOption.js

@@ -74,5 +74,5 @@ SelectOption.displayName = "SelectOption";
 
 //#endregion
 export { SelectOption as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=selectOption.js.map

package/dist/select/theme.js

@@ -74,5 +74,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/select/useSelect.js

@@ -30,5 +30,5 @@ function useSelect(props) {
 
 //#endregion
 export { useSelect as default, getOptionText };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=useSelect.js.map

package/dist/sidemenu/consts.js

@@ -4,5 +4,5 @@ const expandedWidth = 240;
 
 //#endregion
 export { collapsedWidth, expandedWidth };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=consts.js.map

package/dist/sidemenu/context.js

@@ -5,5 +5,5 @@ const [SidemenuProvider, useSidemenuContext] = createContext({ isOptional: true
 
 //#endregion
 export { SidemenuProvider, useSidemenuContext };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=context.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sidemenu.d.ts","names":[],"sources":["../../src/sidemenu/sidemenu.tsx"],"mappings":";;;;;;;;cAea,QAAA,EA6FP,YAAA,QAAoB,aAAA;EACxB,GAAA,SAAY,WAAA;EACZ,IAAA,SAAa,YAAA;AAAA"}
+{"version":3,"file":"sidemenu.d.ts","names":[],"sources":["../../src/sidemenu/sidemenu.tsx"],"mappings":";;;;;;;;cAea,QAAA,EA8FP,YAAA,QAAoB,aAAA;EACxB,GAAA,SAAY,WAAA;EACZ,IAAA,SAAa,YAAA;AAAA"}

package/dist/sidemenu/sidemenu.js

@@ -80,7 +80,8 @@ const Sidemenu = vui((props, ref) => {
 					onClick: onToggle,
 					pl: 0,
 					size: "md",
-					variant: isDark ? "tertiaryLight" : "tertiaryDark",
+					variant: "tertiary",
+					intent: isDark ? "contrast" : "brand",
 					w: "100%",
 					children: /* @__PURE__ */ jsx(Icon, { name: icon })
 				})
@@ -94,5 +95,5 @@ Sidemenu.displayName = "Sidemenu";
 
 //#endregion
 export { Sidemenu as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=sidemenu.js.map

package/dist/sidemenu/sidemenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenu.js","names":[],"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":";;;;;;;;;;;;;;;;;AAeA,MAAa,WAAW,KAA2B,OAAO,QAAQ;CAChE,MAAM,EACJ,UACA,WACA,OACA,aAAa,OACb,WAAW,OACX,MACA,SACA,QAAQ,eACR,YACA,GAAG,SACD;CAEJ,MAAM,CAAC,wBAAwB,6BAA6B,SAAS,WAAW;CAChF,MAAM,UAAU,cACR,gBAAgB;EAAE;EAAM;EAAS;EAAwB,CAAC,EAChE;EAAC;EAAM;EAAS;EAAuB,CACxC;CAED,MAAM,SAAS,eAAe,YAAY,MAAM;CAEhD,MAAM,SAAS,YAAY;AAE3B,iBAAgB;AACd,4BAA0B,WAAW;IACpC,CAAC,WAAW,CAAC;CAEhB,MAAM,iBAAiB,0BAA0B,CAAC,uBAAuB;CAEzE,MAAM,IAAI,yBAAyB,QAAQ;CAC3C,MAAM,OAAO,WAAW,yBAAyB,SAAS;CAC1D,MAAM,iBAAiB,yBAAyB,aAAa;CAE7D,SAAS,YAAY,MAAyB;AAC5C,QAAM,WAAW;AACjB,MAAI,MAAM,KAAM,cAAa,KAAK,KAAK;;AAGzC,QACE,oBAAC;EAAiB,OAAO;YACvB,qBAAC;GACC,WAAW,GAAG,gBAAgB,UAAU;GACxC,WAAU;GACV,eAAc;GACd,UAAU;GACV,WAAU;GACV,UAAU,WAAW,WAAW;GAC3B;GACL,KAAK,WAAY,MAAM,MAAM,IAAK;GAClC,oBAAmB;GAChB;GACH,GAAI,OAAO;GACX,GAAI;cAEJ,oBAAC;IACC,eAAc;IACd,UAAU;IACV,gBAAe;IACf,MAAM;IACN,WAAU;IACV,WAAU;IACV,GAAE;cAED,QACG,OAAO,OAAO,MAAyB,QACrC,oBAAC;KACC,UAAU,aAAa,MAAM,KAAK;KAElC,GAAI;KACJ,eAAe,YAAY,KAAK;OAF3B,IAGL,CACF,GACF;KACA,EACN,oBAAC;IAAI,WAAU;IAAsB,GAAE;IAAO,GAAI,OAAO;cACvD,oBAAC;KACC,cAAY,yBAAyB,aAAa;KAClD,cAAc;KACE;KAChB,MAAM,SAAS,OAAO,SAAS;KAC/B,SAAS;KACT,IAAI;KACJ,MAAK;KACL,SAAS,SAAS,kBAAkB;KACpC,GAAE;eAEF,oBAAC,QAAK,MAAM,OAAQ;MACb;KACL;IACF;GACW;EAErB;AAKF,SAAS,MAAM;AACf,SAAS,OAAO;AAChB,SAAS,cAAc"}
+{"version":3,"file":"sidemenu.js","names":[],"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=\"tertiary\"\n            intent={isDark ? 'contrast' : 'brand'}\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":";;;;;;;;;;;;;;;;;AAeA,MAAa,WAAW,KAA2B,OAAO,QAAQ;CAChE,MAAM,EACJ,UACA,WACA,OACA,aAAa,OACb,WAAW,OACX,MACA,SACA,QAAQ,eACR,YACA,GAAG,SACD;CAEJ,MAAM,CAAC,wBAAwB,6BAA6B,SAAS,WAAW;CAChF,MAAM,UAAU,cACR,gBAAgB;EAAE;EAAM;EAAS;EAAwB,CAAC,EAChE;EAAC;EAAM;EAAS;EAAuB,CACxC;CAED,MAAM,SAAS,eAAe,YAAY,MAAM;CAEhD,MAAM,SAAS,YAAY;AAE3B,iBAAgB;AACd,4BAA0B,WAAW;IACpC,CAAC,WAAW,CAAC;CAEhB,MAAM,iBAAiB,0BAA0B,CAAC,uBAAuB;CAEzE,MAAM,IAAI,yBAAyB,QAAQ;CAC3C,MAAM,OAAO,WAAW,yBAAyB,SAAS;CAC1D,MAAM,iBAAiB,yBAAyB,aAAa;CAE7D,SAAS,YAAY,MAAyB;AAC5C,QAAM,WAAW;AACjB,MAAI,MAAM,KAAM,cAAa,KAAK,KAAK;;AAGzC,QACE,oBAAC;EAAiB,OAAO;YACvB,qBAAC;GACC,WAAW,GAAG,gBAAgB,UAAU;GACxC,WAAU;GACV,eAAc;GACd,UAAU;GACV,WAAU;GACV,UAAU,WAAW,WAAW;GAC3B;GACL,KAAK,WAAY,MAAM,MAAM,IAAK;GAClC,oBAAmB;GAChB;GACH,GAAI,OAAO;GACX,GAAI;cAEJ,oBAAC;IACC,eAAc;IACd,UAAU;IACV,gBAAe;IACf,MAAM;IACN,WAAU;IACV,WAAU;IACV,GAAE;cAED,QACG,OAAO,OAAO,MAAyB,QACrC,oBAAC;KACC,UAAU,aAAa,MAAM,KAAK;KAElC,GAAI;KACJ,eAAe,YAAY,KAAK;OAF3B,IAGL,CACF,GACF;KACA,EACN,oBAAC;IAAI,WAAU;IAAsB,GAAE;IAAO,GAAI,OAAO;cACvD,oBAAC;KACC,cAAY,yBAAyB,aAAa;KAClD,cAAc;KACE;KAChB,MAAM,SAAS,OAAO,SAAS;KAC/B,SAAS;KACT,IAAI;KACJ,MAAK;KACL,SAAQ;KACR,QAAQ,SAAS,aAAa;KAC9B,GAAE;eAEF,oBAAC,QAAK,MAAM,OAAQ;MACb;KACL;IACF;GACW;EAErB;AAKF,SAAS,MAAM;AACf,SAAS,OAAO;AAChB,SAAS,cAAc"}

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

@@ -1 +1 @@
-{"version":3,"file":"sidemenuItem.d.ts","names":[],"sources":["../../src/sidemenu/sidemenuItem.tsx"],"mappings":";;;;;;cAgBa,YAAA,EAqGP,YAAA,QAAoB,iBAAA"}
+{"version":3,"file":"sidemenuItem.d.ts","names":[],"sources":["../../src/sidemenu/sidemenuItem.tsx"],"mappings":";;;;;;cAgBa,YAAA,EAuGP,YAAA,QAAoB,iBAAA"}

package/dist/sidemenu/sidemenuItem.js

@@ -56,7 +56,8 @@ const SidemenuItem = vui((props, ref) => {
 		pl,
 		py,
 		size: "md",
-		variant: isDark ? "tertiaryLight" : "tertiaryDark",
+		variant: "tertiary",
+		intent: isDark ? "contrast" : "brand",
 		w: "100%",
 		...styles.item,
 		minH: size === "lg" ? "56px" : "40px",
@@ -97,7 +98,8 @@ const SidemenuItem = vui((props, ref) => {
 				icon: isExpandedVertically ? "falChevronUp" : "falChevronDown",
 				onClick: toggle,
 				size: "sm",
-				variant: isDark ? "tertiaryLight" : "tertiaryDark"
+				variant: "tertiary",
+				intent: isDark ? "contrast" : "brand"
 			})]
 		}), !!children && hasChildrenExpanded && isExpandedVertically && /* @__PURE__ */ jsx(Box, {
 			flexDirection: "column",
@@ -111,5 +113,5 @@ SidemenuItem.displayName = "SidemenuItem";
 
 //#endregion
 export { SidemenuItem as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=sidemenuItem.js.map

package/dist/sidemenu/sidemenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenuItem.js","names":[],"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":";;;;;;;;;;;;;;;AAgBA,MAAa,eAAe,KAAkC,OAAO,QAAQ;CAC3E,MAAM,EACJ,WACA,UACA,MACA,WAAW,MACX,UACA,aAAa,MACb,KAAK,GACL,KAAK,GACL,SACA,YACA,UACA,OACA,GAAG,SACD,iBAAiB,MAAM;CAE3B,MAAM,EAAE,sBAAsB,yBAAyB,QAAQ,MAAM,wBAAwB,WAC3F,gBAAgB,WAAW;AAE7B,iBAAgB;AACd,MAAI,qBAAsB,aAAY;AACtC,MAAI,CAAC,qBAAsB,eAAc;IACxC,CAAC,qBAAqB,CAAC;CAE1B,MAAM,sBAAsB,CAAC,CAAC,YAAY;CAE1C,MAAM,qBACJ,qBAAC;EAAI;EAAQ,IAAI;EAAK,IAAI;EAAG,GAAE;EAAO,YAAW;aAC/C,oBAAC;GAAK,IAAI,aAAa,OAAO,QAAQ;GAAG,MAAM;GAAM,MAAM;IAAY,EACvE,oBAAC;GAAE;GAAY,IAAI;aAChB;IACC;GACA;CAGR,MAAM,UAAU,MAAqC;AACnD,IAAE,gBAAgB;AAClB,IAAE,iBAAiB;AACnB,0BAAwB,CAAC,qBAAqB;;CAGhD,MAAM,eAAe;EACnB,YAAY;EACZ,QAAQ;EACR,cAAc;EACd,YAAY,CAAC,uBAAuB,WAAW,SAAS;EACxD,iBAAiB,WAAY,SAAS,mBAAmB,iBAAkB;EAC3E,IAAI,SAAS,kBAAkB,WAAW,eAAe;EACzD,OAAO,sBAAsB,iBAAiB,SAAS,mBAAmB;EAC1E,GAAG;EACH,gBAAgB;EAChB,eAAe,WAAW;EAC1B;EACA;EACA,MAAM;EACN,SAAS,SAAS,kBAAkB;EACpC,GAAG;EACH,GAAG,OAAO;EACV,MAAM,SAAS,OAAO,SAAS;EAC/B,SAAS,SAAS,iBAAiB;EACnC,GAAG;EACJ;AAED,QACE,qBAAC;EAAI,eAAc;EAAc;EAAK,GAAE;aACrC,CAAC,uBAAuB,WACvB,qBAAC;GAAQ,QAAQ,CAAC,GAAG,iBAAiB,gBAAgB,EAAE;GAAE,WAAU;GAAc,SAAQ;cACxF,oBAAC,QAAQ;IAAQ,IAAI;IAAK,WAAW,GAAG,6BAA6B,UAAU;cAC7E,oBAAC;KAAI,GAAI;KAAc,YAAY,aAAa,SAAS,mBAAmB;eAC1E,oBAAC,iBAAe;MACZ;KACU,EAClB,oBAAC,QAAQ;IAAQ,WAAU;cACzB,oBAAC;KAAI,eAAc;KAAS,gBAAe;KAAQ,GAAE;KAClD;MACG;KACU;IACV,GAEV,qBAAC;GAAO,WAAW,GAAG,qBAAqB,UAAU;GAAE,GAAI;cACzD,oBAAC,iBAAe,EACf,uBACC,oBAAC;IACC,cAAY,uBAAuB,aAAa;IAChD,WAAU;IACV,MAAM,uBAAuB,iBAAiB;IAC9C,SAAS;IACT,MAAK;IACL,SAAS,SAAS,kBAAkB;KACpC;IAEG,EAEV,CAAC,CAAC,YAAY,uBAAuB,wBACpC,oBAAC;GAAI,eAAc;GAAS,gBAAe;GAAQ,GAAE;GAClD;IACG;GAEJ;EAER;AAEF,aAAa,cAAc"}
+{"version":3,"file":"sidemenuItem.js","names":[],"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: 'tertiary',\n    intent: isDark ? 'contrast' : 'brand',\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=\"tertiary\"\n              intent={isDark ? 'contrast' : 'brand'}\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":";;;;;;;;;;;;;;;AAgBA,MAAa,eAAe,KAAkC,OAAO,QAAQ;CAC3E,MAAM,EACJ,WACA,UACA,MACA,WAAW,MACX,UACA,aAAa,MACb,KAAK,GACL,KAAK,GACL,SACA,YACA,UACA,OACA,GAAG,SACD,iBAAiB,MAAM;CAE3B,MAAM,EAAE,sBAAsB,yBAAyB,QAAQ,MAAM,wBAAwB,WAC3F,gBAAgB,WAAW;AAE7B,iBAAgB;AACd,MAAI,qBAAsB,aAAY;AACtC,MAAI,CAAC,qBAAsB,eAAc;IACxC,CAAC,qBAAqB,CAAC;CAE1B,MAAM,sBAAsB,CAAC,CAAC,YAAY;CAE1C,MAAM,qBACJ,qBAAC;EAAI;EAAQ,IAAI;EAAK,IAAI;EAAG,GAAE;EAAO,YAAW;aAC/C,oBAAC;GAAK,IAAI,aAAa,OAAO,QAAQ;GAAG,MAAM;GAAM,MAAM;IAAY,EACvE,oBAAC;GAAE;GAAY,IAAI;aAChB;IACC;GACA;CAGR,MAAM,UAAU,MAAqC;AACnD,IAAE,gBAAgB;AAClB,IAAE,iBAAiB;AACnB,0BAAwB,CAAC,qBAAqB;;CAGhD,MAAM,eAAe;EACnB,YAAY;EACZ,QAAQ;EACR,cAAc;EACd,YAAY,CAAC,uBAAuB,WAAW,SAAS;EACxD,iBAAiB,WAAY,SAAS,mBAAmB,iBAAkB;EAC3E,IAAI,SAAS,kBAAkB,WAAW,eAAe;EACzD,OAAO,sBAAsB,iBAAiB,SAAS,mBAAmB;EAC1E,GAAG;EACH,gBAAgB;EAChB,eAAe,WAAW;EAC1B;EACA;EACA,MAAM;EACN,SAAS;EACT,QAAQ,SAAS,aAAa;EAC9B,GAAG;EACH,GAAG,OAAO;EACV,MAAM,SAAS,OAAO,SAAS;EAC/B,SAAS,SAAS,iBAAiB;EACnC,GAAG;EACJ;AAED,QACE,qBAAC;EAAI,eAAc;EAAc;EAAK,GAAE;aACrC,CAAC,uBAAuB,WACvB,qBAAC;GAAQ,QAAQ,CAAC,GAAG,iBAAiB,gBAAgB,EAAE;GAAE,WAAU;GAAc,SAAQ;cACxF,oBAAC,QAAQ;IAAQ,IAAI;IAAK,WAAW,GAAG,6BAA6B,UAAU;cAC7E,oBAAC;KAAI,GAAI;KAAc,YAAY,aAAa,SAAS,mBAAmB;eAC1E,oBAAC,iBAAe;MACZ;KACU,EAClB,oBAAC,QAAQ;IAAQ,WAAU;cACzB,oBAAC;KAAI,eAAc;KAAS,gBAAe;KAAQ,GAAE;KAClD;MACG;KACU;IACV,GAEV,qBAAC;GAAO,WAAW,GAAG,qBAAqB,UAAU;GAAE,GAAI;cACzD,oBAAC,iBAAe,EACf,uBACC,oBAAC;IACC,cAAY,uBAAuB,aAAa;IAChD,WAAU;IACV,MAAM,uBAAuB,iBAAiB;IAC9C,SAAS;IACT,MAAK;IACL,SAAQ;IACR,QAAQ,SAAS,aAAa;KAC9B;IAEG,EAEV,CAAC,CAAC,YAAY,uBAAuB,wBACpC,oBAAC;GAAI,eAAc;GAAS,gBAAe;GAAQ,GAAE;GAClD;IACG;GAEJ;EAER;AAEF,aAAa,cAAc"}

package/dist/sidemenu/sidemenuTop.js

@@ -31,5 +31,5 @@ SidemenuTop.displayName = "SidemenuTop";
 
 //#endregion
 export { SidemenuTop as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=sidemenuTop.js.map

package/dist/sidemenu/theme.js

@@ -41,5 +41,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=theme.js.map

package/dist/sidemenu/useSidemenuItem.js

@@ -22,5 +22,5 @@ const useSidemenuItem = (isExpanded) => {
 
 //#endregion
 export { useSidemenuItem as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=useSidemenuItem.js.map

package/dist/sidemenuV2/SidemenuItemContent.js

@@ -61,5 +61,5 @@ SidemenuItemContent.displayName = "SidemenuItemContent";
 
 //#endregion
 export { SidemenuItemContent as default };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=SidemenuItemContent.js.map

package/dist/sidemenuV2/consts.js

@@ -4,5 +4,5 @@ const expandedWidth = 240;
 
 //#endregion
 export { collapsedWidth, expandedWidth };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=consts.js.map

package/dist/sidemenuV2/context.js

@@ -106,5 +106,5 @@ const SidemenuStateProvider = ({ children, isExpandedInitial = true, onExpandedC
 
 //#endregion
 export { SidemenuStateProvider, useSidemenuContext };
-globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.3"
 //# sourceMappingURL=context.js.map