@choco-vanille/ui 1.1.1 → 1.2.0

package/dist/components/forms/text-field/hooks/useTextfield.hook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTextfield.hook.js","sources":["../../../../../src/components/forms/text-field/hooks/useTextfield.hook.tsx"],"sourcesContent":["import { type FocusEventHandler, type MouseEventHandler, useCallback, useId, useRef, useState } from 'react'\r\nimport type { TextFieldProps } from '@components/forms/text-field/types/TextField.props.ts'\r\nimport type { UseTextFieldReturn } from '@components/forms/text-field/hooks/types'\r\n\r\nexport const useTextField = (\r\n    props: TextFieldProps & {\r\n        type?: string\r\n        onMouseDown?: MouseEventHandler<HTMLInputElement>\r\n        onFocus?: FocusEventHandler<HTMLInputElement>\r\n        onBlur?: FocusEventHandler<HTMLInputElement>\r\n    }\r\n): UseTextFieldReturn => {\r\n    const {\r\n        label,\r\n        error,\r\n        startIcon,\r\n        endAction,\r\n        type,\r\n        onMouseDown,\r\n        onFocus,\r\n        onBlur,\r\n        id\r\n    } = props\r\n\r\n    const generatedId = useId()\r\n    const inputId = id ?? (label ? generatedId : undefined)\r\n    const helperId = `${generatedId}-helper`\r\n    const hasError = Boolean(error)\r\n    const isPassword = type === 'password'\r\n\r\n    const [showPassword, setShowPassword] = useState(false)\r\n    const pointerDownRef = useRef(false)\r\n\r\n    const handleMouseDown = useCallback(\r\n        (e: React.MouseEvent<HTMLInputElement>) => {\r\n            pointerDownRef.current = true\r\n            onMouseDown?.(e)\r\n        },\r\n        [onMouseDown],\r\n    )\r\n\r\n    const handleFocus = useCallback(\r\n        (e: React.FocusEvent<HTMLInputElement>) => {\r\n            if (pointerDownRef.current) {\r\n                e.currentTarget.setAttribute('data-mouse-focus', '')\r\n                pointerDownRef.current = false\r\n            }\r\n            onFocus?.(e)\r\n        },\r\n        [onFocus],\r\n    )\r\n\r\n    const handleBlur = useCallback(\r\n        (e: React.FocusEvent<HTMLInputElement>) => {\r\n            pointerDownRef.current = false\r\n            e.currentTarget.removeAttribute('data-mouse-focus')\r\n            onBlur?.(e)\r\n        },\r\n        [onBlur],\r\n    )\r\n\r\n    const hasStartIcon = Boolean(startIcon)\r\n    const hasEndAction = isPassword || Boolean(endAction)\r\n    const resolvedType = isPassword ? (showPassword ? 'text' : 'password') : type\r\n\r\n    return {\r\n        inputId,\r\n        helperId,\r\n        hasError,\r\n        isPassword,\r\n        showPassword,\r\n        setShowPassword,\r\n        handleMouseDown,\r\n        handleFocus,\r\n        handleBlur,\r\n        hasStartIcon,\r\n        hasEndAction,\r\n        resolvedType,\r\n    }\r\n}\r\n"],"names":["useTextField","props","label","error","startIcon","endAction","type","onMouseDown","onFocus","onBlur","id","generatedId","useId","inputId","helperId","hasError","isPassword","showPassword","setShowPassword","useState","pointerDownRef","useRef","handleMouseDown","useCallback","handleFocus","handleBlur"],"mappings":";AAIO,MAAMA,IAAe,CACxBC,MAMqB;AACrB,QAAM;AAAA,IACF,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC;AAAA,IACA,IAAAC;AAAA,EAAA,IACAT,GAEEU,IAAcC,EAAA,GACdC,IAAUH,MAAOR,IAAQS,IAAc,SACvCG,IAAW,GAAGH,CAAW,WACzBI,IAAW,EAAQZ,GACnBa,IAAaV,MAAS,YAEtB,CAACW,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChDC,IAAiBC,EAAO,EAAK,GAE7BC,IAAkBC;AAAA,IACpB,CAAC,MAA0C;AACvC,MAAAH,EAAe,UAAU,IACzBb,IAAc,CAAC;AAAA,IACnB;AAAA,IACA,CAACA,CAAW;AAAA,EAAA,GAGViB,IAAcD;AAAA,IAChB,CAAC,MAA0C;AACvC,MAAIH,EAAe,YACf,EAAE,cAAc,aAAa,oBAAoB,EAAE,GACnDA,EAAe,UAAU,KAE7BZ,IAAU,CAAC;AAAA,IACf;AAAA,IACA,CAACA,CAAO;AAAA,EAAA,GAGNiB,IAAaF;AAAA,IACf,CAAC,MAA0C;AACvC,MAAAH,EAAe,UAAU,IACzB,EAAE,cAAc,gBAAgB,kBAAkB,GAClDX,IAAS,CAAC;AAAA,IACd;AAAA,IACA,CAACA,CAAM;AAAA,EAAA;AAOX,SAAO;AAAA,IACH,SAAAI;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,iBAAAI;AAAA,IACA,aAAAE;AAAA,IACA,YAAAC;AAAA,IACA,cAdiB,EAAQrB;AAAA,IAezB,cAdiBY,KAAc,EAAQX;AAAA,IAevC,cAdiBW,IAAcC,IAAe,SAAS,aAAcX;AAAA,EAcrE;AAER;"}

package/dist/components/forms/text-field/index.d.ts

@@ -0,0 +1,10 @@
+export { default as TextField } from './TextField.tsx';
+export { TEXT_FIELD_STYLES } from './styles/TextField.css.ts';
+export { TEXT_FIELD_LABEL_STYLES } from './components/text-field-label/styles/TextFieldLabel.css.ts';
+export { TEXT_FIELD_START_ICON_STYLES } from './components/text-field-start-icon/styles/TextFieldStartIcon.css.ts';
+export { TEXT_FIELD_END_ACTION_STYLES } from './components/text-field-end-action/styles/TextFieldEndAction.css.ts';
+export type { TextFieldProps } from './types/TextField.props.ts';
+export type { TextFieldSize } from './types/TextField.types.ts';
+export type { TextFieldLabelProps } from './components/text-field-label/types/TextFieldLabel.props.ts';
+export type { TextFieldStartIconProps } from './components/text-field-start-icon/types/TextFieldStartIcon.types.ts';
+export type { TextFieldEndActionProps } from './components/text-field-end-action/types/TextFieldEndAction.props.ts';

package/dist/components/forms/text-field/styles/TextField.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                               */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={recipe:e.createRuntimeFn({defaultClassName:"_1ugc12d0",variantClassNames:{size:{sm:"_1ugc12d1",md:"_1ugc12d2",lg:"_1ugc12d3"},hasError:{true:"_1ugc12d4",false:"_1ugc12d5"},hasStartIcon:{true:"_1ugc12d6",false:"_1ugc12d7"},hasEndAction:{true:"_1ugc12d8",false:"_1ugc12d9"}},defaultVariants:{size:"md",hasError:!1,hasStartIcon:!1,hasEndAction:!1},compoundVariants:[[{size:"sm",hasStartIcon:!0},"_1ugc12da"],[{size:"md",hasStartIcon:!0},"_1ugc12db"],[{size:"lg",hasStartIcon:!0},"_1ugc12dc"],[{size:"sm",hasEndAction:!0},"_1ugc12dd"],[{size:"md",hasEndAction:!0},"_1ugc12de"],[{size:"lg",hasEndAction:!0},"_1ugc12df"]]})};exports.TEXT_FIELD_STYLES=a;
+//# sourceMappingURL=TextField.css.cjs.map

package/dist/components/forms/text-field/styles/TextField.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/text-field/styles/TextField.css.d.ts

@@ -0,0 +1,49 @@
+import { RuntimeFn } from '@vanilla-extract/recipes';
+export declare const TEXT_FIELD_STYLES: {
+    recipe: RuntimeFn<{
+        size: {
+            sm: {
+                height: "2.25rem";
+                paddingInline: `var(--${string})`;
+                fontSize: `var(--${string})`;
+            };
+            md: {
+                height: "2.5rem";
+                paddingInline: `var(--${string})`;
+                fontSize: `var(--${string})`;
+            };
+            lg: {
+                height: "2.75rem";
+                paddingInline: `var(--${string})`;
+                fontSize: `var(--${string})`;
+            };
+        };
+        hasError: {
+            true: {
+                borderColor: `var(--${string})`;
+                selectors: {
+                    '&:hover:not(:disabled)': {
+                        borderColor: `var(--${string})`;
+                    };
+                    '&:focus-visible': {
+                        borderColor: `var(--${string})`;
+                        boxShadow: `0 0 0 2px var(--${string}), 0 0 0 4px var(--${string})`;
+                    };
+                    '&[data-mouse-focus]:focus-visible': {
+                        boxShadow: "none";
+                        borderColor: `var(--${string})`;
+                    };
+                };
+            };
+            false: {};
+        };
+        hasStartIcon: {
+            true: {};
+            false: {};
+        };
+        hasEndAction: {
+            true: {};
+            false: {};
+        };
+    }>;
+};

package/dist/components/forms/text-field/styles/TextField.css.js

@@ -0,0 +1,8 @@
+/* empty css                                            */
+/* empty css                             */
+import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
+var r = { recipe: a({ defaultClassName: "_1ugc12d0", variantClassNames: { size: { sm: "_1ugc12d1", md: "_1ugc12d2", lg: "_1ugc12d3" }, hasError: { true: "_1ugc12d4", false: "_1ugc12d5" }, hasStartIcon: { true: "_1ugc12d6", false: "_1ugc12d7" }, hasEndAction: { true: "_1ugc12d8", false: "_1ugc12d9" } }, defaultVariants: { size: "md", hasError: !1, hasStartIcon: !1, hasEndAction: !1 }, compoundVariants: [[{ size: "sm", hasStartIcon: !0 }, "_1ugc12da"], [{ size: "md", hasStartIcon: !0 }, "_1ugc12db"], [{ size: "lg", hasStartIcon: !0 }, "_1ugc12dc"], [{ size: "sm", hasEndAction: !0 }, "_1ugc12dd"], [{ size: "md", hasEndAction: !0 }, "_1ugc12de"], [{ size: "lg", hasEndAction: !0 }, "_1ugc12df"]] }) };
+export {
+  r as TEXT_FIELD_STYLES
+};
+//# sourceMappingURL=TextField.css.js.map

package/dist/components/forms/text-field/styles/TextField.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/components/forms/text-field/types/TextField.props.d.ts

@@ -0,0 +1,22 @@
+import { RefAttributes } from 'react';
+import { TextFieldSize } from './TextField.types.ts';
+import type * as React from 'react';
+export type TextFieldProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> & RefAttributes<HTMLInputElement> & {
+    /** Input size. @default 'md' */
+    size?: TextFieldSize;
+    /** Text label rendered above the input, linked via Radix Label for accessibility. */
+    label?: string;
+    /** Helper text rendered below the input. Hidden when `error` is provided. */
+    helperText?: string;
+    /** Error message rendered below the input. When set, the input is styled in its error state. */
+    error?: string;
+    /** Iconify icon name rendered on the left side of the input. */
+    startIcon?: string;
+    /**
+     * Custom action element (e.g. `<IconButton>`) rendered on the right side of the input.
+     * Ignored when `type="password"` (the toggle button takes precedence).
+     */
+    endAction?: React.ReactNode;
+    /** CSS width of the outer wrapper. Defaults to `100%`. */
+    width?: React.CSSProperties['width'];
+};

package/dist/components/forms/text-field/types/TextField.types.d.ts

@@ -0,0 +1,3 @@
+import { TEXT_FIELD_SIZES } from '../constants';
+/** Size variants for the TextField component. */
+export type TextFieldSize = (typeof TEXT_FIELD_SIZES)[keyof typeof TEXT_FIELD_SIZES];

package/dist/components/forms/text-field/types/index.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { default as TextFieldEndAction } from '../components/text-field-end-action/TextFieldEndAction.tsx';
+import { default as TextFieldLabel } from '../components/text-field-label/TextFieldLabel.tsx';
+import { default as TextFieldStartIcon } from '../components/text-field-start-icon/TextFieldStartIcon.tsx';
+import { TextFieldProps } from './TextField.props.ts';
+export type TextFieldCompound = FC<TextFieldProps> & {
+    Label: typeof TextFieldLabel;
+    StartIcon: typeof TextFieldStartIcon;
+    EndAction: typeof TextFieldEndAction;
+};

package/dist/components/foundation/icon/Icon.cjs

@@ -0,0 +1,2 @@
+"use strict";const r=require("react/jsx-runtime"),j=require("@iconify/react"),v=require("../../layout/box/Box.cjs");require("../../layout/box/styles/Box.css.cjs");const S=require("./styles/Icon.css.cjs"),h=require("../../../utils/cn.cjs"),C=require("react"),c=C.memo(({icon:i,size:n,spin:o,color:t,padding:a,borderColor:l,backgroundColor:u,borderWidth:d,borderStyle:m,borderRadius:p,"aria-label":e,className:q,style:x,...I})=>{const s=e===void 0,y=S.ICON_STYLES.recipe({size:n,spin:o,color:t}),N={...x};return r.jsx(v,{as:"span",display:"inline-flex",padding:a,borderColor:l,backgroundColor:u,borderWidth:d,borderStyle:m,borderRadius:p,children:r.jsx(j.Icon,{icon:i,"aria-hidden":s,"aria-label":e,role:s?void 0:"img",className:h.cn(y,q),style:N,...I})})});c.displayName="Icon";module.exports=c;
+//# sourceMappingURL=Icon.cjs.map

package/dist/components/foundation/icon/Icon.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.cjs","sources":["../../../../src/components/foundation/icon/Icon.tsx"],"sourcesContent":["import { Icon as Iconify } from '@iconify/react'\r\n\r\nimport { Box } from '@components/layout/box'\r\nimport { ICON_STYLES } from '@components/foundation/icon/styles/Icon.css.ts'\r\nimport type { IconProps } from '@components/foundation/icon/types/Icon.props.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, type CSSProperties, type FC } from 'react'\r\n\r\nconst Icon: FC<IconProps> = memo(({\r\n    icon,\r\n    size,\r\n    spin,\r\n    color,\r\n    padding,\r\n    borderColor,\r\n    backgroundColor,\r\n    borderWidth,\r\n    borderStyle,\r\n    borderRadius,\r\n    'aria-label': ariaLabel,\r\n    className,\r\n    style,\r\n    ...props\r\n}) => {\r\n    const isDecorative = ariaLabel === undefined\r\n\r\n    const recipeClassName = ICON_STYLES.recipe({\r\n        size,\r\n        spin,\r\n        color,\r\n    })\r\n\r\n    const computedStyle: CSSProperties = {\r\n        ...style,\r\n    }\r\n\r\n    return (\r\n        <Box\r\n            as={'span'}\r\n            display={'inline-flex'}\r\n            padding={padding}\r\n            borderColor={borderColor}\r\n            backgroundColor={backgroundColor}\r\n            borderWidth={borderWidth}\r\n            borderStyle={borderStyle}\r\n            borderRadius={borderRadius}\r\n        >\r\n            <Iconify\r\n                icon={icon}\r\n                aria-hidden={isDecorative}\r\n                aria-label={ariaLabel}\r\n                role={isDecorative ? undefined : 'img'}\r\n                className={cn(recipeClassName, className)}\r\n                style={computedStyle}\r\n                {...props}\r\n            />\r\n        </Box>\r\n    )\r\n})\r\n\r\nIcon.displayName = 'Icon'\r\n\r\nexport default Icon\r\n"],"names":["Icon","memo","icon","size","spin","color","padding","borderColor","backgroundColor","borderWidth","borderStyle","borderRadius","ariaLabel","className","style","props","isDecorative","recipeClassName","ICON_STYLES","computedStyle","jsx","Box","Iconify","cn"],"mappings":"kQAQMA,EAAsBC,EAAAA,KAAK,CAAC,CAC9B,KAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,QAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,YAAAC,EACA,YAAAC,EACA,aAAAC,EACA,aAAcC,EACd,UAAAC,EACA,MAAAC,EACA,GAAGC,CACP,IAAM,CACF,MAAMC,EAAeJ,IAAc,OAE7BK,EAAkBC,EAAAA,YAAY,OAAO,CACvC,KAAAf,EACA,KAAAC,EACA,MAAAC,CAAA,CACH,EAEKc,EAA+B,CACjC,GAAGL,CAAA,EAGP,OACIM,EAAAA,IAACC,EAAA,CACG,GAAI,OACJ,QAAS,cACT,QAAAf,EACA,YAAAC,EACA,gBAAAC,EACA,YAAAC,EACA,YAAAC,EACA,aAAAC,EAEA,SAAAS,EAAAA,IAACE,EAAAA,KAAA,CACG,KAAApB,EACA,cAAac,EACb,aAAYJ,EACZ,KAAMI,EAAe,OAAY,MACjC,UAAWO,EAAAA,GAAGN,EAAiBJ,CAAS,EACxC,MAAOM,EACN,GAAGJ,CAAA,CAAA,CACR,CAAA,CAGZ,CAAC,EAEDf,EAAK,YAAc"}

package/dist/components/foundation/icon/Icon.d.ts

@@ -0,0 +1,4 @@
+import { IconProps } from './types/Icon.props.ts';
+import { FC } from 'react';
+declare const Icon: FC<IconProps>;
+export default Icon;

package/dist/components/foundation/icon/Icon.js

@@ -0,0 +1,61 @@
+import { jsx as e } from "react/jsx-runtime";
+import { Icon as u } from "@iconify/react";
+import v from "../../layout/box/Box.js";
+import "../../layout/box/styles/Box.css.js";
+import { ICON_STYLES as S } from "./styles/Icon.css.js";
+import { cn as h } from "../../../utils/cn.js";
+import { memo as C } from "react";
+const b = C(({
+  icon: i,
+  size: m,
+  spin: a,
+  color: t,
+  padding: s,
+  borderColor: c,
+  backgroundColor: n,
+  borderWidth: l,
+  borderStyle: p,
+  borderRadius: d,
+  "aria-label": o,
+  className: f,
+  style: I,
+  ...x
+}) => {
+  const r = o === void 0, y = S.recipe({
+    size: m,
+    spin: a,
+    color: t
+  }), N = {
+    ...I
+  };
+  return /* @__PURE__ */ e(
+    v,
+    {
+      as: "span",
+      display: "inline-flex",
+      padding: s,
+      borderColor: c,
+      backgroundColor: n,
+      borderWidth: l,
+      borderStyle: p,
+      borderRadius: d,
+      children: /* @__PURE__ */ e(
+        u,
+        {
+          icon: i,
+          "aria-hidden": r,
+          "aria-label": o,
+          role: r ? void 0 : "img",
+          className: h(y, f),
+          style: N,
+          ...x
+        }
+      )
+    }
+  );
+});
+b.displayName = "Icon";
+export {
+  b as default
+};
+//# sourceMappingURL=Icon.js.map

package/dist/components/foundation/icon/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sources":["../../../../src/components/foundation/icon/Icon.tsx"],"sourcesContent":["import { Icon as Iconify } from '@iconify/react'\r\n\r\nimport { Box } from '@components/layout/box'\r\nimport { ICON_STYLES } from '@components/foundation/icon/styles/Icon.css.ts'\r\nimport type { IconProps } from '@components/foundation/icon/types/Icon.props.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, type CSSProperties, type FC } from 'react'\r\n\r\nconst Icon: FC<IconProps> = memo(({\r\n    icon,\r\n    size,\r\n    spin,\r\n    color,\r\n    padding,\r\n    borderColor,\r\n    backgroundColor,\r\n    borderWidth,\r\n    borderStyle,\r\n    borderRadius,\r\n    'aria-label': ariaLabel,\r\n    className,\r\n    style,\r\n    ...props\r\n}) => {\r\n    const isDecorative = ariaLabel === undefined\r\n\r\n    const recipeClassName = ICON_STYLES.recipe({\r\n        size,\r\n        spin,\r\n        color,\r\n    })\r\n\r\n    const computedStyle: CSSProperties = {\r\n        ...style,\r\n    }\r\n\r\n    return (\r\n        <Box\r\n            as={'span'}\r\n            display={'inline-flex'}\r\n            padding={padding}\r\n            borderColor={borderColor}\r\n            backgroundColor={backgroundColor}\r\n            borderWidth={borderWidth}\r\n            borderStyle={borderStyle}\r\n            borderRadius={borderRadius}\r\n        >\r\n            <Iconify\r\n                icon={icon}\r\n                aria-hidden={isDecorative}\r\n                aria-label={ariaLabel}\r\n                role={isDecorative ? undefined : 'img'}\r\n                className={cn(recipeClassName, className)}\r\n                style={computedStyle}\r\n                {...props}\r\n            />\r\n        </Box>\r\n    )\r\n})\r\n\r\nIcon.displayName = 'Icon'\r\n\r\nexport default Icon\r\n"],"names":["Icon","memo","icon","size","spin","color","padding","borderColor","backgroundColor","borderWidth","borderStyle","borderRadius","ariaLabel","className","style","props","isDecorative","recipeClassName","ICON_STYLES","computedStyle","jsx","Box","Iconify","cn"],"mappings":";;;;;;;AAQA,MAAMA,IAAsBC,EAAK,CAAC;AAAA,EAC9B,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAcC;AAAA,EACd,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACP,MAAM;AACF,QAAMC,IAAeJ,MAAc,QAE7BK,IAAkBC,EAAY,OAAO;AAAA,IACvC,MAAAf;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,EAAA,CACH,GAEKc,IAA+B;AAAA,IACjC,GAAGL;AAAA,EAAA;AAGP,SACI,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,SAAAf;AAAA,MACA,aAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,aAAAC;AAAA,MACA,aAAAC;AAAA,MACA,cAAAC;AAAA,MAEA,UAAA,gBAAAS;AAAA,QAACE;AAAAA,QAAA;AAAA,UACG,MAAApB;AAAA,UACA,eAAac;AAAA,UACb,cAAYJ;AAAA,UACZ,MAAMI,IAAe,SAAY;AAAA,UACjC,WAAWO,EAAGN,GAAiBJ,CAAS;AAAA,UACxC,OAAOM;AAAA,UACN,GAAGJ;AAAA,QAAA;AAAA,MAAA;AAAA,IACR;AAAA,EAAA;AAGZ,CAAC;AAEDf,EAAK,cAAc;"}

package/dist/components/foundation/icon/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Icon } from './Icon.tsx';
+export { ICON_STYLES } from './styles/Icon.css.ts';
+export type { IconProps } from './types/Icon.props.ts';
+export type { IconColor, IconSize } from './types/Icon.types.ts';

package/dist/components/foundation/icon/styles/Icon.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                                                                */;/* empty css                                                                 */;/* empty css                                                                         */;/* empty css                                                                      */;/* empty css                                                                       */;/* empty css                                                                    */;/* empty css                                                                     */;/* empty css                                                                       */;/* empty css                                                                        */;/* empty css                                                                      */;/* empty css                                                                       */;/* empty css                                                                       */;/* empty css                          */const l=require("@vanilla-extract/recipes/createRuntimeFn");var e={recipe:l.createRuntimeFn({defaultClassName:"_1liyln50",variantClassNames:{size:{xs:"_1liyln51",sm:"_1liyln52",md:"_1liyln53",lg:"_1liyln54",xl:"_1liyln55","2xl":"_1liyln56"},spin:{true:"_1liyln57"},color:{background:"_1liyln58",foreground:"_1liyln59",text:"_1liyln5a",textSecondary:"_1liyln5b",textTertiary:"_1liyln5c",card:"_1liyln5d",cardForeground:"_1liyln5e",popover:"_1liyln5f",popoverForeground:"_1liyln5g",muted:"_1liyln5h",mutedForeground:"_1liyln5i",overlay:"_1liyln5j",primary:"_1liyln5k",primaryHover:"_1liyln5l",primaryActive:"_1liyln5m",primaryForeground:"_1liyln5n",primarySubtle:"_1liyln5o",primarySubtleHover:"_1liyln5p",primarySubtleActive:"_1liyln5q",primarySubtleForeground:"_1liyln5r",primarySubtleBorder:"_1liyln5s",link:"_1liyln5t",linkHover:"_1liyln5u",linkActive:"_1liyln5v",secondary:"_1liyln5w",secondaryHover:"_1liyln5x",secondaryActive:"_1liyln5y",secondaryForeground:"_1liyln5z",secondarySubtle:"_1liyln510",secondarySubtleHover:"_1liyln511",secondarySubtleActive:"_1liyln512",secondarySubtleForeground:"_1liyln513",secondarySubtleBorder:"_1liyln514",tertiary:"_1liyln515",tertiaryHover:"_1liyln516",tertiaryActive:"_1liyln517",tertiaryForeground:"_1liyln518",tertiarySubtle:"_1liyln519",tertiarySubtleHover:"_1liyln51a",tertiarySubtleActive:"_1liyln51b",tertiarySubtleForeground:"_1liyln51c",tertiarySubtleBorder:"_1liyln51d",success:"_1liyln51e",successHover:"_1liyln51f",successActive:"_1liyln51g",successForeground:"_1liyln51h",successSubtle:"_1liyln51i",successSubtleHover:"_1liyln51j",successSubtleActive:"_1liyln51k",successSubtleForeground:"_1liyln51l",successSubtleBorder:"_1liyln51m",warning:"_1liyln51n",warningHover:"_1liyln51o",warningActive:"_1liyln51p",warningForeground:"_1liyln51q",warningSubtle:"_1liyln51r",warningSubtleHover:"_1liyln51s",warningSubtleActive:"_1liyln51t",warningSubtleForeground:"_1liyln51u",warningSubtleBorder:"_1liyln51v",info:"_1liyln51w",infoHover:"_1liyln51x",infoActive:"_1liyln51y",infoForeground:"_1liyln51z",infoSubtle:"_1liyln520",infoSubtleHover:"_1liyln521",infoSubtleActive:"_1liyln522",infoSubtleForeground:"_1liyln523",infoSubtleBorder:"_1liyln524",destructive:"_1liyln525",destructiveHover:"_1liyln526",destructiveActive:"_1liyln527",destructiveForeground:"_1liyln528",destructiveSubtle:"_1liyln529",destructiveSubtleHover:"_1liyln52a",destructiveSubtleActive:"_1liyln52b",destructiveSubtleForeground:"_1liyln52c",destructiveSubtleBorder:"_1liyln52d",purple:"_1liyln52e",purpleHover:"_1liyln52f",purpleActive:"_1liyln52g",purpleForeground:"_1liyln52h",purpleSubtle:"_1liyln52i",purpleSubtleHover:"_1liyln52j",purpleSubtleActive:"_1liyln52k",purpleSubtleForeground:"_1liyln52l",purpleSubtleBorder:"_1liyln52m",pink:"_1liyln52n",pinkHover:"_1liyln52o",pinkActive:"_1liyln52p",pinkForeground:"_1liyln52q",pinkSubtle:"_1liyln52r",pinkSubtleHover:"_1liyln52s",pinkSubtleActive:"_1liyln52t",pinkSubtleForeground:"_1liyln52u",pinkSubtleBorder:"_1liyln52v",orange:"_1liyln52w",orangeHover:"_1liyln52x",orangeActive:"_1liyln52y",orangeForeground:"_1liyln52z",orangeSubtle:"_1liyln530",orangeSubtleHover:"_1liyln531",orangeSubtleActive:"_1liyln532",orangeSubtleForeground:"_1liyln533",orangeSubtleBorder:"_1liyln534",teal:"_1liyln535",tealHover:"_1liyln536",tealActive:"_1liyln537",tealForeground:"_1liyln538",tealSubtle:"_1liyln539",tealSubtleHover:"_1liyln53a",tealSubtleActive:"_1liyln53b",tealSubtleForeground:"_1liyln53c",tealSubtleBorder:"_1liyln53d",cyan:"_1liyln53e",cyanHover:"_1liyln53f",cyanActive:"_1liyln53g",cyanForeground:"_1liyln53h",cyanSubtle:"_1liyln53i",cyanSubtleHover:"_1liyln53j",cyanSubtleActive:"_1liyln53k",cyanSubtleForeground:"_1liyln53l",cyanSubtleBorder:"_1liyln53m",indigo:"_1liyln53n",indigoHover:"_1liyln53o",indigoActive:"_1liyln53p",indigoForeground:"_1liyln53q",indigoSubtle:"_1liyln53r",indigoSubtleHover:"_1liyln53s",indigoSubtleActive:"_1liyln53t",indigoSubtleForeground:"_1liyln53u",indigoSubtleBorder:"_1liyln53v",border:"_1liyln53w",borderStrong:"_1liyln53x",input:"_1liyln53y",ring:"_1liyln53z",highlight:"_1liyln540",highlightForeground:"_1liyln541",skeleton:"_1liyln542",skeletonForeground:"_1liyln543",transparent:"_1liyln544"}},defaultVariants:{size:"md"},compoundVariants:[]})};exports.ICON_STYLES=e;
+//# sourceMappingURL=Icon.css.cjs.map

package/dist/components/foundation/icon/styles/Icon.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/foundation/icon/styles/Icon.css.d.ts

@@ -0,0 +1,38 @@
+import { RecipeVariants, RuntimeFn } from '@vanilla-extract/recipes';
+export declare const ICON_STYLES: {
+    recipe: RuntimeFn<{
+        size: {
+            xs: {
+                width: `var(--${string})`;
+                height: `var(--${string})`;
+            };
+            sm: {
+                width: `var(--${string})`;
+                height: `var(--${string})`;
+            };
+            md: {
+                width: `var(--${string})`;
+                height: `var(--${string})`;
+            };
+            lg: {
+                width: `var(--${string})`;
+                height: `var(--${string})`;
+            };
+            xl: {
+                width: `var(--${string})`;
+                height: `var(--${string})`;
+            };
+            '2xl': {
+                width: `var(--${string})`;
+                height: `var(--${string})`;
+            };
+        };
+        spin: {
+            true: {
+                animation: `${string} 1s linear infinite`;
+            };
+        };
+        color: Record<"background" | "foreground" | "text" | "textSecondary" | "textTertiary" | "card" | "cardForeground" | "popover" | "popoverForeground" | "muted" | "mutedForeground" | "overlay" | "primary" | "primaryHover" | "primaryActive" | "primaryForeground" | "primarySubtle" | "primarySubtleHover" | "primarySubtleActive" | "primarySubtleForeground" | "primarySubtleBorder" | "link" | "linkHover" | "linkActive" | "secondary" | "secondaryHover" | "secondaryActive" | "secondaryForeground" | "secondarySubtle" | "secondarySubtleHover" | "secondarySubtleActive" | "secondarySubtleForeground" | "secondarySubtleBorder" | "tertiary" | "tertiaryHover" | "tertiaryActive" | "tertiaryForeground" | "tertiarySubtle" | "tertiarySubtleHover" | "tertiarySubtleActive" | "tertiarySubtleForeground" | "tertiarySubtleBorder" | "success" | "successHover" | "successActive" | "successForeground" | "successSubtle" | "successSubtleHover" | "successSubtleActive" | "successSubtleForeground" | "successSubtleBorder" | "warning" | "warningHover" | "warningActive" | "warningForeground" | "warningSubtle" | "warningSubtleHover" | "warningSubtleActive" | "warningSubtleForeground" | "warningSubtleBorder" | "info" | "infoHover" | "infoActive" | "infoForeground" | "infoSubtle" | "infoSubtleHover" | "infoSubtleActive" | "infoSubtleForeground" | "infoSubtleBorder" | "destructive" | "destructiveHover" | "destructiveActive" | "destructiveForeground" | "destructiveSubtle" | "destructiveSubtleHover" | "destructiveSubtleActive" | "destructiveSubtleForeground" | "destructiveSubtleBorder" | "purple" | "purpleHover" | "purpleActive" | "purpleForeground" | "purpleSubtle" | "purpleSubtleHover" | "purpleSubtleActive" | "purpleSubtleForeground" | "purpleSubtleBorder" | "pink" | "pinkHover" | "pinkActive" | "pinkForeground" | "pinkSubtle" | "pinkSubtleHover" | "pinkSubtleActive" | "pinkSubtleForeground" | "pinkSubtleBorder" | "orange" | "orangeHover" | "orangeActive" | "orangeForeground" | "orangeSubtle" | "orangeSubtleHover" | "orangeSubtleActive" | "orangeSubtleForeground" | "orangeSubtleBorder" | "teal" | "tealHover" | "tealActive" | "tealForeground" | "tealSubtle" | "tealSubtleHover" | "tealSubtleActive" | "tealSubtleForeground" | "tealSubtleBorder" | "cyan" | "cyanHover" | "cyanActive" | "cyanForeground" | "cyanSubtle" | "cyanSubtleHover" | "cyanSubtleActive" | "cyanSubtleForeground" | "cyanSubtleBorder" | "indigo" | "indigoHover" | "indigoActive" | "indigoForeground" | "indigoSubtle" | "indigoSubtleHover" | "indigoSubtleActive" | "indigoSubtleForeground" | "indigoSubtleBorder" | "border" | "borderStrong" | "input" | "ring" | "highlight" | "highlightForeground" | "skeleton" | "skeletonForeground" | "transparent", Record<string, string>>;
+    }>;
+};
+export type IconRecipeVariants = NonNullable<RecipeVariants<typeof ICON_STYLES.recipe>>;

package/dist/components/foundation/icon/styles/Icon.css.js

@@ -0,0 +1,20 @@
+/* empty css                                            */
+/* empty css                                                              */
+/* empty css                                                               */
+/* empty css                                                                       */
+/* empty css                                                                    */
+/* empty css                                                                     */
+/* empty css                                                                  */
+/* empty css                                                                   */
+/* empty css                                                                     */
+/* empty css                                                                      */
+/* empty css                                                                    */
+/* empty css                                                                     */
+/* empty css                                                                     */
+/* empty css                        */
+import { createRuntimeFn as l } from "@vanilla-extract/recipes/createRuntimeFn";
+var S = { recipe: l({ defaultClassName: "_1liyln50", variantClassNames: { size: { xs: "_1liyln51", sm: "_1liyln52", md: "_1liyln53", lg: "_1liyln54", xl: "_1liyln55", "2xl": "_1liyln56" }, spin: { true: "_1liyln57" }, color: { background: "_1liyln58", foreground: "_1liyln59", text: "_1liyln5a", textSecondary: "_1liyln5b", textTertiary: "_1liyln5c", card: "_1liyln5d", cardForeground: "_1liyln5e", popover: "_1liyln5f", popoverForeground: "_1liyln5g", muted: "_1liyln5h", mutedForeground: "_1liyln5i", overlay: "_1liyln5j", primary: "_1liyln5k", primaryHover: "_1liyln5l", primaryActive: "_1liyln5m", primaryForeground: "_1liyln5n", primarySubtle: "_1liyln5o", primarySubtleHover: "_1liyln5p", primarySubtleActive: "_1liyln5q", primarySubtleForeground: "_1liyln5r", primarySubtleBorder: "_1liyln5s", link: "_1liyln5t", linkHover: "_1liyln5u", linkActive: "_1liyln5v", secondary: "_1liyln5w", secondaryHover: "_1liyln5x", secondaryActive: "_1liyln5y", secondaryForeground: "_1liyln5z", secondarySubtle: "_1liyln510", secondarySubtleHover: "_1liyln511", secondarySubtleActive: "_1liyln512", secondarySubtleForeground: "_1liyln513", secondarySubtleBorder: "_1liyln514", tertiary: "_1liyln515", tertiaryHover: "_1liyln516", tertiaryActive: "_1liyln517", tertiaryForeground: "_1liyln518", tertiarySubtle: "_1liyln519", tertiarySubtleHover: "_1liyln51a", tertiarySubtleActive: "_1liyln51b", tertiarySubtleForeground: "_1liyln51c", tertiarySubtleBorder: "_1liyln51d", success: "_1liyln51e", successHover: "_1liyln51f", successActive: "_1liyln51g", successForeground: "_1liyln51h", successSubtle: "_1liyln51i", successSubtleHover: "_1liyln51j", successSubtleActive: "_1liyln51k", successSubtleForeground: "_1liyln51l", successSubtleBorder: "_1liyln51m", warning: "_1liyln51n", warningHover: "_1liyln51o", warningActive: "_1liyln51p", warningForeground: "_1liyln51q", warningSubtle: "_1liyln51r", warningSubtleHover: "_1liyln51s", warningSubtleActive: "_1liyln51t", warningSubtleForeground: "_1liyln51u", warningSubtleBorder: "_1liyln51v", info: "_1liyln51w", infoHover: "_1liyln51x", infoActive: "_1liyln51y", infoForeground: "_1liyln51z", infoSubtle: "_1liyln520", infoSubtleHover: "_1liyln521", infoSubtleActive: "_1liyln522", infoSubtleForeground: "_1liyln523", infoSubtleBorder: "_1liyln524", destructive: "_1liyln525", destructiveHover: "_1liyln526", destructiveActive: "_1liyln527", destructiveForeground: "_1liyln528", destructiveSubtle: "_1liyln529", destructiveSubtleHover: "_1liyln52a", destructiveSubtleActive: "_1liyln52b", destructiveSubtleForeground: "_1liyln52c", destructiveSubtleBorder: "_1liyln52d", purple: "_1liyln52e", purpleHover: "_1liyln52f", purpleActive: "_1liyln52g", purpleForeground: "_1liyln52h", purpleSubtle: "_1liyln52i", purpleSubtleHover: "_1liyln52j", purpleSubtleActive: "_1liyln52k", purpleSubtleForeground: "_1liyln52l", purpleSubtleBorder: "_1liyln52m", pink: "_1liyln52n", pinkHover: "_1liyln52o", pinkActive: "_1liyln52p", pinkForeground: "_1liyln52q", pinkSubtle: "_1liyln52r", pinkSubtleHover: "_1liyln52s", pinkSubtleActive: "_1liyln52t", pinkSubtleForeground: "_1liyln52u", pinkSubtleBorder: "_1liyln52v", orange: "_1liyln52w", orangeHover: "_1liyln52x", orangeActive: "_1liyln52y", orangeForeground: "_1liyln52z", orangeSubtle: "_1liyln530", orangeSubtleHover: "_1liyln531", orangeSubtleActive: "_1liyln532", orangeSubtleForeground: "_1liyln533", orangeSubtleBorder: "_1liyln534", teal: "_1liyln535", tealHover: "_1liyln536", tealActive: "_1liyln537", tealForeground: "_1liyln538", tealSubtle: "_1liyln539", tealSubtleHover: "_1liyln53a", tealSubtleActive: "_1liyln53b", tealSubtleForeground: "_1liyln53c", tealSubtleBorder: "_1liyln53d", cyan: "_1liyln53e", cyanHover: "_1liyln53f", cyanActive: "_1liyln53g", cyanForeground: "_1liyln53h", cyanSubtle: "_1liyln53i", cyanSubtleHover: "_1liyln53j", cyanSubtleActive: "_1liyln53k", cyanSubtleForeground: "_1liyln53l", cyanSubtleBorder: "_1liyln53m", indigo: "_1liyln53n", indigoHover: "_1liyln53o", indigoActive: "_1liyln53p", indigoForeground: "_1liyln53q", indigoSubtle: "_1liyln53r", indigoSubtleHover: "_1liyln53s", indigoSubtleActive: "_1liyln53t", indigoSubtleForeground: "_1liyln53u", indigoSubtleBorder: "_1liyln53v", border: "_1liyln53w", borderStrong: "_1liyln53x", input: "_1liyln53y", ring: "_1liyln53z", highlight: "_1liyln540", highlightForeground: "_1liyln541", skeleton: "_1liyln542", skeletonForeground: "_1liyln543", transparent: "_1liyln544" } }, defaultVariants: { size: "md" }, compoundVariants: [] }) };
+export {
+  S as ICON_STYLES
+};
+//# sourceMappingURL=Icon.css.js.map

package/dist/components/foundation/icon/styles/Icon.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/dist/components/foundation/icon/types/Icon.props.d.ts

@@ -0,0 +1,24 @@
+import { IconProps as IconifyProps } from '@iconify/react';
+import { CSSProperties } from 'react';
+import { BoxBorderRadius, BoxColor, BoxSpace } from '../../../layout/box/types/Box.types.ts';
+import { IconColor, IconSize } from './Icon.types.ts';
+export type IconProps = Omit<IconifyProps, 'aria-hidden' | 'role'> & {
+    /** Icon size. Defaults to `md`. */
+    size?: IconSize;
+    /** Whether the icon should continuously rotate. */
+    spin?: boolean;
+    /** Optional theme color token applied to the icon's `color` CSS property. */
+    color?: IconColor;
+    /** Padding token applied to the wrapper around the icon. */
+    padding?: BoxSpace;
+    /** Theme color token applied to the wrapper's border color. */
+    borderColor?: BoxColor;
+    /** Theme color token applied to the wrapper's background color. */
+    backgroundColor?: BoxColor;
+    /** The CSS `border-width` value of the wrapper. */
+    borderWidth?: CSSProperties['borderWidth'];
+    /** The CSS `border-style` value of the wrapper. */
+    borderStyle?: CSSProperties['borderStyle'];
+    /** Border radius token applied to the wrapper. */
+    borderRadius?: BoxBorderRadius;
+};

package/dist/components/foundation/icon/types/Icon.types.d.ts

@@ -0,0 +1,4 @@
+import { ThemeColorValue } from '../../../../theme';
+export type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+/** Theme color tokens supported by the Icon recipe. */
+export type IconColor = ThemeColorValue;

package/dist/components/foundation/index.d.ts

@@ -0,0 +1,2 @@
+export * from './icon';
+export * from './typography';

package/dist/components/foundation/typography/Typography.cjs

@@ -0,0 +1,2 @@
+"use strict";const h=require("react/jsx-runtime"),A=require("./styles/Typography.css.cjs"),N=require("./constants/index.cjs"),R=require("../../../utils/cn.cjs"),j=require("../../../theme/contract.css.cjs"),G=require("react"),r=G.memo(({as:t,variant:e,fontSize:c,fontWeight:n,color:o,textTransform:p,display:i,width:a,minWidth:u,maxWidth:y,opacity:m,flex:T,flexGrow:l,flexShrink:q,letterSpacing:s,ellipsis:E,maxLines:P,className:Y,style:_,ref:d,...g})=>{const x=t??N.TYPOGRAPHY_ELEMENT_MAP[e??"span"]??"span",S={textTransform:p,display:i,width:a,minWidth:u,maxWidth:y,opacity:m,flex:T,flexGrow:l,flexShrink:q,letterSpacing:s?j.vars.letterSpacing[s]:void 0,..._};return h.jsx(x,{ref:d,className:R.cn(A.TYPOGRAPHY_STYLES.recipe({variant:e,fontSize:c,fontWeight:n,ellipsis:E,maxLines:P,color:o}),Y),style:S,...g})});r.displayName="Typography";module.exports=r;
+//# sourceMappingURL=Typography.cjs.map

package/dist/components/foundation/typography/Typography.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.cjs","sources":["../../../../src/components/foundation/typography/Typography.tsx"],"sourcesContent":["import { TYPOGRAPHY_STYLES } from '@components/foundation/typography/styles/Typography.css.ts'\r\nimport { TYPOGRAPHY_ELEMENT_MAP } from '@components/foundation/typography/constants'\r\nimport type { TypographyProps } from '@components/foundation/typography/types/Typography.props.ts'\r\nimport type { TypographyVariant } from '@components/foundation/typography/types/Typography.types.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { memo, type CSSProperties, type FC } from 'react'\r\n\r\nconst Typography: FC<TypographyProps> = memo(({\r\n    as,\r\n    variant,\r\n    fontSize,\r\n    fontWeight,\r\n    color,\r\n    textTransform,\r\n    display,\r\n    width,\r\n    minWidth,\r\n    maxWidth,\r\n    opacity,\r\n    flex,\r\n    flexGrow,\r\n    flexShrink,\r\n    letterSpacing,\r\n    ellipsis,\r\n    maxLines,\r\n    className,\r\n    style,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const Element = as ?? TYPOGRAPHY_ELEMENT_MAP[(variant as TypographyVariant) ?? 'span'] ?? 'span'\r\n\r\n    const computedStyle: CSSProperties = {\r\n        textTransform,\r\n        display,\r\n        width,\r\n        minWidth,\r\n        maxWidth,\r\n        opacity,\r\n        flex,\r\n        flexGrow,\r\n        flexShrink,\r\n        letterSpacing: letterSpacing ? vars.letterSpacing[letterSpacing] : undefined,\r\n        ...style,\r\n    }\r\n\r\n    return (\r\n        <Element\r\n            ref={ref}\r\n            className={cn(TYPOGRAPHY_STYLES.recipe({ variant, fontSize, fontWeight, ellipsis, maxLines, color }), className)}\r\n            style={computedStyle}\r\n            {...props}\r\n        />\r\n    )\r\n})\r\n\r\nTypography.displayName = 'Typography'\r\n\r\nexport default Typography\r\n"],"names":["Typography","memo","as","variant","fontSize","fontWeight","color","textTransform","display","width","minWidth","maxWidth","opacity","flex","flexGrow","flexShrink","letterSpacing","ellipsis","maxLines","className","style","ref","props","Element","TYPOGRAPHY_ELEMENT_MAP","computedStyle","vars","jsx","cn","TYPOGRAPHY_STYLES"],"mappings":"iOAQMA,EAAkCC,EAAAA,KAAK,CAAC,CAC1C,GAAAC,EACA,QAAAC,EACA,SAAAC,EACA,WAAAC,EACA,MAAAC,EACA,cAAAC,EACA,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,QAAAC,EACA,KAAAC,EACA,SAAAC,EACA,WAAAC,EACA,cAAAC,EACA,SAAAC,EACA,SAAAC,EACA,UAAAC,EACA,MAAAC,EACA,IAAAC,EACA,GAAGC,CACP,IAAM,CACF,MAAMC,EAAUrB,GAAMsB,EAAAA,uBAAwBrB,GAAiC,MAAM,GAAK,OAEpFsB,EAA+B,CACjC,cAAAlB,EACA,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,QAAAC,EACA,KAAAC,EACA,SAAAC,EACA,WAAAC,EACA,cAAeC,EAAgBU,EAAAA,KAAK,cAAcV,CAAa,EAAI,OACnE,GAAGI,CAAA,EAGP,OACIO,EAAAA,IAACJ,EAAA,CACG,IAAAF,EACA,UAAWO,EAAAA,GAAGC,EAAAA,kBAAkB,OAAO,CAAE,QAAA1B,EAAS,SAAAC,EAAU,WAAAC,EAAY,SAAAY,EAAU,SAAAC,EAAU,MAAAZ,CAAA,CAAO,EAAGa,CAAS,EAC/G,MAAOM,EACN,GAAGH,CAAA,CAAA,CAGhB,CAAC,EAEDtB,EAAW,YAAc"}

package/dist/components/foundation/typography/Typography.d.ts

@@ -0,0 +1,4 @@
+import { TypographyProps } from './types/Typography.props.ts';
+import { FC } from 'react';
+declare const Typography: FC<TypographyProps>;
+export default Typography;

package/dist/components/foundation/typography/Typography.js

@@ -0,0 +1,57 @@
+import { jsx as N } from "react/jsx-runtime";
+import { TYPOGRAPHY_STYLES as _ } from "./styles/Typography.css.js";
+import { TYPOGRAPHY_ELEMENT_MAP as h } from "./constants/index.js";
+import { cn as x } from "../../../utils/cn.js";
+import { vars as G } from "../../../theme/contract.css.js";
+import { memo as H } from "react";
+const L = H(({
+  as: m,
+  variant: o,
+  fontSize: p,
+  fontWeight: t,
+  color: e,
+  textTransform: s,
+  display: a,
+  width: i,
+  minWidth: c,
+  maxWidth: n,
+  opacity: f,
+  flex: l,
+  flexGrow: y,
+  flexShrink: T,
+  letterSpacing: r,
+  ellipsis: E,
+  maxLines: P,
+  className: Y,
+  style: d,
+  ref: S,
+  ...g
+}) => {
+  const u = m ?? h[o ?? "span"] ?? "span", A = {
+    textTransform: s,
+    display: a,
+    width: i,
+    minWidth: c,
+    maxWidth: n,
+    opacity: f,
+    flex: l,
+    flexGrow: y,
+    flexShrink: T,
+    letterSpacing: r ? G.letterSpacing[r] : void 0,
+    ...d
+  };
+  return /* @__PURE__ */ N(
+    u,
+    {
+      ref: S,
+      className: x(_.recipe({ variant: o, fontSize: p, fontWeight: t, ellipsis: E, maxLines: P, color: e }), Y),
+      style: A,
+      ...g
+    }
+  );
+});
+L.displayName = "Typography";
+export {
+  L as default
+};
+//# sourceMappingURL=Typography.js.map

package/dist/components/foundation/typography/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.js","sources":["../../../../src/components/foundation/typography/Typography.tsx"],"sourcesContent":["import { TYPOGRAPHY_STYLES } from '@components/foundation/typography/styles/Typography.css.ts'\r\nimport { TYPOGRAPHY_ELEMENT_MAP } from '@components/foundation/typography/constants'\r\nimport type { TypographyProps } from '@components/foundation/typography/types/Typography.props.ts'\r\nimport type { TypographyVariant } from '@components/foundation/typography/types/Typography.types.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { memo, type CSSProperties, type FC } from 'react'\r\n\r\nconst Typography: FC<TypographyProps> = memo(({\r\n    as,\r\n    variant,\r\n    fontSize,\r\n    fontWeight,\r\n    color,\r\n    textTransform,\r\n    display,\r\n    width,\r\n    minWidth,\r\n    maxWidth,\r\n    opacity,\r\n    flex,\r\n    flexGrow,\r\n    flexShrink,\r\n    letterSpacing,\r\n    ellipsis,\r\n    maxLines,\r\n    className,\r\n    style,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const Element = as ?? TYPOGRAPHY_ELEMENT_MAP[(variant as TypographyVariant) ?? 'span'] ?? 'span'\r\n\r\n    const computedStyle: CSSProperties = {\r\n        textTransform,\r\n        display,\r\n        width,\r\n        minWidth,\r\n        maxWidth,\r\n        opacity,\r\n        flex,\r\n        flexGrow,\r\n        flexShrink,\r\n        letterSpacing: letterSpacing ? vars.letterSpacing[letterSpacing] : undefined,\r\n        ...style,\r\n    }\r\n\r\n    return (\r\n        <Element\r\n            ref={ref}\r\n            className={cn(TYPOGRAPHY_STYLES.recipe({ variant, fontSize, fontWeight, ellipsis, maxLines, color }), className)}\r\n            style={computedStyle}\r\n            {...props}\r\n        />\r\n    )\r\n})\r\n\r\nTypography.displayName = 'Typography'\r\n\r\nexport default Typography\r\n"],"names":["Typography","memo","as","variant","fontSize","fontWeight","color","textTransform","display","width","minWidth","maxWidth","opacity","flex","flexGrow","flexShrink","letterSpacing","ellipsis","maxLines","className","style","ref","props","Element","TYPOGRAPHY_ELEMENT_MAP","computedStyle","vars","jsx","cn","TYPOGRAPHY_STYLES"],"mappings":";;;;;;AAQA,MAAMA,IAAkCC,EAAK,CAAC;AAAA,EAC1C,IAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACP,MAAM;AACF,QAAMC,IAAUrB,KAAMsB,EAAwBrB,KAAiC,MAAM,KAAK,QAEpFsB,IAA+B;AAAA,IACjC,eAAAlB;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAeC,IAAgBU,EAAK,cAAcV,CAAa,IAAI;AAAA,IACnE,GAAGI;AAAA,EAAA;AAGP,SACI,gBAAAO;AAAA,IAACJ;AAAA,IAAA;AAAA,MACG,KAAAF;AAAA,MACA,WAAWO,EAAGC,EAAkB,OAAO,EAAE,SAAA1B,GAAS,UAAAC,GAAU,YAAAC,GAAY,UAAAY,GAAU,UAAAC,GAAU,OAAAZ,EAAA,CAAO,GAAGa,CAAS;AAAA,MAC/G,OAAOM;AAAA,MACN,GAAGH;AAAA,IAAA;AAAA,EAAA;AAGhB,CAAC;AAEDtB,EAAW,cAAc;"}

package/dist/components/foundation/typography/constants/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",p:"p",span:"span",label:"label",small:"small",strong:"strong",em:"em",blockquote:"blockquote",pre:"pre",code:"code",kbd:"kbd",samp:"samp",abbr:"abbr",cite:"cite",mark:"mark",del:"del",ins:"ins",sub:"sub",sup:"sup"};exports.TYPOGRAPHY_ELEMENT_MAP=e;
+//# sourceMappingURL=index.cjs.map

package/dist/components/foundation/typography/constants/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../../src/components/foundation/typography/constants/index.ts"],"sourcesContent":["import type { TypographyVariant } from '@components/foundation/typography/types/Typography.types.ts'\r\n\r\nexport const TYPOGRAPHY_ELEMENT_MAP = {\r\n    h1: 'h1',\r\n    h2: 'h2',\r\n    h3: 'h3',\r\n    h4: 'h4',\r\n    h5: 'h5',\r\n    h6: 'h6',\r\n    p: 'p',\r\n    span: 'span',\r\n    label: 'label',\r\n    small: 'small',\r\n    strong: 'strong',\r\n    em: 'em',\r\n    blockquote: 'blockquote',\r\n    pre: 'pre',\r\n    code: 'code',\r\n    kbd: 'kbd',\r\n    samp: 'samp',\r\n    abbr: 'abbr',\r\n    cite: 'cite',\r\n    mark: 'mark',\r\n    del: 'del',\r\n    ins: 'ins',\r\n    sub: 'sub',\r\n    sup: 'sup',\r\n} as const satisfies Record<TypographyVariant, string>\r\n"],"names":["TYPOGRAPHY_ELEMENT_MAP"],"mappings":"gFAEO,MAAMA,EAAyB,CAClC,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,EAAG,IACH,KAAM,OACN,MAAO,QACP,MAAO,QACP,OAAQ,SACR,GAAI,KACJ,WAAY,aACZ,IAAK,MACL,KAAM,OACN,IAAK,MACL,KAAM,OACN,KAAM,OACN,KAAM,OACN,KAAM,OACN,IAAK,MACL,IAAK,MACL,IAAK,MACL,IAAK,KACT"}

package/dist/components/foundation/typography/constants/index.d.ts

@@ -0,0 +1,26 @@
+export declare const TYPOGRAPHY_ELEMENT_MAP: {
+    readonly h1: "h1";
+    readonly h2: "h2";
+    readonly h3: "h3";
+    readonly h4: "h4";
+    readonly h5: "h5";
+    readonly h6: "h6";
+    readonly p: "p";
+    readonly span: "span";
+    readonly label: "label";
+    readonly small: "small";
+    readonly strong: "strong";
+    readonly em: "em";
+    readonly blockquote: "blockquote";
+    readonly pre: "pre";
+    readonly code: "code";
+    readonly kbd: "kbd";
+    readonly samp: "samp";
+    readonly abbr: "abbr";
+    readonly cite: "cite";
+    readonly mark: "mark";
+    readonly del: "del";
+    readonly ins: "ins";
+    readonly sub: "sub";
+    readonly sup: "sup";
+};

package/dist/components/foundation/typography/constants/index.js

@@ -0,0 +1,30 @@
+const e = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  p: "p",
+  span: "span",
+  label: "label",
+  small: "small",
+  strong: "strong",
+  em: "em",
+  blockquote: "blockquote",
+  pre: "pre",
+  code: "code",
+  kbd: "kbd",
+  samp: "samp",
+  abbr: "abbr",
+  cite: "cite",
+  mark: "mark",
+  del: "del",
+  ins: "ins",
+  sub: "sub",
+  sup: "sup"
+};
+export {
+  e as TYPOGRAPHY_ELEMENT_MAP
+};
+//# sourceMappingURL=index.js.map

package/dist/components/foundation/typography/constants/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/components/foundation/typography/constants/index.ts"],"sourcesContent":["import type { TypographyVariant } from '@components/foundation/typography/types/Typography.types.ts'\r\n\r\nexport const TYPOGRAPHY_ELEMENT_MAP = {\r\n    h1: 'h1',\r\n    h2: 'h2',\r\n    h3: 'h3',\r\n    h4: 'h4',\r\n    h5: 'h5',\r\n    h6: 'h6',\r\n    p: 'p',\r\n    span: 'span',\r\n    label: 'label',\r\n    small: 'small',\r\n    strong: 'strong',\r\n    em: 'em',\r\n    blockquote: 'blockquote',\r\n    pre: 'pre',\r\n    code: 'code',\r\n    kbd: 'kbd',\r\n    samp: 'samp',\r\n    abbr: 'abbr',\r\n    cite: 'cite',\r\n    mark: 'mark',\r\n    del: 'del',\r\n    ins: 'ins',\r\n    sub: 'sub',\r\n    sup: 'sup',\r\n} as const satisfies Record<TypographyVariant, string>\r\n"],"names":["TYPOGRAPHY_ELEMENT_MAP"],"mappings":"AAEO,MAAMA,IAAyB;AAAA,EAClC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACT;"}

package/dist/components/foundation/typography/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Typography } from './Typography.tsx';
+export { TYPOGRAPHY_STYLES } from './styles/Typography.css.ts';
+export { TYPOGRAPHY_ELEMENT_MAP } from './constants';
+export type { TypographyProps } from './types/Typography.props.ts';
+export type { TypographyVariant, TypographySize, TypographyWeight } from './types/Typography.types.ts';

package/dist/components/foundation/typography/styles/Typography.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                                */const e=require("@vanilla-extract/recipes/createRuntimeFn");var g={recipe:e.createRuntimeFn({defaultClassName:"lg1gei0",variantClassNames:{variant:{h1:"lg1gei1",h2:"lg1gei2",h3:"lg1gei3",h4:"lg1gei4",h5:"lg1gei5",h6:"lg1gei6",p:"lg1gei7",span:"lg1gei8",label:"lg1gei9",small:"lg1geia",strong:"lg1geib",em:"lg1geic",blockquote:"lg1geid",pre:"lg1geie",code:"lg1geif",kbd:"lg1geig",samp:"lg1geih",abbr:"lg1geii",cite:"lg1geij",mark:"lg1geik",del:"lg1geil",ins:"lg1geim",sub:"lg1gein",sup:"lg1geio"},fontSize:{"2xs":"lg1geip",xs:"lg1geiq",sm:"lg1geir",md:"lg1geis",lg:"lg1geit",xl:"lg1geiu","2xl":"lg1geiv","3xl":"lg1geiw","4xl":"lg1geix","5xl":"lg1geiy","6xl":"lg1geiz"},fontWeight:{thin:"lg1gei10",extralight:"lg1gei11",light:"lg1gei12",normal:"lg1gei13",medium:"lg1gei14",semibold:"lg1gei15",bold:"lg1gei16",extrabold:"lg1gei17",black:"lg1gei18"},ellipsis:{true:"lg1gei19"},maxLines:{1:"lg1gei1a",2:"lg1gei1b",3:"lg1gei1c",4:"lg1gei1d",5:"lg1gei1e",6:"lg1gei1f"},color:{background:"lg1gei1g",foreground:"lg1gei1h",text:"lg1gei1i",textSecondary:"lg1gei1j",textTertiary:"lg1gei1k",card:"lg1gei1l",cardForeground:"lg1gei1m",popover:"lg1gei1n",popoverForeground:"lg1gei1o",muted:"lg1gei1p",mutedForeground:"lg1gei1q",overlay:"lg1gei1r",primary:"lg1gei1s",primaryHover:"lg1gei1t",primaryActive:"lg1gei1u",primaryForeground:"lg1gei1v",primarySubtle:"lg1gei1w",primarySubtleHover:"lg1gei1x",primarySubtleActive:"lg1gei1y",primarySubtleForeground:"lg1gei1z",primarySubtleBorder:"lg1gei20",link:"lg1gei21",linkHover:"lg1gei22",linkActive:"lg1gei23",secondary:"lg1gei24",secondaryHover:"lg1gei25",secondaryActive:"lg1gei26",secondaryForeground:"lg1gei27",secondarySubtle:"lg1gei28",secondarySubtleHover:"lg1gei29",secondarySubtleActive:"lg1gei2a",secondarySubtleForeground:"lg1gei2b",secondarySubtleBorder:"lg1gei2c",tertiary:"lg1gei2d",tertiaryHover:"lg1gei2e",tertiaryActive:"lg1gei2f",tertiaryForeground:"lg1gei2g",tertiarySubtle:"lg1gei2h",tertiarySubtleHover:"lg1gei2i",tertiarySubtleActive:"lg1gei2j",tertiarySubtleForeground:"lg1gei2k",tertiarySubtleBorder:"lg1gei2l",success:"lg1gei2m",successHover:"lg1gei2n",successActive:"lg1gei2o",successForeground:"lg1gei2p",successSubtle:"lg1gei2q",successSubtleHover:"lg1gei2r",successSubtleActive:"lg1gei2s",successSubtleForeground:"lg1gei2t",successSubtleBorder:"lg1gei2u",warning:"lg1gei2v",warningHover:"lg1gei2w",warningActive:"lg1gei2x",warningForeground:"lg1gei2y",warningSubtle:"lg1gei2z",warningSubtleHover:"lg1gei30",warningSubtleActive:"lg1gei31",warningSubtleForeground:"lg1gei32",warningSubtleBorder:"lg1gei33",info:"lg1gei34",infoHover:"lg1gei35",infoActive:"lg1gei36",infoForeground:"lg1gei37",infoSubtle:"lg1gei38",infoSubtleHover:"lg1gei39",infoSubtleActive:"lg1gei3a",infoSubtleForeground:"lg1gei3b",infoSubtleBorder:"lg1gei3c",destructive:"lg1gei3d",destructiveHover:"lg1gei3e",destructiveActive:"lg1gei3f",destructiveForeground:"lg1gei3g",destructiveSubtle:"lg1gei3h",destructiveSubtleHover:"lg1gei3i",destructiveSubtleActive:"lg1gei3j",destructiveSubtleForeground:"lg1gei3k",destructiveSubtleBorder:"lg1gei3l",purple:"lg1gei3m",purpleHover:"lg1gei3n",purpleActive:"lg1gei3o",purpleForeground:"lg1gei3p",purpleSubtle:"lg1gei3q",purpleSubtleHover:"lg1gei3r",purpleSubtleActive:"lg1gei3s",purpleSubtleForeground:"lg1gei3t",purpleSubtleBorder:"lg1gei3u",pink:"lg1gei3v",pinkHover:"lg1gei3w",pinkActive:"lg1gei3x",pinkForeground:"lg1gei3y",pinkSubtle:"lg1gei3z",pinkSubtleHover:"lg1gei40",pinkSubtleActive:"lg1gei41",pinkSubtleForeground:"lg1gei42",pinkSubtleBorder:"lg1gei43",orange:"lg1gei44",orangeHover:"lg1gei45",orangeActive:"lg1gei46",orangeForeground:"lg1gei47",orangeSubtle:"lg1gei48",orangeSubtleHover:"lg1gei49",orangeSubtleActive:"lg1gei4a",orangeSubtleForeground:"lg1gei4b",orangeSubtleBorder:"lg1gei4c",teal:"lg1gei4d",tealHover:"lg1gei4e",tealActive:"lg1gei4f",tealForeground:"lg1gei4g",tealSubtle:"lg1gei4h",tealSubtleHover:"lg1gei4i",tealSubtleActive:"lg1gei4j",tealSubtleForeground:"lg1gei4k",tealSubtleBorder:"lg1gei4l",cyan:"lg1gei4m",cyanHover:"lg1gei4n",cyanActive:"lg1gei4o",cyanForeground:"lg1gei4p",cyanSubtle:"lg1gei4q",cyanSubtleHover:"lg1gei4r",cyanSubtleActive:"lg1gei4s",cyanSubtleForeground:"lg1gei4t",cyanSubtleBorder:"lg1gei4u",indigo:"lg1gei4v",indigoHover:"lg1gei4w",indigoActive:"lg1gei4x",indigoForeground:"lg1gei4y",indigoSubtle:"lg1gei4z",indigoSubtleHover:"lg1gei50",indigoSubtleActive:"lg1gei51",indigoSubtleForeground:"lg1gei52",indigoSubtleBorder:"lg1gei53",border:"lg1gei54",borderStrong:"lg1gei55",input:"lg1gei56",ring:"lg1gei57",highlight:"lg1gei58",highlightForeground:"lg1gei59",skeleton:"lg1gei5a",skeletonForeground:"lg1gei5b",transparent:"lg1gei5c"}},defaultVariants:{variant:"p"},compoundVariants:[]})};exports.TYPOGRAPHY_STYLES=g;
+//# sourceMappingURL=Typography.css.cjs.map

package/dist/components/foundation/typography/styles/Typography.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}