@veracity/vui 5.2.2 → 5.3.0-alpha.399291.2606221048

package/dist/tabs/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","names":[],"sources":["../../src/tabs/tab.tsx"],"sourcesContent":["import { styled, vui } from '../core'\nimport { cs } from '../utils'\nimport type { TabProps } from './tabs.types'\n\nexport const TabBase = styled.divBox`\n  width: 100%;\n`\n\n/**\n * Implements a Tab component\n */\nexport const Tab = vui<'div', TabProps>(({ children, className }, ref) => (\n  <TabBase className={cs('vui-tab', className)} ref={ref}>\n    {children}\n  </TabBase>\n))\n\nTab.displayName = 'Tab'\n\nexport default Tab\n"],"mappings":";;;;;;AAIA,MAAa,UAAU,OAAO,MAAM;;;;;;AAOpC,MAAa,MAAM,KAAsB,EAAE,UAAU,aAAa,QAChE,oBAAC,SAAD;CAAS,WAAW,GAAG,WAAW,SAAS;CAAQ;CAChD;AACM,EACV;AAED,IAAI,cAAc"}
+{"version":3,"file":"tab.js","names":[],"sources":["../../src/tabs/tab.tsx"],"sourcesContent":["import type { TabProps } from './tabs.types'\n\nimport { styled, vui } from '../core'\nimport { cs } from '../utils'\n\nexport const TabBase = styled.divBox`\n  width: 100%;\n`\n\n/**\n * Implements a Tab component\n */\nexport const Tab = vui<'div', TabProps>(({ children, className }, ref) => (\n  <TabBase className={cs('vui-tab', className)} ref={ref}>\n    {children}\n  </TabBase>\n))\n\nTab.displayName = 'Tab'\n\nexport default Tab\n"],"mappings":";;;;;;AAKA,MAAa,UAAU,OAAO,MAAM;;;;;;AAOpC,MAAa,MAAM,KAAsB,EAAE,UAAU,aAAa,QAChE,oBAAC,SAAD;CAAS,WAAW,GAAG,WAAW,SAAS;CAAQ;CAChD;AACM,EACV;AAED,IAAI,cAAc"}

package/dist/tabs/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","names":[],"sources":["../../src/tabs/tabs.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;cAWa,QAAA,8BAAQ,eAAA,oCAAA,YAAA,EAEpB,cAAA,GAFoB,oBAAA,GAAA,WAAA,GAAA,cAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,eAAA,GAAA,gBAAA,GAAA,mBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,oBAAA,GAAA,gBAAA,GAAA,mBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,oBAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,YAAA,GAAA,iBAAA,GAAA,iBAAA,GAAA,iBAAA,GAAA,YAAA,GAAA,YAAA,GAAA,mBAAA,GAAA,mBAAA,GAAA,gBAAA,GAAA,gBAAA,GAAA,SAAA,GAAA,cAAA,GAAA,YAAA,GAAA,cAAA,GAAA,eAAA,GAAA,YAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,mBAAA,GAAA,iBAAA,GAAA,aAAA,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,kBAAA,GAAA,SAAA,GAAA,gBAAA,GAAA,cAAA,GAAA,UAAA,GAAA,QAAA,GAAA,QAAA,GAAA,QAAA,GAAA,cAAA,GAAA,WAAA,GAAA,eAAA,GAAA,YAAA,GAAA,iBAAA,GAAA,oBAAA,GAAA,iBAAA,GAAA,wBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,aAAA,GAAA,eAAA,GAAA,WAAA,GAAA,kBAAA,GAAA,WAAA,GAAA,eAAA,GAAA,gBAAA,GAAA,UAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA,GAAA,cAAA,GAAA,aAAA,GAAA,WAAA,GAAA,QAAA,GAAA,UAAA,GAAA,WAAA,GAAA,SAAA,GAAA,eAAA,GAAA,uBAAA,GAAA,cAAA,GAAA,aAAA,GAAA,UAAA,GAAA,WAAA,GAAA,aAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA,GAAA,WAAA,GAAA,cAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,eAAA,GAAA,YAAA,GAAA,YAAA,GAAA,YAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,kBAAA,GAAA,gBAAA,GAAA,aAAA,GAAA,aAAA,GAAA,WAAA,GAAA,WAAA,GAAA,kBAAA,GAAA,kBAAA,GAAA,mBAAA,GAAA,gBAAA,GAAA,cAAA,GAAA,oBAAA,GAAA,eAAA,GAAA,eAAA,GAAA,WAAA,GAAA,UAAA,GAAA,UAAA,GAAA,UAAA,GAAA,WAAA,GAAA,WAAA,GAAA,eAAA,GAAA,uBAAA,GAAA,uBAAA,GAAA,6BAAA,GAAA,oBAAA,GAAA,eAAA,GAAA,aAAA,GAAA,cAAA,GAAA,eAAA,GAAA,eAAA,GAAA,UAAA,GAAA,kBAAA,GAAA,mBAAA,GAAA,cAAA,GAAA,kBAAA,GAAA,kBAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,kBAAA,GAAA,sBAAA,GAAA,cAAA,GAAA,YAAA,WAAA,YAAA;;;;;;;;;cAOR,IAAA,EAAI,YAAA,QAAA,SAAA"}
+{"version":3,"file":"tabs.d.ts","names":[],"sources":["../../src/tabs/tabs.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;cAaa,QAAA,8BAAQ,eAAA,oCAAA,YAAA,EAEpB,cAAA,GAFoB,oBAAA,GAAA,WAAA,GAAA,cAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,eAAA,GAAA,gBAAA,GAAA,mBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,oBAAA,GAAA,gBAAA,GAAA,mBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,oBAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,YAAA,GAAA,iBAAA,GAAA,iBAAA,GAAA,iBAAA,GAAA,YAAA,GAAA,YAAA,GAAA,mBAAA,GAAA,mBAAA,GAAA,gBAAA,GAAA,gBAAA,GAAA,SAAA,GAAA,cAAA,GAAA,YAAA,GAAA,cAAA,GAAA,eAAA,GAAA,YAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,mBAAA,GAAA,iBAAA,GAAA,aAAA,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,kBAAA,GAAA,SAAA,GAAA,gBAAA,GAAA,cAAA,GAAA,UAAA,GAAA,QAAA,GAAA,QAAA,GAAA,QAAA,GAAA,cAAA,GAAA,WAAA,GAAA,eAAA,GAAA,YAAA,GAAA,iBAAA,GAAA,oBAAA,GAAA,iBAAA,GAAA,wBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,aAAA,GAAA,eAAA,GAAA,WAAA,GAAA,kBAAA,GAAA,WAAA,GAAA,eAAA,GAAA,gBAAA,GAAA,UAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA,GAAA,cAAA,GAAA,aAAA,GAAA,WAAA,GAAA,QAAA,GAAA,UAAA,GAAA,WAAA,GAAA,SAAA,GAAA,eAAA,GAAA,uBAAA,GAAA,cAAA,GAAA,aAAA,GAAA,UAAA,GAAA,WAAA,GAAA,aAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA,GAAA,WAAA,GAAA,cAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,eAAA,GAAA,YAAA,GAAA,YAAA,GAAA,YAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,kBAAA,GAAA,gBAAA,GAAA,aAAA,GAAA,aAAA,GAAA,WAAA,GAAA,WAAA,GAAA,kBAAA,GAAA,kBAAA,GAAA,mBAAA,GAAA,gBAAA,GAAA,cAAA,GAAA,oBAAA,GAAA,eAAA,GAAA,eAAA,GAAA,WAAA,GAAA,UAAA,GAAA,UAAA,GAAA,UAAA,GAAA,WAAA,GAAA,WAAA,GAAA,eAAA,GAAA,uBAAA,GAAA,uBAAA,GAAA,6BAAA,GAAA,oBAAA,GAAA,eAAA,GAAA,aAAA,GAAA,cAAA,GAAA,eAAA,GAAA,eAAA,GAAA,UAAA,GAAA,kBAAA,GAAA,mBAAA,GAAA,cAAA,GAAA,kBAAA,GAAA,kBAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,kBAAA,GAAA,sBAAA,GAAA,cAAA,GAAA,YAAA,WAAA,YAAA;;;;;;;;;cAOR,IAAA,EAAI,YAAA,QAAA,SAAA"}

package/dist/tabs/tabs.js

@@ -78,5 +78,5 @@ Tabs.displayName = "Tabs";
 
 //#endregion
 export { TabsBase, Tabs as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tabs.js.map

package/dist/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":[],"sources":["../../src/tabs/tabs.tsx"],"sourcesContent":["import type { ReactElement } from 'react'\nimport { Children, useEffect } from 'react'\n\nimport { styled, useStyleConfig, vui } from '../core'\nimport { P } from '../p'\nimport { cs } from '../utils'\nimport Tab from './tab'\nimport type { TabIndexProps, TabProps, TabsProps } from './tabs.types'\nimport TabsNavBar from './tabsNavBar'\nimport { useTabsState } from './useTabsState'\n\nexport const TabsBase = styled.divBox<TabsProps>`\n  width: 100%;\n`\n\n/**\n * Implements Tabs navigation to switch between views. Implements Tabs navigation to switch between views. **Do not use as a top menu in a page!**\n */\nexport const Tabs = vui<'div', TabsProps>((props, ref) => {\n  const { actions, activeTabId, showBorder = true, children, className, size, onTabClick, ...rest } = props\n  const styles = useStyleConfig('Tabs', props)\n  const { tabs, setTabs, activeTabIndex, setActiveTabIndex, animationDirection, setAnimationDirection } = useTabsState(\n    'fadeIn',\n    0,\n  )\n\n  useEffect(() => {\n    const _tabs: TabIndexProps[] = []\n    if (children) {\n      // @ts-expect-error no idea\n      ;(Children.toArray(children) as ReactElement[]).forEach((child: ReactElement<TabProps>, index: number) => {\n        if (child?.props?.title)\n          _tabs.push({\n            id: child.props.id,\n            index: index,\n            title: child.props.title,\n            icon: child.props.icon,\n            className: child.props.className,\n            children: child.props.children,\n            disabled: child.props.disabled,\n            onClick: child.props.onClick,\n            onDelete: child.props.onDelete,\n          })\n      })\n    }\n    setTabs(_tabs)\n    if (activeTabId !== undefined) {\n      const tab = _tabs.find((t: TabIndexProps) => t?.id === activeTabId || t?.index === activeTabId)\n      if (tab?.index !== undefined) setActiveTabIndex(tab.index)\n    }\n  }, [children, activeTabId])\n\n  const onNavItemClick = (tabIndex: number, e: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n    const tab = tabs.find(t => t.index === tabIndex)\n    if (tab?.children !== undefined && tab?.index !== undefined) {\n      setAnimationDirection(tab.index < activeTabIndex ? 'fadeLeft' : 'fadeRight')\n      setActiveTabIndex(tab.index)\n      onTabClick?.(tab.id || tab.index)\n    }\n    tab?.onClick?.(e)\n  }\n\n  const activeTab = tabs?.[activeTabIndex]\n\n  return (\n    <TabsBase className={cs('vui-tabs', className)} ref={ref} {...styles.container} {...rest}>\n      {!!tabs?.length && (\n        <TabsNavBar\n          actions={actions}\n          activeNavItem={activeTabIndex}\n          animationDirection={animationDirection}\n          onNavItemClick={(tabIndex, e) => onNavItemClick(tabIndex, e)}\n          showBorder={showBorder}\n          size={size}\n          tabs={tabs}\n        />\n      )}\n      {tabs?.length ? (\n        <Tab onClick={activeTab?.onClick} title={activeTab?.title}>\n          {!activeTab?.disabled && activeTab?.children}\n        </Tab>\n      ) : (\n        <P p={2}>Please specify Tabs.</P>\n      )}\n    </TabsBase>\n  )\n})\n\nTabs.displayName = 'Tabs'\n\nexport default Tabs\n"],"mappings":";;;;;;;;;;;;AAWA,MAAa,WAAW,OAAO,MAAiB;;;;;;AAOhD,MAAa,OAAO,KAAuB,OAAO,QAAQ;CACxD,MAAM,EAAE,SAAS,aAAa,aAAa,MAAM,UAAU,WAAW,MAAM,YAAY,GAAG,SAAS;CACpG,MAAM,SAAS,eAAe,QAAQ,KAAK;CAC3C,MAAM,EAAE,MAAM,SAAS,gBAAgB,mBAAmB,oBAAoB,0BAA0B,aACtG,UACA,CACF;CAEA,gBAAgB;EACd,MAAM,QAAyB,CAAC;EAChC,IAAI,UAED,AAAC,SAAS,QAAQ,QAAQ,CAAC,CAAoB,SAAS,OAA+B,UAAkB;GACxG,IAAI,OAAO,OAAO,OAChB,MAAM,KAAK;IACT,IAAI,MAAM,MAAM;IACT;IACP,OAAO,MAAM,MAAM;IACnB,MAAM,MAAM,MAAM;IAClB,WAAW,MAAM,MAAM;IACvB,UAAU,MAAM,MAAM;IACtB,UAAU,MAAM,MAAM;IACtB,SAAS,MAAM,MAAM;IACrB,UAAU,MAAM,MAAM;GACxB,CAAC;EACL,CAAC;EAEH,QAAQ,KAAK;EACb,IAAI,gBAAgB,QAAW;GAC7B,MAAM,MAAM,MAAM,MAAM,MAAqB,GAAG,OAAO,eAAe,GAAG,UAAU,WAAW;GAC9F,IAAI,KAAK,UAAU,QAAW,kBAAkB,IAAI,KAAK;EAC3D;CACF,GAAG,CAAC,UAAU,WAAW,CAAC;CAE1B,MAAM,kBAAkB,UAAkB,MAAmD;EAC3F,MAAM,MAAM,KAAK,MAAK,MAAK,EAAE,UAAU,QAAQ;EAC/C,IAAI,KAAK,aAAa,UAAa,KAAK,UAAU,QAAW;GAC3D,sBAAsB,IAAI,QAAQ,iBAAiB,aAAa,WAAW;GAC3E,kBAAkB,IAAI,KAAK;GAC3B,aAAa,IAAI,MAAM,IAAI,KAAK;EAClC;EACA,KAAK,UAAU,CAAC;CAClB;CAEA,MAAM,YAAY,OAAO;CAEzB,OACE,qBAAC,UAAD;EAAU,WAAW,GAAG,YAAY,SAAS;EAAQ;EAAK,GAAI,OAAO;EAAW,GAAI;YAApF,CACG,CAAC,CAAC,MAAM,UACP,oBAAC,YAAD;GACW;GACT,eAAe;GACK;GACpB,iBAAiB,UAAU,MAAM,eAAe,UAAU,CAAC;GAC/C;GACN;GACA;EACP,IAEF,MAAM,SACL,oBAAC,KAAD;GAAK,SAAS,WAAW;GAAS,OAAO,WAAW;aACjD,CAAC,WAAW,YAAY,WAAW;EACjC,KAEL,oBAAC,GAAD;GAAG,GAAG;aAAG;EAAuB,EAE1B;;AAEd,CAAC;AAED,KAAK,cAAc"}
+{"version":3,"file":"tabs.js","names":[],"sources":["../../src/tabs/tabs.tsx"],"sourcesContent":["import type { ReactElement } from 'react'\n\nimport { Children, useEffect } from 'react'\n\nimport type { TabIndexProps, TabProps, TabsProps } from './tabs.types'\n\nimport { styled, useStyleConfig, vui } from '../core'\nimport { P } from '../p'\nimport { cs } from '../utils'\nimport Tab from './tab'\nimport TabsNavBar from './tabsNavBar'\nimport { useTabsState } from './useTabsState'\n\nexport const TabsBase = styled.divBox<TabsProps>`\n  width: 100%;\n`\n\n/**\n * Implements Tabs navigation to switch between views. Implements Tabs navigation to switch between views. **Do not use as a top menu in a page!**\n */\nexport const Tabs = vui<'div', TabsProps>((props, ref) => {\n  const { actions, activeTabId, showBorder = true, children, className, size, onTabClick, ...rest } = props\n  const styles = useStyleConfig('Tabs', props)\n  const { tabs, setTabs, activeTabIndex, setActiveTabIndex, animationDirection, setAnimationDirection } = useTabsState(\n    'fadeIn',\n    0,\n  )\n\n  useEffect(() => {\n    const _tabs: TabIndexProps[] = []\n    if (children) {\n      // @ts-expect-error no idea\n      ;(Children.toArray(children) as ReactElement[]).forEach((child: ReactElement<TabProps>, index: number) => {\n        if (child?.props?.title)\n          _tabs.push({\n            id: child.props.id,\n            index: index,\n            title: child.props.title,\n            icon: child.props.icon,\n            className: child.props.className,\n            children: child.props.children,\n            disabled: child.props.disabled,\n            onClick: child.props.onClick,\n            onDelete: child.props.onDelete,\n          })\n      })\n    }\n    setTabs(_tabs)\n    if (activeTabId !== undefined) {\n      const tab = _tabs.find((t: TabIndexProps) => t?.id === activeTabId || t?.index === activeTabId)\n      if (tab?.index !== undefined) setActiveTabIndex(tab.index)\n    }\n  }, [children, activeTabId])\n\n  const onNavItemClick = (tabIndex: number, e: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n    const tab = tabs.find(t => t.index === tabIndex)\n    if (tab?.children !== undefined && tab?.index !== undefined) {\n      setAnimationDirection(tab.index < activeTabIndex ? 'fadeLeft' : 'fadeRight')\n      setActiveTabIndex(tab.index)\n      onTabClick?.(tab.id || tab.index)\n    }\n    tab?.onClick?.(e)\n  }\n\n  const activeTab = tabs?.[activeTabIndex]\n\n  return (\n    <TabsBase className={cs('vui-tabs', className)} ref={ref} {...styles.container} {...rest}>\n      {!!tabs?.length && (\n        <TabsNavBar\n          actions={actions}\n          activeNavItem={activeTabIndex}\n          animationDirection={animationDirection}\n          onNavItemClick={(tabIndex, e) => onNavItemClick(tabIndex, e)}\n          showBorder={showBorder}\n          size={size}\n          tabs={tabs}\n        />\n      )}\n      {tabs?.length ? (\n        <Tab onClick={activeTab?.onClick} title={activeTab?.title}>\n          {!activeTab?.disabled && activeTab?.children}\n        </Tab>\n      ) : (\n        <P p={2}>Please specify Tabs.</P>\n      )}\n    </TabsBase>\n  )\n})\n\nTabs.displayName = 'Tabs'\n\nexport default Tabs\n"],"mappings":";;;;;;;;;;;;AAaA,MAAa,WAAW,OAAO,MAAiB;;;;;;AAOhD,MAAa,OAAO,KAAuB,OAAO,QAAQ;CACxD,MAAM,EAAE,SAAS,aAAa,aAAa,MAAM,UAAU,WAAW,MAAM,YAAY,GAAG,SAAS;CACpG,MAAM,SAAS,eAAe,QAAQ,KAAK;CAC3C,MAAM,EAAE,MAAM,SAAS,gBAAgB,mBAAmB,oBAAoB,0BAA0B,aACtG,UACA,CACF;CAEA,gBAAgB;EACd,MAAM,QAAyB,CAAC;EAChC,IAAI,UAED,AAAC,SAAS,QAAQ,QAAQ,CAAC,CAAoB,SAAS,OAA+B,UAAkB;GACxG,IAAI,OAAO,OAAO,OAChB,MAAM,KAAK;IACT,IAAI,MAAM,MAAM;IACT;IACP,OAAO,MAAM,MAAM;IACnB,MAAM,MAAM,MAAM;IAClB,WAAW,MAAM,MAAM;IACvB,UAAU,MAAM,MAAM;IACtB,UAAU,MAAM,MAAM;IACtB,SAAS,MAAM,MAAM;IACrB,UAAU,MAAM,MAAM;GACxB,CAAC;EACL,CAAC;EAEH,QAAQ,KAAK;EACb,IAAI,gBAAgB,QAAW;GAC7B,MAAM,MAAM,MAAM,MAAM,MAAqB,GAAG,OAAO,eAAe,GAAG,UAAU,WAAW;GAC9F,IAAI,KAAK,UAAU,QAAW,kBAAkB,IAAI,KAAK;EAC3D;CACF,GAAG,CAAC,UAAU,WAAW,CAAC;CAE1B,MAAM,kBAAkB,UAAkB,MAAmD;EAC3F,MAAM,MAAM,KAAK,MAAK,MAAK,EAAE,UAAU,QAAQ;EAC/C,IAAI,KAAK,aAAa,UAAa,KAAK,UAAU,QAAW;GAC3D,sBAAsB,IAAI,QAAQ,iBAAiB,aAAa,WAAW;GAC3E,kBAAkB,IAAI,KAAK;GAC3B,aAAa,IAAI,MAAM,IAAI,KAAK;EAClC;EACA,KAAK,UAAU,CAAC;CAClB;CAEA,MAAM,YAAY,OAAO;CAEzB,OACE,qBAAC,UAAD;EAAU,WAAW,GAAG,YAAY,SAAS;EAAQ;EAAK,GAAI,OAAO;EAAW,GAAI;YAApF,CACG,CAAC,CAAC,MAAM,UACP,oBAAC,YAAD;GACW;GACT,eAAe;GACK;GACpB,iBAAiB,UAAU,MAAM,eAAe,UAAU,CAAC;GAC/C;GACN;GACA;EACP,IAEF,MAAM,SACL,oBAAC,KAAD;GAAK,SAAS,WAAW;GAAS,OAAO,WAAW;aACjD,CAAC,WAAW,YAAY,WAAW;EACjC,KAEL,oBAAC,GAAD;GAAG,GAAG;aAAG;EAAuB,EAE1B;;AAEd,CAAC;AAED,KAAK,cAAc"}

package/dist/tabs/tabsNavBar.js

@@ -89,5 +89,5 @@ TabsNavBar.displayName = "TabsNavBar";
 
 //#endregion
 export { TabsNavBar as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tabsNavBar.js.map

package/dist/tabs/tabsNavBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabsNavBar.js","names":["theme"],"sources":["../../src/tabs/tabsNavBar.tsx"],"sourcesContent":["import Box from '../box'\nimport { vui } from '../core'\nimport { DismissButton } from '../dismissButton'\nimport { Icon } from '../icon'\nimport { List, ListItem } from '../list'\nimport type { Dict } from '../utils'\nimport { cs } from '../utils'\nimport { colors, iconSizeMapper } from './consts'\nimport type { NavBarIconSize, TabIndexProps, TabNavBarProps } from './tabs.types'\nimport theme from './theme'\n\nconst { activeBg, border, color, hover, main } = colors\n\nexport const TabsNavBar = vui<'div', TabNavBarProps>((props, ref) => {\n  const { actions, tabs, onNavItemClick, activeNavItem, animationDirection, showBorder, size = 'md' } = props\n  const iconSize: NavBarIconSize = iconSizeMapper?.[size as string] || 'md'\n\n  const { sizes } = (theme as Dict) ?? {}\n\n  const fontSize = sizes[size ?? 'md'].tabsNavBar.fontSize\n  const h = sizes[size ?? 'md'].tabsNavBar.h\n  const borderWidth = sizes[size ?? 'md'].tabsNavBar.borderWidth\n  const py = sizes[size ?? 'md'].tabsNavBar.py\n  const iconMarginRight = size === 'xxl' ? '16px' : '8px'\n\n  const isActive = (tab: TabIndexProps) => !tab.disabled && tab?.index === activeNavItem\n\n  return (\n    <List\n      alignItems=\"end\"\n      borderBottom={showBorder ? `1px solid ${border}` : 'none'}\n      className={cs('vui-tabsNavBar')}\n      display=\"flex\"\n      isInteractive\n      mb=\"20px\"\n      ref={ref}\n      w={1}\n    >\n      {tabs?.map?.(tab => (\n        <ListItem\n          activeBg={tab.disabled ? undefined : activeBg}\n          bg=\"white\"\n          className={`vui-tabsNavBarItem vui-tabsNavBarItem-${tab?.id}`}\n          color={isActive(tab) ? main : color}\n          disabled={tab.disabled}\n          display=\"inline-flex\"\n          fontSize={fontSize}\n          lineHeight=\"125%\"\n          fontWeight={400}\n          h={h}\n          hoverBg={tab.disabled ? undefined : hover}\n          key={tab.index}\n          onClick={e => onNavItemClick?.(tab.index || 0, e)}\n          position=\"relative\"\n          px=\"16px\"\n          py={py}\n        >\n          <Box alignItems=\"center\">\n            {!!tab.icon && <Icon mr={iconMarginRight} name={tab.icon} size={iconSize} />}\n            {tab.title}\n          </Box>\n          {!!tab.onDelete && (\n            <DismissButton\n              aria-label=\"Delete\"\n              disabled={tab.disabled}\n              ml={1}\n              onClick={(e: { stopPropagation: () => void }) => {\n                e?.stopPropagation()\n                tab?.onDelete?.(e as any)\n              }}\n              title=\"Delete\"\n            />\n          )}\n          {isActive(tab) && (\n            <Box\n              animation={animationDirection}\n              bg={main}\n              bottom=\"-1px\"\n              className=\"vui-tabsNavBarItemActiveIndicator\"\n              h={borderWidth}\n              left={0}\n              position=\"absolute\"\n              w={1}\n            >\n              &nbsp;\n            </Box>\n          )}\n        </ListItem>\n      ))}\n      {!!actions && (\n        <Box ml=\"auto\" px={0.75} py={0.5}>\n          {actions}\n        </Box>\n      )}\n    </List>\n  )\n})\n\nTabsNavBar.displayName = 'TabsNavBar'\n\nexport default TabsNavBar\n"],"mappings":";;;;;;;;;;;;AAWA,MAAM,EAAE,UAAU,QAAQ,OAAO,OAAO,SAAS;AAEjD,MAAa,aAAa,KAA4B,OAAO,QAAQ;CACnE,MAAM,EAAE,SAAS,MAAM,gBAAgB,eAAe,oBAAoB,YAAY,OAAO,SAAS;CACtG,MAAM,WAA2B,iBAAiB,SAAmB;CAErE,MAAM,EAAE,UAAWA,iBAAkB,CAAC;CAEtC,MAAM,WAAW,MAAM,QAAQ,KAAK,CAAC,WAAW;CAChD,MAAM,IAAI,MAAM,QAAQ,KAAK,CAAC,WAAW;CACzC,MAAM,cAAc,MAAM,QAAQ,KAAK,CAAC,WAAW;CACnD,MAAM,KAAK,MAAM,QAAQ,KAAK,CAAC,WAAW;CAC1C,MAAM,kBAAkB,SAAS,QAAQ,SAAS;CAElD,MAAM,YAAY,QAAuB,CAAC,IAAI,YAAY,KAAK,UAAU;CAEzE,OACE,qBAAC,MAAD;EACE,YAAW;EACX,cAAc,aAAa,aAAa,WAAW;EACnD,WAAW,GAAG,gBAAgB;EAC9B,SAAQ;EACR;EACA,IAAG;EACE;EACL,GAAG;YARL,CAUG,MAAM,OAAM,QACX,qBAAC,UAAD;GACE,UAAU,IAAI,WAAW,SAAY;GACrC,IAAG;GACH,WAAW,yCAAyC,KAAK;GACzD,OAAO,SAAS,GAAG,IAAI,OAAO;GAC9B,UAAU,IAAI;GACd,SAAQ;GACE;GACV,YAAW;GACX,YAAY;GACT;GACH,SAAS,IAAI,WAAW,SAAY;GAEpC,UAAS,MAAK,iBAAiB,IAAI,SAAS,GAAG,CAAC;GAChD,UAAS;GACT,IAAG;GACC;aAhBN;IAkBE,qBAAC,KAAD;KAAK,YAAW;eAAhB,CACG,CAAC,CAAC,IAAI,QAAQ,oBAAC,MAAD;MAAM,IAAI;MAAiB,MAAM,IAAI;MAAM,MAAM;KAAW,IAC1E,IAAI,KACF;;IACJ,CAAC,CAAC,IAAI,YACL,oBAAC,eAAD;KACE,cAAW;KACX,UAAU,IAAI;KACd,IAAI;KACJ,UAAU,MAAuC;MAC/C,GAAG,gBAAgB;MACnB,KAAK,WAAW,CAAQ;KAC1B;KACA,OAAM;IACP;IAEF,SAAS,GAAG,KACX,oBAAC,KAAD;KACE,WAAW;KACX,IAAI;KACJ,QAAO;KACP,WAAU;KACV,GAAG;KACH,MAAM;KACN,UAAS;KACT,GAAG;eACJ;IAEI;GAEC;KApCH,IAAI,KAoCD,CACX,GACA,CAAC,CAAC,WACD,oBAAC,KAAD;GAAK,IAAG;GAAO,IAAI;GAAM,IAAI;aAC1B;EACE,EAEH;;AAEV,CAAC;AAED,WAAW,cAAc"}
+{"version":3,"file":"tabsNavBar.js","names":["theme"],"sources":["../../src/tabs/tabsNavBar.tsx"],"sourcesContent":["import type { Dict } from '../utils'\nimport type { NavBarIconSize, TabIndexProps, TabNavBarProps } from './tabs.types'\n\nimport Box from '../box'\nimport { vui } from '../core'\nimport { DismissButton } from '../dismissButton'\nimport { Icon } from '../icon'\nimport { List, ListItem } from '../list'\nimport { cs } from '../utils'\nimport { colors, iconSizeMapper } from './consts'\nimport theme from './theme'\n\nconst { activeBg, border, color, hover, main } = colors\n\nexport const TabsNavBar = vui<'div', TabNavBarProps>((props, ref) => {\n  const { actions, tabs, onNavItemClick, activeNavItem, animationDirection, showBorder, size = 'md' } = props\n  const iconSize: NavBarIconSize = iconSizeMapper?.[size as string] || 'md'\n\n  const { sizes } = (theme as Dict) ?? {}\n\n  const fontSize = sizes[size ?? 'md'].tabsNavBar.fontSize\n  const h = sizes[size ?? 'md'].tabsNavBar.h\n  const borderWidth = sizes[size ?? 'md'].tabsNavBar.borderWidth\n  const py = sizes[size ?? 'md'].tabsNavBar.py\n  const iconMarginRight = size === 'xxl' ? '16px' : '8px'\n\n  const isActive = (tab: TabIndexProps) => !tab.disabled && tab?.index === activeNavItem\n\n  return (\n    <List\n      alignItems=\"end\"\n      borderBottom={showBorder ? `1px solid ${border}` : 'none'}\n      className={cs('vui-tabsNavBar')}\n      display=\"flex\"\n      isInteractive\n      mb=\"20px\"\n      ref={ref}\n      w={1}\n    >\n      {tabs?.map?.(tab => (\n        <ListItem\n          activeBg={tab.disabled ? undefined : activeBg}\n          bg=\"white\"\n          className={`vui-tabsNavBarItem vui-tabsNavBarItem-${tab?.id}`}\n          color={isActive(tab) ? main : color}\n          disabled={tab.disabled}\n          display=\"inline-flex\"\n          fontSize={fontSize}\n          lineHeight=\"125%\"\n          fontWeight={400}\n          h={h}\n          hoverBg={tab.disabled ? undefined : hover}\n          key={tab.index}\n          onClick={e => onNavItemClick?.(tab.index || 0, e)}\n          position=\"relative\"\n          px=\"16px\"\n          py={py}\n        >\n          <Box alignItems=\"center\">\n            {!!tab.icon && <Icon mr={iconMarginRight} name={tab.icon} size={iconSize} />}\n            {tab.title}\n          </Box>\n          {!!tab.onDelete && (\n            <DismissButton\n              aria-label=\"Delete\"\n              disabled={tab.disabled}\n              ml={1}\n              onClick={(e: { stopPropagation: () => void }) => {\n                e?.stopPropagation()\n                tab?.onDelete?.(e as any)\n              }}\n              title=\"Delete\"\n            />\n          )}\n          {isActive(tab) && (\n            <Box\n              animation={animationDirection}\n              bg={main}\n              bottom=\"-1px\"\n              className=\"vui-tabsNavBarItemActiveIndicator\"\n              h={borderWidth}\n              left={0}\n              position=\"absolute\"\n              w={1}\n            >\n              &nbsp;\n            </Box>\n          )}\n        </ListItem>\n      ))}\n      {!!actions && (\n        <Box ml=\"auto\" px={0.75} py={0.5}>\n          {actions}\n        </Box>\n      )}\n    </List>\n  )\n})\n\nTabsNavBar.displayName = 'TabsNavBar'\n\nexport default TabsNavBar\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,EAAE,UAAU,QAAQ,OAAO,OAAO,SAAS;AAEjD,MAAa,aAAa,KAA4B,OAAO,QAAQ;CACnE,MAAM,EAAE,SAAS,MAAM,gBAAgB,eAAe,oBAAoB,YAAY,OAAO,SAAS;CACtG,MAAM,WAA2B,iBAAiB,SAAmB;CAErE,MAAM,EAAE,UAAWA,iBAAkB,CAAC;CAEtC,MAAM,WAAW,MAAM,QAAQ,KAAK,CAAC,WAAW;CAChD,MAAM,IAAI,MAAM,QAAQ,KAAK,CAAC,WAAW;CACzC,MAAM,cAAc,MAAM,QAAQ,KAAK,CAAC,WAAW;CACnD,MAAM,KAAK,MAAM,QAAQ,KAAK,CAAC,WAAW;CAC1C,MAAM,kBAAkB,SAAS,QAAQ,SAAS;CAElD,MAAM,YAAY,QAAuB,CAAC,IAAI,YAAY,KAAK,UAAU;CAEzE,OACE,qBAAC,MAAD;EACE,YAAW;EACX,cAAc,aAAa,aAAa,WAAW;EACnD,WAAW,GAAG,gBAAgB;EAC9B,SAAQ;EACR;EACA,IAAG;EACE;EACL,GAAG;YARL,CAUG,MAAM,OAAM,QACX,qBAAC,UAAD;GACE,UAAU,IAAI,WAAW,SAAY;GACrC,IAAG;GACH,WAAW,yCAAyC,KAAK;GACzD,OAAO,SAAS,GAAG,IAAI,OAAO;GAC9B,UAAU,IAAI;GACd,SAAQ;GACE;GACV,YAAW;GACX,YAAY;GACT;GACH,SAAS,IAAI,WAAW,SAAY;GAEpC,UAAS,MAAK,iBAAiB,IAAI,SAAS,GAAG,CAAC;GAChD,UAAS;GACT,IAAG;GACC;aAhBN;IAkBE,qBAAC,KAAD;KAAK,YAAW;eAAhB,CACG,CAAC,CAAC,IAAI,QAAQ,oBAAC,MAAD;MAAM,IAAI;MAAiB,MAAM,IAAI;MAAM,MAAM;KAAW,IAC1E,IAAI,KACF;;IACJ,CAAC,CAAC,IAAI,YACL,oBAAC,eAAD;KACE,cAAW;KACX,UAAU,IAAI;KACd,IAAI;KACJ,UAAU,MAAuC;MAC/C,GAAG,gBAAgB;MACnB,KAAK,WAAW,CAAQ;KAC1B;KACA,OAAM;IACP;IAEF,SAAS,GAAG,KACX,oBAAC,KAAD;KACE,WAAW;KACX,IAAI;KACJ,QAAO;KACP,WAAU;KACV,GAAG;KACH,MAAM;KACN,UAAS;KACT,GAAG;eACJ;IAEI;GAEC;KApCH,IAAI,KAoCD,CACX,GACA,CAAC,CAAC,WACD,oBAAC,KAAD;GAAK,IAAG;GAAO,IAAI;GAAM,IAAI;aAC1B;EACE,EAEH;;AAEV,CAAC;AAED,WAAW,cAAc"}

package/dist/tabs/theme.js

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

package/dist/tabs/useTabsState.js

@@ -17,5 +17,5 @@ const useTabsState = (initialAnimation, tabIndex) => {
 
 //#endregion
 export { useTabsState };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=useTabsState.js.map

package/dist/tag/tag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.d.ts","names":[],"sources":["../../src/tag/tag.tsx"],"mappings":";;;;;;;AA6CA;;cAAa,GAAA,EA4JP,YAAY,SAAS,QAAA"}
+{"version":3,"file":"tag.d.ts","names":[],"sources":["../../src/tag/tag.tsx"],"mappings":";;;;;;;AA8CA;;cAAa,GAAA,EA4JP,YAAY,SAAS,QAAA"}

package/dist/tag/tag.js

@@ -131,5 +131,5 @@ Tag.displayName = "Tag";
 
 //#endregion
 export { Tag as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tag.js.map

package/dist/tag/tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.js","names":["fontSizes"],"sources":["../../src/tag/tag.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { DismissButton } from '../dismissButton'\nimport Icon from '../icon'\nimport T from '../t'\nimport { fontSizes } from '../theme'\nimport { cs, filterUndefined, isReactText, isString } from '../utils'\nimport type { TagProps } from './tag.types'\nimport { resolveTagVariantKey } from './utils'\n\n// ---------------------------------------------------------------------------\n// Styled primitives\n// ---------------------------------------------------------------------------\n\n/** Outer container — rendered as <span> for static tags and <button> for interactive tags. */\nconst TagBase = styled.spanBox`\n  /* Drives DismissButton color via cascade so the close affordance picks up the tag's text color. */\n  --vui-dismiss-fg: currentColor;\n\n  align-items: center;\n  display: inline-flex;\n  font-weight: medium;\n  justify-content: center;\n  line-height: 1;\n  max-width: 100%;\n  position: relative;\n  transition-duration: fast;\n  width: fit-content;\n\n  &:focus {\n    outline: none;\n  }\n`\n\n// ---------------------------------------------------------------------------\n// Tag component\n// ---------------------------------------------------------------------------\n\n/**\n * Displays text, icons or custom content. Can be made interactive or include a\n * dismiss affordance. When `isInteractive` (or `onClick` without `onDelete`)\n * is set, the tag renders as a `<button>` so it is keyboard-activatable.\n */\nexport const Tag = vui<'span', TagProps>((props, ref) => {\n  const {\n    children,\n    className,\n    deleteLabel = 'Remove',\n    icon,\n    startIcon,\n    endIcon,\n    iconLeft,\n    iconRight,\n    color: colorProp,\n    isInteractive = props.onClick !== undefined && props.onDelete === undefined,\n    isTruncated = true,\n    itemLeft,\n    itemRight,\n    onClick,\n    onDelete,\n    size = 'md',\n    text,\n    variant: variantProp,\n    ...rest\n  } = props\n\n  // Resolve canonical theme key from the two-prop API (variant + color).\n  const resolvedVariant = useMemo(() => resolveTagVariantKey(variantProp, colorProp), [variantProp, colorProp])\n\n  // Dev-mode deprecation warning for legacy combined variants.\n  useEffect(() => {\n    if (process.env.NODE_ENV !== 'production') {\n      if (iconLeft !== undefined) {\n        console.warn('[Tag] `iconLeft` is deprecated. Use `startIcon` instead.')\n      }\n      if (iconRight !== undefined) {\n        console.warn('[Tag] `iconRight` is deprecated. Use `endIcon` instead.')\n      }\n      if (\n        variantProp !== undefined &&\n        !['subtle', 'solid'].includes(variantProp) &&\n        /^(subtle|solid)(Brand|Success|Danger|Warning|Lavender|Eucalyptus|Terracotta|Grey)$/.test(variantProp)\n      ) {\n        console.warn(\n          `[Tag] Combined variant \"${variantProp}\" is deprecated. ` +\n            'Use separate `variant` + `color` props instead (e.g. variant=\"subtle\" color=\"blue\").',\n        )\n      }\n    }\n  }, [iconLeft, iconRight, variantProp])\n\n  const resolvedStartIcon = startIcon ?? iconLeft\n  const resolvedEndIcon = endIcon ?? iconRight\n\n  const styles = useStyleConfig('Tag', { ...props, variant: resolvedVariant })\n  const {\n    h,\n    fontSize: themeFontSize,\n    paddingX = 0,\n    paddingY = 0,\n    gapX = 0,\n    borderRadius,\n    bgHover,\n    bgPressed,\n    ...containerColors\n  } = styles.container ?? {}\n  const dismissStyles = styles.dismiss ?? {}\n  const iconStyles = styles.icon ?? {}\n\n  const resolvedFontSize = fontSizes[themeFontSize as keyof typeof fontSizes] ?? themeFontSize\n  const fontSize = `var(--vui-tag-font-size, ${resolvedFontSize}px)`\n\n  const resolvedIconSize = iconStyles.fontSize || '1rem'\n  const iconSize = `var(--vui-tag-icon-size, ${resolvedIconSize})`\n\n  const TagIcon = ({ name, mr, ml }: { name: string; mr?: string; ml?: string }) => (\n    <Icon className=\"vui-tagIcon\" fontSize={iconSize} h={iconSize} ml={ml} mr={mr} w={iconSize} name={name} />\n  )\n\n  // Theme numeric values are raw pixel measurements (mirrors button/theme.ts).\n  // Convert to px strings to bypass xstyled's `spaces` scale lookup on padding/gap props.\n  const toPx = (v: unknown) => (typeof v === 'number' ? `${v}px` : v)\n  const pxX = toPx(paddingX)\n  const pxY = toPx(paddingY)\n  const pxGap = toPx(gapX)\n\n  const aliasedProps = filterUndefined({\n    borderRadius,\n  })\n\n  const interactiveStateProps = isInteractive\n    ? filterUndefined({\n        hoverBg: bgHover,\n        activeBg: bgPressed,\n      })\n    : undefined\n\n  const interactiveProps = isInteractive\n    ? {\n        as: 'button' as const,\n        type: 'button' as const,\n        cursor: 'pointer',\n        tabIndex: 0,\n        userSelect: 'none',\n      }\n    : {}\n\n  return (\n    <TagBase\n      className={cs('vui-tag', className)}\n      focusRing={2}\n      fontSize={fontSize}\n      h={h}\n      isTruncated={isTruncated}\n      onClick={onClick}\n      px={pxX}\n      py={pxY}\n      ref={ref}\n      variant={resolvedVariant}\n      {...containerColors}\n      {...interactiveProps}\n      {...interactiveStateProps}\n      {...aliasedProps}\n      {...rest}\n    >\n      {isString(icon) ? <TagIcon name={icon} /> : icon}\n\n      {!icon && (\n        <>\n          {itemLeft}\n\n          {isString(resolvedStartIcon) ? <TagIcon name={resolvedStartIcon} mr={pxGap as string} /> : resolvedStartIcon}\n\n          {children ??\n            (isReactText(text) ? (\n              <T className=\"vui-tagText\" fontSize=\"inherit\" isTruncated={isTruncated}>\n                {text}\n              </T>\n            ) : (\n              text\n            ))}\n\n          {isString(resolvedEndIcon) ? <TagIcon name={resolvedEndIcon} ml={pxGap as string} /> : resolvedEndIcon}\n\n          {onDelete && !isInteractive ? (\n            <DismissButton\n              aria-label={deleteLabel}\n              className=\"vui-tagButton\"\n              ml={pxGap}\n              onClick={onDelete}\n              {...dismissStyles}\n            />\n          ) : (\n            itemRight\n          )}\n        </>\n      )}\n    </TagBase>\n  )\n}) as VuiComponent<'span', TagProps>\n\nTag.displayName = 'Tag'\n\nexport default Tag\n"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,UAAU,OAAO,OAAO;;;;;;;;;;;;;;;;;;;;;;;AA4B9B,MAAa,MAAM,KAAuB,OAAO,QAAQ;CACvD,MAAM,EACJ,UACA,WACA,cAAc,UACd,MACA,WACA,SACA,UACA,WACA,OAAO,WACP,gBAAgB,MAAM,YAAY,UAAa,MAAM,aAAa,QAClE,cAAc,MACd,UACA,WACA,SACA,UACA,OAAO,MACP,MACA,SAAS,aACT,GAAG,SACD;CAGJ,MAAM,kBAAkB,cAAc,qBAAqB,aAAa,SAAS,GAAG,CAAC,aAAa,SAAS,CAAC;CAG5G,gBAAgB;EAEZ,IAAI,aAAa,QACf,QAAQ,KAAK,0DAA0D;EAEzE,IAAI,cAAc,QAChB,QAAQ,KAAK,yDAAyD;EAExE,IACE,gBAAgB,UAChB,CAAC,CAAC,UAAU,OAAO,CAAC,CAAC,SAAS,WAAW,KACzC,qFAAqF,KAAK,WAAW,GAErG,QAAQ,KACN,2BAA2B,YAAY,0GAEzC;CAGN,GAAG;EAAC;EAAU;EAAW;CAAW,CAAC;CAErC,MAAM,oBAAoB,aAAa;CACvC,MAAM,kBAAkB,WAAW;CAEnC,MAAM,SAAS,eAAe,OAAO;EAAE,GAAG;EAAO,SAAS;CAAgB,CAAC;CAC3E,MAAM,EACJ,GACA,UAAU,eACV,WAAW,GACX,WAAW,GACX,OAAO,GACP,cACA,SACA,WACA,GAAG,oBACD,OAAO,aAAa,CAAC;CACzB,MAAM,gBAAgB,OAAO,WAAW,CAAC;CACzC,MAAM,aAAa,OAAO,QAAQ,CAAC;CAGnC,MAAM,WAAW,4BADQA,kBAAU,kBAA4C,cACjB;CAG9D,MAAM,WAAW,4BADQ,WAAW,YAAY,OACc;CAE9D,MAAM,WAAW,EAAE,MAAM,IAAI,SAC3B,oBAAC,MAAD;EAAM,WAAU;EAAc,UAAU;EAAU,GAAG;EAAc;EAAQ;EAAI,GAAG;EAAgB;CAAO;CAK3G,MAAM,QAAQ,MAAgB,OAAO,MAAM,WAAW,GAAG,EAAE,MAAM;CACjE,MAAM,MAAM,KAAK,QAAQ;CACzB,MAAM,MAAM,KAAK,QAAQ;CACzB,MAAM,QAAQ,KAAK,IAAI;CAEvB,MAAM,eAAe,gBAAgB,EACnC,aACF,CAAC;CAED,MAAM,wBAAwB,gBAC1B,gBAAgB;EACd,SAAS;EACT,UAAU;CACZ,CAAC,IACD;CAEJ,MAAM,mBAAmB,gBACrB;EACE,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,UAAU;EACV,YAAY;CACd,IACA,CAAC;CAEL,OACE,qBAAC,SAAD;EACE,WAAW,GAAG,WAAW,SAAS;EAClC,WAAW;EACD;EACP;EACU;EACJ;EACT,IAAI;EACJ,IAAI;EACC;EACL,SAAS;EACT,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,GAAI;YAfN,CAiBG,SAAS,IAAI,IAAI,oBAAC,SAAD,EAAS,MAAM,KAAO,KAAI,MAE3C,CAAC,QACA;GACG;GAEA,SAAS,iBAAiB,IAAI,oBAAC,SAAD;IAAS,MAAM;IAAmB,IAAI;GAAkB,KAAI;GAE1F,aACE,YAAY,IAAI,IACf,oBAAC,GAAD;IAAG,WAAU;IAAc,UAAS;IAAuB;cACxD;GACA,KAEH;GAGH,SAAS,eAAe,IAAI,oBAAC,SAAD;IAAS,MAAM;IAAiB,IAAI;GAAkB,KAAI;GAEtF,YAAY,CAAC,gBACZ,oBAAC,eAAD;IACE,cAAY;IACZ,WAAU;IACV,IAAI;IACJ,SAAS;IACT,GAAI;GACL,KAED;EAEF,IAEG;;AAEb,CAAC;AAED,IAAI,cAAc"}
+{"version":3,"file":"tag.js","names":["fontSizes"],"sources":["../../src/tag/tag.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport type { TagProps } from './tag.types'\n\nimport { styled, useStyleConfig, vui } from '../core'\nimport { DismissButton } from '../dismissButton'\nimport Icon from '../icon'\nimport T from '../t'\nimport { fontSizes } from '../theme'\nimport { cs, filterUndefined, isReactText, isString } from '../utils'\nimport { resolveTagVariantKey } from './utils'\n\n// ---------------------------------------------------------------------------\n// Styled primitives\n// ---------------------------------------------------------------------------\n\n/** Outer container — rendered as <span> for static tags and <button> for interactive tags. */\nconst TagBase = styled.spanBox`\n  /* Drives DismissButton color via cascade so the close affordance picks up the tag's text color. */\n  --vui-dismiss-fg: currentColor;\n\n  align-items: center;\n  display: inline-flex;\n  font-weight: medium;\n  justify-content: center;\n  line-height: 1;\n  max-width: 100%;\n  position: relative;\n  transition-duration: fast;\n  width: fit-content;\n\n  &:focus {\n    outline: none;\n  }\n`\n\n// ---------------------------------------------------------------------------\n// Tag component\n// ---------------------------------------------------------------------------\n\n/**\n * Displays text, icons or custom content. Can be made interactive or include a\n * dismiss affordance. When `isInteractive` (or `onClick` without `onDelete`)\n * is set, the tag renders as a `<button>` so it is keyboard-activatable.\n */\nexport const Tag = vui<'span', TagProps>((props, ref) => {\n  const {\n    children,\n    className,\n    deleteLabel = 'Remove',\n    icon,\n    startIcon,\n    endIcon,\n    iconLeft,\n    iconRight,\n    color: colorProp,\n    isInteractive = props.onClick !== undefined && props.onDelete === undefined,\n    isTruncated = true,\n    itemLeft,\n    itemRight,\n    onClick,\n    onDelete,\n    size = 'md',\n    text,\n    variant: variantProp,\n    ...rest\n  } = props\n\n  // Resolve canonical theme key from the two-prop API (variant + color).\n  const resolvedVariant = useMemo(() => resolveTagVariantKey(variantProp, colorProp), [variantProp, colorProp])\n\n  // Dev-mode deprecation warning for legacy combined variants.\n  useEffect(() => {\n    if (process.env.NODE_ENV !== 'production') {\n      if (iconLeft !== undefined) {\n        console.warn('[Tag] `iconLeft` is deprecated. Use `startIcon` instead.')\n      }\n      if (iconRight !== undefined) {\n        console.warn('[Tag] `iconRight` is deprecated. Use `endIcon` instead.')\n      }\n      if (\n        variantProp !== undefined &&\n        !['subtle', 'solid'].includes(variantProp) &&\n        /^(subtle|solid)(Brand|Success|Danger|Warning|Lavender|Eucalyptus|Terracotta|Grey)$/.test(variantProp)\n      ) {\n        console.warn(\n          `[Tag] Combined variant \"${variantProp}\" is deprecated. ` +\n            'Use separate `variant` + `color` props instead (e.g. variant=\"subtle\" color=\"blue\").',\n        )\n      }\n    }\n  }, [iconLeft, iconRight, variantProp])\n\n  const resolvedStartIcon = startIcon ?? iconLeft\n  const resolvedEndIcon = endIcon ?? iconRight\n\n  const styles = useStyleConfig('Tag', { ...props, variant: resolvedVariant })\n  const {\n    h,\n    fontSize: themeFontSize,\n    paddingX = 0,\n    paddingY = 0,\n    gapX = 0,\n    borderRadius,\n    bgHover,\n    bgPressed,\n    ...containerColors\n  } = styles.container ?? {}\n  const dismissStyles = styles.dismiss ?? {}\n  const iconStyles = styles.icon ?? {}\n\n  const resolvedFontSize = fontSizes[themeFontSize as keyof typeof fontSizes] ?? themeFontSize\n  const fontSize = `var(--vui-tag-font-size, ${resolvedFontSize}px)`\n\n  const resolvedIconSize = iconStyles.fontSize || '1rem'\n  const iconSize = `var(--vui-tag-icon-size, ${resolvedIconSize})`\n\n  const TagIcon = ({ name, mr, ml }: { name: string; mr?: string; ml?: string }) => (\n    <Icon className=\"vui-tagIcon\" fontSize={iconSize} h={iconSize} ml={ml} mr={mr} w={iconSize} name={name} />\n  )\n\n  // Theme numeric values are raw pixel measurements (mirrors button/theme.ts).\n  // Convert to px strings to bypass xstyled's `spaces` scale lookup on padding/gap props.\n  const toPx = (v: unknown) => (typeof v === 'number' ? `${v}px` : v)\n  const pxX = toPx(paddingX)\n  const pxY = toPx(paddingY)\n  const pxGap = toPx(gapX)\n\n  const aliasedProps = filterUndefined({\n    borderRadius,\n  })\n\n  const interactiveStateProps = isInteractive\n    ? filterUndefined({\n        hoverBg: bgHover,\n        activeBg: bgPressed,\n      })\n    : undefined\n\n  const interactiveProps = isInteractive\n    ? {\n        as: 'button' as const,\n        type: 'button' as const,\n        cursor: 'pointer',\n        tabIndex: 0,\n        userSelect: 'none',\n      }\n    : {}\n\n  return (\n    <TagBase\n      className={cs('vui-tag', className)}\n      focusRing={2}\n      fontSize={fontSize}\n      h={h}\n      isTruncated={isTruncated}\n      onClick={onClick}\n      px={pxX}\n      py={pxY}\n      ref={ref}\n      variant={resolvedVariant}\n      {...containerColors}\n      {...interactiveProps}\n      {...interactiveStateProps}\n      {...aliasedProps}\n      {...rest}\n    >\n      {isString(icon) ? <TagIcon name={icon} /> : icon}\n\n      {!icon && (\n        <>\n          {itemLeft}\n\n          {isString(resolvedStartIcon) ? <TagIcon name={resolvedStartIcon} mr={pxGap as string} /> : resolvedStartIcon}\n\n          {children ??\n            (isReactText(text) ? (\n              <T className=\"vui-tagText\" fontSize=\"inherit\" isTruncated={isTruncated}>\n                {text}\n              </T>\n            ) : (\n              text\n            ))}\n\n          {isString(resolvedEndIcon) ? <TagIcon name={resolvedEndIcon} ml={pxGap as string} /> : resolvedEndIcon}\n\n          {onDelete && !isInteractive ? (\n            <DismissButton\n              aria-label={deleteLabel}\n              className=\"vui-tagButton\"\n              ml={pxGap}\n              onClick={onDelete}\n              {...dismissStyles}\n            />\n          ) : (\n            itemRight\n          )}\n        </>\n      )}\n    </TagBase>\n  )\n}) as VuiComponent<'span', TagProps>\n\nTag.displayName = 'Tag'\n\nexport default Tag\n"],"mappings":";;;;;;;;;;;;;;;;AAkBA,MAAM,UAAU,OAAO,OAAO;;;;;;;;;;;;;;;;;;;;;;;AA4B9B,MAAa,MAAM,KAAuB,OAAO,QAAQ;CACvD,MAAM,EACJ,UACA,WACA,cAAc,UACd,MACA,WACA,SACA,UACA,WACA,OAAO,WACP,gBAAgB,MAAM,YAAY,UAAa,MAAM,aAAa,QAClE,cAAc,MACd,UACA,WACA,SACA,UACA,OAAO,MACP,MACA,SAAS,aACT,GAAG,SACD;CAGJ,MAAM,kBAAkB,cAAc,qBAAqB,aAAa,SAAS,GAAG,CAAC,aAAa,SAAS,CAAC;CAG5G,gBAAgB;EAEZ,IAAI,aAAa,QACf,QAAQ,KAAK,0DAA0D;EAEzE,IAAI,cAAc,QAChB,QAAQ,KAAK,yDAAyD;EAExE,IACE,gBAAgB,UAChB,CAAC,CAAC,UAAU,OAAO,CAAC,CAAC,SAAS,WAAW,KACzC,qFAAqF,KAAK,WAAW,GAErG,QAAQ,KACN,2BAA2B,YAAY,0GAEzC;CAGN,GAAG;EAAC;EAAU;EAAW;CAAW,CAAC;CAErC,MAAM,oBAAoB,aAAa;CACvC,MAAM,kBAAkB,WAAW;CAEnC,MAAM,SAAS,eAAe,OAAO;EAAE,GAAG;EAAO,SAAS;CAAgB,CAAC;CAC3E,MAAM,EACJ,GACA,UAAU,eACV,WAAW,GACX,WAAW,GACX,OAAO,GACP,cACA,SACA,WACA,GAAG,oBACD,OAAO,aAAa,CAAC;CACzB,MAAM,gBAAgB,OAAO,WAAW,CAAC;CACzC,MAAM,aAAa,OAAO,QAAQ,CAAC;CAGnC,MAAM,WAAW,4BADQA,kBAAU,kBAA4C,cACjB;CAG9D,MAAM,WAAW,4BADQ,WAAW,YAAY,OACc;CAE9D,MAAM,WAAW,EAAE,MAAM,IAAI,SAC3B,oBAAC,MAAD;EAAM,WAAU;EAAc,UAAU;EAAU,GAAG;EAAc;EAAQ;EAAI,GAAG;EAAgB;CAAO;CAK3G,MAAM,QAAQ,MAAgB,OAAO,MAAM,WAAW,GAAG,EAAE,MAAM;CACjE,MAAM,MAAM,KAAK,QAAQ;CACzB,MAAM,MAAM,KAAK,QAAQ;CACzB,MAAM,QAAQ,KAAK,IAAI;CAEvB,MAAM,eAAe,gBAAgB,EACnC,aACF,CAAC;CAED,MAAM,wBAAwB,gBAC1B,gBAAgB;EACd,SAAS;EACT,UAAU;CACZ,CAAC,IACD;CAEJ,MAAM,mBAAmB,gBACrB;EACE,IAAI;EACJ,MAAM;EACN,QAAQ;EACR,UAAU;EACV,YAAY;CACd,IACA,CAAC;CAEL,OACE,qBAAC,SAAD;EACE,WAAW,GAAG,WAAW,SAAS;EAClC,WAAW;EACD;EACP;EACU;EACJ;EACT,IAAI;EACJ,IAAI;EACC;EACL,SAAS;EACT,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,GAAI;YAfN,CAiBG,SAAS,IAAI,IAAI,oBAAC,SAAD,EAAS,MAAM,KAAO,KAAI,MAE3C,CAAC,QACA;GACG;GAEA,SAAS,iBAAiB,IAAI,oBAAC,SAAD;IAAS,MAAM;IAAmB,IAAI;GAAkB,KAAI;GAE1F,aACE,YAAY,IAAI,IACf,oBAAC,GAAD;IAAG,WAAU;IAAc,UAAS;IAAuB;cACxD;GACA,KAEH;GAGH,SAAS,eAAe,IAAI,oBAAC,SAAD;IAAS,MAAM;IAAiB,IAAI;GAAkB,KAAI;GAEtF,YAAY,CAAC,gBACZ,oBAAC,eAAD;IACE,cAAY;IACZ,WAAU;IACV,IAAI;IACJ,SAAS;IACT,GAAI;GACL,KAED;EAEF,IAEG;;AAEb,CAAC;AAED,IAAI,cAAc"}

package/dist/tag/theme.js

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

package/dist/tag/utils.js

@@ -1,6 +1,6 @@
 //#region src/tag/utils.ts
 /** Canonical hierarchy keys recognised by the two-prop API. */
-const HIERARCHY_KEYS = new Set(["subtle", "solid"]);
+const HIERARCHY_KEYS = /* @__PURE__ */ new Set(["subtle", "solid"]);
 const capitalize = (s) => s.charAt(0).toUpperCase() + s.slice(1);
 /**
 * Converts a two-prop variant+color pair into the combined theme key used
@@ -20,5 +20,5 @@ const resolveTagVariantKey = (variant, color) => {
 
 //#endregion
 export { resolveTagVariantKey };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=utils.js.map

package/dist/tag/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":[],"sources":["../../src/tag/utils.ts"],"sourcesContent":["import type { TagHierarchy, TagColor } from './tag.types'\n\n/** Canonical hierarchy keys recognised by the two-prop API. */\nconst HIERARCHY_KEYS = new Set<TagHierarchy>(['subtle', 'solid'])\n\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1)\n\n/**\n * Converts a two-prop variant+color pair into the combined theme key used\n * internally (e.g. `resolveTagVariantKey('subtle','blue') => 'subtleBlue'`).\n * When `color` is omitted, `'blue'` is used as the default.\n *\n * If `variant` is already a fully-qualified legacy key (e.g. `'subtleBlue'` or\n * `'subtleBlue'`) it is returned unchanged so the new API is backward-compatible.\n *\n * Returns `'subtleBlue'` (the default variant) when `variant` is absent.\n */\nexport const resolveTagVariantKey = (variant: string | undefined, color: TagColor | string | undefined): string => {\n  if (!variant) return `subtle${capitalize(color ?? 'blue')}`\n\n  // Already a combined / legacy key — pass through unchanged.\n  if (!HIERARCHY_KEYS.has(variant as TagHierarchy)) return variant\n\n  // New two-prop API: combine hierarchy + color (defaults to 'blue').\n  return `${variant}${capitalize(color ?? 'blue')}`\n}\n"],"mappings":";;AAGA,MAAM,iBAAiB,IAAI,IAAkB,CAAC,UAAU,OAAO,CAAC;AAEhE,MAAM,cAAc,MAAc,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAE,MAAM,CAAC;;;;;;;;;;;AAYvE,MAAa,wBAAwB,SAA6B,UAAiD;CACjH,IAAI,CAAC,SAAS,OAAO,SAAS,WAAW,SAAS,MAAM;CAGxD,IAAI,CAAC,eAAe,IAAI,OAAuB,GAAG,OAAO;CAGzD,OAAO,GAAG,UAAU,WAAW,SAAS,MAAM;AAChD"}
+{"version":3,"file":"utils.js","names":[],"sources":["../../src/tag/utils.ts"],"sourcesContent":["import type { TagHierarchy, TagColor } from './tag.types'\n\n/** Canonical hierarchy keys recognised by the two-prop API. */\nconst HIERARCHY_KEYS = new Set<TagHierarchy>(['subtle', 'solid'])\n\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1)\n\n/**\n * Converts a two-prop variant+color pair into the combined theme key used\n * internally (e.g. `resolveTagVariantKey('subtle','blue') => 'subtleBlue'`).\n * When `color` is omitted, `'blue'` is used as the default.\n *\n * If `variant` is already a fully-qualified legacy key (e.g. `'subtleBlue'` or\n * `'subtleBlue'`) it is returned unchanged so the new API is backward-compatible.\n *\n * Returns `'subtleBlue'` (the default variant) when `variant` is absent.\n */\nexport const resolveTagVariantKey = (variant: string | undefined, color: TagColor | string | undefined): string => {\n  if (!variant) return `subtle${capitalize(color ?? 'blue')}`\n\n  // Already a combined / legacy key — pass through unchanged.\n  if (!HIERARCHY_KEYS.has(variant as TagHierarchy)) return variant\n\n  // New two-prop API: combine hierarchy + color (defaults to 'blue').\n  return `${variant}${capitalize(color ?? 'blue')}`\n}\n"],"mappings":";;AAGA,MAAM,iCAAiB,IAAI,IAAkB,CAAC,UAAU,OAAO,CAAC;AAEhE,MAAM,cAAc,MAAc,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAE,MAAM,CAAC;;;;;;;;;;;AAYvE,MAAa,wBAAwB,SAA6B,UAAiD;CACjH,IAAI,CAAC,SAAS,OAAO,SAAS,WAAW,SAAS,MAAM;CAGxD,IAAI,CAAC,eAAe,IAAI,OAAuB,GAAG,OAAO;CAGzD,OAAO,GAAG,UAAU,WAAW,SAAS,MAAM;AAChD"}

package/dist/tagToggle/TagToggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TagToggle.d.ts","names":[],"sources":["../../src/tagToggle/TagToggle.tsx"],"mappings":";;;;;;;cAoCa,SAAA,EAAS,YAAA,WAAA,cAAA"}
+{"version":3,"file":"TagToggle.d.ts","names":[],"sources":["../../src/tagToggle/TagToggle.tsx"],"mappings":";;;;;;;cAqCa,SAAA,EAAS,YAAA,WAAA,cAAA"}

package/dist/tagToggle/TagToggle.js

@@ -78,5 +78,5 @@ TagToggle.displayName = "TagToggle";
 
 //#endregion
 export { TagToggle as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=TagToggle.js.map

package/dist/tagToggle/TagToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagToggle.js","names":["fontSizes"],"sources":["../../src/tagToggle/TagToggle.tsx"],"sourcesContent":["import { styled, useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport T from '../t'\nimport { fontSizes } from '../theme'\nimport { cs, isString } from '../utils'\nimport type { TagToggleProps } from './tagToggle.types'\n\n// ---------------------------------------------------------------------------\n// Styled primitive\n// ---------------------------------------------------------------------------\n\nconst TagToggleBase = styled.buttonBox`\n  align-items: center;\n  cursor: pointer;\n  display: inline-flex;\n  font-weight: medium;\n  justify-content: center;\n  line-height: 1;\n  position: relative;\n  transition-duration: fast;\n  user-select: none;\n  width: fit-content;\n\n  &:focus {\n    outline: none;\n  }\n`\n\n// ---------------------------------------------------------------------------\n// TagToggle component\n// ---------------------------------------------------------------------------\n\n/**\n * A toggle button styled as a tag. Uses brand-only colour tokens and an\n * `aria-pressed` attribute to convey selected state.\n */\nexport const TagToggle = vui<'button', TagToggleProps>((props, ref) => {\n  const { className, icon, isSelected = false, label, onChange, variant = 'solid', ...rest } = props\n\n  // Resolve the theme variant key: e.g. subtle → subtle, subtle + selected → subtleSelected.\n  const themeVariant = isSelected ? `${variant}Selected` : variant\n\n  const styles = useStyleConfig('TagToggle', { ...props, variant: themeVariant })\n  const {\n    h,\n    fontSize: themeFontSize,\n    paddingX = 0,\n    paddingY = 0,\n    gapX = 0,\n    borderRadius,\n    bgHover,\n    bgPressed,\n    ...containerColors\n  } = styles.container ?? {}\n  const iconStyles = styles.icon ?? {}\n\n  const resolvedFontSize = fontSizes[themeFontSize as keyof typeof fontSizes] ?? themeFontSize\n  const fontSize = `var(--vui-tag-font-size, ${resolvedFontSize}px)`\n\n  const pxX = `${paddingX}px`\n  const pxY = `${paddingY}px`\n  const pxGap = `${gapX}px`\n\n  return (\n    <TagToggleBase\n      aria-pressed={isSelected}\n      borderRadius={borderRadius}\n      className={cs('vui-tagToggle', className)}\n      focusRing={2}\n      fontSize={fontSize}\n      h={h}\n      onClick={() => onChange?.(!isSelected)}\n      px={pxX}\n      py={pxY}\n      ref={ref}\n      type=\"button\"\n      activeBg={bgPressed}\n      hoverBg={bgHover}\n      {...containerColors}\n      {...rest}\n    >\n      {isString(icon) ? (\n        <>\n          <Icon className=\"vui-tagToggleIcon\" mr={label ? pxGap : undefined} name={icon} {...iconStyles} />\n          {label && (\n            <T className=\"vui-tagToggleText\" fontSize={fontSize}>\n              {label}\n            </T>\n          )}\n        </>\n      ) : (\n        label && (\n          <T className=\"vui-tagToggleText\" fontSize={fontSize}>\n            {label}\n          </T>\n        )\n      )}\n    </TagToggleBase>\n  )\n})\n\nTagToggle.displayName = 'TagToggle'\n\nexport default TagToggle\n"],"mappings":";;;;;;;;;;;AAWA,MAAM,gBAAgB,OAAO,SAAS;;;;;;;;;;;;;;;;;;;;AAyBtC,MAAa,YAAY,KAA+B,OAAO,QAAQ;CACrE,MAAM,EAAE,WAAW,MAAM,aAAa,OAAO,OAAO,UAAU,UAAU,SAAS,GAAG,SAAS;CAG7F,MAAM,eAAe,aAAa,GAAG,QAAQ,YAAY;CAEzD,MAAM,SAAS,eAAe,aAAa;EAAE,GAAG;EAAO,SAAS;CAAa,CAAC;CAC9E,MAAM,EACJ,GACA,UAAU,eACV,WAAW,GACX,WAAW,GACX,OAAO,GACP,cACA,SACA,WACA,GAAG,oBACD,OAAO,aAAa,CAAC;CACzB,MAAM,aAAa,OAAO,QAAQ,CAAC;CAGnC,MAAM,WAAW,4BADQA,kBAAU,kBAA4C,cACjB;CAE9D,MAAM,MAAM,GAAG,SAAS;CACxB,MAAM,MAAM,GAAG,SAAS;CACxB,MAAM,QAAQ,GAAG,KAAK;CAEtB,OACE,oBAAC,eAAD;EACE,gBAAc;EACA;EACd,WAAW,GAAG,iBAAiB,SAAS;EACxC,WAAW;EACD;EACP;EACH,eAAe,WAAW,CAAC,UAAU;EACrC,IAAI;EACJ,IAAI;EACC;EACL,MAAK;EACL,UAAU;EACV,SAAS;EACT,GAAI;EACJ,GAAI;YAEH,SAAS,IAAI,IACZ,4CACE,oBAAC,MAAD;GAAM,WAAU;GAAoB,IAAI,QAAQ,QAAQ;GAAW,MAAM;GAAM,GAAI;EAAa,IAC/F,SACC,oBAAC,GAAD;GAAG,WAAU;GAA8B;aACxC;EACA,EAEL,OAEF,SACE,oBAAC,GAAD;GAAG,WAAU;GAA8B;aACxC;EACA;CAGM;AAEnB,CAAC;AAED,UAAU,cAAc"}
+{"version":3,"file":"TagToggle.js","names":["fontSizes"],"sources":["../../src/tagToggle/TagToggle.tsx"],"sourcesContent":["import type { TagToggleProps } from './tagToggle.types'\n\nimport { styled, useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport T from '../t'\nimport { fontSizes } from '../theme'\nimport { cs, isString } from '../utils'\n\n// ---------------------------------------------------------------------------\n// Styled primitive\n// ---------------------------------------------------------------------------\n\nconst TagToggleBase = styled.buttonBox`\n  align-items: center;\n  cursor: pointer;\n  display: inline-flex;\n  font-weight: medium;\n  justify-content: center;\n  line-height: 1;\n  position: relative;\n  transition-duration: fast;\n  user-select: none;\n  width: fit-content;\n\n  &:focus {\n    outline: none;\n  }\n`\n\n// ---------------------------------------------------------------------------\n// TagToggle component\n// ---------------------------------------------------------------------------\n\n/**\n * A toggle button styled as a tag. Uses brand-only colour tokens and an\n * `aria-pressed` attribute to convey selected state.\n */\nexport const TagToggle = vui<'button', TagToggleProps>((props, ref) => {\n  const { className, icon, isSelected = false, label, onChange, variant = 'solid', ...rest } = props\n\n  // Resolve the theme variant key: e.g. subtle → subtle, subtle + selected → subtleSelected.\n  const themeVariant = isSelected ? `${variant}Selected` : variant\n\n  const styles = useStyleConfig('TagToggle', { ...props, variant: themeVariant })\n  const {\n    h,\n    fontSize: themeFontSize,\n    paddingX = 0,\n    paddingY = 0,\n    gapX = 0,\n    borderRadius,\n    bgHover,\n    bgPressed,\n    ...containerColors\n  } = styles.container ?? {}\n  const iconStyles = styles.icon ?? {}\n\n  const resolvedFontSize = fontSizes[themeFontSize as keyof typeof fontSizes] ?? themeFontSize\n  const fontSize = `var(--vui-tag-font-size, ${resolvedFontSize}px)`\n\n  const pxX = `${paddingX}px`\n  const pxY = `${paddingY}px`\n  const pxGap = `${gapX}px`\n\n  return (\n    <TagToggleBase\n      aria-pressed={isSelected}\n      borderRadius={borderRadius}\n      className={cs('vui-tagToggle', className)}\n      focusRing={2}\n      fontSize={fontSize}\n      h={h}\n      onClick={() => onChange?.(!isSelected)}\n      px={pxX}\n      py={pxY}\n      ref={ref}\n      type=\"button\"\n      activeBg={bgPressed}\n      hoverBg={bgHover}\n      {...containerColors}\n      {...rest}\n    >\n      {isString(icon) ? (\n        <>\n          <Icon className=\"vui-tagToggleIcon\" mr={label ? pxGap : undefined} name={icon} {...iconStyles} />\n          {label && (\n            <T className=\"vui-tagToggleText\" fontSize={fontSize}>\n              {label}\n            </T>\n          )}\n        </>\n      ) : (\n        label && (\n          <T className=\"vui-tagToggleText\" fontSize={fontSize}>\n            {label}\n          </T>\n        )\n      )}\n    </TagToggleBase>\n  )\n})\n\nTagToggle.displayName = 'TagToggle'\n\nexport default TagToggle\n"],"mappings":";;;;;;;;;;;AAYA,MAAM,gBAAgB,OAAO,SAAS;;;;;;;;;;;;;;;;;;;;AAyBtC,MAAa,YAAY,KAA+B,OAAO,QAAQ;CACrE,MAAM,EAAE,WAAW,MAAM,aAAa,OAAO,OAAO,UAAU,UAAU,SAAS,GAAG,SAAS;CAG7F,MAAM,eAAe,aAAa,GAAG,QAAQ,YAAY;CAEzD,MAAM,SAAS,eAAe,aAAa;EAAE,GAAG;EAAO,SAAS;CAAa,CAAC;CAC9E,MAAM,EACJ,GACA,UAAU,eACV,WAAW,GACX,WAAW,GACX,OAAO,GACP,cACA,SACA,WACA,GAAG,oBACD,OAAO,aAAa,CAAC;CACzB,MAAM,aAAa,OAAO,QAAQ,CAAC;CAGnC,MAAM,WAAW,4BADQA,kBAAU,kBAA4C,cACjB;CAE9D,MAAM,MAAM,GAAG,SAAS;CACxB,MAAM,MAAM,GAAG,SAAS;CACxB,MAAM,QAAQ,GAAG,KAAK;CAEtB,OACE,oBAAC,eAAD;EACE,gBAAc;EACA;EACd,WAAW,GAAG,iBAAiB,SAAS;EACxC,WAAW;EACD;EACP;EACH,eAAe,WAAW,CAAC,UAAU;EACrC,IAAI;EACJ,IAAI;EACC;EACL,MAAK;EACL,UAAU;EACV,SAAS;EACT,GAAI;EACJ,GAAI;YAEH,SAAS,IAAI,IACZ,4CACE,oBAAC,MAAD;GAAM,WAAU;GAAoB,IAAI,QAAQ,QAAQ;GAAW,MAAM;GAAM,GAAI;EAAa,IAC/F,SACC,oBAAC,GAAD;GAAG,WAAU;GAA8B;aACxC;EACA,EAEL,OAEF,SACE,oBAAC,GAAD;GAAG,WAAU;GAA8B;aACxC;EACA;CAGM;AAEnB,CAAC;AAED,UAAU,cAAc"}

package/dist/tagToggle/theme.js

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

package/dist/textarea/helpers.js

@@ -7,5 +7,5 @@ function getInitialCount(props) {
 
 //#endregion
 export { getInitialCount };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=helpers.js.map

package/dist/textarea/textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.d.ts","names":[],"sources":["../../src/textarea/textarea.tsx"],"mappings":";;;;cA8Ba,YAAA,8BAAY,eAAA,oCAAA,YAAA,EAKxB,WALwB;;;;;cAWZ,QAAA,EAAQ,YAAA,QAAA,aAAA"}
+{"version":3,"file":"textarea.d.ts","names":[],"sources":["../../src/textarea/textarea.tsx"],"mappings":";;;;cA+Ba,YAAA,8BAAY,eAAA,oCAAA,YAAA,EAKxB,WALwB;;;;;cAWZ,QAAA,EAAQ,YAAA,QAAA,aAAA"}

package/dist/textarea/textarea.js

@@ -139,5 +139,5 @@ Textarea.displayName = "Textarea";
 
 //#endregion
 export { TextareaBase, Textarea as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=textarea.js.map

package/dist/textarea/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","names":[],"sources":["../../src/textarea/textarea.tsx"],"sourcesContent":["import { useEffect, useId, useState } from 'react'\n\nimport { Box, Label } from '..'\nimport { omitThemingProps, styled, useStyleConfig, vui } from '../core'\nimport { helpTextMargin, helpTextSize, inputColors } from '../input/consts'\nimport HelpText from '../input/helpText'\nimport T from '../t'\nimport type { ChangeEvent } from '../utils'\nimport { cs, filterUndefined, isString } from '../utils'\nimport { getInitialCount } from './helpers'\nimport type { TextareaProps } from './textarea.types'\n\nconst TextareaTextarea = styled.textareaBox`\n  border-radius: none;\n  border-width: 1px;\n  outline: none;\n  padding: 1;\n  resize: none;\n  min-height: 80px;\n  transition-duration: fast;\n  width: 100%;\n\n  &[aria-disabled='true'] {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: sandstone.79;\n    border-color: sandstone.79;\n  }\n`\n\nexport const TextareaBase = styled.divBox`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n`\n\n/**\n * Displays a textarea element wrapped in a div to allow extra content, like counter.\n * Forwards many relevant props to the inner textarea. Exposes some props to the children via context.\n */\nexport const Textarea = vui<'div', TextareaProps>((props, ref) => {\n  const {\n    autoFocus,\n    ariaLabel,\n    className,\n    colorScheme: colorSchemeProp,\n    cols,\n    defaultValue,\n    disabled,\n    errorText,\n    id: idProp,\n    helpText,\n    label,\n    labelMarkOptional,\n    labelTooltipText,\n    maxLength,\n    name,\n    onBlur,\n    onChange: onChangeProp,\n    onFocus,\n    placeholder,\n    readOnly,\n    required,\n    resize = 'none',\n    rows,\n    showCount,\n    textareaProps = {},\n    textareaRef,\n    value,\n    ...rest\n  } = omitThemingProps(props)\n\n  const generatedId = useId()\n  const [count, setCount] = useState(() => getInitialCount(props))\n  const [valueInternal, setValueInternal] = useState(defaultValue)\n\n  const id = idProp || generatedId\n\n  const styles = useStyleConfig('Textarea', props)\n\n  function onChange(e: ChangeEvent<HTMLTextAreaElement>) {\n    setValueInternal(e.target.value)\n    setCount(e.target.value.length)\n    onChangeProp?.(e)\n  }\n\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n  })\n\n  const textareaAliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n    'aria-label': ariaLabel,\n    bg: readOnly ? 'sandstone.97' : undefined,\n    borderColor: readOnly ? 'sandstone.55' : undefined,\n    focusWithinBorderColor: !readOnly ? 'transparent' : undefined,\n    focusWithinRingColor: readOnly ? 'transparent' : undefined,\n  })\n\n  useEffect(() => {\n    setValueInternal(value)\n    setCount(value?.toString()?.length ? `${value}`.length : 0)\n  }, [value])\n\n  return (\n    <Box className=\"vui-textareaContainer\" column ref={ref} {...rest}>\n      {isString(label) ? (\n        <Label\n          aria-disabled={disabled}\n          className=\"vui-textareaLabel\"\n          htmlFor={id}\n          markAsOptional={labelMarkOptional}\n          mb={0.5}\n          text={label}\n          tooltipText={labelTooltipText}\n          {...styles.label}\n        />\n      ) : (\n        label\n      )}\n      <TextareaBase className={cs('vui-textarea', className)} {...styles.container} {...aliasedProps}>\n        <TextareaTextarea\n          className=\"vui-textareaTextarea\"\n          ref={textareaRef}\n          {...{\n            autoFocus,\n            cols,\n            defaultValue,\n            disabled,\n            id,\n            maxLength,\n            name,\n            onBlur,\n            onChange,\n            onFocus,\n            placeholder,\n            readOnly,\n            required,\n            resize,\n            rows,\n          }}\n          value={valueInternal}\n          {...styles.textarea}\n          {...textareaAliasedProps}\n          {...textareaProps}\n        />\n\n        {showCount && (\n          <T\n            className=\"vui-textareaCount\"\n            color={maxLength && count > maxLength ? inputColors.error : inputColors.helpText}\n            position=\"absolute\"\n            right={0}\n            size=\"sm\"\n            top=\"calc(100% + 1px)\"\n          >\n            {count} {maxLength ? `/ ${maxLength}` : null}\n          </T>\n        )}\n      </TextareaBase>\n      {!!helpText && <HelpText size={helpTextSize['lg']}>{helpText}</HelpText>}\n      {!!errorText && (\n        <HelpText isError mr={showCount ? helpTextMargin : undefined} size={helpTextSize['lg']}>\n          {errorText}\n        </HelpText>\n      )}\n    </Box>\n  )\n})\n\nTextarea.displayName = 'Textarea'\n\nexport default Textarea\n"],"mappings":";;;;;;;;;;;;;;;;AAYA,MAAM,mBAAmB,OAAO,WAAW;;;;;;;;;;;;;;;;;AAkB3C,MAAa,eAAe,OAAO,MAAM;;;;;;;;;;AAWzC,MAAa,WAAW,KAA2B,OAAO,QAAQ;CAChE,MAAM,EACJ,WACA,WACA,WACA,aAAa,iBACb,MACA,cACA,UACA,WACA,IAAI,QACJ,UACA,OACA,mBACA,kBACA,WACA,MACA,QACA,UAAU,cACV,SACA,aACA,UACA,UACA,SAAS,QACT,MACA,WACA,gBAAgB,CAAC,GACjB,aACA,OACA,GAAG,SACD,iBAAiB,KAAK;CAE1B,MAAM,cAAc,MAAM;CAC1B,MAAM,CAAC,OAAO,YAAY,eAAe,gBAAgB,KAAK,CAAC;CAC/D,MAAM,CAAC,eAAe,oBAAoB,SAAS,YAAY;CAE/D,MAAM,KAAK,UAAU;CAErB,MAAM,SAAS,eAAe,YAAY,KAAK;CAE/C,SAAS,SAAS,GAAqC;EACrD,iBAAiB,EAAE,OAAO,KAAK;EAC/B,SAAS,EAAE,OAAO,MAAM,MAAM;EAC9B,eAAe,CAAC;CAClB;CAEA,MAAM,eAAe,gBAAgB,EACnC,iBAAiB,SACnB,CAAC;CAED,MAAM,uBAAuB,gBAAgB;EAC3C,iBAAiB;EACjB,cAAc;EACd,IAAI,WAAW,iBAAiB;EAChC,aAAa,WAAW,iBAAiB;EACzC,wBAAwB,CAAC,WAAW,gBAAgB;EACpD,sBAAsB,WAAW,gBAAgB;CACnD,CAAC;CAED,gBAAgB;EACd,iBAAiB,KAAK;EACtB,SAAS,OAAO,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,SAAS,CAAC;CAC5D,GAAG,CAAC,KAAK,CAAC;CAEV,OACE,qBAAC,KAAD;EAAK,WAAU;EAAwB;EAAY;EAAK,GAAI;YAA5D;GACG,SAAS,KAAK,IACb,oBAAC,OAAD;IACE,iBAAe;IACf,WAAU;IACV,SAAS;IACT,gBAAgB;IAChB,IAAI;IACJ,MAAM;IACN,aAAa;IACb,GAAI,OAAO;GACZ,KAED;GAEF,qBAAC,cAAD;IAAc,WAAW,GAAG,gBAAgB,SAAS;IAAG,GAAI,OAAO;IAAW,GAAI;cAAlF,CACE,oBAAC,kBAAD;KACE,WAAU;KACV,KAAK;KAEH;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KAEF,OAAO;KACP,GAAI,OAAO;KACX,GAAI;KACJ,GAAI;IACL,IAEA,aACC,qBAAC,GAAD;KACE,WAAU;KACV,OAAO,aAAa,QAAQ,YAAY,YAAY,QAAQ,YAAY;KACxE,UAAS;KACT,OAAO;KACP,MAAK;KACL,KAAI;eANN;MAQG;MAAM;MAAE,YAAY,KAAK,cAAc;KACvC;MAEO;;GACb,CAAC,CAAC,YAAY,oBAAC,UAAD;IAAU,MAAM,aAAa;cAAQ;GAAmB;GACtE,CAAC,CAAC,aACD,oBAAC,UAAD;IAAU;IAAQ,IAAI,qBAA6B;IAAW,MAAM,aAAa;cAC9E;GACO;EAET;;AAET,CAAC;AAED,SAAS,cAAc"}
+{"version":3,"file":"textarea.js","names":[],"sources":["../../src/textarea/textarea.tsx"],"sourcesContent":["import { useEffect, useId, useState } from 'react'\n\nimport type { ChangeEvent } from '../utils'\nimport type { TextareaProps } from './textarea.types'\n\nimport { Box, Label } from '..'\nimport { omitThemingProps, styled, useStyleConfig, vui } from '../core'\nimport { helpTextMargin, helpTextSize, inputColors } from '../input/consts'\nimport HelpText from '../input/helpText'\nimport T from '../t'\nimport { cs, filterUndefined, isString } from '../utils'\nimport { getInitialCount } from './helpers'\n\nconst TextareaTextarea = styled.textareaBox`\n  border-radius: none;\n  border-width: 1px;\n  outline: none;\n  padding: 1;\n  resize: none;\n  min-height: 80px;\n  transition-duration: fast;\n  width: 100%;\n\n  &[aria-disabled='true'] {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: sandstone.79;\n    border-color: sandstone.79;\n  }\n`\n\nexport const TextareaBase = styled.divBox`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n`\n\n/**\n * Displays a textarea element wrapped in a div to allow extra content, like counter.\n * Forwards many relevant props to the inner textarea. Exposes some props to the children via context.\n */\nexport const Textarea = vui<'div', TextareaProps>((props, ref) => {\n  const {\n    autoFocus,\n    ariaLabel,\n    className,\n    colorScheme: colorSchemeProp,\n    cols,\n    defaultValue,\n    disabled,\n    errorText,\n    id: idProp,\n    helpText,\n    label,\n    labelMarkOptional,\n    labelTooltipText,\n    maxLength,\n    name,\n    onBlur,\n    onChange: onChangeProp,\n    onFocus,\n    placeholder,\n    readOnly,\n    required,\n    resize = 'none',\n    rows,\n    showCount,\n    textareaProps = {},\n    textareaRef,\n    value,\n    ...rest\n  } = omitThemingProps(props)\n\n  const generatedId = useId()\n  const [count, setCount] = useState(() => getInitialCount(props))\n  const [valueInternal, setValueInternal] = useState(defaultValue)\n\n  const id = idProp || generatedId\n\n  const styles = useStyleConfig('Textarea', props)\n\n  function onChange(e: ChangeEvent<HTMLTextAreaElement>) {\n    setValueInternal(e.target.value)\n    setCount(e.target.value.length)\n    onChangeProp?.(e)\n  }\n\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n  })\n\n  const textareaAliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n    'aria-label': ariaLabel,\n    bg: readOnly ? 'sandstone.97' : undefined,\n    borderColor: readOnly ? 'sandstone.55' : undefined,\n    focusWithinBorderColor: !readOnly ? 'transparent' : undefined,\n    focusWithinRingColor: readOnly ? 'transparent' : undefined,\n  })\n\n  useEffect(() => {\n    setValueInternal(value)\n    setCount(value?.toString()?.length ? `${value}`.length : 0)\n  }, [value])\n\n  return (\n    <Box className=\"vui-textareaContainer\" column ref={ref} {...rest}>\n      {isString(label) ? (\n        <Label\n          aria-disabled={disabled}\n          className=\"vui-textareaLabel\"\n          htmlFor={id}\n          markAsOptional={labelMarkOptional}\n          mb={0.5}\n          text={label}\n          tooltipText={labelTooltipText}\n          {...styles.label}\n        />\n      ) : (\n        label\n      )}\n      <TextareaBase className={cs('vui-textarea', className)} {...styles.container} {...aliasedProps}>\n        <TextareaTextarea\n          className=\"vui-textareaTextarea\"\n          ref={textareaRef}\n          {...{\n            autoFocus,\n            cols,\n            defaultValue,\n            disabled,\n            id,\n            maxLength,\n            name,\n            onBlur,\n            onChange,\n            onFocus,\n            placeholder,\n            readOnly,\n            required,\n            resize,\n            rows,\n          }}\n          value={valueInternal}\n          {...styles.textarea}\n          {...textareaAliasedProps}\n          {...textareaProps}\n        />\n\n        {showCount && (\n          <T\n            className=\"vui-textareaCount\"\n            color={maxLength && count > maxLength ? inputColors.error : inputColors.helpText}\n            position=\"absolute\"\n            right={0}\n            size=\"sm\"\n            top=\"calc(100% + 1px)\"\n          >\n            {count} {maxLength ? `/ ${maxLength}` : null}\n          </T>\n        )}\n      </TextareaBase>\n      {!!helpText && <HelpText size={helpTextSize['lg']}>{helpText}</HelpText>}\n      {!!errorText && (\n        <HelpText isError mr={showCount ? helpTextMargin : undefined} size={helpTextSize['lg']}>\n          {errorText}\n        </HelpText>\n      )}\n    </Box>\n  )\n})\n\nTextarea.displayName = 'Textarea'\n\nexport default Textarea\n"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAM,mBAAmB,OAAO,WAAW;;;;;;;;;;;;;;;;;AAkB3C,MAAa,eAAe,OAAO,MAAM;;;;;;;;;;AAWzC,MAAa,WAAW,KAA2B,OAAO,QAAQ;CAChE,MAAM,EACJ,WACA,WACA,WACA,aAAa,iBACb,MACA,cACA,UACA,WACA,IAAI,QACJ,UACA,OACA,mBACA,kBACA,WACA,MACA,QACA,UAAU,cACV,SACA,aACA,UACA,UACA,SAAS,QACT,MACA,WACA,gBAAgB,CAAC,GACjB,aACA,OACA,GAAG,SACD,iBAAiB,KAAK;CAE1B,MAAM,cAAc,MAAM;CAC1B,MAAM,CAAC,OAAO,YAAY,eAAe,gBAAgB,KAAK,CAAC;CAC/D,MAAM,CAAC,eAAe,oBAAoB,SAAS,YAAY;CAE/D,MAAM,KAAK,UAAU;CAErB,MAAM,SAAS,eAAe,YAAY,KAAK;CAE/C,SAAS,SAAS,GAAqC;EACrD,iBAAiB,EAAE,OAAO,KAAK;EAC/B,SAAS,EAAE,OAAO,MAAM,MAAM;EAC9B,eAAe,CAAC;CAClB;CAEA,MAAM,eAAe,gBAAgB,EACnC,iBAAiB,SACnB,CAAC;CAED,MAAM,uBAAuB,gBAAgB;EAC3C,iBAAiB;EACjB,cAAc;EACd,IAAI,WAAW,iBAAiB;EAChC,aAAa,WAAW,iBAAiB;EACzC,wBAAwB,CAAC,WAAW,gBAAgB;EACpD,sBAAsB,WAAW,gBAAgB;CACnD,CAAC;CAED,gBAAgB;EACd,iBAAiB,KAAK;EACtB,SAAS,OAAO,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,SAAS,CAAC;CAC5D,GAAG,CAAC,KAAK,CAAC;CAEV,OACE,qBAAC,KAAD;EAAK,WAAU;EAAwB;EAAY;EAAK,GAAI;YAA5D;GACG,SAAS,KAAK,IACb,oBAAC,OAAD;IACE,iBAAe;IACf,WAAU;IACV,SAAS;IACT,gBAAgB;IAChB,IAAI;IACJ,MAAM;IACN,aAAa;IACb,GAAI,OAAO;GACZ,KAED;GAEF,qBAAC,cAAD;IAAc,WAAW,GAAG,gBAAgB,SAAS;IAAG,GAAI,OAAO;IAAW,GAAI;cAAlF,CACE,oBAAC,kBAAD;KACE,WAAU;KACV,KAAK;KAEH;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KAEF,OAAO;KACP,GAAI,OAAO;KACX,GAAI;KACJ,GAAI;IACL,IAEA,aACC,qBAAC,GAAD;KACE,WAAU;KACV,OAAO,aAAa,QAAQ,YAAY,YAAY,QAAQ,YAAY;KACxE,UAAS;KACT,OAAO;KACP,MAAK;KACL,KAAI;eANN;MAQG;MAAM;MAAE,YAAY,KAAK,cAAc;KACvC;MAEO;;GACb,CAAC,CAAC,YAAY,oBAAC,UAAD;IAAU,MAAM,aAAa;cAAQ;GAAmB;GACtE,CAAC,CAAC,aACD,oBAAC,UAAD;IAAU;IAAQ,IAAI,qBAA6B;IAAW,MAAM,aAAa;cAC9E;GACO;EAET;;AAET,CAAC;AAED,SAAS,cAAc"}

package/dist/textarea/theme.js

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

package/dist/theme/components.js

@@ -124,5 +124,5 @@ var components_default = {
 
 //#endregion
 export { components_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=components.js.map

package/dist/theme/defaultTheme.js

@@ -9,5 +9,5 @@ const defaultTheme = {
 
 //#endregion
 export { defaultTheme as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=defaultTheme.js.map

package/dist/theme/extendTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"extendTheme.d.ts","names":[],"sources":["../../src/theme/extendTheme.ts"],"mappings":";;;;iBAKgB,WAAA,CAAY,UAAA,EAAY,kBAAA,GAAqB,QAAQ"}
+{"version":3,"file":"extendTheme.d.ts","names":[],"sources":["../../src/theme/extendTheme.ts"],"mappings":";;;;iBAMgB,WAAA,CAAY,UAAA,EAAY,kBAAA,GAAqB,QAAQ"}

package/dist/theme/extendTheme.js

@@ -9,5 +9,5 @@ function extendTheme(extensions) {
 
 //#endregion
 export { extendTheme };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=extendTheme.js.map

package/dist/theme/extendTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"extendTheme.js","names":[],"sources":["../../src/theme/extendTheme.ts"],"sourcesContent":["import { merge } from '../utils'\nimport defaultTheme from './defaultTheme'\nimport type { VuiTheme, VuiThemeExtensions } from './types'\n\n/** Merges provided theme extensions and overrides with default VUI theme. */\nexport function extendTheme(extensions: VuiThemeExtensions): VuiTheme {\n  return merge(defaultTheme, extensions)\n}\n"],"mappings":";;;;;AAKA,SAAgB,YAAY,YAA0C;CACpE,OAAO,MAAM,cAAc,UAAU;AACvC"}
+{"version":3,"file":"extendTheme.js","names":[],"sources":["../../src/theme/extendTheme.ts"],"sourcesContent":["import type { VuiTheme, VuiThemeExtensions } from './types'\n\nimport { merge } from '../utils'\nimport defaultTheme from './defaultTheme'\n\n/** Merges provided theme extensions and overrides with default VUI theme. */\nexport function extendTheme(extensions: VuiThemeExtensions): VuiTheme {\n  return merge(defaultTheme, extensions)\n}\n"],"mappings":";;;;;AAMA,SAAgB,YAAY,YAA0C;CACpE,OAAO,MAAM,cAAc,UAAU;AACvC"}

package/dist/theme/foundations/animations.js

@@ -16,5 +16,5 @@ var animations_default = {
 
 //#endregion
 export { animations_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=animations.js.map

package/dist/theme/foundations/borders.js

@@ -3,5 +3,5 @@ var borders_default = {};
 
 //#endregion
 export { borders_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=borders.js.map

package/dist/theme/foundations/colors.js

@@ -480,5 +480,5 @@ var colors_default = {
 
 //#endregion
 export { darkBlue, colors_default as default, energyRed, grey, landGreen };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=colors.js.map

package/dist/theme/foundations/durations.js

@@ -8,5 +8,5 @@ var durations_default = {
 
 //#endregion
 export { durations_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=durations.js.map

package/dist/theme/foundations/fontSizes.js

@@ -8,5 +8,5 @@ var fontSizes_default = {
 
 //#endregion
 export { fontSizes_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=fontSizes.js.map

package/dist/theme/foundations/fontWeights.js

@@ -7,5 +7,5 @@ var fontWeights_default = {
 
 //#endregion
 export { fontWeights_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=fontWeights.js.map

package/dist/theme/foundations/fonts.js

@@ -7,5 +7,5 @@ var fonts_default = {
 
 //#endregion
 export { fonts_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=fonts.js.map

package/dist/theme/foundations/gridTemplateColumns.js

@@ -16,5 +16,5 @@ var gridTemplateColumns_default = {
 
 //#endregion
 export { gridTemplateColumns_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=gridTemplateColumns.js.map

package/dist/theme/foundations/gridTemplateRows.js

@@ -10,5 +10,5 @@ var gridTemplateRows_default = {
 
 //#endregion
 export { gridTemplateRows_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=gridTemplateRows.js.map

package/dist/theme/foundations/index.js

@@ -45,5 +45,5 @@ var foundations_default = {
 
 //#endregion
 export { foundations_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=index.js.map

package/dist/theme/foundations/radii.js

@@ -14,5 +14,5 @@ var radii_default = {
 
 //#endregion
 export { radii_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=radii.js.map

package/dist/theme/foundations/ringWidths.js

@@ -3,5 +3,5 @@ var ringWidths_default = {};
 
 //#endregion
 export { ringWidths_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=ringWidths.js.map

package/dist/theme/foundations/screens.js

@@ -11,5 +11,5 @@ var screens_default = {
 
 //#endregion
 export { screens_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=screens.js.map

package/dist/theme/foundations/shadows.js

@@ -39,5 +39,5 @@ var shadows_default = {
 
 //#endregion
 export { shadows_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=shadows.js.map

package/dist/theme/foundations/sizes.js

@@ -3,5 +3,5 @@ var sizes_default = {};
 
 //#endregion
 export { sizes_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=sizes.js.map

package/dist/theme/foundations/spaces.js

@@ -31,5 +31,5 @@ var spaces_default = {
 
 //#endregion
 export { spaces_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=spaces.js.map

package/dist/theme/foundations/timingFunctions.js

@@ -3,5 +3,5 @@ var timingFunctions_default = {};
 
 //#endregion
 export { timingFunctions_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=timingFunctions.js.map

package/dist/theme/foundations/transformers.js

@@ -14,5 +14,5 @@ var transformers_default = {
 
 //#endregion
 export { transformers_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=transformers.js.map

package/dist/theme/foundations/transforms.js

@@ -3,5 +3,5 @@ var transforms_default = {};
 
 //#endregion
 export { transforms_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=transforms.js.map

package/dist/theme/foundations/transitions.js

@@ -3,5 +3,5 @@ var transitions_default = {};
 
 //#endregion
 export { transitions_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=transitions.js.map

package/dist/theme/foundations/zIndices.js

@@ -9,5 +9,5 @@ var zIndices_default = {
 
 //#endregion
 export { zIndices_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=zIndices.js.map

package/dist/theme/themePlaceholder.js

@@ -14,5 +14,5 @@ var themePlaceholder_default = {
 
 //#endregion
 export { themePlaceholder_default as default };
-globalThis.__vuiVersion__ = "5.2.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=themePlaceholder.js.map

package/dist/toast/ToastItem.d.ts

@@ -0,0 +1,21 @@
+import { ToastRenderProps } from "./toast.types.js";
+
+//#region src/toast/ToastItem.d.ts
+interface ToastItemProps extends ToastRenderProps {
+  onClose?: () => void;
+}
+declare const ToastItem: import("react").MemoExoticComponent<({
+  action,
+  icon,
+  onClose,
+  showDismissButton,
+  size,
+  status,
+  text,
+  textLayout,
+  title
+}: ToastItemProps) => import("react").JSX.Element>;
+//#endregion
+export { ToastItem, ToastItemProps };
+
+//# sourceMappingURL=ToastItem.d.ts.map

package/dist/toast/ToastItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastItem.d.ts","names":[],"sources":["../../src/toast/ToastItem.tsx"],"mappings":";;;UAuJiB,cAAA,SAAuB,gBAAgB;EACtD,OAAO;AAAA;AAAA,cAgDI,SAAA,kBAAS,mBAAA;EAAA,MAAA;EAAA,IAAA;EAAA,OAAA;EAAA,iBAAA;EAAA,IAAA;EAAA,MAAA;EAAA,IAAA;EAAA,UAAA;EAAA;AAAA,GAnCnB,cAAA,qBAAc,GAAA,CAAA,OAAA"}