@atom-learning/components 6.5.4 → 6.5.5

package/dist/components/inline-message/InlineMessage.js

@@ -1,10 +1,10 @@
-import { styled as e } from "../../styled.js";
-import { Icon as t } from "../icon/Icon.js";
-import { Text as n } from "../text/Text.js";
-import { INLINE_MESSAGE_ICONS as r } from "./InlineMessage.config.js";
-import * as i from "react";
+import { styled } from "../../styled.js";
+import { Icon } from "../icon/Icon.js";
+import { Text } from "../text/Text.js";
+import { INLINE_MESSAGE_ICONS } from "./InlineMessage.config.js";
+import * as React$1 from "react";
 //#region src/components/inline-message/InlineMessage.tsx
-var a = e("div", {
+var InlineMessageContainer = styled("div", {
 	base: ["flex"],
 	variants: { theme: {
 		success: ["text-success"],
@@ -13,20 +13,21 @@ var a = e("div", {
 		neutral: ["text-grey-800"],
 		error: ["text-danger"]
 	} }
-}), o = ({ className: e, showIcon: o = !0, theme: s = "error", size: c = "sm", children: l, ...u }) => /* @__PURE__ */ i.createElement(a, {
-	theme: s,
-	className: e,
-	...u
-}, o && /* @__PURE__ */ i.createElement(t, {
+});
+var InlineMessage = ({ className, showIcon = true, theme = "error", size = "sm", children, ...rest }) => /* @__PURE__ */ React$1.createElement(InlineMessageContainer, {
+	theme,
+	className,
+	...rest
+}, showIcon && /* @__PURE__ */ React$1.createElement(Icon, {
 	size: "sm",
-	is: r[s],
+	is: INLINE_MESSAGE_ICONS[theme],
 	className: "mr-2"
-}), /* @__PURE__ */ i.createElement(n, {
+}), /* @__PURE__ */ React$1.createElement(Text, {
 	as: "span",
-	size: c,
+	size,
 	className: "translate-y-0.5"
-}, l));
+}, children));
 //#endregion
-export { o as InlineMessage };
+export { InlineMessage };
 
 //# sourceMappingURL=InlineMessage.js.map

package/dist/components/inline-message/InlineMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineMessage.js","names":[],"sources":["../../../src/components/inline-message/InlineMessage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '~/components/icon/Icon'\nimport { Text } from '~/components/text/Text'\nimport { styled } from '~/styled'\n\nimport { INLINE_MESSAGE_ICONS } from './InlineMessage.config'\nimport { InlineMessageTheme } from './InlineMessage.types'\n\nconst InlineMessageContainer = styled('div', {\n  base: ['flex'],\n  variants: {\n    theme: {\n      success: ['text-success'],\n      warning: ['[&_svg]:text-warning-dark', 'text-warning-text'],\n      info: ['text-info'],\n      neutral: ['text-grey-800'],\n      error: ['text-danger']\n    }\n  }\n})\n\ntype TInlineMessageProps = React.ComponentProps<\n  typeof InlineMessageContainer\n> & {\n  showIcon?: boolean\n  size?: 'xs' | 'sm' | 'md'\n}\n\nexport const InlineMessage = ({\n  className,\n  showIcon = true,\n  theme = 'error',\n  size = 'sm',\n  children,\n  ...rest\n}: TInlineMessageProps) => (\n  <InlineMessageContainer theme={theme} className={className} {...rest}>\n    {showIcon && (\n      <Icon\n        size=\"sm\"\n        is={INLINE_MESSAGE_ICONS[theme as InlineMessageTheme]}\n        className=\"mr-2\"\n      />\n    )}\n    <Text as=\"span\" size={size} className=\"translate-y-0.5\">\n      {children}\n    </Text>\n  </InlineMessageContainer>\n)\n"],"mappings":";;;;;;AASA,IAAM,IAAyB,EAAO,OAAO;CAC3C,MAAM,CAAC,OAAO;CACd,UAAU,EACR,OAAO;EACL,SAAS,CAAC,eAAe;EACzB,SAAS,CAAC,6BAA6B,oBAAoB;EAC3D,MAAM,CAAC,YAAY;EACnB,SAAS,CAAC,gBAAgB;EAC1B,OAAO,CAAC,cAAc;EACvB,EACF;CACF,CAAC,EASW,KAAiB,EAC5B,cACA,cAAW,IACX,WAAQ,SACR,UAAO,MACP,aACA,GAAG,QAEH,kBAAA,cAAC,GAAD;CAA+B;CAAkB;CAAW,GAAI;CAWvC,EAVtB,KACC,kBAAA,cAAC,GAAD;CACE,MAAK;CACL,IAAI,EAAqB;CACzB,WAAU;CACV,CAAA,EAEJ,kBAAA,cAAC,GAAD;CAAM,IAAG;CAAa;CAAM,WAAU;CAE/B,EADJ,EACI,CACgB"}
+{"version":3,"file":"InlineMessage.js","names":[],"sources":["../../../src/components/inline-message/InlineMessage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '~/components/icon/Icon'\nimport { Text } from '~/components/text/Text'\nimport { styled } from '~/styled'\n\nimport { INLINE_MESSAGE_ICONS } from './InlineMessage.config'\nimport { InlineMessageTheme } from './InlineMessage.types'\n\nconst InlineMessageContainer = styled('div', {\n  base: ['flex'],\n  variants: {\n    theme: {\n      success: ['text-success'],\n      warning: ['[&_svg]:text-warning-dark', 'text-warning-text'],\n      info: ['text-info'],\n      neutral: ['text-grey-800'],\n      error: ['text-danger']\n    }\n  }\n})\n\ntype TInlineMessageProps = React.ComponentProps<\n  typeof InlineMessageContainer\n> & {\n  showIcon?: boolean\n  size?: 'xs' | 'sm' | 'md'\n}\n\nexport const InlineMessage = ({\n  className,\n  showIcon = true,\n  theme = 'error',\n  size = 'sm',\n  children,\n  ...rest\n}: TInlineMessageProps) => (\n  <InlineMessageContainer theme={theme} className={className} {...rest}>\n    {showIcon && (\n      <Icon\n        size=\"sm\"\n        is={INLINE_MESSAGE_ICONS[theme as InlineMessageTheme]}\n        className=\"mr-2\"\n      />\n    )}\n    <Text as=\"span\" size={size} className=\"translate-y-0.5\">\n      {children}\n    </Text>\n  </InlineMessageContainer>\n)\n"],"mappings":";;;;;;AASA,IAAM,yBAAyB,OAAO,OAAO;CAC3C,MAAM,CAAC,OAAO;CACd,UAAU,EACR,OAAO;EACL,SAAS,CAAC,eAAe;EACzB,SAAS,CAAC,6BAA6B,oBAAoB;EAC3D,MAAM,CAAC,YAAY;EACnB,SAAS,CAAC,gBAAgB;EAC1B,OAAO,CAAC,cAAc;EACvB,EACF;CACF,CAAC;AASF,IAAa,iBAAiB,EAC5B,WACA,WAAW,MACX,QAAQ,SACR,OAAO,MACP,UACA,GAAG,WAEH,wBAAA,cAAC,wBAAD;CAA+B;CAAkB;CAAW,GAAI;CAWvC,EAVtB,YACC,wBAAA,cAAC,MAAD;CACE,MAAK;CACL,IAAI,qBAAqB;CACzB,WAAU;CACV,CAAA,EAEJ,wBAAA,cAAC,MAAD;CAAM,IAAG;CAAa;CAAM,WAAU;CAE/B,EADJ,SACI,CACgB"}

package/dist/components/input/Input.js

@@ -1,9 +1,9 @@
-import { styled as e } from "../../styled.js";
-import { Text as t } from "../text/Text.js";
-import { overrideStyledVariantValue as n } from "../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";
-import * as r from "react";
+import { styled } from "../../styled.js";
+import { Text } from "../text/Text.js";
+import { overrideStyledVariantValue } from "../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";
+import * as React$1 from "react";
 //#region src/components/input/Input.tsx
-var i = e("div", {
+var InputBackground = styled("div", {
 	base: [
 		"flex",
 		"text-grey-1000",
@@ -51,49 +51,56 @@ var i = e("div", {
 		class: ["bg-danger-light", "focus-within:outline-danger"]
 	}]
 });
-i.displayName = "InputBackground";
-var a = e(t, { base: [
+InputBackground.displayName = "InputBackground";
+var StyledInputText = styled(Text, { base: [
 	"appearance-none",
+	"border-none",
 	"bg-none",
+	"bg-transparent",
 	"shadow-none",
+	"box-border",
 	"focus:outline-none",
 	"px-3",
 	"size-full",
 	"placeholder:opacity-100",
 	"placeholder:text-grey-700"
-] }), o = {
+] });
+var toTextSize = {
 	sm: "sm",
 	md: "md",
 	lg: "md",
 	xl: "lg"
-}, s = r.forwardRef(({ type: e = "text", size: t, ...i }, s) => {
-	let c = r.useMemo(() => n(t, (e) => o[e]), [t]);
-	return /* @__PURE__ */ r.createElement(a, {
-		ref: s,
+};
+var InputText = React$1.forwardRef(({ type = "text", size, ...rest }, ref) => {
+	const textSize = React$1.useMemo(() => overrideStyledVariantValue(size, (s) => toTextSize[s]), [size]);
+	return /* @__PURE__ */ React$1.createElement(StyledInputText, {
+		ref,
 		as: "input",
-		type: e === "number" ? "text" : e,
-		inputMode: e === "number" ? "numeric" : void 0,
-		pattern: e === "number" ? "[0-9]*" : void 0,
-		size: c,
-		...i
+		type: type === "number" ? "text" : type,
+		inputMode: type === "number" ? "numeric" : void 0,
+		pattern: type === "number" ? "[0-9]*" : void 0,
+		size: textSize,
+		...rest
 	});
 });
-s.displayName = "InputText";
-var c = r.forwardRef(({ className: e, size: t = "md", appearance: n = "standard", state: a, disabled: o, style: c, ...l }, u) => /* @__PURE__ */ r.createElement(i, {
-	size: t,
-	appearance: n,
-	disabled: o,
-	state: a,
-	className: e,
-	style: c
-}, /* @__PURE__ */ r.createElement(s, {
-	size: t,
-	ref: u,
-	disabled: o,
-	...l
-})));
-c.displayName = "Input";
+InputText.displayName = "InputText";
+var Input = React$1.forwardRef(({ className, size = "md", appearance = "standard", state, disabled, style, ...rest }, ref) => {
+	return /* @__PURE__ */ React$1.createElement(InputBackground, {
+		size,
+		appearance,
+		disabled,
+		state,
+		className,
+		style
+	}, /* @__PURE__ */ React$1.createElement(InputText, {
+		size,
+		ref,
+		disabled,
+		...rest
+	}));
+});
+Input.displayName = "Input";
 //#endregion
-export { c as Input, i as InputBackground, s as InputText };
+export { Input, InputBackground, InputText };
 
 //# sourceMappingURL=Input.js.map

package/dist/components/input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":[],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Text } from '../text/Text'\n\nexport const InputBackground = styled('div', {\n  base: [\n    'flex',\n    'text-grey-1000',\n    'transition-[background,border-color]',\n    'duration-100',\n    'ease-out',\n    'w-full'\n  ],\n  variants: {\n    appearance: {\n      standard: [\n        'bg-white',\n        'border',\n        'border-grey-800',\n        'focus-within:border-blue-800',\n        'rounded-md'\n      ],\n      modern: [\n        'bg-grey-100',\n        'border-none',\n        'focus-within:outline-2',\n        'focus-within:outline-blue-800',\n        'focus-within:outline-offset-1',\n        'focus-within:outline-solid',\n        'focus-within:z-1',\n        'rounded-md'\n      ]\n    },\n    size: {\n      sm: ['h-8'],\n      md: ['h-10'],\n      lg: ['h-12'],\n      xl: ['h-16']\n    },\n    disabled: {\n      true: ['cursor-not-allowed', 'opacity-30']\n    },\n    state: {\n      error: []\n    }\n  },\n  compoundVariants: [\n    {\n      state: 'error',\n      appearance: 'standard',\n      class: ['border-danger']\n    },\n    {\n      state: 'error',\n      appearance: 'modern',\n      class: ['bg-danger-light', 'focus-within:outline-danger']\n    }\n  ]\n})\n\nInputBackground.displayName = 'InputBackground'\n\nconst StyledInputText = styled(Text, {\n  base: [\n    'appearance-none',\n    'bg-none',\n    'shadow-none',\n    'focus:outline-none',\n    'px-3',\n    'size-full',\n    'placeholder:opacity-100',\n    'placeholder:text-grey-700'\n  ]\n})\n\nexport type InputTextProps = Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  'size'\n> &\n  Omit<React.ComponentProps<typeof StyledInputText>, 'type' | 'as'> & {\n    // override default 'type' property to prevent Input from being used to render\n    // checkboxes, radios etc — we have dedicated components for them\n    type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n    as?: never\n    disabled?: boolean\n  }\n\nconst toTextSize = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'md',\n  xl: 'lg'\n}\n\nexport const InputText = React.forwardRef<HTMLInputElement, InputTextProps>(\n  ({ type = 'text', size, ...rest }, ref) => {\n    const textSize = React.useMemo(\n      () => overrideStyledVariantValue(size, (s) => toTextSize[s]),\n      [size]\n    )\n\n    return (\n      <StyledInputText\n        ref={ref}\n        as=\"input\"\n        type={type === 'number' ? 'text' : type}\n        inputMode={type === 'number' ? 'numeric' : undefined}\n        pattern={type === 'number' ? '[0-9]*' : undefined}\n        size={textSize}\n        {...(rest as any)}\n      />\n    )\n  }\n)\n\nInputText.displayName = 'InputText'\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n  React.ComponentProps<typeof InputText>,\n  'size' | 'state' | 'appearance'\n> & {\n  size?: InputBackgroundProps['size']\n  state?: InputBackgroundProps['state']\n  appearance?: InputBackgroundProps['appearance']\n  disabled?: boolean\n  name?: string\n  readOnly?: boolean\n  value?: string | number\n  onChange?: React.ChangeEventHandler<HTMLInputElement>\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      size = 'md',\n      appearance = 'standard',\n      state,\n      disabled,\n      style,\n      ...rest\n    },\n    ref\n  ) => {\n    return (\n      <InputBackground\n        size={size}\n        appearance={appearance}\n        disabled={disabled}\n        state={state}\n        className={className}\n        style={style}\n      >\n        <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n      </InputBackground>\n    )\n  }\n)\n\nInput.displayName = 'Input'\n"],"mappings":";;;;;AAOA,IAAa,IAAkB,EAAO,OAAO;CAC3C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,OAAO;GACZ,IAAI,CAAC,OAAO;GACZ,IAAI,CAAC,OAAO;GACb;EACD,UAAU,EACR,MAAM,CAAC,sBAAsB,aAAa,EAC3C;EACD,OAAO,EACL,OAAO,EAAE,EACV;EACF;CACD,kBAAkB,CAChB;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,gBAAgB;EACzB,EACD;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,mBAAmB,8BAA8B;EAC1D,CACF;CACF,CAAC;AAEF,EAAgB,cAAc;AAE9B,IAAM,IAAkB,EAAO,GAAM,EACnC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAcI,IAAa;CACjB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEY,IAAY,EAAM,YAC5B,EAAE,UAAO,QAAQ,SAAM,GAAG,KAAQ,MAAQ;CACzC,IAAM,IAAW,EAAM,cACf,EAA2B,IAAO,MAAM,EAAW,GAAG,EAC5D,CAAC,EAAK,CACP;AAED,QACE,kBAAA,cAAC,GAAD;EACO;EACL,IAAG;EACH,MAAM,MAAS,WAAW,SAAS;EACnC,WAAW,MAAS,WAAW,YAAY,KAAA;EAC3C,SAAS,MAAS,WAAW,WAAW,KAAA;EACxC,MAAM;EACN,GAAK;EACL,CAAA;EAGP;AAED,EAAU,cAAc;AAiBxB,IAAa,IAAQ,EAAM,YAEvB,EACE,cACA,UAAO,MACP,gBAAa,YACb,UACA,aACA,UACA,GAAG,KAEL,MAGE,kBAAA,cAAC,GAAD;CACQ;CACM;CACF;CACH;CACI;CACJ;CAGS,EADhB,kBAAA,cAAC,GAAD;CAAiB;CAAW;CAAe;CAAU,GAAI;CAAQ,CAAA,CACjD,CAGvB;AAED,EAAM,cAAc"}
+{"version":3,"file":"Input.js","names":[],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Text } from '../text/Text'\n\nexport const InputBackground = styled('div', {\n  base: [\n    'flex',\n    'text-grey-1000',\n    'transition-[background,border-color]',\n    'duration-100',\n    'ease-out',\n    'w-full'\n  ],\n  variants: {\n    appearance: {\n      standard: [\n        'bg-white',\n        'border',\n        'border-grey-800',\n        'focus-within:border-blue-800',\n        'rounded-md'\n      ],\n      modern: [\n        'bg-grey-100',\n        'border-none',\n        'focus-within:outline-2',\n        'focus-within:outline-blue-800',\n        'focus-within:outline-offset-1',\n        'focus-within:outline-solid',\n        'focus-within:z-1',\n        'rounded-md'\n      ]\n    },\n    size: {\n      sm: ['h-8'],\n      md: ['h-10'],\n      lg: ['h-12'],\n      xl: ['h-16']\n    },\n    disabled: {\n      true: ['cursor-not-allowed', 'opacity-30']\n    },\n    state: {\n      error: []\n    }\n  },\n  compoundVariants: [\n    {\n      state: 'error',\n      appearance: 'standard',\n      class: ['border-danger']\n    },\n    {\n      state: 'error',\n      appearance: 'modern',\n      class: ['bg-danger-light', 'focus-within:outline-danger']\n    }\n  ]\n})\n\nInputBackground.displayName = 'InputBackground'\n\nconst StyledInputText = styled(Text, {\n  base: [\n    'appearance-none',\n    'border-none',\n    'bg-none',\n    'bg-transparent',\n    'shadow-none',\n    'box-border',\n    'focus:outline-none',\n    'px-3',\n    'size-full',\n    'placeholder:opacity-100',\n    'placeholder:text-grey-700'\n  ]\n})\n\nexport type InputTextProps = Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  'size'\n> &\n  Omit<React.ComponentProps<typeof StyledInputText>, 'type' | 'as'> & {\n    // override default 'type' property to prevent Input from being used to render\n    // checkboxes, radios etc — we have dedicated components for them\n    type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n    as?: never\n    disabled?: boolean\n  }\n\nconst toTextSize = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'md',\n  xl: 'lg'\n}\n\nexport const InputText = React.forwardRef<HTMLInputElement, InputTextProps>(\n  ({ type = 'text', size, ...rest }, ref) => {\n    const textSize = React.useMemo(\n      () => overrideStyledVariantValue(size, (s) => toTextSize[s]),\n      [size]\n    )\n\n    return (\n      <StyledInputText\n        ref={ref}\n        as=\"input\"\n        type={type === 'number' ? 'text' : type}\n        inputMode={type === 'number' ? 'numeric' : undefined}\n        pattern={type === 'number' ? '[0-9]*' : undefined}\n        size={textSize}\n        {...(rest as any)}\n      />\n    )\n  }\n)\n\nInputText.displayName = 'InputText'\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n  React.ComponentProps<typeof InputText>,\n  'size' | 'state' | 'appearance'\n> & {\n  size?: InputBackgroundProps['size']\n  state?: InputBackgroundProps['state']\n  appearance?: InputBackgroundProps['appearance']\n  disabled?: boolean\n  name?: string\n  readOnly?: boolean\n  value?: string | number\n  onChange?: React.ChangeEventHandler<HTMLInputElement>\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      size = 'md',\n      appearance = 'standard',\n      state,\n      disabled,\n      style,\n      ...rest\n    },\n    ref\n  ) => {\n    return (\n      <InputBackground\n        size={size}\n        appearance={appearance}\n        disabled={disabled}\n        state={state}\n        className={className}\n        style={style}\n      >\n        <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n      </InputBackground>\n    )\n  }\n)\n\nInput.displayName = 'Input'\n"],"mappings":";;;;;AAOA,IAAa,kBAAkB,OAAO,OAAO;CAC3C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,OAAO;GACZ,IAAI,CAAC,OAAO;GACZ,IAAI,CAAC,OAAO;GACb;EACD,UAAU,EACR,MAAM,CAAC,sBAAsB,aAAa,EAC3C;EACD,OAAO,EACL,OAAO,EAAE,EACV;EACF;CACD,kBAAkB,CAChB;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,gBAAgB;EACzB,EACD;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,mBAAmB,8BAA8B;EAC1D,CACF;CACF,CAAC;AAEF,gBAAgB,cAAc;AAE9B,IAAM,kBAAkB,OAAO,MAAM,EACnC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAcF,IAAM,aAAa;CACjB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAa,YAAY,QAAM,YAC5B,EAAE,OAAO,QAAQ,MAAM,GAAG,QAAQ,QAAQ;CACzC,MAAM,WAAW,QAAM,cACf,2BAA2B,OAAO,MAAM,WAAW,GAAG,EAC5D,CAAC,KAAK,CACP;AAED,QACE,wBAAA,cAAC,iBAAD;EACO;EACL,IAAG;EACH,MAAM,SAAS,WAAW,SAAS;EACnC,WAAW,SAAS,WAAW,YAAY,KAAA;EAC3C,SAAS,SAAS,WAAW,WAAW,KAAA;EACxC,MAAM;EACN,GAAK;EACL,CAAA;EAGP;AAED,UAAU,cAAc;AAiBxB,IAAa,QAAQ,QAAM,YAEvB,EACE,WACA,OAAO,MACP,aAAa,YACb,OACA,UACA,OACA,GAAG,QAEL,QACG;AACH,QACE,wBAAA,cAAC,iBAAD;EACQ;EACM;EACF;EACH;EACI;EACJ;EAGS,EADhB,wBAAA,cAAC,WAAD;EAAiB;EAAW;EAAe;EAAU,GAAI;EAAQ,CAAA,CACjD;EAGvB;AAED,MAAM,cAAc"}

package/dist/components/input-field/InputField.js

@@ -1,33 +1,37 @@
-import { useFieldError as e } from "../form/useFieldError.js";
-import { FieldWrapper as t } from "../field-wrapper/FieldWrapper.js";
-import { useFormCustomContext as n } from "../form/useFormCustomContext.js";
-import { Input as r } from "../input/Input.js";
-import * as i from "react";
-import { useFormContext as a } from "react-hook-form";
+import { useFieldError } from "../form/useFieldError.js";
+import { FieldWrapper } from "../field-wrapper/FieldWrapper.js";
+import { useFormCustomContext } from "../form/useFormCustomContext.js";
+import { Input } from "../input/Input.js";
+import * as React$1 from "react";
+import { useFormContext } from "react-hook-form";
 //#region src/components/input-field/InputField.tsx
-var o = ({ className: o, label: s, name: c, validation: l, prompt: u, description: d, hideLabel: f, appearance: p, ...m }) => {
-	let { register: h } = a(), g = n(), { error: _ } = e(c), v = l ? h(l) : h, y = g?.appearance || p;
-	return /* @__PURE__ */ i.createElement(t, {
-		className: o,
-		description: d,
-		error: _,
-		fieldId: c,
-		hideLabel: f,
-		label: s,
-		prompt: u,
-		required: !!l?.required,
-		appearance: y
-	}, /* @__PURE__ */ i.createElement(r, {
-		id: c,
-		name: c,
-		ref: v,
-		appearance: y,
-		..._ && { state: "error" },
-		...m
+var InputField = ({ className, label, name, validation, prompt, description, hideLabel, appearance, ...remainingProps }) => {
+	const { register } = useFormContext();
+	const context = useFormCustomContext();
+	const { error } = useFieldError(name);
+	const ref = validation ? register(validation) : register;
+	const formAppearance = context?.appearance || appearance;
+	return /* @__PURE__ */ React$1.createElement(FieldWrapper, {
+		className,
+		description,
+		error,
+		fieldId: name,
+		hideLabel,
+		label,
+		prompt,
+		required: Boolean(validation?.required),
+		appearance: formAppearance
+	}, /* @__PURE__ */ React$1.createElement(Input, {
+		id: name,
+		name,
+		ref,
+		appearance: formAppearance,
+		...error && { state: "error" },
+		...remainingProps
 	}));
 };
-o.displayName = "InputField";
+InputField.displayName = "InputField";
 //#endregion
-export { o as InputField };
+export { InputField };
 
 //# sourceMappingURL=InputField.js.map

package/dist/components/input-field/InputField.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputField.js","names":[],"sources":["../../../src/components/input-field/InputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport { Input, InputProps } from '~/components/input/Input'\n\ntype InputFieldProps = InputProps & FieldElementWrapperProps\n\nexport const InputField = ({\n  className,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  appearance,\n  ...remainingProps\n}: InputFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Input\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nInputField.displayName = 'InputField'\n"],"mappings":";;;;;;;AAaA,IAAa,KAAc,EACzB,cACA,UACA,SACA,eACA,WACA,gBACA,cACA,eACA,GAAG,QACkB;CACrB,IAAM,EAAE,gBAAa,GAAgB,EAC/B,IAAU,GAAsB,EAChC,EAAE,aAAU,EAAc,EAAK,EAE/B,IAAM,IAAa,EAAS,EAAW,GAAG,GAC1C,IAAiB,GAAS,cAAc;AAE9C,QACE,kBAAA,cAAC,GAAD;EACa;EACE;EACN;EACP,SAAS;EACE;EACJ;EACC;EACR,UAAU,EAAQ,GAAY;EAC9B,YAAY;EAUC,EARb,kBAAA,cAAC,GAAD;EACE,IAAI;EACE;EACD;EACL,YAAY;EACZ,GAAK,KAAS,EAAE,OAAO,SAAS;EAChC,GAAI;EACJ,CAAA,CACW;;AAInB,EAAW,cAAc"}
+{"version":3,"file":"InputField.js","names":[],"sources":["../../../src/components/input-field/InputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport { Input, InputProps } from '~/components/input/Input'\n\ntype InputFieldProps = InputProps & FieldElementWrapperProps\n\nexport const InputField = ({\n  className,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  appearance,\n  ...remainingProps\n}: InputFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Input\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nInputField.displayName = 'InputField'\n"],"mappings":";;;;;;;AAaA,IAAa,cAAc,EACzB,WACA,OACA,MACA,YACA,QACA,aACA,WACA,YACA,GAAG,qBACkB;CACrB,MAAM,EAAE,aAAa,gBAAgB;CACrC,MAAM,UAAU,sBAAsB;CACtC,MAAM,EAAE,UAAU,cAAc,KAAK;CAErC,MAAM,MAAM,aAAa,SAAS,WAAW,GAAG;CAChD,MAAM,iBAAiB,SAAS,cAAc;AAE9C,QACE,wBAAA,cAAC,cAAD;EACa;EACE;EACN;EACP,SAAS;EACE;EACJ;EACC;EACR,UAAU,QAAQ,YAAY,SAAS;EACvC,YAAY;EAUC,EARb,wBAAA,cAAC,OAAD;EACE,IAAI;EACE;EACD;EACL,YAAY;EACZ,GAAK,SAAS,EAAE,OAAO,SAAS;EAChC,GAAI;EACJ,CAAA,CACW;;AAInB,WAAW,cAAc"}

package/dist/components/keyboard-shortcut/KeyboardShortcut.js

@@ -1,32 +1,36 @@
-import { styled as e } from "../../styled.js";
-import { Text as t } from "../text/Text.js";
-import { useCallbackRefState as n } from "../../utilities/hooks/useCallbackRef.js";
-import * as r from "react";
-import { Slot as i } from "@radix-ui/react-slot";
+import { styled } from "../../styled.js";
+import { Text } from "../text/Text.js";
+import { useCallbackRefState } from "../../utilities/hooks/useCallbackRef.js";
+import * as React$1 from "react";
+import { Slot } from "@radix-ui/react-slot";
 //#region src/components/keyboard-shortcut/KeyboardShortcut.tsx
-var a = r.forwardRef(({ asChild: e, config: t, targetWindow: a = !1, onKeyDown: o, ...s }, c) => {
-	let [l, u] = n();
-	r.useImperativeHandle(c, () => l);
-	let d = r.useCallback((e) => {
-		t.forEach(({ shortcut: t, action: n }) => {
-			Object.entries(t).every(([t, n]) => e[t] === n) && n({
+var KeyboardShortcut = React$1.forwardRef(({ asChild, config, targetWindow = false, onKeyDown, ...rest }, ref) => {
+	const [targetElRef, setTargetElRef] = useCallbackRefState();
+	React$1.useImperativeHandle(ref, () => targetElRef);
+	const handleOnKeydown = React$1.useCallback((e) => {
+		config.forEach(({ shortcut, action }) => {
+			if (Object.entries(shortcut).every(([key, value]) => e[key] === value)) action({
 				event: e,
-				shortcut: t
+				shortcut
 			});
-		}), o?.(e);
-	}, [t, o]);
-	r.useEffect(() => (a && window.addEventListener("keydown", d), () => {
-		window.removeEventListener("keydown", d);
-	}), [a, d]);
-	let f = e ? i : "div";
-	return /* @__PURE__ */ r.createElement(f, {
-		onKeyDown: a ? void 0 : d,
-		ref: u,
-		...s
+		});
+		onKeyDown?.(e);
+	}, [config, onKeyDown]);
+	React$1.useEffect(() => {
+		if (targetWindow) window.addEventListener("keydown", handleOnKeydown);
+		return () => {
+			window.removeEventListener("keydown", handleOnKeydown);
+		};
+	}, [targetWindow, handleOnKeydown]);
+	const Component = asChild ? Slot : "div";
+	return /* @__PURE__ */ React$1.createElement(Component, {
+		onKeyDown: targetWindow ? void 0 : handleOnKeydown,
+		ref: setTargetElRef,
+		...rest
 	});
 });
-a.displayName = "KeyboardShortcut";
-var o = e(t, { base: [
+KeyboardShortcut.displayName = "KeyboardShortcut";
+var StyledKeyboardShortcutIndicator = styled(Text, { base: [
 	"bg-grey-100",
 	"text-text-subtle",
 	"px-2",
@@ -40,13 +44,16 @@ var o = e(t, { base: [
 	"rounded-md",
 	"shrink-0",
 	"capsize-none"
-] }), s = (e) => /* @__PURE__ */ r.createElement(o, {
-	size: "sm",
-	as: "kbd",
-	...e
-});
-s.displayName = "KeyboardShortcut";
+] });
+var KeyboardShortcutIndicator = (props) => {
+	return /* @__PURE__ */ React$1.createElement(StyledKeyboardShortcutIndicator, {
+		size: "sm",
+		as: "kbd",
+		...props
+	});
+};
+KeyboardShortcutIndicator.displayName = "KeyboardShortcut";
 //#endregion
-export { a as KeyboardShortcut, s as KeyboardShortcutIndicator };
+export { KeyboardShortcut, KeyboardShortcutIndicator };
 
 //# sourceMappingURL=KeyboardShortcut.js.map

package/dist/components/keyboard-shortcut/KeyboardShortcut.js.map

@@ -1 +1 @@
-{"version":3,"file":"KeyboardShortcut.js","names":[],"sources":["../../../src/components/keyboard-shortcut/KeyboardShortcut.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\n\nimport { Text } from '../text/Text'\n\ntype KeyboardEventWindowOrElement =\n  | KeyboardEvent\n  | React.KeyboardEvent<HTMLDivElement>\ntype ShortcutConfig = Partial<KeyboardEvent>\n\ntype KeyboardShortcutProps = React.HTMLAttributes<HTMLDivElement> & {\n  asChild?: boolean\n  config: {\n    shortcut: ShortcutConfig\n    action: ({\n      event,\n      shortcut\n    }: {\n      event: KeyboardEvent | React.KeyboardEvent<HTMLDivElement>\n      shortcut: ShortcutConfig\n    }) => void\n  }[]\n  targetWindow?: boolean\n  onKeyDown?: (e: KeyboardEventWindowOrElement) => void\n}\n\nexport const KeyboardShortcut = React.forwardRef<\n  HTMLDivElement,\n  KeyboardShortcutProps\n>(({ asChild, config, targetWindow = false, onKeyDown, ...rest }, ref) => {\n  const [targetElRef, setTargetElRef] = useCallbackRefState()\n  React.useImperativeHandle(ref, () => targetElRef as HTMLDivElement)\n\n  const handleOnKeydown = React.useCallback(\n    (e: KeyboardEventWindowOrElement) => {\n      config.forEach(({ shortcut, action }) => {\n        if (Object.entries(shortcut).every(([key, value]) => e[key] === value))\n          action({ event: e, shortcut })\n      })\n      onKeyDown?.(e)\n    },\n    [config, onKeyDown]\n  )\n\n  React.useEffect(() => {\n    if (targetWindow) window.addEventListener('keydown', handleOnKeydown)\n\n    return () => {\n      window.removeEventListener('keydown', handleOnKeydown)\n    }\n  }, [targetWindow, handleOnKeydown])\n\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <Component\n      onKeyDown={targetWindow ? undefined : (handleOnKeydown as any)}\n      ref={setTargetElRef}\n      {...rest}\n    />\n  )\n})\n\nKeyboardShortcut.displayName = 'KeyboardShortcut'\n\nconst StyledKeyboardShortcutIndicator = styled(Text, {\n  base: [\n    'bg-grey-100',\n    'text-text-subtle',\n    'px-2',\n    'py-0.5',\n    'min-w-6',\n    'min-h-6',\n    'font-normal',\n    'inline-flex',\n    'justify-center',\n    'items-center',\n    'rounded-md',\n    'shrink-0',\n    'capsize-none'\n  ]\n})\n\ntype KeyboardShortcutIndicatorProps = React.ComponentProps<\n  typeof StyledKeyboardShortcutIndicator\n>\n\nexport const KeyboardShortcutIndicator = (\n  props: KeyboardShortcutIndicatorProps\n) => {\n  return <StyledKeyboardShortcutIndicator size=\"sm\" as=\"kbd\" {...props} />\n}\n\nKeyboardShortcutIndicator.displayName = 'KeyboardShortcut'\n"],"mappings":";;;;;;AA6BA,IAAa,IAAmB,EAAM,YAGnC,EAAE,YAAS,WAAQ,kBAAe,IAAO,cAAW,GAAG,KAAQ,MAAQ;CACxE,IAAM,CAAC,GAAa,KAAkB,GAAqB;AAC3D,GAAM,oBAAoB,SAAW,EAA8B;CAEnE,IAAM,IAAkB,EAAM,aAC3B,MAAoC;AAKnC,EAJA,EAAO,SAAS,EAAE,aAAU,gBAAa;AACvC,GAAI,OAAO,QAAQ,EAAS,CAAC,OAAO,CAAC,GAAK,OAAW,EAAE,OAAS,EAAM,IACpE,EAAO;IAAE,OAAO;IAAG;IAAU,CAAC;IAChC,EACF,IAAY,EAAE;IAEhB,CAAC,GAAQ,EAAU,CACpB;AAED,GAAM,iBACA,KAAc,OAAO,iBAAiB,WAAW,EAAgB,QAExD;AACX,SAAO,oBAAoB,WAAW,EAAgB;KAEvD,CAAC,GAAc,EAAgB,CAAC;CAEnC,IAAM,IAAY,IAAU,IAAO;AAEnC,QACE,kBAAA,cAAC,GAAD;EACE,WAAW,IAAe,KAAA,IAAa;EACvC,KAAK;EACL,GAAI;EACJ,CAAA;EAEJ;AAEF,EAAiB,cAAc;AAE/B,IAAM,IAAkC,EAAO,GAAM,EACnD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAMW,KACX,MAEO,kBAAA,cAAC,GAAD;CAAiC,MAAK;CAAK,IAAG;CAAM,GAAI;CAAS,CAAA;AAG1E,EAA0B,cAAc"}
+{"version":3,"file":"KeyboardShortcut.js","names":[],"sources":["../../../src/components/keyboard-shortcut/KeyboardShortcut.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\n\nimport { Text } from '../text/Text'\n\ntype KeyboardEventWindowOrElement =\n  | KeyboardEvent\n  | React.KeyboardEvent<HTMLDivElement>\ntype ShortcutConfig = Partial<KeyboardEvent>\n\ntype KeyboardShortcutProps = React.HTMLAttributes<HTMLDivElement> & {\n  asChild?: boolean\n  config: {\n    shortcut: ShortcutConfig\n    action: ({\n      event,\n      shortcut\n    }: {\n      event: KeyboardEvent | React.KeyboardEvent<HTMLDivElement>\n      shortcut: ShortcutConfig\n    }) => void\n  }[]\n  targetWindow?: boolean\n  onKeyDown?: (e: KeyboardEventWindowOrElement) => void\n}\n\nexport const KeyboardShortcut = React.forwardRef<\n  HTMLDivElement,\n  KeyboardShortcutProps\n>(({ asChild, config, targetWindow = false, onKeyDown, ...rest }, ref) => {\n  const [targetElRef, setTargetElRef] = useCallbackRefState()\n  React.useImperativeHandle(ref, () => targetElRef as HTMLDivElement)\n\n  const handleOnKeydown = React.useCallback(\n    (e: KeyboardEventWindowOrElement) => {\n      config.forEach(({ shortcut, action }) => {\n        if (Object.entries(shortcut).every(([key, value]) => e[key] === value))\n          action({ event: e, shortcut })\n      })\n      onKeyDown?.(e)\n    },\n    [config, onKeyDown]\n  )\n\n  React.useEffect(() => {\n    if (targetWindow) window.addEventListener('keydown', handleOnKeydown)\n\n    return () => {\n      window.removeEventListener('keydown', handleOnKeydown)\n    }\n  }, [targetWindow, handleOnKeydown])\n\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <Component\n      onKeyDown={targetWindow ? undefined : (handleOnKeydown as any)}\n      ref={setTargetElRef}\n      {...rest}\n    />\n  )\n})\n\nKeyboardShortcut.displayName = 'KeyboardShortcut'\n\nconst StyledKeyboardShortcutIndicator = styled(Text, {\n  base: [\n    'bg-grey-100',\n    'text-text-subtle',\n    'px-2',\n    'py-0.5',\n    'min-w-6',\n    'min-h-6',\n    'font-normal',\n    'inline-flex',\n    'justify-center',\n    'items-center',\n    'rounded-md',\n    'shrink-0',\n    'capsize-none'\n  ]\n})\n\ntype KeyboardShortcutIndicatorProps = React.ComponentProps<\n  typeof StyledKeyboardShortcutIndicator\n>\n\nexport const KeyboardShortcutIndicator = (\n  props: KeyboardShortcutIndicatorProps\n) => {\n  return <StyledKeyboardShortcutIndicator size=\"sm\" as=\"kbd\" {...props} />\n}\n\nKeyboardShortcutIndicator.displayName = 'KeyboardShortcut'\n"],"mappings":";;;;;;AA6BA,IAAa,mBAAmB,QAAM,YAGnC,EAAE,SAAS,QAAQ,eAAe,OAAO,WAAW,GAAG,QAAQ,QAAQ;CACxE,MAAM,CAAC,aAAa,kBAAkB,qBAAqB;AAC3D,SAAM,oBAAoB,WAAW,YAA8B;CAEnE,MAAM,kBAAkB,QAAM,aAC3B,MAAoC;AACnC,SAAO,SAAS,EAAE,UAAU,aAAa;AACvC,OAAI,OAAO,QAAQ,SAAS,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE,SAAS,MAAM,CACpE,QAAO;IAAE,OAAO;IAAG;IAAU,CAAC;IAChC;AACF,cAAY,EAAE;IAEhB,CAAC,QAAQ,UAAU,CACpB;AAED,SAAM,gBAAgB;AACpB,MAAI,aAAc,QAAO,iBAAiB,WAAW,gBAAgB;AAErE,eAAa;AACX,UAAO,oBAAoB,WAAW,gBAAgB;;IAEvD,CAAC,cAAc,gBAAgB,CAAC;CAEnC,MAAM,YAAY,UAAU,OAAO;AAEnC,QACE,wBAAA,cAAC,WAAD;EACE,WAAW,eAAe,KAAA,IAAa;EACvC,KAAK;EACL,GAAI;EACJ,CAAA;EAEJ;AAEF,iBAAiB,cAAc;AAE/B,IAAM,kCAAkC,OAAO,MAAM,EACnD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAMF,IAAa,6BACX,UACG;AACH,QAAO,wBAAA,cAAC,iCAAD;EAAiC,MAAK;EAAK,IAAG;EAAM,GAAI;EAAS,CAAA;;AAG1E,0BAA0B,cAAc"}

package/dist/components/keyboard-shortcut/index.js

@@ -1,8 +1,8 @@
-import { KeyboardShortcut as e, KeyboardShortcutIndicator as t } from "./KeyboardShortcut.js";
+import { KeyboardShortcut as KeyboardShortcut$1, KeyboardShortcutIndicator } from "./KeyboardShortcut.js";
 //#region src/components/keyboard-shortcut/index.ts
-var n = Object.assign(e, { Indicator: t });
-n.displayName = "KeyboardShortcut";
+var KeyboardShortcut = Object.assign(KeyboardShortcut$1, { Indicator: KeyboardShortcutIndicator });
+KeyboardShortcut.displayName = "KeyboardShortcut";
 //#endregion
-export { n as KeyboardShortcut };
+export { KeyboardShortcut };
 
 //# sourceMappingURL=index.js.map

package/dist/components/keyboard-shortcut/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/keyboard-shortcut/index.ts"],"sourcesContent":["import {\n  KeyboardShortcut as KeyboardShortcutComponent,\n  KeyboardShortcutIndicator\n} from './KeyboardShortcut'\n\nexport const KeyboardShortcut = Object.assign(KeyboardShortcutComponent, {\n  Indicator: KeyboardShortcutIndicator\n})\n\nKeyboardShortcut.displayName = 'KeyboardShortcut'\n"],"mappings":";;AAKA,IAAa,IAAmB,OAAO,OAAO,GAA2B,EACvE,WAAW,GACZ,CAAC;AAEF,EAAiB,cAAc"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/keyboard-shortcut/index.ts"],"sourcesContent":["import {\n  KeyboardShortcut as KeyboardShortcutComponent,\n  KeyboardShortcutIndicator\n} from './KeyboardShortcut'\n\nexport const KeyboardShortcut = Object.assign(KeyboardShortcutComponent, {\n  Indicator: KeyboardShortcutIndicator\n})\n\nKeyboardShortcut.displayName = 'KeyboardShortcut'\n"],"mappings":";;AAKA,IAAa,mBAAmB,OAAO,OAAO,oBAA2B,EACvE,WAAW,2BACZ,CAAC;AAEF,iBAAiB,cAAc"}

package/dist/components/label/Label.js

@@ -1,8 +1,12 @@
-import { styled as e } from "../../styled.js";
-import * as t from "react";
+import { styled } from "../../styled.js";
+import * as React$1 from "react";
 //#region src/components/label/Label.tsx
-var n = e("label", {
-	base: ["text-grey-900", "font-body"],
+var StyledLabel = styled("label", {
+	base: [
+		"text-grey-900",
+		"font-body",
+		"m-0"
+	],
 	variants: {
 		size: {
 			sm: [
@@ -64,19 +68,20 @@ var n = e("label", {
 			class: ["font-normal"]
 		}
 	]
-}), r = ({ align: e = "start", as: r = "label", direction: i = "row", size: a = "md", type: o = "block", children: s, required: c, ...l }) => /* @__PURE__ */ t.createElement(n, {
-	as: r,
-	size: a,
-	type: o,
-	align: e,
-	direction: i,
-	...l
-}, s, c && /* @__PURE__ */ t.createElement("span", {
+});
+var Label = ({ align = "start", as = "label", direction = "row", size = "md", type = "block", children, required, ...rest }) => /* @__PURE__ */ React$1.createElement(StyledLabel, {
+	as,
+	size,
+	type,
+	align,
+	direction,
+	...rest
+}, children, required && /* @__PURE__ */ React$1.createElement("span", {
 	className: "text-danger ml-1 font-normal",
-	"aria-hidden": !0
+	"aria-hidden": true
 }, "*"));
-r.displayName = "Label";
+Label.displayName = "Label";
 //#endregion
-export { r as Label };
+export { Label };
 
 //# sourceMappingURL=Label.js.map

package/dist/components/label/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","names":[],"sources":["../../../src/components/label/Label.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities/types'\n\nconst StyledLabel = styled('label', {\n  base: ['text-grey-900', 'font-body'],\n  variants: {\n    size: {\n      sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      md: ['text-md', 'leading-normal', 'capsize-[0.3864]']\n    },\n    type: {\n      block: ['block', 'font-semibold'],\n      inline: ['flex', 'font-normal', 'max-w-max']\n    },\n    align: { start: [], center: [] },\n    direction: { reverse: [], row: [] },\n    appearance: { standard: [], modern: [] }\n  },\n  compoundVariants: [\n    {\n      type: 'inline',\n      align: 'start',\n      class: ['items-start']\n    },\n    {\n      type: 'inline',\n      align: 'center',\n      class: ['items-center']\n    },\n    {\n      type: 'inline',\n      direction: 'reverse',\n      class: ['flex-row-reverse']\n    },\n    {\n      type: 'inline',\n      direction: 'row',\n      class: ['flex-row']\n    },\n    {\n      type: 'block',\n      appearance: 'modern',\n      class: ['font-normal']\n    }\n  ]\n})\n\nexport type LabelProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledLabel>,\n  {\n    as?: 'label' | 'legend'\n    required?: boolean\n  }\n>\n\nexport const Label = ({\n  align = 'start',\n  as = 'label',\n  direction = 'row',\n  size = 'md',\n  type = 'block',\n  children,\n  required,\n  ...rest\n}: LabelProps) => (\n  <StyledLabel\n    as={as}\n    size={size}\n    type={type}\n    align={align}\n    direction={direction}\n    {...rest}\n  >\n    {children}\n    {required && (\n      <span className=\"text-danger ml-1 font-normal\" aria-hidden>\n        *\n      </span>\n    )}\n  </StyledLabel>\n)\n\nLabel.displayName = 'Label'\n"],"mappings":";;;AAKA,IAAM,IAAc,EAAO,SAAS;CAClC,MAAM,CAAC,iBAAiB,YAAY;CACpC,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,MAAM;GACJ,OAAO,CAAC,SAAS,gBAAgB;GACjC,QAAQ;IAAC;IAAQ;IAAe;IAAY;GAC7C;EACD,OAAO;GAAE,OAAO,EAAE;GAAE,QAAQ,EAAE;GAAE;EAChC,WAAW;GAAE,SAAS,EAAE;GAAE,KAAK,EAAE;GAAE;EACnC,YAAY;GAAE,UAAU,EAAE;GAAE,QAAQ,EAAE;GAAE;EACzC;CACD,kBAAkB;EAChB;GACE,MAAM;GACN,OAAO;GACP,OAAO,CAAC,cAAc;GACvB;EACD;GACE,MAAM;GACN,OAAO;GACP,OAAO,CAAC,eAAe;GACxB;EACD;GACE,MAAM;GACN,WAAW;GACX,OAAO,CAAC,mBAAmB;GAC5B;EACD;GACE,MAAM;GACN,WAAW;GACX,OAAO,CAAC,WAAW;GACpB;EACD;GACE,MAAM;GACN,YAAY;GACZ,OAAO,CAAC,cAAc;GACvB;EACF;CACF,CAAC,EAUW,KAAS,EACpB,WAAQ,SACR,QAAK,SACL,eAAY,OACZ,UAAO,MACP,UAAO,SACP,aACA,aACA,GAAG,QAEH,kBAAA,cAAC,GAAD;CACM;CACE;CACA;CACC;CACI;CACX,GAAI;CAQQ,EANX,GACA,KACC,kBAAA,cAAC,QAAD;CAAM,WAAU;CAA+B,eAAA;CAExC,EAFoD,IAEpD,CAEG;AAGhB,EAAM,cAAc"}
+{"version":3,"file":"Label.js","names":[],"sources":["../../../src/components/label/Label.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities/types'\n\nconst StyledLabel = styled('label', {\n  base: ['text-grey-900', 'font-body', 'm-0'],\n  variants: {\n    size: {\n      sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      md: ['text-md', 'leading-normal', 'capsize-[0.3864]']\n    },\n    type: {\n      block: ['block', 'font-semibold'],\n      inline: ['flex', 'font-normal', 'max-w-max']\n    },\n    align: { start: [], center: [] },\n    direction: { reverse: [], row: [] },\n    appearance: { standard: [], modern: [] }\n  },\n  compoundVariants: [\n    {\n      type: 'inline',\n      align: 'start',\n      class: ['items-start']\n    },\n    {\n      type: 'inline',\n      align: 'center',\n      class: ['items-center']\n    },\n    {\n      type: 'inline',\n      direction: 'reverse',\n      class: ['flex-row-reverse']\n    },\n    {\n      type: 'inline',\n      direction: 'row',\n      class: ['flex-row']\n    },\n    {\n      type: 'block',\n      appearance: 'modern',\n      class: ['font-normal']\n    }\n  ]\n})\n\nexport type LabelProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledLabel>,\n  {\n    as?: 'label' | 'legend'\n    required?: boolean\n  }\n>\n\nexport const Label = ({\n  align = 'start',\n  as = 'label',\n  direction = 'row',\n  size = 'md',\n  type = 'block',\n  children,\n  required,\n  ...rest\n}: LabelProps) => (\n  <StyledLabel\n    as={as}\n    size={size}\n    type={type}\n    align={align}\n    direction={direction}\n    {...rest}\n  >\n    {children}\n    {required && (\n      <span className=\"text-danger ml-1 font-normal\" aria-hidden>\n        *\n      </span>\n    )}\n  </StyledLabel>\n)\n\nLabel.displayName = 'Label'\n"],"mappings":";;;AAKA,IAAM,cAAc,OAAO,SAAS;CAClC,MAAM;EAAC;EAAiB;EAAa;EAAM;CAC3C,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,MAAM;GACJ,OAAO,CAAC,SAAS,gBAAgB;GACjC,QAAQ;IAAC;IAAQ;IAAe;IAAY;GAC7C;EACD,OAAO;GAAE,OAAO,EAAE;GAAE,QAAQ,EAAE;GAAE;EAChC,WAAW;GAAE,SAAS,EAAE;GAAE,KAAK,EAAE;GAAE;EACnC,YAAY;GAAE,UAAU,EAAE;GAAE,QAAQ,EAAE;GAAE;EACzC;CACD,kBAAkB;EAChB;GACE,MAAM;GACN,OAAO;GACP,OAAO,CAAC,cAAc;GACvB;EACD;GACE,MAAM;GACN,OAAO;GACP,OAAO,CAAC,eAAe;GACxB;EACD;GACE,MAAM;GACN,WAAW;GACX,OAAO,CAAC,mBAAmB;GAC5B;EACD;GACE,MAAM;GACN,WAAW;GACX,OAAO,CAAC,WAAW;GACpB;EACD;GACE,MAAM;GACN,YAAY;GACZ,OAAO,CAAC,cAAc;GACvB;EACF;CACF,CAAC;AAUF,IAAa,SAAS,EACpB,QAAQ,SACR,KAAK,SACL,YAAY,OACZ,OAAO,MACP,OAAO,SACP,UACA,UACA,GAAG,WAEH,wBAAA,cAAC,aAAD;CACM;CACE;CACA;CACC;CACI;CACX,GAAI;CAQQ,EANX,UACA,YACC,wBAAA,cAAC,QAAD;CAAM,WAAU;CAA+B,eAAA;CAExC,EAFoD,IAEpD,CAEG;AAGhB,MAAM,cAAc"}

package/dist/components/link/Link.js

@@ -1,8 +1,8 @@
-import { styled as e } from "../../styled.js";
-import { getExternalAnchorProps as t } from "../../utilities/uri/index.js";
-import * as n from "react";
+import { styled } from "../../styled.js";
+import { getExternalAnchorProps } from "../../utilities/uri/index.js";
+import * as React$1 from "react";
 //#region src/components/link/Link.tsx
-var r = e("a", {
+var StyledLink = styled("a", {
 	base: [
 		"bg-[unset]",
 		"text-primary-800",
@@ -52,17 +52,18 @@ var r = e("a", {
 		noCapsize: { true: ["capsize-none"] }
 	},
 	defaultVariants: { size: "md" }
-}, { enabledResponsiveVariants: !0 }), i = n.forwardRef(({ as: e, disabled: i, href: a, ...o }, s) => /* @__PURE__ */ n.createElement(r, {
-	as: e || (a ? void 0 : "button"),
-	noCapsize: a ? void 0 : !0,
-	href: a,
-	...i && { disabled: !0 },
-	...o,
-	...t(a),
-	ref: s
+}, { enabledResponsiveVariants: true });
+var Link = React$1.forwardRef(({ as, disabled, href, ...rest }, ref) => /* @__PURE__ */ React$1.createElement(StyledLink, {
+	as: as || (!href ? "button" : void 0),
+	noCapsize: !href ? true : void 0,
+	href,
+	...disabled && { disabled: true },
+	...rest,
+	...getExternalAnchorProps(href),
+	ref
 }));
-i.displayName = "Link";
+Link.displayName = "Link";
 //#endregion
-export { i as Link, r as StyledLink };
+export { Link, StyledLink };
 
 //# sourceMappingURL=Link.js.map

package/dist/components/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","names":[],"sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nexport const StyledLink = styled(\n  'a',\n  {\n    base: [\n      'bg-[unset]',\n      'text-primary-800',\n      'cursor-pointer',\n      'font-body',\n      'no-underline',\n      'focus:text-primary-900',\n      'focus:underline',\n      'hover:text-primary-900',\n      'hover:underline',\n      'active:text-primary-1000',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30',\n      'disabled:pointer-events-none',\n      '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:after:content-none',\n      '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:before:content-none',\n      '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:text-[100%]/none'\n    ],\n    variants: {\n      size: {\n        xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n        sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n        md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n        lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n        xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]']\n      },\n      noCapsize: {\n        true: ['capsize-none']\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\ntype LinkProps = Override<\n  React.ComponentProps<typeof StyledLink>,\n  NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ as, disabled, href, ...rest }, ref) => (\n    <StyledLink\n      as={as || (!href ? 'button' : undefined)}\n      noCapsize={!href ? true : undefined}\n      href={href}\n      {...(disabled && { disabled: true })}\n      {...rest}\n      {...getExternalAnchorProps(href)}\n      ref={ref as any}\n    />\n  )\n)\n\nLink.displayName = 'Link'\n"],"mappings":";;;;AAOA,IAAa,IAAa,EACxB,KACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAOY,IAAO,EAAM,YACvB,EAAE,OAAI,aAAU,SAAM,GAAG,KAAQ,MAChC,kBAAA,cAAC,GAAD;CACE,IAAI,MAAQ,IAAkB,KAAA,IAAX;CACnB,WAAY,IAAc,KAAA,IAAP;CACb;CACN,GAAK,KAAY,EAAE,UAAU,IAAM;CACnC,GAAI;CACJ,GAAI,EAAuB,EAAK;CAC3B;CACL,CAAA,CAEL;AAED,EAAK,cAAc"}
+{"version":3,"file":"Link.js","names":[],"sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nexport const StyledLink = styled(\n  'a',\n  {\n    base: [\n      'bg-[unset]',\n      'text-primary-800',\n      'cursor-pointer',\n      'font-body',\n      'no-underline',\n      'focus:text-primary-900',\n      'focus:underline',\n      'hover:text-primary-900',\n      'hover:underline',\n      'active:text-primary-1000',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30',\n      'disabled:pointer-events-none',\n      '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:after:content-none',\n      '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:before:content-none',\n      '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:text-[100%]/none'\n    ],\n    variants: {\n      size: {\n        xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n        sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n        md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n        lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n        xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]']\n      },\n      noCapsize: {\n        true: ['capsize-none']\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\ntype LinkProps = Override<\n  React.ComponentProps<typeof StyledLink>,\n  NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ as, disabled, href, ...rest }, ref) => (\n    <StyledLink\n      as={as || (!href ? 'button' : undefined)}\n      noCapsize={!href ? true : undefined}\n      href={href}\n      {...(disabled && { disabled: true })}\n      {...rest}\n      {...getExternalAnchorProps(href)}\n      ref={ref as any}\n    />\n  )\n)\n\nLink.displayName = 'Link'\n"],"mappings":";;;;AAOA,IAAa,aAAa,OACxB,KACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EAAE,2BAA2B,MAAM,CACpC;AAOD,IAAa,OAAO,QAAM,YACvB,EAAE,IAAI,UAAU,MAAM,GAAG,QAAQ,QAChC,wBAAA,cAAC,YAAD;CACE,IAAI,OAAO,CAAC,OAAO,WAAW,KAAA;CAC9B,WAAW,CAAC,OAAO,OAAO,KAAA;CACpB;CACN,GAAK,YAAY,EAAE,UAAU,MAAM;CACnC,GAAI;CACJ,GAAI,uBAAuB,KAAK;CAC3B;CACL,CAAA,CAEL;AAED,KAAK,cAAc"}

package/dist/components/list/List.js

@@ -1,7 +1,8 @@
-import { styled as e } from "../../styled.js";
-import * as t from "react";
+import { styled } from "../../styled.js";
+import * as React$1 from "react";
 //#region src/components/list/List.tsx
-var n = e("li", { base: ["last:mb-0", "not-last:mb-2"] }), r = e("ul", {
+var StyledLi = styled("li", { base: ["last:mb-0", "not-last:mb-2"] });
+var StyledList = styled("ul", {
 	base: ["list-inside", "font-body"],
 	variants: {
 		size: {
@@ -48,16 +49,17 @@ var n = e("li", { base: ["last:mb-0", "not-last:mb-2"] }), r = e("ul", {
 		},
 		theme: { primary: ["marker:text-primary-800"] }
 	}
-}), i = t.forwardRef(({ size: e = "md", noCapsize: n = !0, ordered: i = !1, ...a }, o) => /* @__PURE__ */ t.createElement(r, {
-	ref: o,
-	as: i ? "ol" : "ul",
-	ordered: i,
-	size: e,
-	noCapsize: n,
-	...a
+});
+var List = React$1.forwardRef(({ size = "md", noCapsize = true, ordered = false, ...remainingProps }, ref) => /* @__PURE__ */ React$1.createElement(StyledList, {
+	ref,
+	as: ordered ? "ol" : "ul",
+	ordered,
+	size,
+	noCapsize,
+	...remainingProps
 }));
-i.Item = n;
+List.Item = StyledLi;
 //#endregion
-export { i as List };
+export { List };
 
 //# sourceMappingURL=List.js.map

package/dist/components/list/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","names":[],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nexport const StyledLi = styled('li', {\n  base: ['last:mb-0', 'not-last:mb-2']\n})\n\nexport const StyledList = styled('ul', {\n  base: ['list-inside', 'font-body'],\n  variants: {\n    size: {\n      xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n      sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n      lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n      xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]']\n    },\n    noCapsize: {\n      true: ['capsize-none']\n    },\n    ordered: {\n      true: [\n        'pl-4',\n        'list-decimal',\n        '[&_>_li]:pl-1',\n        '[&_>_li::marker]:font-medium',\n        '[&_>_li::marker]:text-sm'\n      ],\n      false: ['pl-3', 'list-disc', '[&_>_li]:pl-2']\n    },\n    theme: {\n      primary: ['marker:text-primary-800']\n    }\n  }\n})\n\ntype ListProps = React.ComponentProps<typeof StyledList> & {\n  ordered?: boolean\n}\n\ntype ListType = ReturnType<\n  typeof React.forwardRef<HTMLUListElement, ListProps>\n> & {\n  Item: typeof StyledLi\n}\n\nexport const List = React.forwardRef<HTMLUListElement, ListProps>(\n  (\n    { size = 'md', noCapsize = true, ordered = false, ...remainingProps },\n    ref\n  ) => (\n    <StyledList\n      ref={ref}\n      as={ordered ? 'ol' : 'ul'}\n      ordered={ordered}\n      size={size}\n      noCapsize={noCapsize}\n      {...remainingProps}\n    />\n  )\n) as ListType\n\nList.Item = StyledLi\n"],"mappings":";;;AAIA,IAAa,IAAW,EAAO,MAAM,EACnC,MAAM,CAAC,aAAa,gBAAgB,EACrC,CAAC,EAEW,IAAa,EAAO,MAAM;CACrC,MAAM,CAAC,eAAe,YAAY;CAClC,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACD,SAAS;GACP,MAAM;IACJ;IACA;IACA;IACA;IACA;IACD;GACD,OAAO;IAAC;IAAQ;IAAa;IAAgB;GAC9C;EACD,OAAO,EACL,SAAS,CAAC,0BAA0B,EACrC;EACF;CACF,CAAC,EAYW,IAAO,EAAM,YAEtB,EAAE,UAAO,MAAM,eAAY,IAAM,aAAU,IAAO,GAAG,KACrD,MAEA,kBAAA,cAAC,GAAD;CACO;CACL,IAAI,IAAU,OAAO;CACZ;CACH;CACK;CACX,GAAI;CACJ,CAAA,CAEL;AAED,EAAK,OAAO"}
+{"version":3,"file":"List.js","names":[],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nexport const StyledLi = styled('li', {\n  base: ['last:mb-0', 'not-last:mb-2']\n})\n\nexport const StyledList = styled('ul', {\n  base: ['list-inside', 'font-body'],\n  variants: {\n    size: {\n      xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n      sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n      lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n      xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]']\n    },\n    noCapsize: {\n      true: ['capsize-none']\n    },\n    ordered: {\n      true: [\n        'pl-4',\n        'list-decimal',\n        '[&_>_li]:pl-1',\n        '[&_>_li::marker]:font-medium',\n        '[&_>_li::marker]:text-sm'\n      ],\n      false: ['pl-3', 'list-disc', '[&_>_li]:pl-2']\n    },\n    theme: {\n      primary: ['marker:text-primary-800']\n    }\n  }\n})\n\ntype ListProps = React.ComponentProps<typeof StyledList> & {\n  ordered?: boolean\n}\n\ntype ListType = ReturnType<\n  typeof React.forwardRef<HTMLUListElement, ListProps>\n> & {\n  Item: typeof StyledLi\n}\n\nexport const List = React.forwardRef<HTMLUListElement, ListProps>(\n  (\n    { size = 'md', noCapsize = true, ordered = false, ...remainingProps },\n    ref\n  ) => (\n    <StyledList\n      ref={ref}\n      as={ordered ? 'ol' : 'ul'}\n      ordered={ordered}\n      size={size}\n      noCapsize={noCapsize}\n      {...remainingProps}\n    />\n  )\n) as ListType\n\nList.Item = StyledLi\n"],"mappings":";;;AAIA,IAAa,WAAW,OAAO,MAAM,EACnC,MAAM,CAAC,aAAa,gBAAgB,EACrC,CAAC;AAEF,IAAa,aAAa,OAAO,MAAM;CACrC,MAAM,CAAC,eAAe,YAAY;CAClC,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACD,SAAS;GACP,MAAM;IACJ;IACA;IACA;IACA;IACA;IACD;GACD,OAAO;IAAC;IAAQ;IAAa;IAAgB;GAC9C;EACD,OAAO,EACL,SAAS,CAAC,0BAA0B,EACrC;EACF;CACF,CAAC;AAYF,IAAa,OAAO,QAAM,YAEtB,EAAE,OAAO,MAAM,YAAY,MAAM,UAAU,OAAO,GAAG,kBACrD,QAEA,wBAAA,cAAC,YAAD;CACO;CACL,IAAI,UAAU,OAAO;CACZ;CACH;CACK;CACX,GAAI;CACJ,CAAA,CAEL;AAED,KAAK,OAAO"}