@veracity/vui 4.1.0 → 4.2.0-alpha.manual.2603301258

package/dist/sidemenuV2/context.js

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

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

@@ -1 +1 @@
-{"version":3,"file":"sidemenuItemV2.d.ts","names":[],"sources":["../../src/sidemenuV2/sidemenuItemV2.tsx"],"mappings":";;;;;;;cAmFa,cAAA,EAkOP,YAAA,QAAoB,mBAAA"}
+{"version":3,"file":"sidemenuItemV2.d.ts","names":[],"sources":["../../src/sidemenuV2/sidemenuItemV2.tsx"],"mappings":";;;;;;;cAmFa,cAAA,EAoOP,YAAA,QAAoB,mBAAA"}

package/dist/sidemenuV2/sidemenuItemV2.js

@@ -103,10 +103,7 @@ const SidemenuItemV2 = vui((props, ref) => {
 		size,
 		level
 	]);
-	const themeValues = useMemo(() => ({
-		activeColor: isDark ? "digiGreen.main" : "seaBlue.main",
-		buttonVariant: isDark ? "menuDark" : "menuLight"
-	}), [isDark]);
+	const themeValues = useMemo(() => ({ activeColor: isDark ? "digiGreen.main" : "seaBlue.main" }), [isDark]);
 	const handleClick = useCallback((event) => {
 		if (!computedStates.isDisabled) {
 			const targetTag = event.target;
@@ -122,12 +119,13 @@ const SidemenuItemV2 = vui((props, ref) => {
 	}, [onClick, computedStates.isDisabled]);
 	const buttonStyles = useMemo(() => ({
 		...styles && "item" in styles && styles.item ? styles.item : {},
+		...styles && "button" in styles && styles.button ? styles.button : {},
 		borderLeftColor: isExactlyActive ? themeValues.activeColor : "transparent",
 		transitionProperty: "background-color, border-color, color, transform, opacity",
 		size: computedStates.buttonSize,
 		h: computedStates.buttonSize === "lg" ? 40 : 36,
 		iconSize: computedStates.iconSize,
-		variant: themeValues.buttonVariant,
+		variant: "tertiaryBrand",
 		onClick: handleClick,
 		disabled: computedStates.isDisabled,
 		role: "button",
@@ -150,7 +148,7 @@ const SidemenuItemV2 = vui((props, ref) => {
 		return {
 			"aria-label": ariaLabel,
 			className: "vui-sidemenu-item-expand",
-			variant: themeValues.buttonVariant,
+			variant: "tertiaryBrand",
 			icon: chevronIcon,
 			size: "sm",
 			pl: "4px",
@@ -162,7 +160,7 @@ const SidemenuItemV2 = vui((props, ref) => {
 			hoverBg: "transparent",
 			activeBg: "transparent"
 		};
-	}, [isSubmenuOpen, themeValues.buttonVariant]);
+	}, [isSubmenuOpen]);
 	const renderPopover = () => /* @__PURE__ */ jsx(SidemenuPopover, {
 		isDark,
 		className,
@@ -236,5 +234,5 @@ SidemenuItemV2.displayName = "SidemenuItemV2";
 
 //#endregion
 export { SidemenuItemV2 as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=sidemenuItemV2.js.map

package/dist/sidemenuV2/sidemenuItemV2.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidemenuItemV2.js","names":["colors"],"sources":["../../src/sidemenuV2/sidemenuItemV2.tsx"],"sourcesContent":["import type { MouseEvent } from 'react'\nimport { useEffect, useMemo, useCallback } from 'react'\n\nimport Box from '../box'\nimport Button from '../button'\nimport type { VuiComponent } from '../core'\nimport { omitThemingProps, styled, th, vui } from '../core'\nimport Popover from '../popover'\nimport { colors } from '../theme'\nimport Tooltip from '../tooltip'\nimport { cs, generateMenuItemId } from '../utils'\nimport { collapsedWidth, expandedWidth } from './consts'\nimport SidemenuItemContent from './SidemenuItemContent'\nimport type { SidemenuItemV2Props } from './sidemenuV2.types'\nimport useSidemenuItem from './useSidemenuItem'\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 .vui-sidemenu-item-content > .vui-box > .vui-button.vui-button {\n    background: ${p => th.color(p.hoverColor)};\n  }\n`\n\n// SidemenuPopover component extracted from inline Popover logic\nconst SidemenuPopover = ({\n  isDark,\n  className,\n  buttonStyles,\n  isExactlyActive,\n  icon,\n  title,\n  isMenuExpanded,\n  children,\n}: {\n  isDark: boolean\n  className?: string\n  buttonStyles: any\n  isExactlyActive: boolean\n  icon?: any\n  title: string\n  isMenuExpanded: boolean\n  children: React.ReactNode\n}) => (\n  <Popover offset={[0, collapsedWidth - expandedWidth - 2]} placement=\"right-start\" trigger=\"mouseenter\">\n    {({ isOpen }: { isOpen: boolean }) => (\n      <PopoverHovered hoverColor={isDark ? colors.seaBlue.main : colors.skyBlue.selected}>\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            className={cs('focusAsBorder')}\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              className={cs('focusAsBorder')}\n            >\n              <SidemenuItemContent title={title} isInPopover={true} />\n            </Button>\n            {children}\n          </Box>\n        </Popover.Content>\n      </PopoverHovered>\n    )}\n  </Popover>\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  // Helper: Render collapsed popover\n  const renderPopover = () => (\n    <SidemenuPopover\n      isDark={isDark}\n      className={className}\n      buttonStyles={buttonStyles}\n      isExactlyActive={isExactlyActive}\n      icon={icon}\n      title={title}\n      isMenuExpanded={isMenuExpanded}\n    >\n      {children ? children : undefined}\n    </SidemenuPopover>\n  )\n\n  // Helper: Render expanded button\n  const renderButton = () => {\n    if (level === 0 && !isMenuExpanded) {\n      return (\n        <Tooltip text={title} placement=\"right\" offset={[0, -200]}>\n          <Button\n            className={cs('vui-sidemenu-item focusAsBorder', isExactlyActive && 'vui-sidemenu-item--active', className)}\n            {...buttonStyles}\n            isActive={isExactlyActive}\n          >\n            <SidemenuItemContent icon={icon} iconSize={buttonStyles.iconSize} />\n            {isMenuExpanded && computedStates.shouldShowExpandButton && <Button {...expandButtonProps} />}{' '}\n          </Button>\n        </Tooltip>\n      )\n    }\n\n    return (\n      <Button\n        className={cs('vui-sidemenu-item focusAsBorder', isExactlyActive && 'vui-sidemenu-item--active', className)}\n        {...buttonStyles}\n        isActive={isExactlyActive}\n        title={!isMenuExpanded ? title : undefined}\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        {isMenuExpanded && computedStates.shouldShowExpandButton && <Button {...expandButtonProps} />}{' '}\n        {/* Expand/Collapse button */}\n      </Button>\n    )\n    // No leftover return, handled above\n  }\n\n  // Helper: Render expanded children\n  const renderChildren = () => (\n    <Box flexDirection=\"column\" justifyContent=\"start\" w=\"100%\">\n      {children}\n    </Box>\n  )\n\n  const shouldShowPopover = Boolean(!isMenuExpanded && level === 0 && !!children)\n  const shouldShowChildren = computedStates.hasChildrenExpanded\n\n  return (\n    <Box flexDirection=\"column\" ref={ref} w=\"100%\" mt={onBottom ? 'auto' : 0} id={computedItemId}>\n      {shouldShowPopover && renderPopover()}\n      {!shouldShowPopover && renderButton()}\n      {shouldShowChildren && renderChildren()}\n    </Box>\n  )\n}) as VuiComponent<'div', SidemenuItemV2Props>\n\nSidemenuItemV2.displayName = 'SidemenuItemV2'\n\nexport default SidemenuItemV2\n"],"mappings":"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"}
+{"version":3,"file":"sidemenuItemV2.js","names":["colors"],"sources":["../../src/sidemenuV2/sidemenuItemV2.tsx"],"sourcesContent":["import type { MouseEvent } from 'react'\nimport { useEffect, useMemo, useCallback } from 'react'\n\nimport Box from '../box'\nimport Button from '../button'\nimport type { VuiComponent } from '../core'\nimport { omitThemingProps, styled, th, vui } from '../core'\nimport Popover from '../popover'\nimport { colors } from '../theme'\nimport Tooltip from '../tooltip'\nimport { cs, generateMenuItemId } from '../utils'\nimport { collapsedWidth, expandedWidth } from './consts'\nimport SidemenuItemContent from './SidemenuItemContent'\nimport type { SidemenuItemV2Props } from './sidemenuV2.types'\nimport useSidemenuItem from './useSidemenuItem'\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 .vui-sidemenu-item-content > .vui-box > .vui-button.vui-button {\n    background: ${p => th.color(p.hoverColor)};\n  }\n`\n\n// SidemenuPopover component extracted from inline Popover logic\nconst SidemenuPopover = ({\n  isDark,\n  className,\n  buttonStyles,\n  isExactlyActive,\n  icon,\n  title,\n  isMenuExpanded,\n  children,\n}: {\n  isDark: boolean\n  className?: string\n  buttonStyles: any\n  isExactlyActive: boolean\n  icon?: any\n  title: string\n  isMenuExpanded: boolean\n  children: React.ReactNode\n}) => (\n  <Popover offset={[0, collapsedWidth - expandedWidth - 2]} placement=\"right-start\" trigger=\"mouseenter\">\n    {({ isOpen }: { isOpen: boolean }) => (\n      <PopoverHovered hoverColor={isDark ? colors.seaBlue.main : colors.skyBlue.selected}>\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            className={cs('focusAsBorder')}\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              className={cs('focusAsBorder')}\n            >\n              <SidemenuItemContent title={title} isInPopover={true} />\n            </Button>\n            {children}\n          </Box>\n        </Popover.Content>\n      </PopoverHovered>\n    )}\n  </Popover>\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    }),\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      // Apply button theme styles from SideMenuV2 theme (replaces removed menuLight/menuDark variants)\n      ...(styles && 'button' in styles && styles.button ? styles.button : {}),\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: 'tertiaryBrand', // Use base variant, theme overrides applied above\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: 'tertiaryBrand', // Use base variant, styling from parent\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])\n\n  // Helper: Render collapsed popover\n  const renderPopover = () => (\n    <SidemenuPopover\n      isDark={isDark}\n      className={className}\n      buttonStyles={buttonStyles}\n      isExactlyActive={isExactlyActive}\n      icon={icon}\n      title={title}\n      isMenuExpanded={isMenuExpanded}\n    >\n      {children ? children : undefined}\n    </SidemenuPopover>\n  )\n\n  // Helper: Render expanded button\n  const renderButton = () => {\n    if (level === 0 && !isMenuExpanded) {\n      return (\n        <Tooltip text={title} placement=\"right\" offset={[0, -200]}>\n          <Button\n            className={cs('vui-sidemenu-item focusAsBorder', isExactlyActive && 'vui-sidemenu-item--active', className)}\n            {...buttonStyles}\n            isActive={isExactlyActive}\n          >\n            <SidemenuItemContent icon={icon} iconSize={buttonStyles.iconSize} />\n            {isMenuExpanded && computedStates.shouldShowExpandButton && <Button {...expandButtonProps} />}{' '}\n          </Button>\n        </Tooltip>\n      )\n    }\n\n    return (\n      <Button\n        className={cs('vui-sidemenu-item focusAsBorder', isExactlyActive && 'vui-sidemenu-item--active', className)}\n        {...buttonStyles}\n        isActive={isExactlyActive}\n        title={!isMenuExpanded ? title : undefined}\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        {isMenuExpanded && computedStates.shouldShowExpandButton && <Button {...expandButtonProps} />}{' '}\n        {/* Expand/Collapse button */}\n      </Button>\n    )\n    // No leftover return, handled above\n  }\n\n  // Helper: Render expanded children\n  const renderChildren = () => (\n    <Box flexDirection=\"column\" justifyContent=\"start\" w=\"100%\">\n      {children}\n    </Box>\n  )\n\n  const shouldShowPopover = Boolean(!isMenuExpanded && level === 0 && !!children)\n  const shouldShowChildren = computedStates.hasChildrenExpanded\n\n  return (\n    <Box flexDirection=\"column\" ref={ref} w=\"100%\" mt={onBottom ? 'auto' : 0} id={computedItemId}>\n      {shouldShowPopover && renderPopover()}\n      {!shouldShowPopover && renderButton()}\n      {shouldShowChildren && renderChildren()}\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/sidemenuTopV2.js

@@ -31,5 +31,5 @@ SidemenuTopV2.displayName = "SidemenuTopV2";
 
 //#endregion
 export { SidemenuTopV2 as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=sidemenuTopV2.js.map

package/dist/sidemenuV2/sidemenuV2.js

@@ -232,5 +232,5 @@ SidemenuV2.displayName = "SidemenuV2";
 
 //#endregion
 export { SidemenuV2 as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=sidemenuV2.js.map

package/dist/sidemenuV2/sidemenuV2.types.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
 import { IconProp } from "../icon/icon.types.js";

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

@@ -1 +1 @@
-{"version":3,"file":"sidemenuV2.types.d.ts","names":[],"sources":["../../src/sidemenuV2/sidemenuV2.types.ts"],"mappings":"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"}
+{"version":3,"file":"sidemenuV2.types.d.ts","names":[],"sources":["../../src/sidemenuV2/sidemenuV2.types.ts"],"mappings":"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"}

package/dist/sidemenuV2/theme.js

@@ -57,7 +57,8 @@ const parts = [
 	"bottom",
 	"toggleButton",
 	"item",
-	"sidemenuTop"
+	"sidemenuTop",
+	"button"
 ];
 const sizes = {
 	sm: { toggleButton: {
@@ -77,10 +78,25 @@ const variants = {
 	light: {
 		container: { bg: "white" },
 		toggleButton: {
-			variant: "tertiaryDark",
+			variant: "tertiaryBrand",
 			hoverBg: "sandstone.95"
 		},
-		item: { color: "darkBlue.main" }
+		item: { color: "darkBlue.main" },
+		button: {
+			bg: "#ffffff",
+			hoverBg: "#D3EEF8",
+			activeBg: "#E9F7FC",
+			disabledBg: "#F8F7F7",
+			borderColor: "transparent",
+			hoverBorderColor: "#003591",
+			activeBorderColor: "#003591",
+			color: "#1A1A19",
+			hoverColor: "#1A1A19",
+			activeColor: "#003591",
+			disabledColor: "#908D89",
+			disabledBorderColor: "transparent",
+			disabledOpacity: "1"
+		}
 	},
 	dark: {
 		container: {
@@ -94,7 +110,22 @@ const variants = {
 			bg: "darkBlue.main"
 		},
 		toggleButton: { variant: "tertiaryLight" },
-		item: { color: "white" }
+		item: { color: "white" },
+		button: {
+			bg: "#0F204B",
+			hoverBg: "#003591",
+			activeBg: "#0041B2",
+			disabledBg: "#0F204B",
+			borderColor: "transparent",
+			hoverBorderColor: "#91FFB4",
+			activeBorderColor: "#91FFB4",
+			color: "#FFFFFF",
+			hoverColor: "#FFFFFF",
+			activeColor: "#91FFBA",
+			disabledColor: "#FFFFFF",
+			disabledBorderColor: "transparent",
+			disabledOpacity: "1"
+		}
 	}
 };
 var theme_default = {
@@ -107,5 +138,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=theme.js.map

package/dist/sidemenuV2/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/sidemenuV2/theme.ts"],"sourcesContent":["const baseStyle = {\n  container: {\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'hidden',\n    transition: 'width 0.2s ease-in-out',\n  },\n  content: {\n    flex: 1,\n    overflowY: 'auto',\n    overflowX: 'hidden',\n  },\n  bottom: {\n    flexShrink: 0,\n    borderTop: `1px solid transparent`,\n    display: 'flex',\n    alignItems: 'center',\n  },\n  item: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'flex-start',\n    flexDirection: 'row',\n    w: '100%',\n    border: 'none',\n    cursor: 'pointer',\n    transition: 'all 0.2s cubic-bezier(0.4, 0, 0.2, 1)',\n    textDecoration: 'none',\n    outline: 'none',\n    px: 0,\n    borderLeft: '3px solid transparent',\n  },\n  sidemenuTop: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    padding: '12px 16px',\n    minHeight: '64px',\n  },\n  // Add toggle button configuration\n  toggleButton: {\n    baseHeight: 52,\n    basePadding: 2,\n    expandedPaddingMultiplier: 5,\n    collapsedWidth: '100%',\n    expandedWidth: '52px',\n    transition: 'padding 0.2s ease-in-out, width 0.2s ease-in-out',\n  },\n}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'light',\n}\n\nconst parts = ['container', 'content', 'bottom', 'toggleButton', 'item', 'sidemenuTop']\n\nconst sizes = {\n  sm: {\n    toggleButton: {\n      baseHeight: 44,\n      basePadding: 1.5,\n    },\n  },\n  md: {\n    toggleButton: {\n      baseHeight: 52,\n      basePadding: 2,\n    },\n  },\n  lg: {\n    toggleButton: {\n      baseHeight: 60,\n      basePadding: 2.5,\n    },\n  },\n}\n\nconst variants = {\n  light: {\n    container: {\n      bg: 'white',\n    },\n    toggleButton: {\n      variant: 'tertiaryDark',\n      hoverBg: 'sandstone.95',\n    },\n    item: {\n      color: 'darkBlue.main',\n    },\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n      color: 'white',\n      boxShadow: '2px 0 4px rgba(0, 0, 0, 0.3)',\n    },\n    bottom: {\n      borderTopColor: 'rgba(255, 255, 255, 0.1)',\n    },\n    sidemenuTop: {\n      borderBottom: '1px solid rgba(255, 255, 255, 0.1)',\n      bg: 'darkBlue.main',\n    },\n    toggleButton: {\n      variant: 'tertiaryLight',\n    },\n    item: {\n      color: 'white',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":";AAAA,MAAM,YAAY;CAChB,WAAW;EACT,SAAS;EACT,eAAe;EACf,UAAU;EACV,YAAY;EACb;CACD,SAAS;EACP,MAAM;EACN,WAAW;EACX,WAAW;EACZ;CACD,QAAQ;EACN,YAAY;EACZ,WAAW;EACX,SAAS;EACT,YAAY;EACb;CACD,MAAM;EACJ,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,eAAe;EACf,GAAG;EACH,QAAQ;EACR,QAAQ;EACR,YAAY;EACZ,gBAAgB;EAChB,SAAS;EACT,IAAI;EACJ,YAAY;EACb;CACD,aAAa;EACX,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,SAAS;EACT,WAAW;EACZ;CAED,cAAc;EACZ,YAAY;EACZ,aAAa;EACb,2BAA2B;EAC3B,gBAAgB;EAChB,eAAe;EACf,YAAY;EACb;CACF;AAED,MAAM,eAAe;CACnB,MAAM;CACN,SAAS;CACV;AAED,MAAM,QAAQ;CAAC;CAAa;CAAW;CAAU;CAAgB;CAAQ;CAAc;AAEvF,MAAM,QAAQ;CACZ,IAAI,EACF,cAAc;EACZ,YAAY;EACZ,aAAa;EACd,EACF;CACD,IAAI,EACF,cAAc;EACZ,YAAY;EACZ,aAAa;EACd,EACF;CACD,IAAI,EACF,cAAc;EACZ,YAAY;EACZ,aAAa;EACd,EACF;CACF;AAED,MAAM,WAAW;CACf,OAAO;EACL,WAAW,EACT,IAAI,SACL;EACD,cAAc;GACZ,SAAS;GACT,SAAS;GACV;EACD,MAAM,EACJ,OAAO,iBACR;EACF;CACD,MAAM;EACJ,WAAW;GACT,IAAI;GACJ,OAAO;GACP,WAAW;GACZ;EACD,QAAQ,EACN,gBAAgB,4BACjB;EACD,aAAa;GACX,cAAc;GACd,IAAI;GACL;EACD,cAAc,EACZ,SAAS,iBACV;EACD,MAAM,EACJ,OAAO,SACR;EACF;CACF;AAED,oBAAe;CACb;CACA;CACA;CACA;CACA;CACD"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/sidemenuV2/theme.ts"],"sourcesContent":["const baseStyle = {\n  container: {\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'hidden',\n    transition: 'width 0.2s ease-in-out',\n  },\n  content: {\n    flex: 1,\n    overflowY: 'auto',\n    overflowX: 'hidden',\n  },\n  bottom: {\n    flexShrink: 0,\n    borderTop: `1px solid transparent`,\n    display: 'flex',\n    alignItems: 'center',\n  },\n  item: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'flex-start',\n    flexDirection: 'row',\n    w: '100%',\n    border: 'none',\n    cursor: 'pointer',\n    transition: 'all 0.2s cubic-bezier(0.4, 0, 0.2, 1)',\n    textDecoration: 'none',\n    outline: 'none',\n    px: 0,\n    borderLeft: '3px solid transparent',\n  },\n  sidemenuTop: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    padding: '12px 16px',\n    minHeight: '64px',\n  },\n  // Add toggle button configuration\n  toggleButton: {\n    baseHeight: 52,\n    basePadding: 2,\n    expandedPaddingMultiplier: 5,\n    collapsedWidth: '100%',\n    expandedWidth: '52px',\n    transition: 'padding 0.2s ease-in-out, width 0.2s ease-in-out',\n  },\n}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'light',\n}\n\nconst parts = ['container', 'content', 'bottom', 'toggleButton', 'item', 'sidemenuTop', 'button']\n\nconst sizes = {\n  sm: {\n    toggleButton: {\n      baseHeight: 44,\n      basePadding: 1.5,\n    },\n  },\n  md: {\n    toggleButton: {\n      baseHeight: 52,\n      basePadding: 2,\n    },\n  },\n  lg: {\n    toggleButton: {\n      baseHeight: 60,\n      basePadding: 2.5,\n    },\n  },\n}\n\nconst variants = {\n  light: {\n    container: {\n      bg: 'white',\n    },\n    toggleButton: {\n      variant: 'tertiaryBrand',\n      hoverBg: 'sandstone.95',\n    },\n    item: {\n      color: 'darkBlue.main',\n    },\n    button: {\n      bg: '#ffffff',\n      hoverBg: '#D3EEF8',\n      activeBg: '#E9F7FC',\n      disabledBg: '#F8F7F7',\n      borderColor: 'transparent',\n      hoverBorderColor: '#003591',\n      activeBorderColor: '#003591',\n      color: '#1A1A19',\n      hoverColor: '#1A1A19',\n      activeColor: '#003591',\n      disabledColor: '#908D89',\n      disabledBorderColor: 'transparent',\n      disabledOpacity: '1',\n    },\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n      color: 'white',\n      boxShadow: '2px 0 4px rgba(0, 0, 0, 0.3)',\n    },\n    bottom: {\n      borderTopColor: 'rgba(255, 255, 255, 0.1)',\n    },\n    sidemenuTop: {\n      borderBottom: '1px solid rgba(255, 255, 255, 0.1)',\n      bg: 'darkBlue.main',\n    },\n    toggleButton: {\n      variant: 'tertiaryLight',\n    },\n    item: {\n      color: 'white',\n    },\n    button: {\n      bg: '#0F204B',\n      hoverBg: '#003591',\n      activeBg: '#0041B2',\n      disabledBg: '#0F204B',\n      borderColor: 'transparent',\n      hoverBorderColor: '#91FFB4',\n      activeBorderColor: '#91FFB4',\n      color: '#FFFFFF',\n      hoverColor: '#FFFFFF',\n      activeColor: '#91FFBA',\n      disabledColor: '#FFFFFF',\n      disabledBorderColor: 'transparent',\n      disabledOpacity: '1',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":";AAAA,MAAM,YAAY;CAChB,WAAW;EACT,SAAS;EACT,eAAe;EACf,UAAU;EACV,YAAY;EACb;CACD,SAAS;EACP,MAAM;EACN,WAAW;EACX,WAAW;EACZ;CACD,QAAQ;EACN,YAAY;EACZ,WAAW;EACX,SAAS;EACT,YAAY;EACb;CACD,MAAM;EACJ,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,eAAe;EACf,GAAG;EACH,QAAQ;EACR,QAAQ;EACR,YAAY;EACZ,gBAAgB;EAChB,SAAS;EACT,IAAI;EACJ,YAAY;EACb;CACD,aAAa;EACX,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,SAAS;EACT,WAAW;EACZ;CAED,cAAc;EACZ,YAAY;EACZ,aAAa;EACb,2BAA2B;EAC3B,gBAAgB;EAChB,eAAe;EACf,YAAY;EACb;CACF;AAED,MAAM,eAAe;CACnB,MAAM;CACN,SAAS;CACV;AAED,MAAM,QAAQ;CAAC;CAAa;CAAW;CAAU;CAAgB;CAAQ;CAAe;CAAS;AAEjG,MAAM,QAAQ;CACZ,IAAI,EACF,cAAc;EACZ,YAAY;EACZ,aAAa;EACd,EACF;CACD,IAAI,EACF,cAAc;EACZ,YAAY;EACZ,aAAa;EACd,EACF;CACD,IAAI,EACF,cAAc;EACZ,YAAY;EACZ,aAAa;EACd,EACF;CACF;AAED,MAAM,WAAW;CACf,OAAO;EACL,WAAW,EACT,IAAI,SACL;EACD,cAAc;GACZ,SAAS;GACT,SAAS;GACV;EACD,MAAM,EACJ,OAAO,iBACR;EACD,QAAQ;GACN,IAAI;GACJ,SAAS;GACT,UAAU;GACV,YAAY;GACZ,aAAa;GACb,kBAAkB;GAClB,mBAAmB;GACnB,OAAO;GACP,YAAY;GACZ,aAAa;GACb,eAAe;GACf,qBAAqB;GACrB,iBAAiB;GAClB;EACF;CACD,MAAM;EACJ,WAAW;GACT,IAAI;GACJ,OAAO;GACP,WAAW;GACZ;EACD,QAAQ,EACN,gBAAgB,4BACjB;EACD,aAAa;GACX,cAAc;GACd,IAAI;GACL;EACD,cAAc,EACZ,SAAS,iBACV;EACD,MAAM,EACJ,OAAO,SACR;EACD,QAAQ;GACN,IAAI;GACJ,SAAS;GACT,UAAU;GACV,YAAY;GACZ,aAAa;GACb,kBAAkB;GAClB,mBAAmB;GACnB,OAAO;GACP,YAAY;GACZ,aAAa;GACb,eAAe;GACf,qBAAqB;GACrB,iBAAiB;GAClB;EACF;CACF;AAED,oBAAe;CACb;CACA;CACA;CACA;CACA;CACD"}

package/dist/sidemenuV2/useSidemenuItem.js

@@ -34,5 +34,5 @@ const useSidemenuItem = (itemId) => {
 
 //#endregion
 export { useSidemenuItem as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=useSidemenuItem.js.map

package/dist/skeleton/skeleton.js

@@ -29,5 +29,5 @@ Skeleton.displayName = "Skeleton";
 
 //#endregion
 export { SkeletonBase, Skeleton as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=skeleton.js.map

package/dist/skeleton/skeleton.types.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
 

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

@@ -1 +1 @@
-{"version":3,"file":"skeleton.types.d.ts","names":[],"sources":["../../src/skeleton/skeleton.types.ts"],"mappings":";;;;;KAGY,aAAA,GAAgB,WAAA,GAC1B,YAAA;kDAEE,QAAA,UAHQ;EAKR,WAAA;EAEA,MAAA;AAAA"}
+{"version":3,"file":"skeleton.types.d.ts","names":[],"sources":["../../src/skeleton/skeleton.types.ts"],"mappings":";;;;;;KAGY,aAAA,GAAgB,WAAA,GAC1B,YAAA;kDAEE,QAAA;EAEA,WAAA,oBALqB;EAOrB,MAAA;AAAA"}

package/dist/skeleton/theme.js

@@ -26,5 +26,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=theme.js.map

package/dist/spinner/consts.js

@@ -13,5 +13,5 @@ const spinnerSpeedMapping = {
 
 //#endregion
 export { spinnerPositionMapping, spinnerSpeedMapping };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=consts.js.map

package/dist/spinner/spinner.js

@@ -56,5 +56,5 @@ Spinner.displayName = "Spinner";
 
 //#endregion
 export { SpinnerCircle, Spinner as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=spinner.js.map

package/dist/spinner/spinner.types.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { BoxProps } from "../box/box.types.js";
 import "../box/index.js";
 import { ReactNode } from "react";

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

@@ -1 +1 @@
-{"version":3,"file":"spinner.types.d.ts","names":[],"sources":["../../src/spinner/spinner.types.ts"],"mappings":";;;;;;KAKY,YAAA,GAAe,IAAA,CAAK,QAAA,wBAC9B,IAAA,CAAK,YAAA;kDAEH,QAAA,UAHQ;EAKR,WAAA;EAEA,UAAA,2BAPuB;EASvB,KAAA,+BARF;EAUE,IAAA,GAAO,YAAA,8BAEA;EAAP,IAAA,GAAO,SAAA,EAAS;EAEhB,YAAA,wCAf4B;EAiB5B,SAAA;AAAA"}
+{"version":3,"file":"spinner.types.d.ts","names":[],"sources":["../../src/spinner/spinner.types.ts"],"mappings":";;;;;;;KAKY,YAAA,GAAe,IAAA,CAAK,QAAA,wBAC9B,IAAA,CAAK,YAAA;kDAEH,QAAA;EAEA,WAAA,iCALoB;EAOpB,UAAA,2BAP4B;EAS5B,KAAA,+BARG;EAUH,IAAA,GAAO,YAAA,8BAAA;EAEP,IAAA,GAAO,SAAA,EAAS;EAEhB,YAAA,wCAfuB;EAiBvB,SAAA;AAAA"}

package/dist/spinner/theme.js

@@ -78,5 +78,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=theme.js.map

package/dist/stepIndicator/stepIndicator.js

@@ -69,5 +69,5 @@ StepIndicator.displayName = "StepIndicator";
 
 //#endregion
 export { StepIndicator as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepIndicator.js.map

package/dist/stepIndicator/stepIndicatorTypes.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
 import { IconProp } from "../icon/icon.types.js";

package/dist/stepIndicator/stepIndicatorTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepIndicatorTypes.d.ts","names":[],"sources":["../../src/stepIndicator/stepIndicatorTypes.ts"],"mappings":";;;;;;;KAIY,kBAAA,GAAqB,WAAA,GAC/B,YAAA;EACE,IAAA,GAAO,QAAA;EACP,SAAA;EACA,MAAA;AAAA;AAAA,KAGQ,oBAAA"}
+{"version":3,"file":"stepIndicatorTypes.d.ts","names":[],"sources":["../../src/stepIndicator/stepIndicatorTypes.ts"],"mappings":";;;;;;;;KAIY,kBAAA,GAAqB,WAAA,GAC/B,YAAA;EACE,IAAA,GAAO,QAAA;EACP,SAAA;EACA,MAAA;AAAA;AAAA,KAGQ,oBAAA"}

package/dist/stepIndicator/theme.js

@@ -64,5 +64,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=theme.js.map

package/dist/stepperHorizontal/consts.js

@@ -21,5 +21,5 @@ const tailClassNameRight = tailClassName + "Right";
 
 //#endregion
 export { boldTitles, stepClassName, tailClassName, tailClassNameLeft, tailClassNameRight, titleColor, variantColor };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=consts.js.map

package/dist/stepperHorizontal/context.js

@@ -5,5 +5,5 @@ const [StepperHorizontalProvider, useStepperHorizontalContext] = createContext({
 
 //#endregion
 export { StepperHorizontalProvider, useStepperHorizontalContext };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=context.js.map

package/dist/stepperHorizontal/stepHorizontal.js

@@ -68,5 +68,5 @@ StepHorizontal.displayName = "StepHorizontal";
 
 //#endregion
 export { StepHorizontalBase, StepHorizontal as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepHorizontal.js.map

package/dist/stepperHorizontal/stepHorizontalTail.js

@@ -25,5 +25,5 @@ StepHorizontalTail.displayName = "StepHorizontalTail";
 
 //#endregion
 export { StepHorizontalTail as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepHorizontalTail.js.map

package/dist/stepperHorizontal/stepHorizontalTitle.js

@@ -27,5 +27,5 @@ StepHorizontalTitle.displayName = "StepHorizontalTitle";
 
 //#endregion
 export { StepHorizontalTitle as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepHorizontalTitle.js.map

package/dist/stepperHorizontal/stepperHorizontal.js

@@ -29,5 +29,5 @@ StepperHorizontal.displayName = "StepperHorizontal";
 
 //#endregion
 export { StepperHorizontal as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepperHorizontal.js.map

package/dist/stepperHorizontal/stepperHorizontalBase.js

@@ -22,5 +22,5 @@ const StepperHorizontalBase = styled.divBox`
 
 //#endregion
 export { StepperHorizontalBase as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepperHorizontalBase.js.map

package/dist/stepperHorizontal/stepperHorizontalTypes.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { ChildrenProp } from "../core/types.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";

package/dist/stepperHorizontal/stepperHorizontalTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepperHorizontalTypes.d.ts","names":[],"sources":["../../src/stepperHorizontal/stepperHorizontalTypes.ts"],"mappings":";;;;;;;;;;;;;KASY,kBAAA;AAAA,KAEA,sBAAA,GAAyB,WAAA,GAAc,YAAA,wBAAoC,YAAA;AAAA,KAE3E,mBAAA,GAAsB,WAAA,GAChC,YAAA;EACE,IAAA,GAAO,QAAA;EACP,MAAA;EACA,IAAA,GAAO,kBAAA;EACP,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,QAAA;EACA,SAAA;EACA,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGF,uBAAA,GAA0B,QAAA;EACpC,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGA,wBAAA,GAA2B,QAAA;EACrC,IAAA,GAAO,kBAAA;EACP,OAAA,GAAU,oBAAA;AAAA"}
+{"version":3,"file":"stepperHorizontalTypes.d.ts","names":[],"sources":["../../src/stepperHorizontal/stepperHorizontalTypes.ts"],"mappings":";;;;;;;;;;;;;;KASY,kBAAA;AAAA,KAEA,sBAAA,GAAyB,WAAA,GAAc,YAAA,wBAAoC,YAAA;AAAA,KAE3E,mBAAA,GAAsB,WAAA,GAChC,YAAA;EACE,IAAA,GAAO,QAAA;EACP,MAAA;EACA,IAAA,GAAO,kBAAA;EACP,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,QAAA;EACA,SAAA;EACA,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGF,uBAAA,GAA0B,QAAA;EACpC,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGA,wBAAA,GAA2B,QAAA;EACrC,IAAA,GAAO,kBAAA;EACP,OAAA,GAAU,oBAAA;AAAA"}

package/dist/stepperHorizontal/theme.js

@@ -17,5 +17,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=theme.js.map

package/dist/stepperVertical/consts.js

@@ -19,5 +19,5 @@ const tailClassName = stepClassName + "Tail";
 
 //#endregion
 export { boldTitles, stepClassName, tailClassName, titleColor, variantColor };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=consts.js.map

package/dist/stepperVertical/context.js

@@ -5,5 +5,5 @@ const [StepperVerticalProvider, useStepperVerticalContext] = createContext({ isO
 
 //#endregion
 export { StepperVerticalProvider, useStepperVerticalContext };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=context.js.map

package/dist/stepperVertical/stepVertical.js

@@ -61,5 +61,5 @@ StepVertical.displayName = "StepVertical";
 
 //#endregion
 export { StepVerticalBase, StepVertical as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepVertical.js.map

package/dist/stepperVertical/stepVerticalTail.js

@@ -25,5 +25,5 @@ StepVerticalTail.displayName = "StepVerticalTail";
 
 //#endregion
 export { StepVerticalTail as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepVerticalTail.js.map

package/dist/stepperVertical/stepVerticalTitle.js

@@ -25,5 +25,5 @@ StepVerticalTitle.displayName = "StepVerticalTitle";
 
 //#endregion
 export { StepVerticalTitle as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepVerticalTitle.js.map

package/dist/stepperVertical/stepperVertical.js

@@ -29,5 +29,5 @@ StepperVertical.displayName = "StepperVertical";
 
 //#endregion
 export { StepperVertical as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepperVertical.js.map

package/dist/stepperVertical/stepperVerticalBase.js

@@ -12,5 +12,5 @@ const StepperVerticalBase = styled.divBox`
 
 //#endregion
 export { StepperVerticalBase as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=stepperVerticalBase.js.map

package/dist/stepperVertical/stepperVerticalTypes.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { ChildrenProp } from "../core/types.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";

package/dist/stepperVertical/stepperVerticalTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepperVerticalTypes.d.ts","names":[],"sources":["../../src/stepperVertical/stepperVerticalTypes.ts"],"mappings":";;;;;;;;;;;;;KASY,gBAAA;AAAA,KAEA,oBAAA,GAAuB,WAAA,GAAc,YAAA,sBAAkC,YAAA;AAAA,KAEvE,iBAAA,GAAoB,WAAA,GAC9B,YAAA;EACE,IAAA,GAAO,QAAA;EACP,MAAA;EACA,IAAA,GAAO,gBAAA;EACP,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,QAAA;EACA,SAAA;EACA,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGF,qBAAA,GAAwB,QAAA;EAClC,IAAA,GAAO,gBAAA;EACP,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGA,sBAAA,GAAyB,QAAA;EACnC,IAAA,GAAO,gBAAA;EACP,OAAA,GAAU,oBAAA;AAAA"}
+{"version":3,"file":"stepperVerticalTypes.d.ts","names":[],"sources":["../../src/stepperVertical/stepperVerticalTypes.ts"],"mappings":";;;;;;;;;;;;;;KASY,gBAAA;AAAA,KAEA,oBAAA,GAAuB,WAAA,GAAc,YAAA,sBAAkC,YAAA;AAAA,KAEvE,iBAAA,GAAoB,WAAA,GAC9B,YAAA;EACE,IAAA,GAAO,QAAA;EACP,MAAA;EACA,IAAA,GAAO,gBAAA;EACP,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,QAAA;EACA,SAAA;EACA,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGF,qBAAA,GAAwB,QAAA;EAClC,IAAA,GAAO,gBAAA;EACP,OAAA,GAAU,oBAAA;AAAA;AAAA,KAGA,sBAAA,GAAyB,QAAA;EACnC,IAAA,GAAO,gBAAA;EACP,OAAA,GAAU,oBAAA;AAAA"}

package/dist/stepperVertical/theme.js

@@ -17,5 +17,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=theme.js.map

package/dist/svg/cache.js

@@ -27,5 +27,5 @@ const cache = new Cache();
 
 //#endregion
 export { cache as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=cache.js.map

package/dist/svg/helpers.js

@@ -28,5 +28,5 @@ function stringToHTML(html) {
 
 //#endregion
 export { getAttributes, getSvgContent, initState, stringToHTML };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=helpers.js.map

package/dist/svg/svg.js

@@ -73,5 +73,5 @@ Svg.displayName = "Svg";
 
 //#endregion
 export { SvgBase, Svg as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=svg.js.map

package/dist/switch/consts.js

@@ -12,5 +12,5 @@ const switchColors = {
 
 //#endregion
 export { switchColors };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=consts.js.map

package/dist/switch/context.js

@@ -5,5 +5,5 @@ const [SwitchProvider, useSwitchContext] = createContext({ isOptional: true });
 
 //#endregion
 export { SwitchProvider, useSwitchContext };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "4.2.0"
 //# sourceMappingURL=context.js.map

package/dist/switch/switch.types.d.ts

@@ -1,6 +1,7 @@
 import { ChangeEventHandler, FocusEventHandler, PropsOf } from "../utils/types.js";
 import "../utils/index.js";
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
 import { ReactNode } from "react";