@veracity/vui 3.0.0-beta.8 → 3.0.0-beta.9

package/dist/spinner/consts.js.map

@@ -1 +1 @@
-{"version":3,"file":"consts.js","names":["spinnerSpeedMapping: Dict<string>"],"sources":["../../src/spinner/consts.ts"],"sourcesContent":["import type { Dict } from '../utils'\n\nexport const spinnerPositionMapping = {\n  bottom: {\n    container: { flexDirection: 'column' },\n  },\n  left: {\n    container: { flexDirection: 'row-reverse' },\n  },\n  right: {\n    container: { flexDirection: 'row' },\n  },\n  top: {\n    container: { flexDirection: 'column-reverse' },\n  },\n}\n\nexport const spinnerSpeedMapping: Dict<string> = {\n  slow: '1s',\n  normal: '0.9s',\n  fast: '0.8s',\n}\n"],"mappings":"AAEA,MAAa,EAAyB,CACpC,OAAQ,CACN,UAAW,CAAE,cAAe,SAAU,CACvC,CACD,KAAM,CACJ,UAAW,CAAE,cAAe,cAAe,CAC5C,CACD,MAAO,CACL,UAAW,CAAE,cAAe,MAAO,CACpC,CACD,IAAK,CACH,UAAW,CAAE,cAAe,iBAAkB,CAC/C,CACF,CAEYA,EAAoC,CAC/C,KAAM,KACN,OAAQ,OACR,KAAM,OACP"}
+{"version":3,"file":"consts.js","names":["spinnerSpeedMapping: Dict<string>"],"sources":["../../src/spinner/consts.ts"],"sourcesContent":["import type { Dict } from '../utils'\n\nexport const spinnerPositionMapping = {\n  bottom: {\n    container: { flexDirection: 'column' },\n  },\n  left: {\n    container: { flexDirection: 'row-reverse' },\n  },\n  right: {\n    container: { flexDirection: 'row' },\n  },\n  top: {\n    container: { flexDirection: 'column-reverse' },\n  },\n}\n\nexport const spinnerSpeedMapping: Dict<string> = {\n  slow: '1s',\n  normal: '0.9s',\n  fast: '0.8s',\n}\n"],"mappings":";AAEA,MAAa,yBAAyB;CACpC,QAAQ,EACN,WAAW,EAAE,eAAe,UAAU,EACvC;CACD,MAAM,EACJ,WAAW,EAAE,eAAe,eAAe,EAC5C;CACD,OAAO,EACL,WAAW,EAAE,eAAe,OAAO,EACpC;CACD,KAAK,EACH,WAAW,EAAE,eAAe,kBAAkB,EAC/C;CACF;AAED,MAAaA,sBAAoC;CAC/C,MAAM;CACN,QAAQ;CACR,MAAM;CACP"}

package/dist/spinner/spinner.d.ts

@@ -1,10 +1,10 @@
 import { SystemProps } from "../system/system.js";
 import { VuiComponent } from "../core/vui.js";
 import { SpinnerProps } from "./spinner.types.js";
-import * as styled_components381 from "styled-components";
+import * as styled_components416 from "styled-components";
 
 //#region src/spinner/spinner.d.ts
-declare const SpinnerCircle: styled_components381.StyledComponent<"div", styled_components381.DefaultTheme, SystemProps, never>;
+declare const SpinnerCircle: styled_components416.StyledComponent<"div", styled_components416.DefaultTheme, SystemProps, never>;
 /**
  * Displays a spinning circular element with optional text to signify loading content.
  *

package/dist/spinner/spinner.js

@@ -1,6 +1,60 @@
-import{filterUndefined as e}from"../utils/object.js";import{cs as t}from"../utils/styles.js";import{useStyleConfig as n}from"../core/theme.js";import{styled as r}from"../core/styled.js";import{vui as i}from"../core/vui.js";import a from"../box/box.js";import o from"../t/t.js";import{spinnerPositionMapping as s,spinnerSpeedMapping as c}from"./consts.js";import{jsx as l,jsxs as u}from"react/jsx-runtime";const d=r.divBox`
+import { filterUndefined } from "../utils/object.js";
+import { cs } from "../utils/styles.js";
+import { useStyleConfig } from "../core/theme.js";
+import { styled } from "../core/styled.js";
+import { vui } from "../core/vui.js";
+import box_default from "../box/box.js";
+import t_default from "../t/t.js";
+import { spinnerPositionMapping, spinnerSpeedMapping } from "./consts.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/spinner/spinner.tsx
+const SpinnerCircle = styled.divBox`
   border-radius: round;
   display: flex;
   flex-shrink: 0;
-`,f=i((r,i)=>{let{className:f,emptyColor:p,size:m,speed:h=`normal`,text:g,textPosition:_=`bottom`,thickness:v,...y}=r,b=n(`Spinner`,r),x=typeof m==`number`,S=s[_],C=c[h]??h,w=e({borderColor:p,borderWidth:x?v??4:v,h:x?m:void 0,w:x?m:void 0});return u(a,{center:!0,className:t(`vui-spinner`,f),gap:1,ref:i,transitionDuration:`fast`,...S.container,...b.container,...y,children:[l(d,{animation:`vui-spin ${C} linear infinite`,className:`vui-spinnerCircle`,...b.circle,...w}),!!g&&l(o,{className:`vui-spinnerText`,...b.text,children:g})]})});f.displayName=`Spinner`;export{f as Spinner,d as SpinnerCircle};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+`;
+/**
+* Displays a spinning circular element with optional text to signify loading content.
+*
+* Handles different positioning scenarios, speeds and coloring of the circle.
+*/
+const Spinner = vui((props, ref) => {
+	const { className, emptyColor, size, speed: speedProp = "normal", text, textPosition = "bottom", thickness,...rest } = props;
+	const styles = useStyleConfig("Spinner", props);
+	const isCustomSize = typeof size === "number";
+	const positionProps = spinnerPositionMapping[textPosition];
+	const speed = spinnerSpeedMapping[speedProp] ?? speedProp;
+	const circleProps = filterUndefined({
+		borderColor: emptyColor,
+		borderWidth: isCustomSize ? thickness ?? 4 : thickness,
+		h: isCustomSize ? size : void 0,
+		w: isCustomSize ? size : void 0
+	});
+	return /* @__PURE__ */ jsxs(box_default, {
+		center: true,
+		className: cs("vui-spinner", className),
+		gap: 1,
+		ref,
+		transitionDuration: "fast",
+		...positionProps.container,
+		...styles.container,
+		...rest,
+		children: [/* @__PURE__ */ jsx(SpinnerCircle, {
+			animation: `vui-spin ${speed} linear infinite`,
+			className: "vui-spinnerCircle",
+			...styles.circle,
+			...circleProps
+		}), !!text && /* @__PURE__ */ jsx(t_default, {
+			className: "vui-spinnerText",
+			...styles.text,
+			children: text
+		})]
+	});
+});
+Spinner.displayName = "Spinner";
+
+//#endregion
+export { Spinner, SpinnerCircle };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=spinner.js.map

package/dist/spinner/spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","names":["Box","T"],"sources":["../../src/spinner/spinner.tsx"],"sourcesContent":["import Box from '../box'\nimport { styled, useStyleConfig, vui } from '../core'\nimport T from '../t'\nimport { cs, filterUndefined } from '../utils'\nimport { spinnerPositionMapping, spinnerSpeedMapping } from './consts'\nimport type { SpinnerProps } from './spinner.types'\n\nexport const SpinnerCircle = styled.divBox`\n  border-radius: round;\n  display: flex;\n  flex-shrink: 0;\n`\n\n/**\n * Displays a spinning circular element with optional text to signify loading content.\n *\n * Handles different positioning scenarios, speeds and coloring of the circle.\n */\nexport const Spinner = vui<'div', SpinnerProps>((props, ref) => {\n  const {\n    className,\n    emptyColor,\n    size,\n    speed: speedProp = 'normal',\n    text,\n    textPosition = 'bottom',\n    thickness,\n    ...rest\n  } = props\n\n  const styles = useStyleConfig('Spinner', props)\n  const isCustomSize = typeof size === 'number'\n  const positionProps = spinnerPositionMapping[textPosition]\n  const speed = spinnerSpeedMapping[speedProp] ?? speedProp\n\n  const circleProps = filterUndefined({\n    borderColor: emptyColor,\n    borderWidth: isCustomSize ? (thickness ?? 4) : thickness,\n    h: isCustomSize ? size : undefined,\n    w: isCustomSize ? size : undefined,\n  })\n\n  return (\n    <Box\n      center\n      className={cs('vui-spinner', className)}\n      gap={1}\n      ref={ref}\n      transitionDuration=\"fast\"\n      {...positionProps.container}\n      {...styles.container}\n      {...rest}\n    >\n      <SpinnerCircle\n        animation={`vui-spin ${speed} linear infinite`}\n        className=\"vui-spinnerCircle\"\n        {...styles.circle}\n        {...circleProps}\n      />\n      {!!text && (\n        <T className=\"vui-spinnerText\" {...styles.text}>\n          {text}\n        </T>\n      )}\n    </Box>\n  )\n})\n\nSpinner.displayName = 'Spinner'\nexport default Spinner\n"],"mappings":"qZAOA,MAAa,EAAgB,EAAO,MAAM;;;;EAW7B,EAAU,GAA0B,EAAO,IAAQ,CAC9D,GAAM,CACJ,YACA,aACA,OACA,MAAO,EAAY,SACnB,OACA,eAAe,SACf,YACA,GAAG,GACD,EAEE,EAAS,EAAe,UAAW,EAAM,CACzC,EAAe,OAAO,GAAS,SAC/B,EAAgB,EAAuB,GACvC,EAAQ,EAAoB,IAAc,EAE1C,EAAc,EAAgB,CAClC,YAAa,EACb,YAAa,EAAgB,GAAa,EAAK,EAC/C,EAAG,EAAe,EAAO,IAAA,GACzB,EAAG,EAAe,EAAO,IAAA,GAC1B,CAAC,CAEF,OACE,EAACA,EAAAA,CACC,OAAA,GACA,UAAW,EAAG,cAAe,EAAU,CACvC,IAAK,EACA,MACL,mBAAmB,OACnB,GAAI,EAAc,UAClB,GAAI,EAAO,UACX,GAAI,YAEJ,EAAC,EAAA,CACC,UAAW,YAAY,EAAM,kBAC7B,UAAU,oBACV,GAAI,EAAO,OACX,GAAI,GACJ,CACD,CAAC,CAAC,GACD,EAACC,EAAAA,CAAE,UAAU,kBAAkB,GAAI,EAAO,cACvC,GACC,CAAA,EAEF,EAER,CAEF,EAAQ,YAAc"}
+{"version":3,"file":"spinner.js","names":["Box","T"],"sources":["../../src/spinner/spinner.tsx"],"sourcesContent":["import Box from '../box'\nimport { styled, useStyleConfig, vui } from '../core'\nimport T from '../t'\nimport { cs, filterUndefined } from '../utils'\nimport { spinnerPositionMapping, spinnerSpeedMapping } from './consts'\nimport type { SpinnerProps } from './spinner.types'\n\nexport const SpinnerCircle = styled.divBox`\n  border-radius: round;\n  display: flex;\n  flex-shrink: 0;\n`\n\n/**\n * Displays a spinning circular element with optional text to signify loading content.\n *\n * Handles different positioning scenarios, speeds and coloring of the circle.\n */\nexport const Spinner = vui<'div', SpinnerProps>((props, ref) => {\n  const {\n    className,\n    emptyColor,\n    size,\n    speed: speedProp = 'normal',\n    text,\n    textPosition = 'bottom',\n    thickness,\n    ...rest\n  } = props\n\n  const styles = useStyleConfig('Spinner', props)\n  const isCustomSize = typeof size === 'number'\n  const positionProps = spinnerPositionMapping[textPosition]\n  const speed = spinnerSpeedMapping[speedProp] ?? speedProp\n\n  const circleProps = filterUndefined({\n    borderColor: emptyColor,\n    borderWidth: isCustomSize ? (thickness ?? 4) : thickness,\n    h: isCustomSize ? size : undefined,\n    w: isCustomSize ? size : undefined,\n  })\n\n  return (\n    <Box\n      center\n      className={cs('vui-spinner', className)}\n      gap={1}\n      ref={ref}\n      transitionDuration=\"fast\"\n      {...positionProps.container}\n      {...styles.container}\n      {...rest}\n    >\n      <SpinnerCircle\n        animation={`vui-spin ${speed} linear infinite`}\n        className=\"vui-spinnerCircle\"\n        {...styles.circle}\n        {...circleProps}\n      />\n      {!!text && (\n        <T className=\"vui-spinnerText\" {...styles.text}>\n          {text}\n        </T>\n      )}\n    </Box>\n  )\n})\n\nSpinner.displayName = 'Spinner'\nexport default Spinner\n"],"mappings":";;;;;;;;;;;AAOA,MAAa,gBAAgB,OAAO,MAAM;;;;;;;;;;AAW1C,MAAa,UAAU,KAA0B,OAAO,QAAQ;CAC9D,MAAM,EACJ,WACA,YACA,MACA,OAAO,YAAY,UACnB,MACA,eAAe,UACf,UACA,GAAG,SACD;CAEJ,MAAM,SAAS,eAAe,WAAW,MAAM;CAC/C,MAAM,eAAe,OAAO,SAAS;CACrC,MAAM,gBAAgB,uBAAuB;CAC7C,MAAM,QAAQ,oBAAoB,cAAc;CAEhD,MAAM,cAAc,gBAAgB;EAClC,aAAa;EACb,aAAa,eAAgB,aAAa,IAAK;EAC/C,GAAG,eAAe,OAAO;EACzB,GAAG,eAAe,OAAO;EAC1B,CAAC;AAEF,QACE,qBAACA;EACC;EACA,WAAW,GAAG,eAAe,UAAU;EACvC,KAAK;EACA;EACL,oBAAmB;EACnB,GAAI,cAAc;EAClB,GAAI,OAAO;EACX,GAAI;aAEJ,oBAAC;GACC,WAAW,YAAY,MAAM;GAC7B,WAAU;GACV,GAAI,OAAO;GACX,GAAI;IACJ,EACD,CAAC,CAAC,QACD,oBAACC;GAAE,WAAU;GAAkB,GAAI,OAAO;aACvC;IACC;GAEF;EAER;AAEF,QAAQ,cAAc"}

package/dist/spinner/theme.js

@@ -1,2 +1,82 @@
-var e={baseStyle:{container:{padding:1}},defaultProps:{size:`xxxl`,variant:`light`},parts:[`container`,`circle`,`text`],sizes:{xs:{circle:{borderWidth:2,h:20,w:20}},sm:{circle:{borderWidth:2,h:24,w:24}},md:{circle:{borderWidth:3,h:32,w:32}},lg:{circle:{borderWidth:3,h:40,w:40}},xl:{circle:{borderWidth:3,h:48,w:48}},xxl:{circle:{borderWidth:4,h:60,w:60}},xxxl:{circle:{borderWidth:5,h:80,w:80}},xxxxl:{circle:{borderWidth:5,h:120,w:120}}},variants:{light:{circle:{borderColor:`seaBlue.80`,borderTopColor:`seaBlue.main`},text:{color:`seaBlue.main`}},dark:{container:{bg:`darkBlue.main`},circle:{borderColor:`hsl(139, 100%, 78%, 0.4)`,borderTopColor:`digiGreen.main`},text:{color:`digiGreen.main`}}}};export{e as default};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+//#region src/spinner/theme.ts
+const baseStyle = { container: { padding: 1 } };
+const defaultProps = {
+	size: "xxxl",
+	variant: "light"
+};
+const parts = [
+	"container",
+	"circle",
+	"text"
+];
+const sizes = {
+	xs: { circle: {
+		borderWidth: 2,
+		h: 20,
+		w: 20
+	} },
+	sm: { circle: {
+		borderWidth: 2,
+		h: 24,
+		w: 24
+	} },
+	md: { circle: {
+		borderWidth: 3,
+		h: 32,
+		w: 32
+	} },
+	lg: { circle: {
+		borderWidth: 3,
+		h: 40,
+		w: 40
+	} },
+	xl: { circle: {
+		borderWidth: 3,
+		h: 48,
+		w: 48
+	} },
+	xxl: { circle: {
+		borderWidth: 4,
+		h: 60,
+		w: 60
+	} },
+	xxxl: { circle: {
+		borderWidth: 5,
+		h: 80,
+		w: 80
+	} },
+	xxxxl: { circle: {
+		borderWidth: 5,
+		h: 120,
+		w: 120
+	} }
+};
+const variants = {
+	light: {
+		circle: {
+			borderColor: "seaBlue.80",
+			borderTopColor: "seaBlue.main"
+		},
+		text: { color: "seaBlue.main" }
+	},
+	dark: {
+		container: { bg: "darkBlue.main" },
+		circle: {
+			borderColor: "hsl(139, 100%, 78%, 0.4)",
+			borderTopColor: "digiGreen.main"
+		},
+		text: { color: "digiGreen.main" }
+	}
+};
+var theme_default = {
+	baseStyle,
+	defaultProps,
+	parts,
+	sizes,
+	variants
+};
+
+//#endregion
+export { theme_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=theme.js.map

package/dist/spinner/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/spinner/theme.ts"],"sourcesContent":["const baseStyle = {\n  container: {\n    padding: 1,\n  },\n}\n\nconst defaultProps = {\n  size: 'xxxl',\n  variant: 'light',\n}\n\nconst parts = ['container', 'circle', 'text']\n\nconst sizes = {\n  xs: {\n    circle: {\n      borderWidth: 2,\n      h: 20,\n      w: 20,\n    },\n  },\n  sm: {\n    circle: {\n      borderWidth: 2,\n      h: 24,\n      w: 24,\n    },\n  },\n  md: {\n    circle: {\n      borderWidth: 3,\n      h: 32,\n      w: 32,\n    },\n  },\n  lg: {\n    circle: {\n      borderWidth: 3,\n      h: 40,\n      w: 40,\n    },\n  },\n  xl: {\n    circle: {\n      borderWidth: 3,\n      h: 48,\n      w: 48,\n    },\n  },\n  xxl: {\n    circle: {\n      borderWidth: 4,\n      h: 60,\n      w: 60,\n    },\n  },\n  xxxl: {\n    circle: {\n      borderWidth: 5,\n      h: 80,\n      w: 80,\n    },\n  },\n  xxxxl: {\n    circle: {\n      borderWidth: 5,\n      h: 120,\n      w: 120,\n    },\n  },\n}\n\nconst variants = {\n  light: {\n    circle: {\n      borderColor: 'seaBlue.80',\n      borderTopColor: 'seaBlue.main',\n    },\n    text: {\n      color: 'seaBlue.main',\n    },\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n    },\n    circle: {\n      borderColor: 'hsl(139, 100%, 78%, 0.4)',\n      borderTopColor: 'digiGreen.main',\n    },\n    text: {\n      color: 'digiGreen.main',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":"AAgGA,IAAA,EAAe,CACb,UAjGgB,CAChB,UAAW,CACT,QAAS,EACV,CACF,CA8FC,aA5FmB,CACnB,KAAM,OACN,QAAS,QACV,CA0FC,MAxFY,CAAC,YAAa,SAAU,OAAO,CAyF3C,MAvFY,CACZ,GAAI,CACF,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,GAAI,CACF,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,GAAI,CACF,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,GAAI,CACF,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,GAAI,CACF,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,IAAK,CACH,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,KAAM,CACJ,OAAQ,CACN,YAAa,EACb,EAAG,GACH,EAAG,GACJ,CACF,CACD,MAAO,CACL,OAAQ,CACN,YAAa,EACb,EAAG,IACH,EAAG,IACJ,CACF,CACF,CA+BC,SA7Be,CACf,MAAO,CACL,OAAQ,CACN,YAAa,aACb,eAAgB,eACjB,CACD,KAAM,CACJ,MAAO,eACR,CACF,CACD,KAAM,CACJ,UAAW,CACT,GAAI,gBACL,CACD,OAAQ,CACN,YAAa,2BACb,eAAgB,iBACjB,CACD,KAAM,CACJ,MAAO,iBACR,CACF,CACF,CAQA"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/spinner/theme.ts"],"sourcesContent":["const baseStyle = {\n  container: {\n    padding: 1,\n  },\n}\n\nconst defaultProps = {\n  size: 'xxxl',\n  variant: 'light',\n}\n\nconst parts = ['container', 'circle', 'text']\n\nconst sizes = {\n  xs: {\n    circle: {\n      borderWidth: 2,\n      h: 20,\n      w: 20,\n    },\n  },\n  sm: {\n    circle: {\n      borderWidth: 2,\n      h: 24,\n      w: 24,\n    },\n  },\n  md: {\n    circle: {\n      borderWidth: 3,\n      h: 32,\n      w: 32,\n    },\n  },\n  lg: {\n    circle: {\n      borderWidth: 3,\n      h: 40,\n      w: 40,\n    },\n  },\n  xl: {\n    circle: {\n      borderWidth: 3,\n      h: 48,\n      w: 48,\n    },\n  },\n  xxl: {\n    circle: {\n      borderWidth: 4,\n      h: 60,\n      w: 60,\n    },\n  },\n  xxxl: {\n    circle: {\n      borderWidth: 5,\n      h: 80,\n      w: 80,\n    },\n  },\n  xxxxl: {\n    circle: {\n      borderWidth: 5,\n      h: 120,\n      w: 120,\n    },\n  },\n}\n\nconst variants = {\n  light: {\n    circle: {\n      borderColor: 'seaBlue.80',\n      borderTopColor: 'seaBlue.main',\n    },\n    text: {\n      color: 'seaBlue.main',\n    },\n  },\n  dark: {\n    container: {\n      bg: 'darkBlue.main',\n    },\n    circle: {\n      borderColor: 'hsl(139, 100%, 78%, 0.4)',\n      borderTopColor: 'digiGreen.main',\n    },\n    text: {\n      color: 'digiGreen.main',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":";AAAA,MAAM,YAAY,EAChB,WAAW,EACT,SAAS,GACV,EACF;AAED,MAAM,eAAe;CACnB,MAAM;CACN,SAAS;CACV;AAED,MAAM,QAAQ;CAAC;CAAa;CAAU;CAAO;AAE7C,MAAM,QAAQ;CACZ,IAAI,EACF,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,IAAI,EACF,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,IAAI,EACF,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,IAAI,EACF,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,IAAI,EACF,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,KAAK,EACH,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,MAAM,EACJ,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACD,OAAO,EACL,QAAQ;EACN,aAAa;EACb,GAAG;EACH,GAAG;EACJ,EACF;CACF;AAED,MAAM,WAAW;CACf,OAAO;EACL,QAAQ;GACN,aAAa;GACb,gBAAgB;GACjB;EACD,MAAM,EACJ,OAAO,gBACR;EACF;CACD,MAAM;EACJ,WAAW,EACT,IAAI,iBACL;EACD,QAAQ;GACN,aAAa;GACb,gBAAgB;GACjB;EACD,MAAM,EACJ,OAAO,kBACR;EACF;CACF;AAED,oBAAe;CACb;CACA;CACA;CACA;CACA;CACD"}

package/dist/stepIndicator/stepIndicator.js

@@ -1,2 +1,73 @@
-import{cs as e}from"../utils/styles.js";import{useStyleConfig as t}from"../core/theme.js";import{vui as n}from"../core/vui.js";import r from"../box/box.js";import i from"../icon/icon.js";import a from"../t/t.js";import o from"../button/button.js";import{jsx as s,jsxs as c}from"react/jsx-runtime";const l=({number:e,variant:t,size:n})=>e===void 0?null:t===`completed`?s(i,{name:`uiCheck`,size:n}):t===`error`?s(i,{name:`uiTimes`,size:n}):s(a,{fontSize:n===`md`?16:14,fontWeight:600,children:e}),u=n((n,i)=>{let{icon:a,number:u,className:d,size:f=`md`,variant:p=`active`,...m}=n,h=t(`StepIndicator`,n);return a?s(o,{className:e(`vui-stepIndicator`,`vui-stepIndicatorIcon`,d),icon:a,ref:i,...h.icon,...m,isRound:!0,minW:`auto`,pointerEvents:`none`,size:f}):c(o,{className:e(`vui-stepIndicator`,`vui-stepIndicatorNumber`,d),ref:i,...h.button,...m,isRound:!0,minW:`auto`,outline:`6px solid white`,pointerEvents:`none`,position:`relative`,size:f,children:[s(r,{mx:.5,position:`relative`}),s(r,{mx:.5,position:`absolute`,children:s(l,{number:u,size:String(f),variant:String(p)})})]})});u.displayName=`StepIndicator`;export{u as StepIndicator};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+import { cs } from "../utils/styles.js";
+import { useStyleConfig } from "../core/theme.js";
+import { vui } from "../core/vui.js";
+import box_default from "../box/box.js";
+import icon_default from "../icon/icon.js";
+import t_default from "../t/t.js";
+import button_default from "../button/button.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/stepIndicator/stepIndicator.tsx
+const Content = ({ number, variant, size }) => {
+	if (typeof number === "undefined") return null;
+	if (variant === "completed") return /* @__PURE__ */ jsx(icon_default, {
+		name: "uiCheck",
+		size
+	});
+	if (variant === "error") return /* @__PURE__ */ jsx(icon_default, {
+		name: "uiTimes",
+		size
+	});
+	return /* @__PURE__ */ jsx(t_default, {
+		fontSize: size === "md" ? 16 : 14,
+		fontWeight: 600,
+		children: number
+	});
+};
+/**
+* Implements stepper indicator **
+*/
+const StepIndicator = vui((props, ref) => {
+	const { icon, number, className, size = "md", variant = "active",...rest } = props;
+	const styles = useStyleConfig("StepIndicator", props);
+	return icon ? /* @__PURE__ */ jsx(button_default, {
+		className: cs("vui-stepIndicator", "vui-stepIndicatorIcon", className),
+		icon,
+		ref,
+		...styles.icon,
+		...rest,
+		isRound: true,
+		minW: "auto",
+		pointerEvents: "none",
+		size
+	}) : /* @__PURE__ */ jsxs(button_default, {
+		className: cs("vui-stepIndicator", "vui-stepIndicatorNumber", className),
+		ref,
+		...styles.button,
+		...rest,
+		isRound: true,
+		minW: "auto",
+		outline: "6px solid white",
+		pointerEvents: "none",
+		position: "relative",
+		size,
+		children: [/* @__PURE__ */ jsx(box_default, {
+			mx: .5,
+			position: "relative"
+		}), /* @__PURE__ */ jsx(box_default, {
+			mx: .5,
+			position: "absolute",
+			children: /* @__PURE__ */ jsx(Content, {
+				number,
+				size: String(size),
+				variant: String(variant)
+			})
+		})]
+	});
+});
+StepIndicator.displayName = "StepIndicator";
+
+//#endregion
+export { StepIndicator };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=stepIndicator.js.map

package/dist/stepIndicator/stepIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepIndicator.js","names":["Icon","T","Button","Box"],"sources":["../../src/stepIndicator/stepIndicator.tsx"],"sourcesContent":["import Box from '../box'\nimport Button from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport T from '../t'\nimport { cs } from '../utils'\nimport type { StepIndicatorProps } from './stepIndicatorTypes'\n\nconst Content = ({ number, variant, size }: { number?: number; variant?: string; size?: string }) => {\n  if (typeof number === 'undefined') return null\n  if (variant === 'completed') return <Icon name=\"uiCheck\" size={size as any} />\n  if (variant === 'error') return <Icon name=\"uiTimes\" size={size as any} />\n  return (\n    <T fontSize={size === 'md' ? 16 : 14} fontWeight={600}>\n      {number}\n    </T>\n  )\n}\n\n/**\n * Implements stepper indicator **\n */\nexport const StepIndicator = vui<'div', StepIndicatorProps>((props, ref) => {\n  const { icon, number, className, size = 'md', variant = 'active', ...rest } = props\n  const styles = useStyleConfig('StepIndicator', props)\n\n  return icon ? (\n    <Button\n      className={cs('vui-stepIndicator', 'vui-stepIndicatorIcon', className)}\n      icon={icon}\n      ref={ref}\n      {...styles.icon}\n      {...rest}\n      isRound\n      minW=\"auto\"\n      pointerEvents=\"none\"\n      size={size}\n    />\n  ) : (\n    <Button\n      className={cs('vui-stepIndicator', 'vui-stepIndicatorNumber', className)}\n      ref={ref}\n      {...styles.button}\n      {...rest}\n      isRound\n      minW=\"auto\"\n      outline=\"6px solid white\"\n      pointerEvents=\"none\"\n      position=\"relative\"\n      size={size}\n    >\n      <Box mx={0.5} position=\"relative\" />\n      <Box mx={0.5} position=\"absolute\">\n        <Content number={number} size={String(size)} variant={String(variant)} />\n      </Box>\n    </Button>\n  )\n})\n\nStepIndicator.displayName = 'StepIndicator'\n\nexport default StepIndicator\n"],"mappings":"ySAQA,MAAM,GAAW,CAAE,SAAQ,UAAS,UACvB,IAAW,OAAoB,KACtC,IAAY,YAAoB,EAACA,EAAAA,CAAK,KAAK,UAAgB,QAAe,CAC1E,IAAY,QAAgB,EAACA,EAAAA,CAAK,KAAK,UAAgB,QAAe,CAExE,EAACC,EAAAA,CAAE,SAAU,IAAS,KAAO,GAAK,GAAI,WAAY,aAC/C,GACC,CAOK,EAAgB,GAAgC,EAAO,IAAQ,CAC1E,GAAM,CAAE,OAAM,SAAQ,YAAW,OAAO,KAAM,UAAU,SAAU,GAAG,GAAS,EACxE,EAAS,EAAe,gBAAiB,EAAM,CAErD,OAAO,EACL,EAACC,EAAAA,CACC,UAAW,EAAG,oBAAqB,wBAAyB,EAAU,CAChE,OACD,MACL,GAAI,EAAO,KACX,GAAI,EACJ,QAAA,GACA,KAAK,OACL,cAAc,OACR,QACN,CAEF,EAACA,EAAAA,CACC,UAAW,EAAG,oBAAqB,0BAA2B,EAAU,CACnE,MACL,GAAI,EAAO,OACX,GAAI,EACJ,QAAA,GACA,KAAK,OACL,QAAQ,kBACR,cAAc,OACd,SAAS,WACH,iBAEN,EAACC,EAAAA,CAAI,GAAI,GAAK,SAAS,YAAa,CACpC,EAACA,EAAAA,CAAI,GAAI,GAAK,SAAS,oBACrB,EAAC,EAAA,CAAgB,SAAQ,KAAM,OAAO,EAAK,CAAE,QAAS,OAAO,EAAQ,EAAI,EACrE,CAAA,EACC,EAEX,CAEF,EAAc,YAAc"}
+{"version":3,"file":"stepIndicator.js","names":["Icon","T","Button","Box"],"sources":["../../src/stepIndicator/stepIndicator.tsx"],"sourcesContent":["import Box from '../box'\nimport Button from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport T from '../t'\nimport { cs } from '../utils'\nimport type { StepIndicatorProps } from './stepIndicatorTypes'\n\nconst Content = ({ number, variant, size }: { number?: number; variant?: string; size?: string }) => {\n  if (typeof number === 'undefined') return null\n  if (variant === 'completed') return <Icon name=\"uiCheck\" size={size as any} />\n  if (variant === 'error') return <Icon name=\"uiTimes\" size={size as any} />\n  return (\n    <T fontSize={size === 'md' ? 16 : 14} fontWeight={600}>\n      {number}\n    </T>\n  )\n}\n\n/**\n * Implements stepper indicator **\n */\nexport const StepIndicator = vui<'div', StepIndicatorProps>((props, ref) => {\n  const { icon, number, className, size = 'md', variant = 'active', ...rest } = props\n  const styles = useStyleConfig('StepIndicator', props)\n\n  return icon ? (\n    <Button\n      className={cs('vui-stepIndicator', 'vui-stepIndicatorIcon', className)}\n      icon={icon}\n      ref={ref}\n      {...styles.icon}\n      {...rest}\n      isRound\n      minW=\"auto\"\n      pointerEvents=\"none\"\n      size={size}\n    />\n  ) : (\n    <Button\n      className={cs('vui-stepIndicator', 'vui-stepIndicatorNumber', className)}\n      ref={ref}\n      {...styles.button}\n      {...rest}\n      isRound\n      minW=\"auto\"\n      outline=\"6px solid white\"\n      pointerEvents=\"none\"\n      position=\"relative\"\n      size={size}\n    >\n      <Box mx={0.5} position=\"relative\" />\n      <Box mx={0.5} position=\"absolute\">\n        <Content number={number} size={String(size)} variant={String(variant)} />\n      </Box>\n    </Button>\n  )\n})\n\nStepIndicator.displayName = 'StepIndicator'\n\nexport default StepIndicator\n"],"mappings":";;;;;;;;;;AAQA,MAAM,WAAW,EAAE,QAAQ,SAAS,WAAiE;AACnG,KAAI,OAAO,WAAW,YAAa,QAAO;AAC1C,KAAI,YAAY,YAAa,QAAO,oBAACA;EAAK,MAAK;EAAgB;GAAe;AAC9E,KAAI,YAAY,QAAS,QAAO,oBAACA;EAAK,MAAK;EAAgB;GAAe;AAC1E,QACE,oBAACC;EAAE,UAAU,SAAS,OAAO,KAAK;EAAI,YAAY;YAC/C;GACC;;;;;AAOR,MAAa,gBAAgB,KAAgC,OAAO,QAAQ;CAC1E,MAAM,EAAE,MAAM,QAAQ,WAAW,OAAO,MAAM,UAAU,SAAU,GAAG,SAAS;CAC9E,MAAM,SAAS,eAAe,iBAAiB,MAAM;AAErD,QAAO,OACL,oBAACC;EACC,WAAW,GAAG,qBAAqB,yBAAyB,UAAU;EAChE;EACD;EACL,GAAI,OAAO;EACX,GAAI;EACJ;EACA,MAAK;EACL,eAAc;EACR;GACN,GAEF,qBAACA;EACC,WAAW,GAAG,qBAAqB,2BAA2B,UAAU;EACnE;EACL,GAAI,OAAO;EACX,GAAI;EACJ;EACA,MAAK;EACL,SAAQ;EACR,eAAc;EACd,UAAS;EACH;aAEN,oBAACC;GAAI,IAAI;GAAK,UAAS;IAAa,EACpC,oBAACA;GAAI,IAAI;GAAK,UAAS;aACrB,oBAAC;IAAgB;IAAQ,MAAM,OAAO,KAAK;IAAE,SAAS,OAAO,QAAQ;KAAI;IACrE;GACC;EAEX;AAEF,cAAc,cAAc"}

package/dist/stepIndicator/theme.js

@@ -1,2 +1,68 @@
-var e={baseStyle:{},defaultProps:{size:`md`,variant:`active`},sizes:{sm:{},md:{}},variants:{active:{button:{bg:`seaBlue.main`},icon:{bg:`white`,color:`seaBlue.main`}},completed:{button:{bg:`landGreen.41`},icon:{bg:`white`,color:`landGreen.41`}},optional:{button:{bg:`white`,borderColor:`seaBlue.45`,color:`seaBlue.45`},icon:{bg:`white`,color:`seaBlue.45`}},pending:{button:{bg:`sandstone.90`,color:`sandstone.45`},icon:{bg:`white`,color:`sandstone.45`}},error:{button:{bg:`energyRed.45`,color:`white`},icon:{bg:`white`,color:`energyRed.45`}}}};export{e as default};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+//#region src/stepIndicator/theme.ts
+const baseStyle = {};
+const defaultProps = {
+	size: "md",
+	variant: "active"
+};
+const sizes = {
+	sm: {},
+	md: {}
+};
+const variants = {
+	active: {
+		button: { bg: "seaBlue.main" },
+		icon: {
+			bg: "white",
+			color: "seaBlue.main"
+		}
+	},
+	completed: {
+		button: { bg: "landGreen.41" },
+		icon: {
+			bg: "white",
+			color: "landGreen.41"
+		}
+	},
+	optional: {
+		button: {
+			bg: "white",
+			borderColor: "seaBlue.45",
+			color: "seaBlue.45"
+		},
+		icon: {
+			bg: "white",
+			color: "seaBlue.45"
+		}
+	},
+	pending: {
+		button: {
+			bg: "sandstone.90",
+			color: "sandstone.45"
+		},
+		icon: {
+			bg: "white",
+			color: "sandstone.45"
+		}
+	},
+	error: {
+		button: {
+			bg: "energyRed.45",
+			color: "white"
+		},
+		icon: {
+			bg: "white",
+			color: "energyRed.45"
+		}
+	}
+};
+var theme_default = {
+	baseStyle,
+	defaultProps,
+	sizes,
+	variants
+};
+
+//#endregion
+export { theme_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=theme.js.map

package/dist/stepIndicator/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/stepIndicator/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'active',\n}\n\nconst sizes = {\n  sm: {},\n  md: {},\n}\n\nconst variants = {\n  active: {\n    button: {\n      bg: 'seaBlue.main',\n    },\n    icon: {\n      bg: 'white',\n      color: 'seaBlue.main',\n    },\n  },\n  completed: {\n    button: {\n      bg: 'landGreen.41',\n    },\n    icon: {\n      bg: 'white',\n      color: 'landGreen.41',\n    },\n  },\n  optional: {\n    button: {\n      bg: 'white',\n      borderColor: 'seaBlue.45',\n      color: 'seaBlue.45',\n    },\n    icon: {\n      bg: 'white',\n      color: 'seaBlue.45',\n    },\n  },\n  pending: {\n    button: {\n      bg: 'sandstone.90',\n      color: 'sandstone.45',\n    },\n    icon: {\n      bg: 'white',\n      color: 'sandstone.45',\n    },\n  },\n  error: {\n    button: {\n      bg: 'energyRed.45',\n      color: 'white',\n    },\n    icon: {\n      bg: 'white',\n      color: 'energyRed.45',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  sizes,\n  variants,\n}\n"],"mappings":"AAgEA,IAAA,EAAe,CACb,UAjEgB,EAAE,CAkElB,aAhEmB,CACnB,KAAM,KACN,QAAS,SACV,CA8DC,MA5DY,CACZ,GAAI,EAAE,CACN,GAAI,EAAE,CACP,CA0DC,SAxDe,CACf,OAAQ,CACN,OAAQ,CACN,GAAI,eACL,CACD,KAAM,CACJ,GAAI,QACJ,MAAO,eACR,CACF,CACD,UAAW,CACT,OAAQ,CACN,GAAI,eACL,CACD,KAAM,CACJ,GAAI,QACJ,MAAO,eACR,CACF,CACD,SAAU,CACR,OAAQ,CACN,GAAI,QACJ,YAAa,aACb,MAAO,aACR,CACD,KAAM,CACJ,GAAI,QACJ,MAAO,aACR,CACF,CACD,QAAS,CACP,OAAQ,CACN,GAAI,eACJ,MAAO,eACR,CACD,KAAM,CACJ,GAAI,QACJ,MAAO,eACR,CACF,CACD,MAAO,CACL,OAAQ,CACN,GAAI,eACJ,MAAO,QACR,CACD,KAAM,CACJ,GAAI,QACJ,MAAO,eACR,CACF,CACF,CAOA"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/stepIndicator/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  size: 'md',\n  variant: 'active',\n}\n\nconst sizes = {\n  sm: {},\n  md: {},\n}\n\nconst variants = {\n  active: {\n    button: {\n      bg: 'seaBlue.main',\n    },\n    icon: {\n      bg: 'white',\n      color: 'seaBlue.main',\n    },\n  },\n  completed: {\n    button: {\n      bg: 'landGreen.41',\n    },\n    icon: {\n      bg: 'white',\n      color: 'landGreen.41',\n    },\n  },\n  optional: {\n    button: {\n      bg: 'white',\n      borderColor: 'seaBlue.45',\n      color: 'seaBlue.45',\n    },\n    icon: {\n      bg: 'white',\n      color: 'seaBlue.45',\n    },\n  },\n  pending: {\n    button: {\n      bg: 'sandstone.90',\n      color: 'sandstone.45',\n    },\n    icon: {\n      bg: 'white',\n      color: 'sandstone.45',\n    },\n  },\n  error: {\n    button: {\n      bg: 'energyRed.45',\n      color: 'white',\n    },\n    icon: {\n      bg: 'white',\n      color: 'energyRed.45',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  sizes,\n  variants,\n}\n"],"mappings":";AAAA,MAAM,YAAY,EAAE;AAEpB,MAAM,eAAe;CACnB,MAAM;CACN,SAAS;CACV;AAED,MAAM,QAAQ;CACZ,IAAI,EAAE;CACN,IAAI,EAAE;CACP;AAED,MAAM,WAAW;CACf,QAAQ;EACN,QAAQ,EACN,IAAI,gBACL;EACD,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACD,WAAW;EACT,QAAQ,EACN,IAAI,gBACL;EACD,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACD,UAAU;EACR,QAAQ;GACN,IAAI;GACJ,aAAa;GACb,OAAO;GACR;EACD,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACD,SAAS;EACP,QAAQ;GACN,IAAI;GACJ,OAAO;GACR;EACD,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACD,OAAO;EACL,QAAQ;GACN,IAAI;GACJ,OAAO;GACR;EACD,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACF;AAED,oBAAe;CACb;CACA;CACA;CACA;CACD"}

package/dist/stepperHorizontal/consts.js

@@ -1,2 +1,25 @@
-const e={active:`seaBlue.main`,completed:`landGreen.41`,optional:`seaBlue.45`,pending:`sandstone.90`,error:`energyRed.main`},t={active:`sandstone.10`,completed:`sandstone.10`,optional:`sandstone.10`,pending:`sandstone.55`,error:`energyRed.main`},n=[`active`,`error`],r=`vui-stepHorizontal`,i=r+`Tail`,a=i+`Left`,o=i+`Right`;export{n as boldTitles,r as stepClassName,i as tailClassName,a as tailClassNameLeft,o as tailClassNameRight,t as titleColor,e as variantColor};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+//#region src/stepperHorizontal/consts.ts
+const variantColor = {
+	active: "seaBlue.main",
+	completed: "landGreen.41",
+	optional: "seaBlue.45",
+	pending: "sandstone.90",
+	error: "energyRed.main"
+};
+const titleColor = {
+	active: "sandstone.10",
+	completed: "sandstone.10",
+	optional: "sandstone.10",
+	pending: "sandstone.55",
+	error: "energyRed.main"
+};
+const boldTitles = ["active", "error"];
+const stepClassName = "vui-stepHorizontal";
+const tailClassName = stepClassName + "Tail";
+const tailClassNameLeft = tailClassName + "Left";
+const tailClassNameRight = tailClassName + "Right";
+
+//#endregion
+export { boldTitles, stepClassName, tailClassName, tailClassNameLeft, tailClassNameRight, titleColor, variantColor };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=consts.js.map

package/dist/stepperHorizontal/consts.js.map

@@ -1 +1 @@
-{"version":3,"file":"consts.js","names":["variantColor: Record<string, string>"],"sources":["../../src/stepperHorizontal/consts.ts"],"sourcesContent":["export const variantColor: Record<string, string> = {\n  active: 'seaBlue.main',\n  completed: 'landGreen.41',\n  optional: 'seaBlue.45',\n  pending: 'sandstone.90',\n  error: 'energyRed.main',\n}\n\nexport const titleColor = {\n  active: 'sandstone.10',\n  completed: 'sandstone.10',\n  optional: 'sandstone.10',\n  pending: 'sandstone.55',\n  error: 'energyRed.main',\n}\n\nexport const boldTitles = ['active', 'error']\n\nexport const stepClassName = 'vui-stepHorizontal'\n\nexport const tailClassName = stepClassName + 'Tail'\n\nexport const tailClassNameLeft = tailClassName + 'Left'\n\nexport const tailClassNameRight = tailClassName + 'Right'\n"],"mappings":"AAAA,MAAaA,EAAuC,CAClD,OAAQ,eACR,UAAW,eACX,SAAU,aACV,QAAS,eACT,MAAO,iBACR,CAEY,EAAa,CACxB,OAAQ,eACR,UAAW,eACX,SAAU,eACV,QAAS,eACT,MAAO,iBACR,CAEY,EAAa,CAAC,SAAU,QAAQ,CAEhC,EAAgB,qBAEhB,EAAgB,EAAgB,OAEhC,EAAoB,EAAgB,OAEpC,EAAqB,EAAgB"}
+{"version":3,"file":"consts.js","names":["variantColor: Record<string, string>"],"sources":["../../src/stepperHorizontal/consts.ts"],"sourcesContent":["export const variantColor: Record<string, string> = {\n  active: 'seaBlue.main',\n  completed: 'landGreen.41',\n  optional: 'seaBlue.45',\n  pending: 'sandstone.90',\n  error: 'energyRed.main',\n}\n\nexport const titleColor = {\n  active: 'sandstone.10',\n  completed: 'sandstone.10',\n  optional: 'sandstone.10',\n  pending: 'sandstone.55',\n  error: 'energyRed.main',\n}\n\nexport const boldTitles = ['active', 'error']\n\nexport const stepClassName = 'vui-stepHorizontal'\n\nexport const tailClassName = stepClassName + 'Tail'\n\nexport const tailClassNameLeft = tailClassName + 'Left'\n\nexport const tailClassNameRight = tailClassName + 'Right'\n"],"mappings":";AAAA,MAAaA,eAAuC;CAClD,QAAQ;CACR,WAAW;CACX,UAAU;CACV,SAAS;CACT,OAAO;CACR;AAED,MAAa,aAAa;CACxB,QAAQ;CACR,WAAW;CACX,UAAU;CACV,SAAS;CACT,OAAO;CACR;AAED,MAAa,aAAa,CAAC,UAAU,QAAQ;AAE7C,MAAa,gBAAgB;AAE7B,MAAa,gBAAgB,gBAAgB;AAE7C,MAAa,oBAAoB,gBAAgB;AAEjD,MAAa,qBAAqB,gBAAgB"}

package/dist/stepperHorizontal/context.js

@@ -1,2 +1,9 @@
-import{createContext as e}from"../utils/react.js";const[t,n]=e({isOptional:!0});export{t as StepperHorizontalProvider,n as useStepperHorizontalContext};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+import { createContext } from "../utils/react.js";
+
+//#region src/stepperHorizontal/context.ts
+const [StepperHorizontalProvider, useStepperHorizontalContext] = createContext({ isOptional: true });
+
+//#endregion
+export { StepperHorizontalProvider, useStepperHorizontalContext };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=context.js.map

package/dist/stepperHorizontal/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../src/stepperHorizontal/context.ts"],"sourcesContent":["import type { Dict } from '../utils'\nimport { createContext } from '../utils'\n\nconst [StepperHorizontalProvider, useStepperHorizontalContext] = createContext<Dict>({ isOptional: true })\n\nexport { StepperHorizontalProvider, useStepperHorizontalContext }\n"],"mappings":"kDAGA,KAAM,CAAC,EAA2B,GAA+B,EAAoB,CAAE,WAAY,GAAM,CAAC"}
+{"version":3,"file":"context.js","names":[],"sources":["../../src/stepperHorizontal/context.ts"],"sourcesContent":["import type { Dict } from '../utils'\nimport { createContext } from '../utils'\n\nconst [StepperHorizontalProvider, useStepperHorizontalContext] = createContext<Dict>({ isOptional: true })\n\nexport { StepperHorizontalProvider, useStepperHorizontalContext }\n"],"mappings":";;;AAGA,MAAM,CAAC,2BAA2B,+BAA+B,cAAoB,EAAE,YAAY,MAAM,CAAC"}

package/dist/stepperHorizontal/stepHorizontal.d.ts

@@ -1,10 +1,10 @@
 import { SystemProps } from "../system/system.js";
 import { VuiComponent } from "../core/vui.js";
 import { StepHorizontalProps } from "./stepperHorizontalTypes.js";
-import * as styled_components404 from "styled-components";
+import * as styled_components412 from "styled-components";
 
 //#region src/stepperHorizontal/stepHorizontal.d.ts
-declare const StepHorizontalBase: styled_components404.StyledComponent<"div", styled_components404.DefaultTheme, SystemProps, never>;
+declare const StepHorizontalBase: styled_components412.StyledComponent<"div", styled_components412.DefaultTheme, SystemProps, never>;
 /**
  * Implements a Horizontal step component
  */

package/dist/stepperHorizontal/stepHorizontal.js

@@ -1,7 +1,72 @@
-import{cs as e}from"../utils/styles.js";import{styled as t}from"../core/styled.js";import{vui as n}from"../core/vui.js";import{Box as r}from"../box/box.js";import{StepIndicator as i}from"../stepIndicator/stepIndicator.js";import{useStepperHorizontalContext as a}from"./context.js";import{stepClassName as o}from"./consts.js";import s from"./stepHorizontalTail.js";import c from"./stepHorizontalTitle.js";import{jsx as l,jsxs as u}from"react/jsx-runtime";const d=t.divBox`
+import { cs } from "../utils/styles.js";
+import { styled } from "../core/styled.js";
+import { vui } from "../core/vui.js";
+import { Box } from "../box/box.js";
+import { StepIndicator } from "../stepIndicator/stepIndicator.js";
+import { useStepperHorizontalContext } from "./context.js";
+import { stepClassName } from "./consts.js";
+import stepHorizontalTail_default from "./stepHorizontalTail.js";
+import stepHorizontalTitle_default from "./stepHorizontalTitle.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/stepperHorizontal/stepHorizontal.tsx
+const StepHorizontalBase = styled.divBox`
   display: flex;
   flex-direction: column;
   position: relative;
   width: 100%;
-`,f=n(({icon:t,number:n,size:f=`md`,description:p,title:m,className:h,variant:g,children:_},v)=>{let y=a()?.size||f;return u(d,{className:e(o,o+g,h),ref:v,children:[l(s,{size:y,variant:g}),l(r,{display:`block`,textAlign:`center`,children:l(i,{icon:t,number:n,size:y,variant:g})}),u(r,{display:`block`,textAlign:`center`,children:[!!m&&l(c,{size:y,variant:g,children:m}),!!p&&l(r,{color:`sandstone.45`,display:`block`,fontSize:`${y===`md`?14:12}px`,textAlign:`center`,children:p}),l(r,{display:`block`,children:_})]})]})});f.displayName=`StepHorizontal`;export{f as StepHorizontal,d as StepHorizontalBase};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+`;
+/**
+* Implements a Horizontal step component
+*/
+const StepHorizontal = vui(({ icon, number, size: propSize = "md", description, title, className, variant, children }, ref) => {
+	const size = useStepperHorizontalContext()?.size || propSize;
+	return /* @__PURE__ */ jsxs(StepHorizontalBase, {
+		className: cs(stepClassName, stepClassName + variant, className),
+		ref,
+		children: [
+			/* @__PURE__ */ jsx(stepHorizontalTail_default, {
+				size,
+				variant
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				display: "block",
+				textAlign: "center",
+				children: /* @__PURE__ */ jsx(StepIndicator, {
+					icon,
+					number,
+					size,
+					variant
+				})
+			}),
+			/* @__PURE__ */ jsxs(Box, {
+				display: "block",
+				textAlign: "center",
+				children: [
+					!!title && /* @__PURE__ */ jsx(stepHorizontalTitle_default, {
+						size,
+						variant,
+						children: title
+					}),
+					!!description && /* @__PURE__ */ jsx(Box, {
+						color: "sandstone.45",
+						display: "block",
+						fontSize: `${size === "md" ? 14 : 12}px`,
+						textAlign: "center",
+						children: description
+					}),
+					/* @__PURE__ */ jsx(Box, {
+						display: "block",
+						children
+					})
+				]
+			})
+		]
+	});
+});
+StepHorizontal.displayName = "StepHorizontal";
+
+//#endregion
+export { StepHorizontal, StepHorizontalBase };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=stepHorizontal.js.map

package/dist/stepperHorizontal/stepHorizontal.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepHorizontal.js","names":["StepHorizontalTail","StepHorizontalTitle"],"sources":["../../src/stepperHorizontal/stepHorizontal.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { styled, vui } from '../core'\nimport { StepIndicator } from '../stepIndicator'\nimport { cs } from '../utils'\nimport { stepClassName } from './consts'\nimport { useStepperHorizontalContext } from './context'\nimport StepHorizontalTail from './stepHorizontalTail'\nimport StepHorizontalTitle from './stepHorizontalTitle'\nimport type { StepHorizontalProps } from './stepperHorizontalTypes'\n\nexport const StepHorizontalBase = styled.divBox`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n`\n\n/**\n * Implements a Horizontal step component\n */\nexport const StepHorizontal = vui<'div', StepHorizontalProps>(\n  ({ icon, number, size: propSize = 'md', description, title, className, variant, children }, ref) => {\n    const context = useStepperHorizontalContext()\n    const size = context?.size || propSize\n    return (\n      <StepHorizontalBase className={cs(stepClassName, stepClassName + variant, className)} ref={ref}>\n        <StepHorizontalTail size={size} variant={variant as any} />\n        <Box display=\"block\" textAlign=\"center\">\n          <StepIndicator icon={icon} number={number} size={size} variant={variant} />\n        </Box>\n        <Box display=\"block\" textAlign=\"center\">\n          {!!title && (\n            <StepHorizontalTitle size={size} variant={variant as any}>\n              {title}\n            </StepHorizontalTitle>\n          )}\n          {!!description && (\n            <Box color=\"sandstone.45\" display=\"block\" fontSize={`${size === 'md' ? 14 : 12}px`} textAlign=\"center\">\n              {description}\n            </Box>\n          )}\n          <Box display=\"block\">{children}</Box>\n        </Box>\n      </StepHorizontalBase>\n    )\n  },\n)\n\nStepHorizontal.displayName = 'StepHorizontal'\n\nexport default StepHorizontal\n"],"mappings":"scAUA,MAAa,EAAqB,EAAO,MAAM;;;;;EAUlC,EAAiB,GAC3B,CAAE,OAAM,SAAQ,KAAM,EAAW,KAAM,cAAa,QAAO,YAAW,UAAS,YAAY,IAAQ,CAElG,IAAM,EADU,GAA6B,EACvB,MAAQ,EAC9B,OACE,EAAC,EAAA,CAAmB,UAAW,EAAG,EAAe,EAAgB,EAAS,EAAU,CAAO,gBACzF,EAACA,EAAAA,CAAyB,OAAe,WAAkB,CAC3D,EAAC,EAAA,CAAI,QAAQ,QAAQ,UAAU,kBAC7B,EAAC,EAAA,CAAoB,OAAc,SAAc,OAAe,WAAW,EACvE,CACN,EAAC,EAAA,CAAI,QAAQ,QAAQ,UAAU,mBAC5B,CAAC,CAAC,GACD,EAACC,EAAAA,CAA0B,OAAe,mBACvC,GACmB,CAEvB,CAAC,CAAC,GACD,EAAC,EAAA,CAAI,MAAM,eAAe,QAAQ,QAAQ,SAAU,GAAG,IAAS,KAAO,GAAK,GAAG,IAAK,UAAU,kBAC3F,GACG,CAER,EAAC,EAAA,CAAI,QAAQ,QAAS,YAAe,GACjC,GACa,EAG1B,CAED,EAAe,YAAc"}
+{"version":3,"file":"stepHorizontal.js","names":["StepHorizontalTail","StepHorizontalTitle"],"sources":["../../src/stepperHorizontal/stepHorizontal.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { styled, vui } from '../core'\nimport { StepIndicator } from '../stepIndicator'\nimport { cs } from '../utils'\nimport { stepClassName } from './consts'\nimport { useStepperHorizontalContext } from './context'\nimport StepHorizontalTail from './stepHorizontalTail'\nimport StepHorizontalTitle from './stepHorizontalTitle'\nimport type { StepHorizontalProps } from './stepperHorizontalTypes'\n\nexport const StepHorizontalBase = styled.divBox`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n`\n\n/**\n * Implements a Horizontal step component\n */\nexport const StepHorizontal = vui<'div', StepHorizontalProps>(\n  ({ icon, number, size: propSize = 'md', description, title, className, variant, children }, ref) => {\n    const context = useStepperHorizontalContext()\n    const size = context?.size || propSize\n    return (\n      <StepHorizontalBase className={cs(stepClassName, stepClassName + variant, className)} ref={ref}>\n        <StepHorizontalTail size={size} variant={variant as any} />\n        <Box display=\"block\" textAlign=\"center\">\n          <StepIndicator icon={icon} number={number} size={size} variant={variant} />\n        </Box>\n        <Box display=\"block\" textAlign=\"center\">\n          {!!title && (\n            <StepHorizontalTitle size={size} variant={variant as any}>\n              {title}\n            </StepHorizontalTitle>\n          )}\n          {!!description && (\n            <Box color=\"sandstone.45\" display=\"block\" fontSize={`${size === 'md' ? 14 : 12}px`} textAlign=\"center\">\n              {description}\n            </Box>\n          )}\n          <Box display=\"block\">{children}</Box>\n        </Box>\n      </StepHorizontalBase>\n    )\n  },\n)\n\nStepHorizontal.displayName = 'StepHorizontal'\n\nexport default StepHorizontal\n"],"mappings":";;;;;;;;;;;;AAUA,MAAa,qBAAqB,OAAO,MAAM;;;;;;;;;AAU/C,MAAa,iBAAiB,KAC3B,EAAE,MAAM,QAAQ,MAAM,WAAW,MAAM,aAAa,OAAO,WAAW,SAAS,YAAY,QAAQ;CAElG,MAAM,OADU,6BAA6B,EACvB,QAAQ;AAC9B,QACE,qBAAC;EAAmB,WAAW,GAAG,eAAe,gBAAgB,SAAS,UAAU;EAAO;;GACzF,oBAACA;IAAyB;IAAe;KAAkB;GAC3D,oBAAC;IAAI,SAAQ;IAAQ,WAAU;cAC7B,oBAAC;KAAoB;KAAc;KAAc;KAAe;MAAW;KACvE;GACN,qBAAC;IAAI,SAAQ;IAAQ,WAAU;;KAC5B,CAAC,CAAC,SACD,oBAACC;MAA0B;MAAe;gBACvC;OACmB;KAEvB,CAAC,CAAC,eACD,oBAAC;MAAI,OAAM;MAAe,SAAQ;MAAQ,UAAU,GAAG,SAAS,OAAO,KAAK,GAAG;MAAK,WAAU;gBAC3F;OACG;KAER,oBAAC;MAAI,SAAQ;MAAS;OAAe;;KACjC;;GACa;EAG1B;AAED,eAAe,cAAc"}

package/dist/stepperHorizontal/stepHorizontalTail.js

@@ -1,2 +1,30 @@
-import{cs as e}from"../utils/styles.js";import{vui as t}from"../core/vui.js";import{Box as n}from"../box/box.js";import{tailClassName as r,tailClassNameLeft as i,tailClassNameRight as a}from"./consts.js";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=t((t,c)=>{let{children:l,className:u,variant:d=`active`,...f}=t;return s(n,{className:e(r),h:`16px`,justifyContent:`space-between`,position:`absolute`,ref:c,w:`100%`,...f,children:[o(n,{className:e(r,i,i+d)}),o(n,{className:e(r,a,i+d)})]})});c.displayName=`StepHorizontalTail`;var l=c;export{l as default};globalThis.__vuiVersion__=`3.0.0-beta.8`;
+import { cs } from "../utils/styles.js";
+import { vui } from "../core/vui.js";
+import { Box } from "../box/box.js";
+import { tailClassName, tailClassNameLeft, tailClassNameRight } from "./consts.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/stepperHorizontal/stepHorizontalTail.tsx
+/**
+* Implements Horizontal stepper tail (the Horizontal line) **
+*/
+const StepHorizontalTail = vui((props, ref) => {
+	const { children, className, variant = "active",...rest } = props;
+	return /* @__PURE__ */ jsxs(Box, {
+		className: cs(tailClassName),
+		h: "16px",
+		justifyContent: "space-between",
+		position: "absolute",
+		ref,
+		w: "100%",
+		...rest,
+		children: [/* @__PURE__ */ jsx(Box, { className: cs(tailClassName, tailClassNameLeft, tailClassNameLeft + variant) }), /* @__PURE__ */ jsx(Box, { className: cs(tailClassName, tailClassNameRight, tailClassNameLeft + variant) })]
+	});
+});
+StepHorizontalTail.displayName = "StepHorizontalTail";
+var stepHorizontalTail_default = StepHorizontalTail;
+
+//#endregion
+export { stepHorizontalTail_default as default };
+globalThis.__vuiVersion__ = "3.0.0-beta.9"
 //# sourceMappingURL=stepHorizontalTail.js.map

package/dist/stepperHorizontal/stepHorizontalTail.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepHorizontalTail.js","names":[],"sources":["../../src/stepperHorizontal/stepHorizontalTail.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { vui } from '../core'\nimport { cs } from '../utils'\nimport { tailClassName, tailClassNameLeft, tailClassNameRight } from './consts'\nimport type { StepHorizontalTailProps } from './stepperHorizontalTypes'\n\n/**\n * Implements Horizontal stepper tail (the Horizontal line) **\n */\nexport const StepHorizontalTail = vui<'div', StepHorizontalTailProps>((props, ref) => {\n  const { children, className, variant = 'active', ...rest } = props\n  return (\n    <Box\n      className={cs(tailClassName)}\n      h=\"16px\"\n      justifyContent=\"space-between\"\n      position=\"absolute\"\n      ref={ref}\n      w=\"100%\"\n      {...rest}\n    >\n      <Box className={cs(tailClassName, tailClassNameLeft, tailClassNameLeft + variant)} />\n      <Box className={cs(tailClassName, tailClassNameRight, tailClassNameLeft + variant)} />\n    </Box>\n  )\n})\n\nStepHorizontalTail.displayName = 'StepHorizontalTail'\n\nexport default StepHorizontalTail\n"],"mappings":"8PASA,MAAa,EAAqB,GAAqC,EAAO,IAAQ,CACpF,GAAM,CAAE,WAAU,YAAW,UAAU,SAAU,GAAG,GAAS,EAC7D,OACE,EAAC,EAAA,CACC,UAAW,EAAG,EAAc,CAC5B,EAAE,OACF,eAAe,gBACf,SAAS,WACJ,MACL,EAAE,OACF,GAAI,YAEJ,EAAC,EAAA,CAAI,UAAW,EAAG,EAAe,EAAmB,EAAoB,EAAQ,CAAA,CAAI,CACrF,EAAC,EAAA,CAAI,UAAW,EAAG,EAAe,EAAoB,EAAoB,EAAQ,CAAA,CAAI,CAAA,EAClF,EAER,CAEF,EAAmB,YAAc,qBAEjC,IAAA,EAAe"}
+{"version":3,"file":"stepHorizontalTail.js","names":[],"sources":["../../src/stepperHorizontal/stepHorizontalTail.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { vui } from '../core'\nimport { cs } from '../utils'\nimport { tailClassName, tailClassNameLeft, tailClassNameRight } from './consts'\nimport type { StepHorizontalTailProps } from './stepperHorizontalTypes'\n\n/**\n * Implements Horizontal stepper tail (the Horizontal line) **\n */\nexport const StepHorizontalTail = vui<'div', StepHorizontalTailProps>((props, ref) => {\n  const { children, className, variant = 'active', ...rest } = props\n  return (\n    <Box\n      className={cs(tailClassName)}\n      h=\"16px\"\n      justifyContent=\"space-between\"\n      position=\"absolute\"\n      ref={ref}\n      w=\"100%\"\n      {...rest}\n    >\n      <Box className={cs(tailClassName, tailClassNameLeft, tailClassNameLeft + variant)} />\n      <Box className={cs(tailClassName, tailClassNameRight, tailClassNameLeft + variant)} />\n    </Box>\n  )\n})\n\nStepHorizontalTail.displayName = 'StepHorizontalTail'\n\nexport default StepHorizontalTail\n"],"mappings":";;;;;;;;;;AASA,MAAa,qBAAqB,KAAqC,OAAO,QAAQ;CACpF,MAAM,EAAE,UAAU,WAAW,UAAU,SAAU,GAAG,SAAS;AAC7D,QACE,qBAAC;EACC,WAAW,GAAG,cAAc;EAC5B,GAAE;EACF,gBAAe;EACf,UAAS;EACJ;EACL,GAAE;EACF,GAAI;aAEJ,oBAAC,OAAI,WAAW,GAAG,eAAe,mBAAmB,oBAAoB,QAAQ,GAAI,EACrF,oBAAC,OAAI,WAAW,GAAG,eAAe,oBAAoB,oBAAoB,QAAQ,GAAI;GAClF;EAER;AAEF,mBAAmB,cAAc;AAEjC,iCAAe"}