@veracity/vui 3.2.0 → 4.0.0-alpha.366771.2601090922

package/dist/stepperVertical/stepVerticalTitle.js

@@ -1,6 +1,9 @@
 import { cs } from "../utils/styles.js";
+import "../utils/index.js";
 import { vui } from "../core/vui.js";
 import { Box } from "../box/box.js";
+import "../box/index.js";
+import "../core/index.js";
 import { boldTitles, stepClassName, titleColor } from "./consts.js";
 import { jsx } from "react/jsx-runtime";
 
@@ -9,7 +12,7 @@ import { jsx } from "react/jsx-runtime";
 * Implements vertical stepper tail (the vertical line) **
 */
 const StepVerticalTitle = vui((props, ref) => {
-	const { children, className, size = "md", variant = "active",...rest } = props;
+	const { children, className, size = "md", variant = "active", ...rest } = props;
 	return /* @__PURE__ */ jsx(Box, {
 		className: cs(stepClassName + "Title"),
 		color: titleColor[variant],
@@ -26,5 +29,5 @@ var stepVerticalTitle_default = StepVerticalTitle;
 
 //#endregion
 export { stepVerticalTitle_default as default };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=stepVerticalTitle.js.map

package/dist/stepperVertical/stepVerticalTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepVerticalTitle.js","names":[],"sources":["../../src/stepperVertical/stepVerticalTitle.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { vui } from '../core'\nimport { cs } from '../utils'\nimport { boldTitles, stepClassName, titleColor } from './consts'\nimport type { StepVerticalTitleProps } from './stepperVerticalTypes'\n\n/**\n * Implements vertical stepper tail (the vertical line) **\n */\nexport const StepVerticalTitle = vui<'div', StepVerticalTitleProps>((props, ref) => {\n  const { children, className, size = 'md', variant = 'active', ...rest } = props\n  return (\n    <Box\n      className={cs(stepClassName + 'Title')}\n      color={titleColor[variant]}\n      fontSize={`${size === 'md' ? 16 : 14}px`}\n      fontWeight={boldTitles.includes(variant) ? 600 : undefined}\n      pt={`${size === 'md' ? 4 : 2}px`}\n      whiteSpace=\"nowrap\"\n      {...rest}\n    >\n      {children}\n    </Box>\n  )\n})\n\nStepVerticalTitle.displayName = 'StepVerticalTitle'\n\nexport default StepVerticalTitle\n"],"mappings":";;;;;;;;;;AASA,MAAa,oBAAoB,KAAoC,OAAO,QAAQ;CAClF,MAAM,EAAE,UAAU,WAAW,OAAO,MAAM,UAAU,SAAU,GAAG,SAAS;AAC1E,QACE,oBAAC;EACC,WAAW,GAAG,gBAAgB,QAAQ;EACtC,OAAO,WAAW;EAClB,UAAU,GAAG,SAAS,OAAO,KAAK,GAAG;EACrC,YAAY,WAAW,SAAS,QAAQ,GAAG,MAAM;EACjD,IAAI,GAAG,SAAS,OAAO,IAAI,EAAE;EAC7B,YAAW;EACX,GAAI;EAEH;GACG;EAER;AAEF,kBAAkB,cAAc;AAEhC,gCAAe"}
+{"version":3,"file":"stepVerticalTitle.js","names":[],"sources":["../../src/stepperVertical/stepVerticalTitle.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { vui } from '../core'\nimport { cs } from '../utils'\nimport { boldTitles, stepClassName, titleColor } from './consts'\nimport type { StepVerticalTitleProps } from './stepperVerticalTypes'\n\n/**\n * Implements vertical stepper tail (the vertical line) **\n */\nexport const StepVerticalTitle = vui<'div', StepVerticalTitleProps>((props, ref) => {\n  const { children, className, size = 'md', variant = 'active', ...rest } = props\n  return (\n    <Box\n      className={cs(stepClassName + 'Title')}\n      color={titleColor[variant]}\n      fontSize={`${size === 'md' ? 16 : 14}px`}\n      fontWeight={boldTitles.includes(variant) ? 600 : undefined}\n      pt={`${size === 'md' ? 4 : 2}px`}\n      whiteSpace=\"nowrap\"\n      {...rest}\n    >\n      {children}\n    </Box>\n  )\n})\n\nStepVerticalTitle.displayName = 'StepVerticalTitle'\n\nexport default StepVerticalTitle\n"],"mappings":";;;;;;;;;;;;;AASA,MAAa,oBAAoB,KAAoC,OAAO,QAAQ;CAClF,MAAM,EAAE,UAAU,WAAW,OAAO,MAAM,UAAU,UAAU,GAAG,SAAS;AAC1E,QACE,oBAAC;EACC,WAAW,GAAG,gBAAgB,QAAQ;EACtC,OAAO,WAAW;EAClB,UAAU,GAAG,SAAS,OAAO,KAAK,GAAG;EACrC,YAAY,WAAW,SAAS,QAAQ,GAAG,MAAM;EACjD,IAAI,GAAG,SAAS,OAAO,IAAI,EAAE;EAC7B,YAAW;EACX,GAAI;EAEH;GACG;EAER;AAEF,kBAAkB,cAAc;AAEhC,gCAAe"}

package/dist/stepperVertical/stepperVertical.d.ts

@@ -9,4 +9,5 @@ import "../index.js";
 declare const StepperVertical: VuiComponent<"div", StepperVerticalProps>;
 //#endregion
 export { StepperVertical };
+
 //# sourceMappingURL=stepperVertical.d.ts.map

package/dist/stepperVertical/stepperVertical.js

@@ -1,7 +1,9 @@
 import { filterUndefined } from "../utils/object.js";
 import { cs } from "../utils/styles.js";
+import "../utils/index.js";
 import { useStyleConfig } from "../core/theme.js";
 import { vui } from "../core/vui.js";
+import "../core/index.js";
 import { StepperVerticalProvider } from "./context.js";
 import stepperVerticalBase_default from "./stepperVerticalBase.js";
 import { useMemo } from "react";
@@ -12,7 +14,7 @@ import { jsx } from "react/jsx-runtime";
 * Implements vertical stepper **
 */
 const StepperVertical = vui((props, ref) => {
-	const { children, className, size,...rest } = props;
+	const { children, className, size, ...rest } = props;
 	const styles = useStyleConfig("StepperVertical", props);
 	return /* @__PURE__ */ jsx(StepperVerticalProvider, {
 		value: useMemo(() => filterUndefined({ size }), [size]),
@@ -29,5 +31,5 @@ StepperVertical.displayName = "StepperVertical";
 
 //#endregion
 export { StepperVertical };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=stepperVertical.js.map

package/dist/stepperVertical/stepperVertical.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepperVertical.js","names":["StepperVerticalBase"],"sources":["../../src/stepperVertical/stepperVertical.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { useStyleConfig, vui } from '../core'\nimport { cs, filterUndefined } from '../utils'\nimport { StepperVerticalProvider } from './context'\nimport StepperVerticalBase from './stepperVerticalBase'\nimport type { StepperVerticalProps } from './stepperVerticalTypes'\n\n/**\n * Implements vertical stepper **\n */\nexport const StepperVertical = vui<'div', StepperVerticalProps>((props, ref) => {\n  const { children, className, size, ...rest } = props\n  const styles = useStyleConfig('StepperVertical', props)\n\n  const context = useMemo(() => filterUndefined({ size }), [size])\n\n  return (\n    <StepperVerticalProvider value={context}>\n      <StepperVerticalBase className={cs('vui-stepperVertical', className)} ref={ref} {...styles.container} {...rest}>\n        {children}\n      </StepperVerticalBase>\n    </StepperVerticalProvider>\n  )\n})\n\nStepperVertical.displayName = 'StepperVertical'\n\nexport default StepperVertical\n"],"mappings":";;;;;;;;;;;;;AAWA,MAAa,kBAAkB,KAAkC,OAAO,QAAQ;CAC9E,MAAM,EAAE,UAAU,WAAW,KAAM,GAAG,SAAS;CAC/C,MAAM,SAAS,eAAe,mBAAmB,MAAM;AAIvD,QACE,oBAAC;EAAwB,OAHX,cAAc,gBAAgB,EAAE,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC;YAI5D,oBAACA;GAAoB,WAAW,GAAG,uBAAuB,UAAU;GAAO;GAAK,GAAI,OAAO;GAAW,GAAI;GACvG;IACmB;GACE;EAE5B;AAEF,gBAAgB,cAAc"}
+{"version":3,"file":"stepperVertical.js","names":["StepperVerticalBase"],"sources":["../../src/stepperVertical/stepperVertical.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { useStyleConfig, vui } from '../core'\nimport { cs, filterUndefined } from '../utils'\nimport { StepperVerticalProvider } from './context'\nimport StepperVerticalBase from './stepperVerticalBase'\nimport type { StepperVerticalProps } from './stepperVerticalTypes'\n\n/**\n * Implements vertical stepper **\n */\nexport const StepperVertical = vui<'div', StepperVerticalProps>((props, ref) => {\n  const { children, className, size, ...rest } = props\n  const styles = useStyleConfig('StepperVertical', props)\n\n  const context = useMemo(() => filterUndefined({ size }), [size])\n\n  return (\n    <StepperVerticalProvider value={context}>\n      <StepperVerticalBase className={cs('vui-stepperVertical', className)} ref={ref} {...styles.container} {...rest}>\n        {children}\n      </StepperVerticalBase>\n    </StepperVerticalProvider>\n  )\n})\n\nStepperVertical.displayName = 'StepperVertical'\n\nexport default StepperVertical\n"],"mappings":";;;;;;;;;;;;;;;AAWA,MAAa,kBAAkB,KAAkC,OAAO,QAAQ;CAC9E,MAAM,EAAE,UAAU,WAAW,MAAM,GAAG,SAAS;CAC/C,MAAM,SAAS,eAAe,mBAAmB,MAAM;AAIvD,QACE,oBAAC;EAAwB,OAHX,cAAc,gBAAgB,EAAE,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC;YAI5D,oBAACA;GAAoB,WAAW,GAAG,uBAAuB,UAAU;GAAO;GAAK,GAAI,OAAO;GAAW,GAAI;GACvG;IACmB;GACE;EAE5B;AAEF,gBAAgB,cAAc"}

package/dist/stepperVertical/stepperVerticalBase.js

@@ -1,4 +1,5 @@
 import { styled } from "../core/styled.js";
+import "../core/index.js";
 import { stepClassName, tailClassName } from "./consts.js";
 
 //#region src/stepperVertical/stepperVerticalBase.ts
@@ -13,5 +14,5 @@ var stepperVerticalBase_default = StepperVerticalBase;
 
 //#endregion
 export { stepperVerticalBase_default as default };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=stepperVerticalBase.js.map

package/dist/stepperVertical/stepperVerticalBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepperVerticalBase.js","names":[],"sources":["../../src/stepperVertical/stepperVerticalBase.ts"],"sourcesContent":["import { styled } from '../core'\nimport { stepClassName, tailClassName } from './consts'\nimport type { StepperVerticalProps } from './stepperVerticalTypes'\n\nconst StepperVerticalBase = styled.divBox<StepperVerticalProps>`\n  width: 100%;\n\n  .${stepClassName}:last-of-type > .${tailClassName} {\n    display: none;\n  }\n`\nexport default StepperVerticalBase\n"],"mappings":";;;;AAIA,MAAM,sBAAsB,OAAO,MAA4B;;;KAG1D,cAAc,mBAAmB,cAAc;;;;AAIpD,kCAAe"}
+{"version":3,"file":"stepperVerticalBase.js","names":[],"sources":["../../src/stepperVertical/stepperVerticalBase.ts"],"sourcesContent":["import { styled } from '../core'\nimport { stepClassName, tailClassName } from './consts'\nimport type { StepperVerticalProps } from './stepperVerticalTypes'\n\nconst StepperVerticalBase = styled.divBox<StepperVerticalProps>`\n  width: 100%;\n\n  .${stepClassName}:last-of-type > .${tailClassName} {\n    display: none;\n  }\n`\nexport default StepperVerticalBase\n"],"mappings":";;;;;AAIA,MAAM,sBAAsB,OAAO,MAA4B;;;KAG1D,cAAc,mBAAmB,cAAc;;;;AAIpD,kCAAe"}

package/dist/stepperVertical/stepperVerticalTypes.d.ts

@@ -1,12 +1,12 @@
 import { ThemingProps } from "../theme/types.js";
+import { ChildrenProp } from "../core/types.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
-import { BoxProps } from "../box/box.types.js";
-import "../box/index.js";
+import "../core/index.js";
 import { IconProp } from "../icon/icon.types.js";
 import "../icon/index.js";
-import { ChildrenProp } from "../core/types.js";
-import "../core/index.js";
+import { BoxProps } from "../box/box.types.js";
+import "../box/index.js";
 import { StepIndicatorVariant } from "../stepIndicator/stepIndicatorTypes.js";
 import { ReactNode } from "react";
 
@@ -33,4 +33,5 @@ type StepVerticalTitleProps = BoxProps & {
 };
 //#endregion
 export { StepVerticalProps, StepVerticalSize, StepVerticalTailProps, StepVerticalTitleProps, StepperVerticalProps };
+
 //# sourceMappingURL=stepperVerticalTypes.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"stepperVerticalTypes.d.ts","names":[],"sources":["../../src/stepperVertical/stepperVerticalTypes.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;KASY,gBAAA,CAAA,CAAA;KAEA,oBAAA,CAAA,CAAA,CAAuB,cAAc,kCAAkC;KAEvE,iBAAA,CAAA,CAAA,CAAoB,cAC9B;SACS;;SAEA;EARC,WAAA,CAAA,CAAA,CASM,SATU;EAEhB,KAAA,CAAA,CAAA,CAQA,SARA;EAAuB,QAAA,CAAA,CAAA,CAAA,OAAA;EAAc,SAAA,CAAA,CAAA,CAAA,MAAA;EAAkC,OAAA,CAAA,CAAA,CAWrE,oBAXqE;CAAY;AAEnF,IAAA,CAYA,qBAAA,CAAA,CAAA,CAAwB,QAZP,CAAA,CAAA,CAAA;EAAG,IAAA,CAAA,CAAA,CAavB,gBAbuB;EAC9B,OAAA,CAAA,CAAA,CAaU,oBAbV;CACS;AAEA,IAAA,CAaC,sBAAA,CAAA,CAAA,CAAyB,QAb1B,CAAA,CAAA,CAAA;EACO,IAAA,CAAA,CAAA,CAaT,gBAbS;EACN,OAAA,CAAA,CAAA,CAaA,oBAbA;CAGE"}
+{"version":3,"file":"stepperVerticalTypes.d.ts","names":[],"sources":["../../src/stepperVertical/stepperVerticalTypes.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;KASY,gBAAA;KAEA,oBAAA,GAAuB,cAAc,kCAAkC;KAEvE,iBAAA,GAAoB,cAC9B;SACS;;SAEA;EARC,WAAA,CAAA,EASM,SATU;EAEhB,KAAA,CAAA,EAQA,SARA;EAAuB,QAAA,CAAA,EAAA,OAAA;EAAc,SAAA,CAAA,EAAA,MAAA;EAAkC,OAAA,CAAA,EAWrE,oBAXqE;CAAY;AAEnF,KAYA,qBAAA,GAAwB,QAZP,GAAA;EAAG,IAAA,CAAA,EAavB,gBAbuB;EAC9B,OAAA,CAAA,EAaU,oBAbV;CACS;AAEA,KAaC,sBAAA,GAAyB,QAb1B,GAAA;EACO,IAAA,CAAA,EAaT,gBAbS;EACN,OAAA,CAAA,EAaA,oBAbA;CAGE"}

package/dist/stepperVertical/theme.js

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

package/dist/svg/cache.js

@@ -28,5 +28,5 @@ var cache_default = cache;
 
 //#endregion
 export { cache_default as default };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=cache.js.map

package/dist/svg/helpers.js

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

package/dist/svg/index.d.ts

@@ -1,2 +1,2 @@
 import { SvgProps, SvgState } from "./svg.types.js";
-import { Svg, SvgBase } from "./svg.js";
+import { Svg, SvgBase } from "./svg.js";

package/dist/svg/index.js

@@ -0,0 +1,3 @@
+import svg_default, { Svg, SvgBase } from "./svg.js";
+
+globalThis.__vuiVersion__ = "4.0.0-beta.1"

package/dist/svg/svg.d.ts

@@ -1,6 +1,6 @@
-import { SvgProps } from "./svg.types.js";
 import { VuiComponent } from "../core/vui.js";
 import "../core/index.js";
+import { SvgProps } from "./svg.types.js";
 
 //#region src/svg/svg.d.ts
 declare const SvgBase: VuiComponent<'svg', SvgProps>;
@@ -14,4 +14,5 @@ declare const SvgBase: VuiComponent<'svg', SvgProps>;
 declare const Svg: VuiComponent<"svg", SvgProps>;
 //#endregion
 export { Svg, SvgBase };
+
 //# sourceMappingURL=svg.d.ts.map

package/dist/svg/svg.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"svg.d.ts","names":[],"sources":["../../src/svg/svg.tsx"],"sourcesContent":[],"mappings":";;;;;cASa,SAAS,oBAAoB;;;AAA1C,CAAA;AA4BA,CAAA,CAAA,CAAA,IAAA,CAAA,KAAA,CAAA,GAAA,CAAA,CAAA,EAAA,CAAA,KAAA,CAAA,GAAA,CAAA,OAAA,CAAA,IAAA,CAAA,GAAA,CAAA,KAAA,CAAA,GAAA,CAAA,GAAA,CAAA,KAAA,CAAA,EAAA,CAAA,EAAA,CAAA,KAAA;;;;cAAa,KAAG,oBAAA"}
+{"version":3,"file":"svg.d.ts","names":[],"sources":["../../src/svg/svg.tsx"],"sourcesContent":[],"mappings":";;;;;cASa,SAAS,oBAAoB;;;AAA1C;AA4BA;;;;cAAa,KAAG,oBAAA"}

package/dist/svg/svg.js

@@ -1,8 +1,10 @@
 import { cs } from "../utils/styles.js";
+import "../utils/index.js";
 import { css, styled } from "../core/styled.js";
 import { vui } from "../core/vui.js";
 import cache_default from "./cache.js";
 import { getAttributes, getSvgContent, initState, stringToHTML } from "./helpers.js";
+import "../core/index.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 
@@ -28,7 +30,7 @@ const SvgBase = styled.svgBox(({ pathFill }) => {
 * Then, renders the svg by parsing loaded content (Review potential for XSS due to innerHTML).
 */
 const Svg = vui((props, ref) => {
-	const { children, className, src,...rest } = props;
+	const { children, className, src, ...rest } = props;
 	const [state, setState] = useState(initState());
 	const isMountedRef = useRef(false);
 	const srcRef = useRef(src);
@@ -74,5 +76,5 @@ var svg_default = Svg;
 
 //#endregion
 export { Svg, SvgBase, svg_default as default };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=svg.js.map

package/dist/svg/svg.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg.js","names":["SvgBase: VuiComponent<'svg', SvgProps>","cache","src","content","svgAttributes"],"sources":["../../src/svg/svg.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { css, styled, vui } from '../core'\nimport { cs } from '../utils'\nimport cache from './cache'\nimport { getAttributes, getSvgContent, initState, stringToHTML } from './helpers'\nimport type { SvgProps, SvgState } from './svg.types'\n\nexport const SvgBase: VuiComponent<'svg', SvgProps> = styled.svgBox<SvgProps>(({ pathFill }) => {\n  return css`\n    ${pathFill !== undefined &&\n    (Array.isArray(pathFill)\n      ? pathFill\n          .map(\n            (fill, index) => `\n\t\t\t\t\t& > path:nth-child(${index + 1}) {\n\t\t\t\t\t\tfill: ${fill};\n\t\t\t\t\t}\n\t\t\t\t`,\n          )\n          .join()\n      : `\n\t\t\t\t& > path {\n\t\t\t\t\tfill: ${pathFill};\n\t\t\t\t}\n\t\t\t`)}\n  `\n})\n\n/**\n * Displays an svg element based on provided children or 'src' prop.\n *\n * When using src, it loads the content from the given URL and saves in in cache.\n *\n * Then, renders the svg by parsing loaded content (Review potential for XSS due to innerHTML).\n */\nexport const Svg = vui<'svg', SvgProps>((props, ref) => {\n  const { children, className, src, ...rest } = props\n  const [state, setState] = useState<SvgState>(initState())\n  const isMountedRef = useRef(false)\n  const srcRef = useRef(src)\n\n  const { content = '', svgAttributes = {} } = state\n  const innerHTML = !children ? { __html: content } : undefined\n\n  useEffect(() => {\n    isMountedRef.current = true\n    return () => {\n      isMountedRef.current = false\n    }\n  }, [])\n\n  useEffect(() => {\n    srcRef.current = src\n\n    async function loadSvg(src: string) {\n      try {\n        const response = await cache.get(src)\n        const content = getSvgContent(response)\n        const svgEl = stringToHTML(response) as Element | undefined\n        const svgAttributes = getAttributes(svgEl)\n\n        svgAttributes['data-src'] = src ?? ''\n\n        // Update state only when requested 'src' and current 'src' are the same\n        if (srcRef.current === src && isMountedRef.current) {\n          setState({ content, svgAttributes })\n        }\n      } catch (error) {\n        console.error(error)\n        if (isMountedRef.current) {\n          setState(initState())\n        }\n      }\n    }\n\n    src && void loadSvg(src)\n  }, [src])\n\n  return (\n    <SvgBase\n      className={cs('vui-svg', className)}\n      // eslint-disable-next-line @eslint-react/dom/no-dangerously-set-innerhtml\n      dangerouslySetInnerHTML={innerHTML}\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      {...svgAttributes}\n      {...rest}\n    >\n      {children}\n    </SvgBase>\n  )\n})\n\nSvg.displayName = 'Svg'\n\nexport default Svg\n"],"mappings":";;;;;;;;;AASA,MAAaA,UAAyC,OAAO,QAAkB,EAAE,eAAe;AAC9F,QAAO,GAAG;MACN,aAAa,WACd,MAAM,QAAQ,SAAS,GACpB,SACG,KACE,MAAM,UAAU;0BACH,QAAQ,EAAE;cACtB,KAAK;;MAGR,CACA,MAAM,GACT;;aAEK,SAAS;;MAEhB;;EAEJ;;;;;;;;AASF,MAAa,MAAM,KAAsB,OAAO,QAAQ;CACtD,MAAM,EAAE,UAAU,WAAW,IAAK,GAAG,SAAS;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAmB,WAAW,CAAC;CACzD,MAAM,eAAe,OAAO,MAAM;CAClC,MAAM,SAAS,OAAO,IAAI;CAE1B,MAAM,EAAE,UAAU,IAAI,gBAAgB,EAAE,KAAK;CAC7C,MAAM,YAAY,CAAC,WAAW,EAAE,QAAQ,SAAS,GAAG;AAEpD,iBAAgB;AACd,eAAa,UAAU;AACvB,eAAa;AACX,gBAAa,UAAU;;IAExB,EAAE,CAAC;AAEN,iBAAgB;AACd,SAAO,UAAU;EAEjB,eAAe,QAAQ,OAAa;AAClC,OAAI;IACF,MAAM,WAAW,MAAMC,cAAM,IAAIC,MAAI;IACrC,MAAMC,YAAU,cAAc,SAAS;IAEvC,MAAMC,kBAAgB,cADR,aAAa,SAAS,CACM;AAE1C,oBAAc,cAAcF,SAAO;AAGnC,QAAI,OAAO,YAAYA,SAAO,aAAa,QACzC,UAAS;KAAE;KAAS;KAAe,CAAC;YAE/B,OAAO;AACd,YAAQ,MAAM,MAAM;AACpB,QAAI,aAAa,QACf,UAAS,WAAW,CAAC;;;AAK3B,SAAY,QAAQ,IAAI;IACvB,CAAC,IAAI,CAAC;AAET,QACE,oBAAC;EACC,WAAW,GAAG,WAAW,UAAU;EAEnC,yBAAyB;EACpB;EACL,OAAM;EACN,GAAI;EACJ,GAAI;EAEH;GACO;EAEZ;AAEF,IAAI,cAAc;AAElB,kBAAe"}
+{"version":3,"file":"svg.js","names":["SvgBase: VuiComponent<'svg', SvgProps>","cache","src","content","svgAttributes"],"sources":["../../src/svg/svg.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { css, styled, vui } from '../core'\nimport { cs } from '../utils'\nimport cache from './cache'\nimport { getAttributes, getSvgContent, initState, stringToHTML } from './helpers'\nimport type { SvgProps, SvgState } from './svg.types'\n\nexport const SvgBase: VuiComponent<'svg', SvgProps> = styled.svgBox<SvgProps>(({ pathFill }) => {\n  return css`\n    ${pathFill !== undefined &&\n    (Array.isArray(pathFill)\n      ? pathFill\n          .map(\n            (fill, index) => `\n\t\t\t\t\t& > path:nth-child(${index + 1}) {\n\t\t\t\t\t\tfill: ${fill};\n\t\t\t\t\t}\n\t\t\t\t`,\n          )\n          .join()\n      : `\n\t\t\t\t& > path {\n\t\t\t\t\tfill: ${pathFill};\n\t\t\t\t}\n\t\t\t`)}\n  `\n})\n\n/**\n * Displays an svg element based on provided children or 'src' prop.\n *\n * When using src, it loads the content from the given URL and saves in in cache.\n *\n * Then, renders the svg by parsing loaded content (Review potential for XSS due to innerHTML).\n */\nexport const Svg = vui<'svg', SvgProps>((props, ref) => {\n  const { children, className, src, ...rest } = props\n  const [state, setState] = useState<SvgState>(initState())\n  const isMountedRef = useRef(false)\n  const srcRef = useRef(src)\n\n  const { content = '', svgAttributes = {} } = state\n  const innerHTML = !children ? { __html: content } : undefined\n\n  useEffect(() => {\n    isMountedRef.current = true\n    return () => {\n      isMountedRef.current = false\n    }\n  }, [])\n\n  useEffect(() => {\n    srcRef.current = src\n\n    async function loadSvg(src: string) {\n      try {\n        const response = await cache.get(src)\n        const content = getSvgContent(response)\n        const svgEl = stringToHTML(response) as Element | undefined\n        const svgAttributes = getAttributes(svgEl)\n\n        svgAttributes['data-src'] = src ?? ''\n\n        // Update state only when requested 'src' and current 'src' are the same\n        if (srcRef.current === src && isMountedRef.current) {\n          setState({ content, svgAttributes })\n        }\n      } catch (error) {\n        console.error(error)\n        if (isMountedRef.current) {\n          setState(initState())\n        }\n      }\n    }\n\n    src && void loadSvg(src)\n  }, [src])\n\n  return (\n    <SvgBase\n      className={cs('vui-svg', className)}\n      // eslint-disable-next-line @eslint-react/dom/no-dangerously-set-innerhtml\n      dangerouslySetInnerHTML={innerHTML}\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      {...svgAttributes}\n      {...rest}\n    >\n      {children}\n    </SvgBase>\n  )\n})\n\nSvg.displayName = 'Svg'\n\nexport default Svg\n"],"mappings":";;;;;;;;;;;AASA,MAAaA,UAAyC,OAAO,QAAkB,EAAE,eAAe;AAC9F,QAAO,GAAG;MACN,aAAa,WACd,MAAM,QAAQ,SAAS,GACpB,SACG,KACE,MAAM,UAAU;0BACH,QAAQ,EAAE;cACtB,KAAK;;MAGR,CACA,MAAM,GACT;;aAEK,SAAS;;MAEhB;;EAEJ;;;;;;;;AASF,MAAa,MAAM,KAAsB,OAAO,QAAQ;CACtD,MAAM,EAAE,UAAU,WAAW,KAAK,GAAG,SAAS;CAC9C,MAAM,CAAC,OAAO,YAAY,SAAmB,WAAW,CAAC;CACzD,MAAM,eAAe,OAAO,MAAM;CAClC,MAAM,SAAS,OAAO,IAAI;CAE1B,MAAM,EAAE,UAAU,IAAI,gBAAgB,EAAE,KAAK;CAC7C,MAAM,YAAY,CAAC,WAAW,EAAE,QAAQ,SAAS,GAAG;AAEpD,iBAAgB;AACd,eAAa,UAAU;AACvB,eAAa;AACX,gBAAa,UAAU;;IAExB,EAAE,CAAC;AAEN,iBAAgB;AACd,SAAO,UAAU;EAEjB,eAAe,QAAQ,OAAa;AAClC,OAAI;IACF,MAAM,WAAW,MAAMC,cAAM,IAAIC,MAAI;IACrC,MAAMC,YAAU,cAAc,SAAS;IAEvC,MAAMC,kBAAgB,cADR,aAAa,SAAS,CACM;AAE1C,oBAAc,cAAcF,SAAO;AAGnC,QAAI,OAAO,YAAYA,SAAO,aAAa,QACzC,UAAS;KAAE;KAAS;KAAe,CAAC;YAE/B,OAAO;AACd,YAAQ,MAAM,MAAM;AACpB,QAAI,aAAa,QACf,UAAS,WAAW,CAAC;;;AAK3B,SAAY,QAAQ,IAAI;IACvB,CAAC,IAAI,CAAC;AAET,QACE,oBAAC;EACC,WAAW,GAAG,WAAW,UAAU;EAEnC,yBAAyB;EACpB;EACL,OAAM;EACN,GAAI;EACJ,GAAI;EAEH;GACO;EAEZ;AAEF,IAAI,cAAc;AAElB,kBAAe"}

package/dist/svg/svg.types.d.ts

@@ -17,4 +17,5 @@ type SvgState = {
 };
 //#endregion
 export { SvgProps, SvgState };
+
 //# sourceMappingURL=svg.types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"svg.types.d.ts","names":[],"sources":["../../src/svg/svg.types.ts"],"sourcesContent":[],"mappings":";;;;;;;KAGY,QAAA,CAAA,CAAA,CAAW;;aAEV,cAAc;;;AAF3B,CAAA;AAAuB,IAAA,CAOX,QAAA,CAAA,CAAA,CAPW;EAEV,OAAA,CAAA,CAAA,CAAA,MAAA;EAAc,aAAA,CAAA,CAOV,IAPU,CAAA,MAAA,CAAA;CAAW"}
+{"version":3,"file":"svg.types.d.ts","names":[],"sources":["../../src/svg/svg.types.ts"],"sourcesContent":[],"mappings":";;;;;;;KAGY,QAAA,GAAW;;aAEV,cAAc;;;AAF3B,CAAA;AAAuB,KAOX,QAAA,GAPW;EAEV,OAAA,CAAA,EAAA,MAAA;EAAc,aAAA,EAOV,IAPU,CAAA,MAAA,CAAA;CAAW"}

package/dist/switch/consts.js

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

package/dist/switch/context.d.ts

@@ -1,8 +1,9 @@
 import { SwitchContext } from "./switch.types.js";
-import * as react955 from "react";
+import * as react357 from "react";
 
 //#region src/switch/context.d.ts
-declare const SwitchProvider: react955.Provider<SwitchContext>, useSwitchContext: () => SwitchContext;
+declare const SwitchProvider: react357.Provider<SwitchContext>, useSwitchContext: () => SwitchContext;
 //#endregion
 export { SwitchProvider, useSwitchContext };
+
 //# sourceMappingURL=context.d.ts.map

package/dist/switch/context.js

@@ -1,9 +1,10 @@
 import { createContext } from "../utils/react.js";
+import "../utils/index.js";
 
 //#region src/switch/context.ts
 const [SwitchProvider, useSwitchContext] = createContext({ isOptional: true });
 
 //#endregion
 export { SwitchProvider, useSwitchContext };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=context.js.map

package/dist/switch/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../src/switch/context.ts"],"sourcesContent":["import { createContext } from '../utils'\nimport type { SwitchContext } from './switch.types'\n\nconst [SwitchProvider, useSwitchContext] = createContext<SwitchContext>({ isOptional: true })\n\nexport { SwitchProvider, useSwitchContext }\n"],"mappings":";;;AAGA,MAAM,CAAC,gBAAgB,oBAAoB,cAA6B,EAAE,YAAY,MAAM,CAAC"}
+{"version":3,"file":"context.js","names":[],"sources":["../../src/switch/context.ts"],"sourcesContent":["import { createContext } from '../utils'\nimport type { SwitchContext } from './switch.types'\n\nconst [SwitchProvider, useSwitchContext] = createContext<SwitchContext>({ isOptional: true })\n\nexport { SwitchProvider, useSwitchContext }\n"],"mappings":";;;;AAGA,MAAM,CAAC,gBAAgB,oBAAoB,cAA6B,EAAE,YAAY,MAAM,CAAC"}

package/dist/switch/index.d.ts

@@ -2,4 +2,4 @@ import { SwitchButtonProps, SwitchContext, SwitchProps } from "./switch.types.js
 import { SwitchProvider, useSwitchContext } from "./context.js";
 import { SwitchButton, SwitchButtonBase } from "./switchButton.js";
 import { SwitchLabel } from "./switchLabel.js";
-import { Switch, SwitchBase } from "./switchMain.js";
+import { Switch, SwitchBase } from "./switchMain.js";

package/dist/switch/index.js

@@ -0,0 +1,6 @@
+import { SwitchProvider, useSwitchContext } from "./context.js";
+import { SwitchButton, SwitchButtonBase } from "./switchButton.js";
+import { SwitchLabel } from "./switchLabel.js";
+import { Switch, SwitchBase } from "./switchMain.js";
+
+globalThis.__vuiVersion__ = "4.0.0-beta.1"

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

@@ -3,7 +3,7 @@ import "../utils/index.js";
 import { ThemingProps } from "../theme/types.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
-import { ReactNode, ReactText } from "react";
+import { ReactNode } from "react";
 
 //#region src/switch/switch.types.d.ts
 type SwitchButtonProps = SystemProps & ThemingProps<'Switch'> & {
@@ -69,8 +69,9 @@ type SwitchProps = SystemProps & ThemingProps<'Switch'> & {
   /** Passed to the inner input. */
   required?: boolean;
   /** Passed to the inner input. */
-  value?: ReactText;
+  value?: string | readonly string[] | number | undefined;
 };
 //#endregion
 export { SwitchButtonProps, SwitchContext, SwitchProps };
+
 //# sourceMappingURL=switch.types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"switch.types.d.ts","names":[],"sources":["../../src/switch/switch.types.ts"],"sourcesContent":[],"mappings":"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"}
+{"version":3,"file":"switch.types.d.ts","names":[],"sources":["../../src/switch/switch.types.ts"],"sourcesContent":[],"mappings":";;;;;;;;KAMY,iBAAA,GAAoB,cAC9B;;;;EADU,WAAA,CAAA,EAAA,MAAiB,GAAA,OAAA,GAAA,UAAA;EAAG;EAC9B,QAAA,CAAA,EAAA,OAAA;EAQkB;EAED,aAAA,CAAA,EAFC,SAED;EAEe;EAAjB,YAAA,CAAA,EAFE,SAEF;EAEqB;EAAvB,UAAM,CAAA,EAFJ,OAEI,CAAA,OAAA,EAFa,WAEb,CAAA;EAIR;EAEE,QAAA,CAAA,EANA,KAAA,CAAM,gBAMN,CANuB,gBAMvB,GAAA,IAAA,CAAA,GAAA,IAAA;EAED;EAAiB,IAAA,CAAA,EAAA,MAAA;EAOnB;EAiBA,MAAA,CAAA,EA5BC,iBA4BU;EAAG;EACxB,QAAA,CAAA,EA3Ba,kBA2Bb;EAEW;EAQO,OAAA,CAAA,EAnCN,iBAmCM;EAED;EAEe,QAAA,CAAA,EAAA,OAAA;EAAjB;EAEqB,KAAA,CAAA,EAAA,MAAA,GAAA,MAAA;CAAvB;AAEC,KApCJ,aAAA,GAAgB,IAoCZ,CAnCd,WAmCc,EAAA,SAAA,GAAA,aAAA,GAAA,UAAA,GAAA,MAAA,GAAA,QAAA,GAAA,UAAA,GAAA,SAAA,GAAA,UAAA,GAAA,MAAA,GAAA,OAAA,GAAA,SAAA,CAAA,GAAA;EAEC,cAAA,CAAA,EAAA,OAAA;CAIJ;AAEE,KA3BH,WAAA,GAAc,WA2BX,GA1Bb,YA0Ba,CAAA,QAAA,CAAA,GAAA;EAED;EAAiB,MAAA,CAAA,EA1BlB,SA0BkB;;;;;;;;kBAlBX;;iBAED;;eAEF,iBAAiB;;aAEnB,KAAA,CAAM,iBAAiB;;cAEtB;;eAEC;;;;WAIJ;;aAEE;;YAED"}

package/dist/switch/switchButton.d.ts

@@ -2,10 +2,10 @@ import { SystemProps } from "../system/system.js";
 import { VuiComponent } from "../core/vui.js";
 import { SwitchButtonProps } from "./switch.types.js";
 import "../index.js";
-import * as styled_components440 from "styled-components";
+import * as styled_components396 from "styled-components";
 
 //#region src/switch/switchButton.d.ts
-declare const SwitchButtonBase: styled_components440.StyledComponent<"span", any, SystemProps, never>;
+declare const SwitchButtonBase: styled_components396.StyledComponent<"span", any, SystemProps, never>;
 /**
  * Controls the logic and visuals of multiple inner parts, such as input, track or thumb elements.
  * Handles controlled and uncontrolled modes.
@@ -13,4 +13,5 @@ declare const SwitchButtonBase: styled_components440.StyledComponent<"span", any
 declare const SwitchButton: VuiComponent<"span", SwitchButtonProps>;
 //#endregion
 export { SwitchButton, SwitchButtonBase };
+
 //# sourceMappingURL=switchButton.d.ts.map

package/dist/switch/switchButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switchButton.d.ts","names":[],"sources":["../../src/switch/switchButton.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAyCa,kBAAgB,oBAAA,CAAA,6BAkB5B,WAAA,CAAA;;;;;cAMY,cAAY,qBAAA"}
+{"version":3,"file":"switchButton.d.ts","names":[],"sources":["../../src/switch/switchButton.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAyCa,kBAAgB,oBAAA,CAAA,6BAkB5B,WAAA;;;;;cAMY,cAAY,qBAAA"}

package/dist/switch/switchButton.js

@@ -1,9 +1,11 @@
 import { filterUndefined } from "../utils/object.js";
 import { cs } from "../utils/styles.js";
+import "../utils/index.js";
 import { switchColors } from "./consts.js";
 import { omitThemingProps, useStyleConfig } from "../core/theme.js";
 import { styled } from "../core/styled.js";
 import { vui } from "../core/vui.js";
+import "../core/index.js";
 import { useSwitchContext } from "./context.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -61,14 +63,14 @@ const SwitchButtonBase = styled(SwitchFoundation)`
 * Handles controlled and uncontrolled modes.
 */
 const SwitchButton = vui((props, ref) => {
-	const { checked, className, defaultChecked, disabled, id, innerLabelOff, innerLabelOn, inputProps, inputRef, name, onBlur, onChange, onFocus, required, value,...rest } = omitThemingProps({
+	const { checked, className, defaultChecked, disabled, id, innerLabelOff, innerLabelOn, inputProps, inputRef, name, onBlur, onChange, onFocus, required, value, ...rest } = omitThemingProps({
 		...useSwitchContext(),
 		...props
 	});
 	const { current: isControlled } = useRef(checked !== void 0);
 	const [isChecked, setIsChecked] = useState(checked ?? defaultChecked);
 	const [isFocused, setIsFocused] = useState(false);
-	const { thumb: thumbStyles, track: trackStyles,...buttonStyles } = useStyleConfig("Switch", useSwitchContext()).button;
+	const { thumb: thumbStyles, track: trackStyles, ...buttonStyles } = useStyleConfig("Switch", useSwitchContext()).button;
 	useEffect(() => {
 		if (isControlled) setIsChecked(checked);
 	}, [checked, isControlled]);
@@ -144,5 +146,5 @@ SwitchButton.displayName = "SwitchButton";
 
 //#endregion
 export { SwitchButton, SwitchButtonBase };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=switchButton.js.map

package/dist/switch/switchButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"switchButton.js","names":[],"sources":["../../src/switch/switchButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport { omitThemingProps, styled, useStyleConfig, vui } from '../core'\nimport type { ChangeEvent, FocusEvent } from '../utils'\nimport { cs, filterUndefined } from '../utils'\nimport { switchColors } from './consts'\nimport { useSwitchContext } from './context'\nimport type { SwitchButtonProps } from './switch.types'\n\nconst SwitchInput = styled.inputBox`\n  cursor: inherit;\n  height: calc(100% + 10px);\n  left: -5px;\n  margin: 0;\n  opacity: 0;\n  padding: 0;\n  position: absolute;\n  top: -5px;\n  width: calc(100% + 10px);\n  z-index: 1;\n`\n\nconst SwitchFoundation = styled.spanBox`\n  border-radius: 100px;\n  display: inline-flex;\n  flex-shrink: 0;\n  transition-duration: fast;\n  position: relative;\n`\n\n/** Circular element that moves along the track when toggled. */\nconst SwitchThumb = styled(SwitchFoundation)`\n  position: absolute;\n`\n\n/** Track element along which the thumb moves when toggled. */\nconst SwitchTrack = styled(SwitchFoundation)`\n  align-items: center;\n  flex: 1;\n`\n\nexport const SwitchButtonBase = styled(SwitchFoundation)`\n  color: white;\n  cursor: pointer;\n  --x-ring-color: green;\n\n  &[aria-disabled='true'] {\n    cursor: not-allowed;\n\n    .vui-switchThumb {\n      background-color: ${switchColors.disabled};\n    }\n\n    .vui-switchTrack {\n      --x-ring-color: ${switchColors.disabled};\n      background-color: ${switchColors.disabledBg};\n      color: ${switchColors.disabled};\n    }\n  }\n`\n\n/**\n * Controls the logic and visuals of multiple inner parts, such as input, track or thumb elements.\n * Handles controlled and uncontrolled modes.\n */\nexport const SwitchButton = vui<'span', SwitchButtonProps>((props, ref) => {\n  const mergedProps = { ...useSwitchContext(), ...props }\n  const {\n    checked,\n    className,\n    defaultChecked,\n    disabled,\n    id,\n    innerLabelOff,\n    innerLabelOn,\n    inputProps,\n    inputRef,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    required,\n    value,\n    ...rest\n  } = omitThemingProps(mergedProps)\n  const { current: isControlled } = useRef(checked !== undefined)\n  const [isChecked, setIsChecked] = useState(checked ?? defaultChecked)\n  const [isFocused, setIsFocused] = useState(false)\n  const styles = useStyleConfig('Switch', useSwitchContext())\n  const { thumb: thumbStyles, track: trackStyles, ...buttonStyles } = styles.button\n\n  useEffect(() => {\n    if (isControlled) setIsChecked(checked)\n  }, [checked, isControlled])\n\n  function handleOnBlur(e: FocusEvent) {\n    setIsFocused(false)\n    onBlur?.(e)\n  }\n\n  function handleOnChange(e: ChangeEvent) {\n    if (!isControlled) setIsChecked(e.target.checked)\n    onChange?.(e)\n  }\n\n  function handleOnFocus(e: FocusEvent) {\n    setIsFocused(true)\n    onFocus?.(e)\n  }\n\n  const hDiff = (thumbStyles.h - trackStyles.h) / 2\n  const thumbOffset = `calc(100% - ${Math.abs(hDiff - thumbStyles.h)}px)`\n  const labelOffset = `${thumbStyles.h - hDiff + 4}px`\n\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n    'data-focused': isFocused ? true : false,\n  })\n\n  const thumbAliasedProps = filterUndefined({\n    left: isChecked ? thumbOffset : -hDiff,\n    ring: isFocused ? thumbStyles.ring : 0,\n  })\n\n  const trackAliasedProps = filterUndefined({\n    bg: isChecked ? trackStyles.bg : innerLabelOff ? switchColors.offBgContrast : switchColors.offBg,\n    pl: isChecked ? 1 : labelOffset,\n    pr: isChecked ? labelOffset : 1,\n    ring: !disabled ? (isFocused ? trackStyles.ring : 0) : 3,\n  })\n\n  return (\n    <SwitchButtonBase\n      className={cs('vui-switchButton', className)}\n      ref={ref}\n      {...buttonStyles}\n      {...aliasedProps}\n      {...rest}\n    >\n      <SwitchInput\n        className=\"vui-switchInput\"\n        onBlur={handleOnBlur}\n        onChange={handleOnChange}\n        onFocus={handleOnFocus}\n        ref={inputRef}\n        tabIndex={-1}\n        type=\"checkbox\"\n        {...{ checked, defaultChecked, disabled, id, name, required, value }}\n        {...inputProps}\n      />\n\n      <SwitchTrack className=\"vui-switchTrack\" tabIndex={0} {...trackStyles} {...trackAliasedProps}>\n        {!isChecked && innerLabelOff}\n\n        <SwitchThumb className=\"vui-switchThumb\" {...thumbStyles} {...thumbAliasedProps} />\n\n        {isChecked && innerLabelOn}\n      </SwitchTrack>\n    </SwitchButtonBase>\n  )\n})\n\nSwitchButton.displayName = 'SwitchButton'\n\nexport default SwitchButton\n"],"mappings":";;;;;;;;;;;AASA,MAAM,cAAc,OAAO,QAAQ;;;;;;;;;;;;AAanC,MAAM,mBAAmB,OAAO,OAAO;;;;;;;;AASvC,MAAM,cAAc,OAAO,iBAAiB;;;;AAK5C,MAAM,cAAc,OAAO,iBAAiB;;;;AAK5C,MAAa,mBAAmB,OAAO,iBAAiB;;;;;;;;;0BAS9B,aAAa,SAAS;;;;wBAIxB,aAAa,SAAS;0BACpB,aAAa,WAAW;eACnC,aAAa,SAAS;;;;;;;;AASrC,MAAa,eAAe,KAAgC,OAAO,QAAQ;CAEzE,MAAM,EACJ,SACA,WACA,gBACA,UACA,IACA,eACA,cACA,YACA,UACA,MACA,QACA,UACA,SACA,UACA,MACA,GAAG,SACD,iBAlBgB;EAAE,GAAG,kBAAkB;EAAE,GAAG;EAAO,CAkBtB;CACjC,MAAM,EAAE,SAAS,iBAAiB,OAAO,YAAY,OAAU;CAC/D,MAAM,CAAC,WAAW,gBAAgB,SAAS,WAAW,eAAe;CACrE,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CAEjD,MAAM,EAAE,OAAO,aAAa,OAAO,YAAa,GAAG,iBADpC,eAAe,UAAU,kBAAkB,CAAC,CACgB;AAE3E,iBAAgB;AACd,MAAI,aAAc,cAAa,QAAQ;IACtC,CAAC,SAAS,aAAa,CAAC;CAE3B,SAAS,aAAa,GAAe;AACnC,eAAa,MAAM;AACnB,WAAS,EAAE;;CAGb,SAAS,eAAe,GAAgB;AACtC,MAAI,CAAC,aAAc,cAAa,EAAE,OAAO,QAAQ;AACjD,aAAW,EAAE;;CAGf,SAAS,cAAc,GAAe;AACpC,eAAa,KAAK;AAClB,YAAU,EAAE;;CAGd,MAAM,SAAS,YAAY,IAAI,YAAY,KAAK;CAChD,MAAM,cAAc,eAAe,KAAK,IAAI,QAAQ,YAAY,EAAE,CAAC;CACnE,MAAM,cAAc,GAAG,YAAY,IAAI,QAAQ,EAAE;CAEjD,MAAM,eAAe,gBAAgB;EACnC,iBAAiB;EACjB,gBAAgB,YAAY,OAAO;EACpC,CAAC;CAEF,MAAM,oBAAoB,gBAAgB;EACxC,MAAM,YAAY,cAAc,CAAC;EACjC,MAAM,YAAY,YAAY,OAAO;EACtC,CAAC;CAEF,MAAM,oBAAoB,gBAAgB;EACxC,IAAI,YAAY,YAAY,KAAK,gBAAgB,aAAa,gBAAgB,aAAa;EAC3F,IAAI,YAAY,IAAI;EACpB,IAAI,YAAY,cAAc;EAC9B,MAAM,CAAC,WAAY,YAAY,YAAY,OAAO,IAAK;EACxD,CAAC;AAEF,QACE,qBAAC;EACC,WAAW,GAAG,oBAAoB,UAAU;EACvC;EACL,GAAI;EACJ,GAAI;EACJ,GAAI;aAEJ,oBAAC;GACC,WAAU;GACV,QAAQ;GACR,UAAU;GACV,SAAS;GACT,KAAK;GACL,UAAU;GACV,MAAK;GACC;GAAS;GAAgB;GAAU;GAAI;GAAM;GAAU;GAC7D,GAAI;IACJ,EAEF,qBAAC;GAAY,WAAU;GAAkB,UAAU;GAAG,GAAI;GAAa,GAAI;;IACxE,CAAC,aAAa;IAEf,oBAAC;KAAY,WAAU;KAAkB,GAAI;KAAa,GAAI;MAAqB;IAElF,aAAa;;IACF;GACG;EAErB;AAEF,aAAa,cAAc"}
+{"version":3,"file":"switchButton.js","names":[],"sources":["../../src/switch/switchButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport { omitThemingProps, styled, useStyleConfig, vui } from '../core'\nimport type { ChangeEvent, FocusEvent } from '../utils'\nimport { cs, filterUndefined } from '../utils'\nimport { switchColors } from './consts'\nimport { useSwitchContext } from './context'\nimport type { SwitchButtonProps } from './switch.types'\n\nconst SwitchInput = styled.inputBox`\n  cursor: inherit;\n  height: calc(100% + 10px);\n  left: -5px;\n  margin: 0;\n  opacity: 0;\n  padding: 0;\n  position: absolute;\n  top: -5px;\n  width: calc(100% + 10px);\n  z-index: 1;\n`\n\nconst SwitchFoundation = styled.spanBox`\n  border-radius: 100px;\n  display: inline-flex;\n  flex-shrink: 0;\n  transition-duration: fast;\n  position: relative;\n`\n\n/** Circular element that moves along the track when toggled. */\nconst SwitchThumb = styled(SwitchFoundation)`\n  position: absolute;\n`\n\n/** Track element along which the thumb moves when toggled. */\nconst SwitchTrack = styled(SwitchFoundation)`\n  align-items: center;\n  flex: 1;\n`\n\nexport const SwitchButtonBase = styled(SwitchFoundation)`\n  color: white;\n  cursor: pointer;\n  --x-ring-color: green;\n\n  &[aria-disabled='true'] {\n    cursor: not-allowed;\n\n    .vui-switchThumb {\n      background-color: ${switchColors.disabled};\n    }\n\n    .vui-switchTrack {\n      --x-ring-color: ${switchColors.disabled};\n      background-color: ${switchColors.disabledBg};\n      color: ${switchColors.disabled};\n    }\n  }\n`\n\n/**\n * Controls the logic and visuals of multiple inner parts, such as input, track or thumb elements.\n * Handles controlled and uncontrolled modes.\n */\nexport const SwitchButton = vui<'span', SwitchButtonProps>((props, ref) => {\n  const mergedProps = { ...useSwitchContext(), ...props }\n  const {\n    checked,\n    className,\n    defaultChecked,\n    disabled,\n    id,\n    innerLabelOff,\n    innerLabelOn,\n    inputProps,\n    inputRef,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    required,\n    value,\n    ...rest\n  } = omitThemingProps(mergedProps)\n  // eslint-disable-next-line @eslint-react/naming-convention/ref-name\n  const { current: isControlled } = useRef(checked !== undefined)\n  const [isChecked, setIsChecked] = useState(checked ?? defaultChecked)\n  const [isFocused, setIsFocused] = useState(false)\n  const styles = useStyleConfig('Switch', useSwitchContext())\n  const { thumb: thumbStyles, track: trackStyles, ...buttonStyles } = styles.button\n\n  useEffect(() => {\n    if (isControlled) setIsChecked(checked)\n  }, [checked, isControlled])\n\n  function handleOnBlur(e: FocusEvent) {\n    setIsFocused(false)\n    onBlur?.(e)\n  }\n\n  function handleOnChange(e: ChangeEvent) {\n    if (!isControlled) setIsChecked(e.target.checked)\n    onChange?.(e)\n  }\n\n  function handleOnFocus(e: FocusEvent) {\n    setIsFocused(true)\n    onFocus?.(e)\n  }\n\n  const hDiff = (thumbStyles.h - trackStyles.h) / 2\n  const thumbOffset = `calc(100% - ${Math.abs(hDiff - thumbStyles.h)}px)`\n  const labelOffset = `${thumbStyles.h - hDiff + 4}px`\n\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n    'data-focused': isFocused ? true : false,\n  })\n\n  const thumbAliasedProps = filterUndefined({\n    left: isChecked ? thumbOffset : -hDiff,\n    ring: isFocused ? thumbStyles.ring : 0,\n  })\n\n  const trackAliasedProps = filterUndefined({\n    bg: isChecked ? trackStyles.bg : innerLabelOff ? switchColors.offBgContrast : switchColors.offBg,\n    pl: isChecked ? 1 : labelOffset,\n    pr: isChecked ? labelOffset : 1,\n    ring: !disabled ? (isFocused ? trackStyles.ring : 0) : 3,\n  })\n\n  return (\n    <SwitchButtonBase\n      className={cs('vui-switchButton', className)}\n      ref={ref}\n      {...buttonStyles}\n      {...aliasedProps}\n      {...rest}\n    >\n      <SwitchInput\n        className=\"vui-switchInput\"\n        onBlur={handleOnBlur}\n        onChange={handleOnChange}\n        onFocus={handleOnFocus}\n        ref={inputRef}\n        tabIndex={-1}\n        type=\"checkbox\"\n        {...{ checked, defaultChecked, disabled, id, name, required, value }}\n        {...inputProps}\n      />\n\n      <SwitchTrack className=\"vui-switchTrack\" tabIndex={0} {...trackStyles} {...trackAliasedProps}>\n        {!isChecked && innerLabelOff}\n\n        <SwitchThumb className=\"vui-switchThumb\" {...thumbStyles} {...thumbAliasedProps} />\n\n        {isChecked && innerLabelOn}\n      </SwitchTrack>\n    </SwitchButtonBase>\n  )\n})\n\nSwitchButton.displayName = 'SwitchButton'\n\nexport default SwitchButton\n"],"mappings":";;;;;;;;;;;;;AASA,MAAM,cAAc,OAAO,QAAQ;;;;;;;;;;;;AAanC,MAAM,mBAAmB,OAAO,OAAO;;;;;;;;AASvC,MAAM,cAAc,OAAO,iBAAiB;;;;AAK5C,MAAM,cAAc,OAAO,iBAAiB;;;;AAK5C,MAAa,mBAAmB,OAAO,iBAAiB;;;;;;;;;0BAS9B,aAAa,SAAS;;;;wBAIxB,aAAa,SAAS;0BACpB,aAAa,WAAW;eACnC,aAAa,SAAS;;;;;;;;AASrC,MAAa,eAAe,KAAgC,OAAO,QAAQ;CAEzE,MAAM,EACJ,SACA,WACA,gBACA,UACA,IACA,eACA,cACA,YACA,UACA,MACA,QACA,UACA,SACA,UACA,OACA,GAAG,SACD,iBAlBgB;EAAE,GAAG,kBAAkB;EAAE,GAAG;EAAO,CAkBtB;CAEjC,MAAM,EAAE,SAAS,iBAAiB,OAAO,YAAY,OAAU;CAC/D,MAAM,CAAC,WAAW,gBAAgB,SAAS,WAAW,eAAe;CACrE,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CAEjD,MAAM,EAAE,OAAO,aAAa,OAAO,aAAa,GAAG,iBADpC,eAAe,UAAU,kBAAkB,CAAC,CACgB;AAE3E,iBAAgB;AACd,MAAI,aAAc,cAAa,QAAQ;IACtC,CAAC,SAAS,aAAa,CAAC;CAE3B,SAAS,aAAa,GAAe;AACnC,eAAa,MAAM;AACnB,WAAS,EAAE;;CAGb,SAAS,eAAe,GAAgB;AACtC,MAAI,CAAC,aAAc,cAAa,EAAE,OAAO,QAAQ;AACjD,aAAW,EAAE;;CAGf,SAAS,cAAc,GAAe;AACpC,eAAa,KAAK;AAClB,YAAU,EAAE;;CAGd,MAAM,SAAS,YAAY,IAAI,YAAY,KAAK;CAChD,MAAM,cAAc,eAAe,KAAK,IAAI,QAAQ,YAAY,EAAE,CAAC;CACnE,MAAM,cAAc,GAAG,YAAY,IAAI,QAAQ,EAAE;CAEjD,MAAM,eAAe,gBAAgB;EACnC,iBAAiB;EACjB,gBAAgB,YAAY,OAAO;EACpC,CAAC;CAEF,MAAM,oBAAoB,gBAAgB;EACxC,MAAM,YAAY,cAAc,CAAC;EACjC,MAAM,YAAY,YAAY,OAAO;EACtC,CAAC;CAEF,MAAM,oBAAoB,gBAAgB;EACxC,IAAI,YAAY,YAAY,KAAK,gBAAgB,aAAa,gBAAgB,aAAa;EAC3F,IAAI,YAAY,IAAI;EACpB,IAAI,YAAY,cAAc;EAC9B,MAAM,CAAC,WAAY,YAAY,YAAY,OAAO,IAAK;EACxD,CAAC;AAEF,QACE,qBAAC;EACC,WAAW,GAAG,oBAAoB,UAAU;EACvC;EACL,GAAI;EACJ,GAAI;EACJ,GAAI;aAEJ,oBAAC;GACC,WAAU;GACV,QAAQ;GACR,UAAU;GACV,SAAS;GACT,KAAK;GACL,UAAU;GACV,MAAK;GACC;GAAS;GAAgB;GAAU;GAAI;GAAM;GAAU;GAC7D,GAAI;IACJ,EAEF,qBAAC;GAAY,WAAU;GAAkB,UAAU;GAAG,GAAI;GAAa,GAAI;;IACxE,CAAC,aAAa;IAEf,oBAAC;KAAY,WAAU;KAAkB,GAAI;KAAa,GAAI;MAAqB;IAElF,aAAa;;IACF;GACG;EAErB;AAEF,aAAa,cAAc"}

package/dist/switch/switchLabel.d.ts

@@ -1,6 +1,6 @@
+import { VuiComponent } from "../core/vui.js";
 import { TProps } from "../t/t.types.js";
 import "../t/index.js";
-import { VuiComponent } from "../core/vui.js";
 import "../index.js";
 
 //#region src/switch/switchLabel.d.ts
@@ -8,4 +8,5 @@ import "../index.js";
 declare const SwitchLabel: VuiComponent<"span", TProps>;
 //#endregion
 export { SwitchLabel };
+
 //# sourceMappingURL=switchLabel.d.ts.map

package/dist/switch/switchLabel.js

@@ -1,14 +1,17 @@
 import { cs } from "../utils/styles.js";
+import "../utils/index.js";
 import { useStyleConfig } from "../core/theme.js";
 import { vui } from "../core/vui.js";
 import t_default from "../t/t.js";
+import "../t/index.js";
+import "../core/index.js";
 import { useSwitchContext } from "./context.js";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/switch/switchLabel.tsx
 /** Displays label text within the Switch component. */
 const SwitchLabel = vui((props, ref) => {
-	const { className,...rest } = props;
+	const { className, ...rest } = props;
 	const styles = useStyleConfig("Switch", useSwitchContext());
 	if (styles.label.size === "xl") rest.fontSize = 20;
 	return /* @__PURE__ */ jsx(t_default, {
@@ -23,5 +26,5 @@ SwitchLabel.displayName = "SwitchLabel";
 
 //#endregion
 export { SwitchLabel };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=switchLabel.js.map

package/dist/switch/switchLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"switchLabel.js","names":["T"],"sources":["../../src/switch/switchLabel.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { TProps } from '../t'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useSwitchContext } from './context'\n\n/** Displays label text within the Switch component. */\nexport const SwitchLabel = vui<'span', TProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Switch', useSwitchContext())\n\n  // <T> has xs but not xl\n  if (styles.label.size === 'xl') {\n    rest.fontSize = 20\n  }\n\n  return <T className={cs('vui-switchLabel', className)} display=\"flex\" ref={ref} {...styles.label} {...rest} />\n})\n\nSwitchLabel.displayName = 'SwitchLabel'\n\nexport default SwitchLabel\n"],"mappings":";;;;;;;;;AAOA,MAAa,cAAc,KAAqB,OAAO,QAAQ;CAC7D,MAAM,EAAE,UAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;AAG3D,KAAI,OAAO,MAAM,SAAS,KACxB,MAAK,WAAW;AAGlB,QAAO,oBAACA;EAAE,WAAW,GAAG,mBAAmB,UAAU;EAAE,SAAQ;EAAY;EAAK,GAAI,OAAO;EAAO,GAAI;GAAQ;EAC9G;AAEF,YAAY,cAAc"}
+{"version":3,"file":"switchLabel.js","names":["T"],"sources":["../../src/switch/switchLabel.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { TProps } from '../t'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useSwitchContext } from './context'\n\n/** Displays label text within the Switch component. */\nexport const SwitchLabel = vui<'span', TProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Switch', useSwitchContext())\n\n  // <T> has xs but not xl\n  if (styles.label.size === 'xl') {\n    rest.fontSize = 20\n  }\n\n  return <T className={cs('vui-switchLabel', className)} display=\"flex\" ref={ref} {...styles.label} {...rest} />\n})\n\nSwitchLabel.displayName = 'SwitchLabel'\n\nexport default SwitchLabel\n"],"mappings":";;;;;;;;;;;;AAOA,MAAa,cAAc,KAAqB,OAAO,QAAQ;CAC7D,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;AAG3D,KAAI,OAAO,MAAM,SAAS,KACxB,MAAK,WAAW;AAGlB,QAAO,oBAACA;EAAE,WAAW,GAAG,mBAAmB,UAAU;EAAE,SAAQ;EAAY;EAAK,GAAI,OAAO;EAAO,GAAI;GAAQ;EAC9G;AAEF,YAAY,cAAc"}

package/dist/switch/switchMain.d.ts

@@ -5,10 +5,10 @@ import { SwitchProps } from "./switch.types.js";
 import { SwitchButton } from "./switchButton.js";
 import { SwitchLabel } from "./switchLabel.js";
 import "../index.js";
-import * as styled_components438 from "styled-components";
+import * as styled_components397 from "styled-components";
 
 //#region src/switch/switchMain.d.ts
-declare const SwitchBase: styled_components438.StyledComponent<"label", styled_components438.DefaultTheme, SystemProps, never>;
+declare const SwitchBase: styled_components397.StyledComponent<"label", styled_components397.DefaultTheme, SystemProps, never>;
 /**
  * Displays a toggle button with supporting text. Allows passing custom elements as side labels and inner labels.
  * Forwards many relevant props to the innner input element. Exposes some props to the children via context.
@@ -19,4 +19,5 @@ declare const Switch: VuiComponent<"label", SwitchProps> & {
 };
 //#endregion
 export { Switch, SwitchBase };
+
 //# sourceMappingURL=switchMain.d.ts.map

package/dist/switch/switchMain.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switchMain.d.ts","names":[],"sources":["../../src/switch/switchMain.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;cAUa,YAAU,oBAAA,CAAA,yBActB,oBAAA,CAdsB,YAAA,CAAA,CAAA,WAAA,CAAA;;;;;cAoBV,QA4DP,sBAAsB;EAhFf,MAAA,CAAA,CAAA,MAAA,CAiFI,YAnEhB;EAAA,KAAA,CAAA,CAAA,MAAA,CAoEe,WAlFO;CAAA"}
+{"version":3,"file":"switchMain.d.ts","names":[],"sources":["../../src/switch/switchMain.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;cAUa,YAAU,oBAAA,CAAA,yBActB,oBAAA,CAdsB,YAAA,EAAA,WAAA;;;;;cAoBV,QA4DP,sBAAsB;EAhFf,MAAA,EAAA,OAiFI,YAnEhB;EAAA,KAAA,EAAA,OAoEe,WAlFO;CAAA"}

package/dist/switch/switchMain.js

@@ -1,9 +1,11 @@
 import { isReactText } from "../utils/assertion.js";
 import { filterUndefined } from "../utils/object.js";
 import { cs } from "../utils/styles.js";
+import "../utils/index.js";
 import { useStyleConfig } from "../core/theme.js";
 import { styled } from "../core/styled.js";
 import { vui } from "../core/vui.js";
+import "../core/index.js";
 import { SwitchProvider } from "./context.js";
 import { SwitchButton } from "./switchButton.js";
 import { SwitchLabel } from "./switchLabel.js";
@@ -31,7 +33,7 @@ const SwitchBase = styled.labelBox`
 * Forwards many relevant props to the innner input element. Exposes some props to the children via context.
 */
 const Switch = vui((props, ref) => {
-	const { button, checked, children, className, defaultChecked, disabled, id, innerLabelOff, innerLabelOn, inputProps, inputRef, labelLeft, labelRight, name, onBlur, onChange, onFocus, required, size, value, variant,...rest } = props;
+	const { button, checked, children, className, defaultChecked, disabled, id, innerLabelOff, innerLabelOn, inputProps, inputRef, labelLeft, labelRight, name, onBlur, onChange, onFocus, required, size, value, variant, ...rest } = props;
 	const styles = useStyleConfig("Switch", props);
 	const context = useMemo(() => filterUndefined({
 		checked,
@@ -93,5 +95,5 @@ Switch.displayName = "Switch";
 
 //#endregion
 export { Switch, SwitchBase };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=switchMain.js.map

package/dist/switch/switchMain.js.map

@@ -1 +1 @@
-{"version":3,"file":"switchMain.js","names":[],"sources":["../../src/switch/switchMain.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { cs, filterUndefined, isReactText } from '../utils'\nimport { SwitchProvider } from './context'\nimport type { SwitchProps } from './switch.types'\nimport { SwitchButton } from './switchButton'\nimport { SwitchLabel } from './switchLabel'\n\nexport const SwitchBase = styled.labelBox`\n  align-items: center;\n  cursor: pointer;\n  display: inline-flex;\n  line-height: normal;\n  width: fit-content;\n\n  &[aria-disabled='true'] {\n    cursor: not-allowed;\n\n    .vui-switchLabel {\n      color: disabled.color;\n    }\n  }\n`\n\n/**\n * Displays a toggle button with supporting text. Allows passing custom elements as side labels and inner labels.\n * Forwards many relevant props to the innner input element. Exposes some props to the children via context.\n */\nexport const Switch = vui<'label', SwitchProps>((props, ref) => {\n  const {\n    button,\n    checked,\n    children,\n    className,\n    defaultChecked,\n    disabled,\n    id,\n    innerLabelOff,\n    innerLabelOn,\n    inputProps,\n    inputRef,\n    labelLeft,\n    labelRight,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    required,\n    size,\n    value,\n    variant,\n    ...rest\n  } = props\n  const styles = useStyleConfig('Switch', props)\n\n  const context = useMemo(\n    () =>\n      filterUndefined({\n        checked,\n        defaultChecked,\n        disabled,\n        name,\n        onBlur,\n        onChange,\n        onFocus,\n        required,\n        size,\n        value,\n        variant,\n      }),\n    [checked, defaultChecked, disabled, name, onBlur, onChange, onFocus, required, size, value, variant],\n  )\n\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n  })\n\n  return (\n    <SwitchProvider value={context}>\n      <SwitchBase className={cs('vui-switch', className)} ref={ref} {...styles.container} {...aliasedProps} {...rest}>\n        {isReactText(labelLeft) ? <SwitchLabel mr={1} text={labelLeft} /> : labelLeft}\n\n        {children ?? button ?? <SwitchButton {...{ id, innerLabelOff, innerLabelOn, inputProps, inputRef }} />}\n\n        {isReactText(labelRight) ? <SwitchLabel ml={1} text={labelRight} /> : labelRight}\n      </SwitchBase>\n    </SwitchProvider>\n  )\n}) as VuiComponent<'label', SwitchProps> & {\n  Button: typeof SwitchButton\n  Label: typeof SwitchLabel\n}\n\nSwitch.Button = SwitchButton\nSwitch.Label = SwitchLabel\nSwitch.displayName = 'Switch'\n\nexport default Switch\n"],"mappings":";;;;;;;;;;;;;AAUA,MAAa,aAAa,OAAO,QAAQ;;;;;;;;;;;;;;;;;;;AAoBzC,MAAa,SAAS,KAA2B,OAAO,QAAQ;CAC9D,MAAM,EACJ,QACA,SACA,UACA,WACA,gBACA,UACA,IACA,eACA,cACA,YACA,UACA,WACA,YACA,MACA,QACA,UACA,SACA,UACA,MACA,OACA,QACA,GAAG,SACD;CACJ,MAAM,SAAS,eAAe,UAAU,MAAM;CAE9C,MAAM,UAAU,cAEZ,gBAAgB;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,EACJ;EAAC;EAAS;EAAgB;EAAU;EAAM;EAAQ;EAAU;EAAS;EAAU;EAAM;EAAO;EAAQ,CACrG;CAED,MAAM,eAAe,gBAAgB,EACnC,iBAAiB,UAClB,CAAC;AAEF,QACE,oBAAC;EAAe,OAAO;YACrB,qBAAC;GAAW,WAAW,GAAG,cAAc,UAAU;GAAO;GAAK,GAAI,OAAO;GAAW,GAAI;GAAc,GAAI;;IACvG,YAAY,UAAU,GAAG,oBAAC;KAAY,IAAI;KAAG,MAAM;MAAa,GAAG;IAEnE,YAAY,UAAU,oBAAC;KAAmB;KAAI;KAAe;KAAc;KAAY;MAAc;IAErG,YAAY,WAAW,GAAG,oBAAC;KAAY,IAAI;KAAG,MAAM;MAAc,GAAG;;IAC3D;GACE;EAEnB;AAKF,OAAO,SAAS;AAChB,OAAO,QAAQ;AACf,OAAO,cAAc"}
+{"version":3,"file":"switchMain.js","names":[],"sources":["../../src/switch/switchMain.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport type { VuiComponent } from '../core'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { cs, filterUndefined, isReactText } from '../utils'\nimport { SwitchProvider } from './context'\nimport type { SwitchProps } from './switch.types'\nimport { SwitchButton } from './switchButton'\nimport { SwitchLabel } from './switchLabel'\n\nexport const SwitchBase = styled.labelBox`\n  align-items: center;\n  cursor: pointer;\n  display: inline-flex;\n  line-height: normal;\n  width: fit-content;\n\n  &[aria-disabled='true'] {\n    cursor: not-allowed;\n\n    .vui-switchLabel {\n      color: disabled.color;\n    }\n  }\n`\n\n/**\n * Displays a toggle button with supporting text. Allows passing custom elements as side labels and inner labels.\n * Forwards many relevant props to the innner input element. Exposes some props to the children via context.\n */\nexport const Switch = vui<'label', SwitchProps>((props, ref) => {\n  const {\n    button,\n    checked,\n    children,\n    className,\n    defaultChecked,\n    disabled,\n    id,\n    innerLabelOff,\n    innerLabelOn,\n    inputProps,\n    inputRef,\n    labelLeft,\n    labelRight,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    required,\n    size,\n    value,\n    variant,\n    ...rest\n  } = props\n  const styles = useStyleConfig('Switch', props)\n\n  const context = useMemo(\n    () =>\n      filterUndefined({\n        checked,\n        defaultChecked,\n        disabled,\n        name,\n        onBlur,\n        onChange,\n        onFocus,\n        required,\n        size,\n        value,\n        variant,\n      }),\n    [checked, defaultChecked, disabled, name, onBlur, onChange, onFocus, required, size, value, variant],\n  )\n\n  const aliasedProps = filterUndefined({\n    'aria-disabled': disabled,\n  })\n\n  return (\n    <SwitchProvider value={context}>\n      <SwitchBase className={cs('vui-switch', className)} ref={ref} {...styles.container} {...aliasedProps} {...rest}>\n        {isReactText(labelLeft) ? <SwitchLabel mr={1} text={labelLeft} /> : labelLeft}\n\n        {children ?? button ?? <SwitchButton {...{ id, innerLabelOff, innerLabelOn, inputProps, inputRef }} />}\n\n        {isReactText(labelRight) ? <SwitchLabel ml={1} text={labelRight} /> : labelRight}\n      </SwitchBase>\n    </SwitchProvider>\n  )\n}) as VuiComponent<'label', SwitchProps> & {\n  Button: typeof SwitchButton\n  Label: typeof SwitchLabel\n}\n\nSwitch.Button = SwitchButton\nSwitch.Label = SwitchLabel\nSwitch.displayName = 'Switch'\n\nexport default Switch\n"],"mappings":";;;;;;;;;;;;;;;AAUA,MAAa,aAAa,OAAO,QAAQ;;;;;;;;;;;;;;;;;;;AAoBzC,MAAa,SAAS,KAA2B,OAAO,QAAQ;CAC9D,MAAM,EACJ,QACA,SACA,UACA,WACA,gBACA,UACA,IACA,eACA,cACA,YACA,UACA,WACA,YACA,MACA,QACA,UACA,SACA,UACA,MACA,OACA,SACA,GAAG,SACD;CACJ,MAAM,SAAS,eAAe,UAAU,MAAM;CAE9C,MAAM,UAAU,cAEZ,gBAAgB;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,EACJ;EAAC;EAAS;EAAgB;EAAU;EAAM;EAAQ;EAAU;EAAS;EAAU;EAAM;EAAO;EAAQ,CACrG;CAED,MAAM,eAAe,gBAAgB,EACnC,iBAAiB,UAClB,CAAC;AAEF,QACE,oBAAC;EAAe,OAAO;YACrB,qBAAC;GAAW,WAAW,GAAG,cAAc,UAAU;GAAO;GAAK,GAAI,OAAO;GAAW,GAAI;GAAc,GAAI;;IACvG,YAAY,UAAU,GAAG,oBAAC;KAAY,IAAI;KAAG,MAAM;MAAa,GAAG;IAEnE,YAAY,UAAU,oBAAC;KAAmB;KAAI;KAAe;KAAc;KAAY;MAAc;IAErG,YAAY,WAAW,GAAG,oBAAC;KAAY,IAAI;KAAG,MAAM;MAAc,GAAG;;IAC3D;GACE;EAEnB;AAKF,OAAO,SAAS;AAChB,OAAO,QAAQ;AACf,OAAO,cAAc"}

package/dist/switch/theme.js

@@ -91,5 +91,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "3.2.0"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=theme.js.map

package/dist/system/animations.d.ts

@@ -11,4 +11,5 @@ type AnimationProps = {
 type AnimationsProps = AnimationProps;
 //#endregion
 export { AnimationGetter, AnimationProp, AnimationProps, AnimationsProps };
+
 //# sourceMappingURL=animations.d.ts.map

package/dist/system/animations.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"animations.d.ts","names":[],"sources":["../../src/system/animations.ts"],"sourcesContent":[],"mappings":";;;;KAIY,eAAA,CAAA,CAAA,CAAkB,aAAa;KAE/B,aAAA,CAAA,CAAA,CAAgB,WAAW,iBAAiB;AAF5C,IAAA,CAIA,cAAA,CAAA,CAAA,CAJe;EAEf,SAAA,CAAA,CAAA,CAGE,aAHW;EAAc,cAAA,CAAA,CAAA,CAIpB,aAJoB;CAAiB;AAA5B,IAAA,CAOhB,eAAA,CAAA,CAAA,CAAkB,cAPF"}
+{"version":3,"file":"animations.d.ts","names":[],"sources":["../../src/system/animations.ts"],"sourcesContent":[],"mappings":";;;;KAIY,eAAA,GAAkB,aAAa;KAE/B,aAAA,GAAgB,WAAW,iBAAiB;AAF5C,KAIA,cAAA,GAJe;EAEf,SAAA,CAAA,EAGE,aAHW;EAAc,cAAA,CAAA,EAIpB,aAJoB;CAAiB;AAA5B,KAOhB,eAAA,GAAkB,cAPF"}

package/dist/system/backgrounds.d.ts

@@ -13,4 +13,5 @@ type BackgroundColorProps = {
 type BackgroundsProps = BackgroundColorProps;
 //#endregion
 export { BackgroundColorProps, BackgroundsProps };
+
 //# sourceMappingURL=backgrounds.d.ts.map

package/dist/system/backgrounds.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"backgrounds.d.ts","names":[],"sources":["../../src/system/backgrounds.ts"],"sourcesContent":[],"mappings":";;;;;KAKK,mBAAA,CAAA,CAAA,CAAsB,WAAW,aAAa;KACvC,oBAAA,CAAA,CAAA;EADP,QAAA,CAAA,CAAA,CAEQ,mBAFW;EAAc,EAAA,CAAA,CAAA,CAG/B,mBAH+B;EAAa,UAAA,CAAA,CAAA,CAIpC,mBAJoC;EAAxB,OAAA,CAAA,CAAA,CAKf,mBALe;CAAU;AACzB,IAAA,CAOA,gBAAA,CAAA,CAAA,CAAmB,oBAPC"}
+{"version":3,"file":"backgrounds.d.ts","names":[],"sources":["../../src/system/backgrounds.ts"],"sourcesContent":[],"mappings":";;;;;KAKK,mBAAA,GAAsB,WAAW,aAAa;KACvC,oBAAA;EADP,QAAA,CAAA,EAEQ,mBAFW;EAAc,EAAA,CAAA,EAG/B,mBAH+B;EAAa,UAAA,CAAA,EAIpC,mBAJoC;EAAxB,OAAA,CAAA,EAKf,mBALe;CAAU;AACzB,KAOA,gBAAA,GAAmB,oBAPC"}