@traefik-labs/faency 12.3.9 → 13.0.0

package/dist/components/IconButton/IconButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.cjs","names":[],"sources":["../../../components/IconButton/IconButton.tsx"],"sourcesContent":["import { styled, VariantProps } from '../../stitches.config';\nimport { BUTTON_BASE_STYLES } from '../Button';\n\nexport const IconButton = styled('button', {\n  ...BUTTON_BASE_STYLES,\n  // Reset\n  alignItems: 'center',\n  display: 'inline-flex',\n  flexShrink: 0,\n  fontFamily: 'inherit',\n  fontSize: '14px',\n  justifyContent: 'center',\n  lineHeight: '1',\n  // Custom\n  position: 'relative',\n  padding: '0',\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    borderRadius: 'inherit',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    borderRadius: 'inherit',\n  },\n  '@hover': {\n    '&:hover': {\n      cursor: 'pointer',\n      '&::before': {\n        backgroundColor: 'rgba(255, 255, 255, 0.15)',\n      },\n      '&::after': {\n        opacity: 0.05,\n      },\n    },\n  },\n\n  '&:focus-visible': {\n    outline: '2px solid currentColor',\n    '&::before': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n    },\n    '&::after': {\n      opacity: 0.15,\n    },\n  },\n\n  '&:active': {\n    '&::before': {\n      backgroundColor: 'rgba(0, 0, 0, 0.15)',\n    },\n  },\n\n  variants: {\n    size: {\n      '1': {\n        borderRadius: '$1',\n        height: '$5',\n        width: '$5',\n      },\n      '2': {\n        borderRadius: '$2',\n        height: '$6',\n        width: '$6',\n      },\n      '3': {\n        borderRadius: '$2',\n        height: '$7',\n        width: '$7',\n      },\n      '4': {\n        borderRadius: '$3',\n        height: '$8',\n        width: '$8',\n      },\n    },\n    variant: {\n      default: {\n        color: '$slate10',\n      },\n      contrast: {\n        color: '$hiContrast',\n      },\n      primary: {\n        color: '$primary',\n      },\n      red: {\n        color: '$red9',\n      },\n      green: {\n        color: '$green9',\n      },\n      orange: {\n        color: '$orange9',\n      },\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: '2',\n  },\n});\n\nexport type IconButtonVariants = VariantProps<typeof IconButton>;\n"],"mappings":";;;AAGA,IAAa,aAAa,wBAAA,OAAO,UAAU;CACzC,GAAG,eAAA;CAEH,YAAY;CACZ,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,UAAU;CACV,gBAAgB;CAChB,YAAY;CAEZ,UAAU;CACV,SAAS;CACT,gBAAgB;CAChB,iBAAiB;CAEjB,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;CAChB;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;CAChB;CACA,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF,EACF;CAEA,mBAAmB;EACjB,SAAS;EACT,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF;CAEA,YAAY,EACV,aAAa,EACX,iBAAiB,sBACnB,EACF;CAEA,UAAU;EACR,MAAM;GACJ,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;GACA,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;GACA,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;GACA,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;EACF;EACA,SAAS;GACP,SAAS,EACP,OAAO,WACT;GACA,UAAU,EACR,OAAO,cACT;GACA,SAAS,EACP,OAAO,WACT;GACA,KAAK,EACH,OAAO,QACT;GACA,OAAO,EACL,OAAO,UACT;GACA,QAAQ,EACN,OAAO,WACT;EACF;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC"}
+{"version":3,"file":"IconButton.cjs","names":["styled","BUTTON_BASE_STYLES"],"sources":["../../../components/IconButton/IconButton.tsx"],"sourcesContent":["import { styled, VariantProps } from '../../stitches.config';\nimport { BUTTON_BASE_STYLES } from '../Button';\n\nexport const IconButton = styled('button', {\n  ...BUTTON_BASE_STYLES,\n  // Reset\n  alignItems: 'center',\n  display: 'inline-flex',\n  flexShrink: 0,\n  fontFamily: 'inherit',\n  fontSize: '14px',\n  justifyContent: 'center',\n  lineHeight: '1',\n  // Custom\n  position: 'relative',\n  padding: '0',\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    borderRadius: 'inherit',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    borderRadius: 'inherit',\n  },\n  '@hover': {\n    '&:hover': {\n      cursor: 'pointer',\n      '&::before': {\n        backgroundColor: 'rgba(255, 255, 255, 0.15)',\n      },\n      '&::after': {\n        opacity: 0.05,\n      },\n    },\n  },\n\n  '&:focus-visible': {\n    outline: '2px solid currentColor',\n    '&::before': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n    },\n    '&::after': {\n      opacity: 0.15,\n    },\n  },\n\n  '&:active': {\n    '&::before': {\n      backgroundColor: 'rgba(0, 0, 0, 0.15)',\n    },\n  },\n\n  variants: {\n    size: {\n      '1': {\n        borderRadius: '$1',\n        height: '$5',\n        width: '$5',\n      },\n      '2': {\n        borderRadius: '$2',\n        height: '$6',\n        width: '$6',\n      },\n      '3': {\n        borderRadius: '$2',\n        height: '$7',\n        width: '$7',\n      },\n      '4': {\n        borderRadius: '$3',\n        height: '$8',\n        width: '$8',\n      },\n    },\n    variant: {\n      default: {\n        color: '$slate10',\n      },\n      contrast: {\n        color: '$hiContrast',\n      },\n      primary: {\n        color: '$primary',\n      },\n      red: {\n        color: '$red9',\n      },\n      green: {\n        color: '$green9',\n      },\n      orange: {\n        color: '$orange9',\n      },\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: '2',\n  },\n});\n\nexport type IconButtonVariants = VariantProps<typeof IconButton>;\n"],"mappings":";;;AAGA,IAAa,aAAaA,wBAAAA,OAAO,UAAU;CACzC,GAAGC,eAAAA;CAEH,YAAY;CACZ,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,UAAU;CACV,gBAAgB;CAChB,YAAY;CAEZ,UAAU;CACV,SAAS;CACT,gBAAgB;CAChB,iBAAiB;CAEjB,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;CAChB;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;CAChB;CACA,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF,EACF;CAEA,mBAAmB;EACjB,SAAS;EACT,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF;CAEA,YAAY,EACV,aAAa,EACX,iBAAiB,sBACnB,EACF;CAEA,UAAU;EACR,MAAM;GACJ,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;GACA,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;GACA,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;GACA,KAAK;IACH,cAAc;IACd,QAAQ;IACR,OAAO;GACT;EACF;EACA,SAAS;GACP,SAAS,EACP,OAAO,WACT;GACA,UAAU,EACR,OAAO,cACT;GACA,SAAS,EACP,OAAO,WACT;GACA,KAAK,EACH,OAAO,QACT;GACA,OAAO,EACL,OAAO,UACT;GACA,QAAQ,EACN,OAAO,WACT;EACF;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC"}

package/dist/components/IconButton/IconButton.js

@@ -1,6 +1,6 @@
 import { styled } from "../../stitches.config.js";
 import { BUTTON_BASE_STYLES } from "../Button/Button.js";
-//#region components/IconButton/IconButton.tsx
+// components/IconButton/IconButton.tsx
 var IconButton = styled("button", {
 	...BUTTON_BASE_STYLES,
 	alignItems: "center",
@@ -76,7 +76,6 @@ var IconButton = styled("button", {
 		size: "2"
 	}
 });
-//#endregion
 export { IconButton };
 
 //# sourceMappingURL=IconButton.js.map

package/dist/components/IconButton/IconButton.themes.cjs

@@ -1,4 +1,4 @@
-//#region components/IconButton/IconButton.themes.ts
+// components/IconButton/IconButton.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = () => ({
@@ -14,7 +14,6 @@ var Theme;
 		iconButtonFocusBorder: "$deepBlue7"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 Object.defineProperty(exports, "Theme", {
 	enumerable: true,
 	get: function() {

package/dist/components/IconButton/IconButton.themes.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.themes.cjs","names":[],"sources":["../../../components/IconButton/IconButton.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    iconButtonBackground: Property.Color;\n    iconButtonHoverBorder: Property.Color;\n    iconButtonHoverBackground: Property.Color;\n    iconButtonFocusBorder: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    iconButtonBackground: 'white',\n    iconButtonHoverBorder: '$slate9',\n    iconButtonHoverBackground: '$slateA3',\n    iconButtonFocusBorder: '$slate10',\n  });\n\n  export const getDark: Factory = () => ({\n    iconButtonBackground: '$deepBlue2',\n    iconButtonHoverBorder: '$deepBlue6',\n    iconButtonHoverBackground: '$slateA4',\n    iconButtonFocusBorder: '$deepBlue7',\n  });\n}\n"],"mappings":";AAIO,IAAA;;CAUQ,OAAA,kBAA2B;EACtC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;CAEa,OAAA,iBAA0B;EACrC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"IconButton.themes.cjs","names":[],"sources":["../../../components/IconButton/IconButton.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    iconButtonBackground: Property.Color;\n    iconButtonHoverBorder: Property.Color;\n    iconButtonHoverBackground: Property.Color;\n    iconButtonFocusBorder: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    iconButtonBackground: 'white',\n    iconButtonHoverBorder: '$slate9',\n    iconButtonHoverBackground: '$slateA3',\n    iconButtonFocusBorder: '$slate10',\n  });\n\n  export const getDark: Factory = () => ({\n    iconButtonBackground: '$deepBlue2',\n    iconButtonHoverBorder: '$deepBlue6',\n    iconButtonHoverBackground: '$slateA4',\n    iconButtonFocusBorder: '$deepBlue7',\n  });\n}\n"],"mappings":";AAIO,IAAU;CAAV,SAAA,QAAA;CAUQ,OAAA,kBAA2B;EACtC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;CAEa,OAAA,iBAA0B;EACrC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/IconButton/IconButton.themes.js

@@ -1,4 +1,4 @@
-//#region components/IconButton/IconButton.themes.ts
+// components/IconButton/IconButton.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = () => ({
@@ -14,7 +14,6 @@ var Theme;
 		iconButtonFocusBorder: "$deepBlue7"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 export { Theme };
 
 //# sourceMappingURL=IconButton.themes.js.map

package/dist/components/IconButton/IconButton.themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.themes.js","names":[],"sources":["../../../components/IconButton/IconButton.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    iconButtonBackground: Property.Color;\n    iconButtonHoverBorder: Property.Color;\n    iconButtonHoverBackground: Property.Color;\n    iconButtonFocusBorder: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    iconButtonBackground: 'white',\n    iconButtonHoverBorder: '$slate9',\n    iconButtonHoverBackground: '$slateA3',\n    iconButtonFocusBorder: '$slate10',\n  });\n\n  export const getDark: Factory = () => ({\n    iconButtonBackground: '$deepBlue2',\n    iconButtonHoverBorder: '$deepBlue6',\n    iconButtonHoverBackground: '$slateA4',\n    iconButtonFocusBorder: '$deepBlue7',\n  });\n}\n"],"mappings":";AAIO,IAAA;;CAUQ,OAAA,kBAA2B;EACtC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;CAEa,OAAA,iBAA0B;EACrC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"IconButton.themes.js","names":[],"sources":["../../../components/IconButton/IconButton.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    iconButtonBackground: Property.Color;\n    iconButtonHoverBorder: Property.Color;\n    iconButtonHoverBackground: Property.Color;\n    iconButtonFocusBorder: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    iconButtonBackground: 'white',\n    iconButtonHoverBorder: '$slate9',\n    iconButtonHoverBackground: '$slateA3',\n    iconButtonFocusBorder: '$slate10',\n  });\n\n  export const getDark: Factory = () => ({\n    iconButtonBackground: '$deepBlue2',\n    iconButtonHoverBorder: '$deepBlue6',\n    iconButtonHoverBackground: '$slateA4',\n    iconButtonFocusBorder: '$deepBlue7',\n  });\n}\n"],"mappings":";AAIO,IAAU;CAAV,SAAA,QAAA;CAUQ,OAAA,kBAA2B;EACtC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;CAEa,OAAA,iBAA0B;EACrC,sBAAsB;EACtB,uBAAuB;EACvB,2BAA2B;EAC3B,uBAAuB;CACzB;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/IconButton/IconButton.vanilla.cjs

@@ -4,7 +4,7 @@ const require_IconButton_vanilla_css = require("./IconButton.vanilla.css.cjs");
 let react = require("react");
 let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/IconButton/IconButton.vanilla.tsx
+// components/IconButton/IconButton.vanilla.tsx
 var IconButtonVanillaComponentImpl = (0, react.forwardRef)(({ as, className, css, style, size, variant, ...props }, ref) => {
 	const Component = as || "button";
 	const { colors } = require_themeContext.useVanillaExtractTheme();
@@ -14,19 +14,19 @@ var IconButtonVanillaComponentImpl = (0, react.forwardRef)(({ as, className, css
 		...style,
 		...(0, _vanilla_extract_dynamic.assignInlineVars)(vars)
 	};
+	const recipeClass = require_IconButton_vanilla_css.iconButtonRecipe({
+		size,
+		variant
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
 		ref,
-		className: `${require_IconButton_vanilla_css.iconButtonRecipe({
-			size,
-			variant
-		})} ${className || ""}`.trim(),
+		className: `${recipeClass} ${className || ""}`.trim(),
 		style: mergedStyles,
 		...props
 	});
 });
 IconButtonVanillaComponentImpl.displayName = "IconButtonVanilla";
 var IconButtonVanilla = IconButtonVanillaComponentImpl;
-//#endregion
 exports.IconButtonVanilla = IconButtonVanilla;
 
 //# sourceMappingURL=IconButton.vanilla.cjs.map

package/dist/components/IconButton/IconButton.vanilla.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.vanilla.cjs","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n  PolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n  C,\n  IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n  'button',\n  IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n  <C extends ElementType = 'button'>(\n    { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'button';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = iconButtonRecipe({ size, variant });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;AA2BA,IAAM,kCAAA,GAAA,MAAA,WAAA,EAEF,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAC1B;CAIA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GALK,+BAAA,iBAAiB;GAAE;GAAM;EAAQ,CAKnC,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
+{"version":3,"file":"IconButton.vanilla.cjs","names":["forwardRef","useVanillaExtractTheme","processCSSProp","assignInlineVars","iconButtonRecipe"],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n  PolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n  C,\n  IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n  'button',\n  IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n  <C extends ElementType = 'button'>(\n    { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'button';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = iconButtonRecipe({ size, variant });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;AA2BA,IAAM,kCAAA,GAAiCA,MAAAA,WAAAA,EAEnC,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAWC,qBAAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAASC,iBAAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAGC,yBAAAA,iBAAAA,CAAiB,IAAI;CAC1B;CAEA,MAAM,cAAcC,+BAAAA,iBAAiB;EAAE;EAAM;CAAQ,CAAC;CAEtD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}

package/dist/components/IconButton/IconButton.vanilla.css.cjs

@@ -1,5 +1,5 @@
 ;/* empty css                                        */
-//#region components/IconButton/IconButton.vanilla.css.ts
+// components/IconButton/IconButton.vanilla.css.ts
 var iconButtonRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").createRuntimeFn)({
 	defaultClassName: "vdyzvy1 vdyzvy0",
 	variantClassNames: {
@@ -24,7 +24,6 @@ var iconButtonRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").c
 	},
 	compoundVariants: []
 });
-//#endregion
 exports.iconButtonRecipe = iconButtonRecipe;
 
 //# sourceMappingURL=IconButton.vanilla.css.cjs.map

package/dist/components/IconButton/IconButton.vanilla.css.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.vanilla.css.cjs","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe, RecipeVariants } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles/tokens.css';\n\n// Base button styles (matching BUTTON_BASE_STYLES from Button component)\nconst baseIconButton = style({\n  // Reset\n  appearance: 'none',\n  userSelect: 'none',\n  boxSizing: 'border-box',\n  border: 'none',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Layout\n  alignItems: 'center',\n  display: 'inline-flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  position: 'relative',\n  padding: '0',\n\n  // Typography\n  fontFamily: 'inherit',\n  fontSize: '14px',\n  lineHeight: '1',\n\n  // Custom\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n\n  // Pseudo-elements for hover/active effects\n  selectors: {\n    '&::before': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&::after': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&:disabled': {\n      pointerEvents: 'none',\n      opacity: 0.5,\n    },\n    '&:focus-visible': {\n      outline: '2px solid currentColor',\n    },\n    '&:focus-visible::before': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n    },\n    '&:focus-visible::after': {\n      opacity: 0.15,\n    },\n    '&:active::before': {\n      backgroundColor: 'rgba(0, 0, 0, 0.15)',\n    },\n  },\n\n  '@media': {\n    '(hover: hover)': {\n      selectors: {\n        '&:hover': {\n          cursor: 'pointer',\n        },\n        '&:hover::before': {\n          backgroundColor: 'rgba(255, 255, 255, 0.15)',\n        },\n        '&:hover::after': {\n          opacity: 0.05,\n        },\n      },\n    },\n  },\n});\n\nexport const iconButtonRecipe = recipe({\n  base: baseIconButton,\n\n  variants: {\n    size: {\n      '1': {\n        borderRadius: tokens.radii['1'],\n        height: tokens.sizes['5'],\n        width: tokens.sizes['5'],\n      },\n      '2': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['6'],\n        width: tokens.sizes['6'],\n      },\n      '3': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['7'],\n        width: tokens.sizes['7'],\n      },\n      '4': {\n        borderRadius: tokens.radii['3'],\n        height: tokens.sizes['8'],\n        width: tokens.sizes['8'],\n      },\n    },\n    variant: {\n      default: {\n        color: tokens.colors.slate['10'],\n      },\n      contrast: {\n        color: tokens.colors.hiContrast,\n      },\n      primary: {\n        color: tokens.colors.primary,\n      },\n      red: {\n        color: tokens.colors.red['9'],\n      },\n      green: {\n        color: tokens.colors.green['9'],\n      },\n      orange: {\n        color: tokens.colors.orange['9'],\n      },\n    },\n  },\n\n  defaultVariants: {\n    variant: 'default',\n    size: '2',\n  },\n});\n\nexport type IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n"],"mappings":""}
+{"version":3,"file":"IconButton.vanilla.css.cjs","names":["_7a468"],"sources":["../../../components/IconButton/IconButton.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe, RecipeVariants } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles/tokens.css';\n\n// Base button styles (matching BUTTON_BASE_STYLES from Button component)\nconst baseIconButton = style({\n  // Reset\n  appearance: 'none',\n  userSelect: 'none',\n  boxSizing: 'border-box',\n  border: 'none',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Layout\n  alignItems: 'center',\n  display: 'inline-flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  position: 'relative',\n  padding: '0',\n\n  // Typography\n  fontFamily: 'inherit',\n  fontSize: '14px',\n  lineHeight: '1',\n\n  // Custom\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n\n  // Pseudo-elements for hover/active effects\n  selectors: {\n    '&::before': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&::after': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&:disabled': {\n      pointerEvents: 'none',\n      opacity: 0.5,\n    },\n    '&:focus-visible': {\n      outline: '2px solid currentColor',\n    },\n    '&:focus-visible::before': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n    },\n    '&:focus-visible::after': {\n      opacity: 0.15,\n    },\n    '&:active::before': {\n      backgroundColor: 'rgba(0, 0, 0, 0.15)',\n    },\n  },\n\n  '@media': {\n    '(hover: hover)': {\n      selectors: {\n        '&:hover': {\n          cursor: 'pointer',\n        },\n        '&:hover::before': {\n          backgroundColor: 'rgba(255, 255, 255, 0.15)',\n        },\n        '&:hover::after': {\n          opacity: 0.05,\n        },\n      },\n    },\n  },\n});\n\nexport const iconButtonRecipe = recipe({\n  base: baseIconButton,\n\n  variants: {\n    size: {\n      '1': {\n        borderRadius: tokens.radii['1'],\n        height: tokens.sizes['5'],\n        width: tokens.sizes['5'],\n      },\n      '2': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['6'],\n        width: tokens.sizes['6'],\n      },\n      '3': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['7'],\n        width: tokens.sizes['7'],\n      },\n      '4': {\n        borderRadius: tokens.radii['3'],\n        height: tokens.sizes['8'],\n        width: tokens.sizes['8'],\n      },\n    },\n    variant: {\n      default: {\n        color: tokens.colors.slate['10'],\n      },\n      contrast: {\n        color: tokens.colors.hiContrast,\n      },\n      primary: {\n        color: tokens.colors.primary,\n      },\n      red: {\n        color: tokens.colors.red['9'],\n      },\n      green: {\n        color: tokens.colors.green['9'],\n      },\n      orange: {\n        color: tokens.colors.orange['9'],\n      },\n    },\n  },\n\n  defaultVariants: {\n    variant: 'default',\n    size: '2',\n  },\n});\n\nexport type IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n"],"mappings":""}

package/dist/components/IconButton/IconButton.vanilla.css.js

@@ -1,6 +1,6 @@
 /* empty css                                      */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
-//#region components/IconButton/IconButton.vanilla.css.ts
+// components/IconButton/IconButton.vanilla.css.ts
 var iconButtonRecipe = createRuntimeFn({
 	defaultClassName: "vdyzvy1 vdyzvy0",
 	variantClassNames: {
@@ -25,7 +25,6 @@ var iconButtonRecipe = createRuntimeFn({
 	},
 	compoundVariants: []
 });
-//#endregion
 export { iconButtonRecipe };
 
 //# sourceMappingURL=IconButton.vanilla.css.js.map

package/dist/components/IconButton/IconButton.vanilla.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.vanilla.css.js","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe, RecipeVariants } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles/tokens.css';\n\n// Base button styles (matching BUTTON_BASE_STYLES from Button component)\nconst baseIconButton = style({\n  // Reset\n  appearance: 'none',\n  userSelect: 'none',\n  boxSizing: 'border-box',\n  border: 'none',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Layout\n  alignItems: 'center',\n  display: 'inline-flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  position: 'relative',\n  padding: '0',\n\n  // Typography\n  fontFamily: 'inherit',\n  fontSize: '14px',\n  lineHeight: '1',\n\n  // Custom\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n\n  // Pseudo-elements for hover/active effects\n  selectors: {\n    '&::before': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&::after': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&:disabled': {\n      pointerEvents: 'none',\n      opacity: 0.5,\n    },\n    '&:focus-visible': {\n      outline: '2px solid currentColor',\n    },\n    '&:focus-visible::before': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n    },\n    '&:focus-visible::after': {\n      opacity: 0.15,\n    },\n    '&:active::before': {\n      backgroundColor: 'rgba(0, 0, 0, 0.15)',\n    },\n  },\n\n  '@media': {\n    '(hover: hover)': {\n      selectors: {\n        '&:hover': {\n          cursor: 'pointer',\n        },\n        '&:hover::before': {\n          backgroundColor: 'rgba(255, 255, 255, 0.15)',\n        },\n        '&:hover::after': {\n          opacity: 0.05,\n        },\n      },\n    },\n  },\n});\n\nexport const iconButtonRecipe = recipe({\n  base: baseIconButton,\n\n  variants: {\n    size: {\n      '1': {\n        borderRadius: tokens.radii['1'],\n        height: tokens.sizes['5'],\n        width: tokens.sizes['5'],\n      },\n      '2': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['6'],\n        width: tokens.sizes['6'],\n      },\n      '3': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['7'],\n        width: tokens.sizes['7'],\n      },\n      '4': {\n        borderRadius: tokens.radii['3'],\n        height: tokens.sizes['8'],\n        width: tokens.sizes['8'],\n      },\n    },\n    variant: {\n      default: {\n        color: tokens.colors.slate['10'],\n      },\n      contrast: {\n        color: tokens.colors.hiContrast,\n      },\n      primary: {\n        color: tokens.colors.primary,\n      },\n      red: {\n        color: tokens.colors.red['9'],\n      },\n      green: {\n        color: tokens.colors.green['9'],\n      },\n      orange: {\n        color: tokens.colors.orange['9'],\n      },\n    },\n  },\n\n  defaultVariants: {\n    variant: 'default',\n    size: '2',\n  },\n});\n\nexport type IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n"],"mappings":""}
+{"version":3,"file":"IconButton.vanilla.css.js","names":["_7a468"],"sources":["../../../components/IconButton/IconButton.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe, RecipeVariants } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles/tokens.css';\n\n// Base button styles (matching BUTTON_BASE_STYLES from Button component)\nconst baseIconButton = style({\n  // Reset\n  appearance: 'none',\n  userSelect: 'none',\n  boxSizing: 'border-box',\n  border: 'none',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Layout\n  alignItems: 'center',\n  display: 'inline-flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  position: 'relative',\n  padding: '0',\n\n  // Typography\n  fontFamily: 'inherit',\n  fontSize: '14px',\n  lineHeight: '1',\n\n  // Custom\n  textDecoration: 'none',\n  backgroundColor: 'transparent',\n\n  // Pseudo-elements for hover/active effects\n  selectors: {\n    '&::before': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&::after': {\n      boxSizing: 'border-box',\n      content: '\"\"',\n      position: 'absolute',\n      inset: 0,\n      borderRadius: 'inherit',\n    },\n    '&:disabled': {\n      pointerEvents: 'none',\n      opacity: 0.5,\n    },\n    '&:focus-visible': {\n      outline: '2px solid currentColor',\n    },\n    '&:focus-visible::before': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n    },\n    '&:focus-visible::after': {\n      opacity: 0.15,\n    },\n    '&:active::before': {\n      backgroundColor: 'rgba(0, 0, 0, 0.15)',\n    },\n  },\n\n  '@media': {\n    '(hover: hover)': {\n      selectors: {\n        '&:hover': {\n          cursor: 'pointer',\n        },\n        '&:hover::before': {\n          backgroundColor: 'rgba(255, 255, 255, 0.15)',\n        },\n        '&:hover::after': {\n          opacity: 0.05,\n        },\n      },\n    },\n  },\n});\n\nexport const iconButtonRecipe = recipe({\n  base: baseIconButton,\n\n  variants: {\n    size: {\n      '1': {\n        borderRadius: tokens.radii['1'],\n        height: tokens.sizes['5'],\n        width: tokens.sizes['5'],\n      },\n      '2': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['6'],\n        width: tokens.sizes['6'],\n      },\n      '3': {\n        borderRadius: tokens.radii['2'],\n        height: tokens.sizes['7'],\n        width: tokens.sizes['7'],\n      },\n      '4': {\n        borderRadius: tokens.radii['3'],\n        height: tokens.sizes['8'],\n        width: tokens.sizes['8'],\n      },\n    },\n    variant: {\n      default: {\n        color: tokens.colors.slate['10'],\n      },\n      contrast: {\n        color: tokens.colors.hiContrast,\n      },\n      primary: {\n        color: tokens.colors.primary,\n      },\n      red: {\n        color: tokens.colors.red['9'],\n      },\n      green: {\n        color: tokens.colors.green['9'],\n      },\n      orange: {\n        color: tokens.colors.orange['9'],\n      },\n    },\n  },\n\n  defaultVariants: {\n    variant: 'default',\n    size: '2',\n  },\n});\n\nexport type IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n"],"mappings":""}

package/dist/components/IconButton/IconButton.vanilla.js

@@ -4,7 +4,7 @@ import { iconButtonRecipe } from "./IconButton.vanilla.css.js";
 import { forwardRef } from "react";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx } from "react/jsx-runtime";
-//#region components/IconButton/IconButton.vanilla.tsx
+// components/IconButton/IconButton.vanilla.tsx
 var IconButtonVanillaComponentImpl = forwardRef(({ as, className, css, style, size, variant, ...props }, ref) => {
 	const Component = as || "button";
 	const { colors } = useVanillaExtractTheme();
@@ -14,19 +14,19 @@ var IconButtonVanillaComponentImpl = forwardRef(({ as, className, css, style, si
 		...style,
 		...assignInlineVars(vars)
 	};
+	const recipeClass = iconButtonRecipe({
+		size,
+		variant
+	});
 	return /* @__PURE__ */ jsx(Component, {
 		ref,
-		className: `${iconButtonRecipe({
-			size,
-			variant
-		})} ${className || ""}`.trim(),
+		className: `${recipeClass} ${className || ""}`.trim(),
 		style: mergedStyles,
 		...props
 	});
 });
 IconButtonVanillaComponentImpl.displayName = "IconButtonVanilla";
 var IconButtonVanilla = IconButtonVanillaComponentImpl;
-//#endregion
 export { IconButtonVanilla };
 
 //# sourceMappingURL=IconButton.vanilla.js.map

package/dist/components/IconButton/IconButton.vanilla.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.vanilla.js","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n  PolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n  C,\n  IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n  'button',\n  IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n  <C extends ElementType = 'button'>(\n    { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'button';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = iconButtonRecipe({ size, variant });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;AA2BA,IAAM,iCAAiC,YAEnC,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAIA,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,iBAAiB;GAAE;GAAM;EAAQ,CAKnC,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
+{"version":3,"file":"IconButton.vanilla.js","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n  PolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n  C,\n  IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n  'button',\n  IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n  <C extends ElementType = 'button'>(\n    { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'button';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = iconButtonRecipe({ size, variant });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;AA2BA,IAAM,iCAAiC,YAEnC,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAEA,MAAM,cAAc,iBAAiB;EAAE;EAAM;CAAQ,CAAC;CAEtD,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}

package/dist/components/Image/Image.cjs

@@ -1,9 +1,8 @@
-//#region components/Image/Image.tsx
+// components/Image/Image.tsx
 var Image = require("../../stitches.config.cjs").styled("img", {
 	verticalAlign: "middle",
 	maxWidth: "100%"
 });
-//#endregion
 exports.Image = Image;
 
 //# sourceMappingURL=Image.cjs.map

package/dist/components/Image/Image.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Image.cjs","names":[],"sources":["../../../components/Image/Image.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Image = styled('img', {\n  // Reset\n  verticalAlign: 'middle',\n  maxWidth: '100%',\n});\n"],"mappings":";AAEA,IAAa,2CAAQ,CAAA,CAAA,OAAO,OAAO;CAEjC,eAAe;CACf,UAAU;AACZ,CAAC"}
+{"version":3,"file":"Image.cjs","names":["styled"],"sources":["../../../components/Image/Image.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Image = styled('img', {\n  // Reset\n  verticalAlign: 'middle',\n  maxWidth: '100%',\n});\n"],"mappings":";AAEA,IAAa,Q,mCAAQA,CAAAA,CAAAA,OAAO,OAAO;CAEjC,eAAe;CACf,UAAU;AACZ,CAAC"}

package/dist/components/Image/Image.js

@@ -1,10 +1,9 @@
 import { styled } from "../../stitches.config.js";
-//#region components/Image/Image.tsx
+// components/Image/Image.tsx
 var Image = styled("img", {
 	verticalAlign: "middle",
 	maxWidth: "100%"
 });
-//#endregion
 export { Image };
 
 //# sourceMappingURL=Image.js.map

package/dist/components/Image/Image.vanilla.cjs

@@ -4,7 +4,7 @@ const require_Image_vanilla_css = require("./Image.vanilla.css.cjs");
 let react = require("react");
 let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/Image/Image.vanilla.tsx
+// components/Image/Image.vanilla.tsx
 var ImageVanillaImpl = (0, react.forwardRef)(({ as, className, css, style, ...props }, ref) => {
 	const Component = as || "img";
 	const { colors } = require_themeContext.useVanillaExtractTheme();
@@ -23,7 +23,6 @@ var ImageVanillaImpl = (0, react.forwardRef)(({ as, className, css, style, ...pr
 });
 ImageVanillaImpl.displayName = "ImageVanilla";
 var ImageVanilla = ImageVanillaImpl;
-//#endregion
 exports.ImageVanilla = ImageVanilla;
 
 //# sourceMappingURL=Image.vanilla.cjs.map

package/dist/components/Image/Image.vanilla.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Image.vanilla.cjs","names":[],"sources":["../../../components/Image/Image.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n  PolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { image } from './Image.vanilla.css';\n\nexport type ImageVanillaProps<C extends ElementType = 'img'> = PolymorphicComponentProps<\n  C,\n  CSSProps\n>;\n\ntype ImageVanillaComponent = PolymorphicComponent<'img', ImageVanillaProps<ElementType>>;\n\nconst ImageVanillaImpl = forwardRef(\n  <C extends ElementType = 'img'>(\n    { as, className, css, style, ...props }: ImageVanillaProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'img';\n    const { colors } = useVanillaExtractTheme();\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    return (\n      <Component\n        ref={ref}\n        className={`${image} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nImageVanillaImpl.displayName = 'ImageVanilla';\n\nexport const ImageVanilla = ImageVanillaImpl as ImageVanillaComponent;\n"],"mappings":";;;;;;;AAmBA,IAAM,oBAAA,GAAA,MAAA,WAAA,EAEF,EAAE,IAAI,WAAW,KAAK,OAAO,GAAG,SAChC,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAC1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAC1B;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GAAG,0BAAA,MAAM,GAAG,aAAa,KAAK,KAAK;EAC9C,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,iBAAiB,cAAc;AAE/B,IAAa,eAAe"}
+{"version":3,"file":"Image.vanilla.cjs","names":["forwardRef","useVanillaExtractTheme","processCSSProp","assignInlineVars","image"],"sources":["../../../components/Image/Image.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n  PolymorphicComponent,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { image } from './Image.vanilla.css';\n\nexport type ImageVanillaProps<C extends ElementType = 'img'> = PolymorphicComponentProps<\n  C,\n  CSSProps\n>;\n\ntype ImageVanillaComponent = PolymorphicComponent<'img', ImageVanillaProps<ElementType>>;\n\nconst ImageVanillaImpl = forwardRef(\n  <C extends ElementType = 'img'>(\n    { as, className, css, style, ...props }: ImageVanillaProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'img';\n    const { colors } = useVanillaExtractTheme();\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    return (\n      <Component\n        ref={ref}\n        className={`${image} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nImageVanillaImpl.displayName = 'ImageVanilla';\n\nexport const ImageVanilla = ImageVanillaImpl as ImageVanillaComponent;\n"],"mappings":";;;;;;;AAmBA,IAAM,oBAAA,GAAmBA,MAAAA,WAAAA,EAErB,EAAE,IAAI,WAAW,KAAK,OAAO,GAAG,SAChC,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAWC,qBAAAA,uBAAuB;CAC1C,MAAM,EAAE,OAAO,WAAW,SAASC,iBAAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAGC,yBAAAA,iBAAAA,CAAiB,IAAI;CAC1B;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GAAGC,0BAAAA,MAAM,GAAG,aAAa,KAAK,KAAK;EAC9C,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,iBAAiB,cAAc;AAE/B,IAAa,eAAe"}

package/dist/components/Image/Image.vanilla.css.cjs

@@ -1,7 +1,6 @@
 ;/* empty css                                   */
-//#region components/Image/Image.vanilla.css.ts
+// components/Image/Image.vanilla.css.ts
 var image = "_18cm5pz0";
-//#endregion
 exports.image = image;
 
 //# sourceMappingURL=Image.vanilla.css.cjs.map

package/dist/components/Image/Image.vanilla.css.js

@@ -1,7 +1,6 @@
 /* empty css                                 */
-//#region components/Image/Image.vanilla.css.ts
+// components/Image/Image.vanilla.css.ts
 var image = "_18cm5pz0";
-//#endregion
 export { image };
 
 //# sourceMappingURL=Image.vanilla.css.js.map

package/dist/components/Image/Image.vanilla.js

@@ -4,7 +4,7 @@ import { image } from "./Image.vanilla.css.js";
 import { forwardRef } from "react";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx } from "react/jsx-runtime";
-//#region components/Image/Image.vanilla.tsx
+// components/Image/Image.vanilla.tsx
 var ImageVanillaImpl = forwardRef(({ as, className, css, style, ...props }, ref) => {
 	const Component = as || "img";
 	const { colors } = useVanillaExtractTheme();
@@ -23,7 +23,6 @@ var ImageVanillaImpl = forwardRef(({ as, className, css, style, ...props }, ref)
 });
 ImageVanillaImpl.displayName = "ImageVanilla";
 var ImageVanilla = ImageVanillaImpl;
-//#endregion
 export { ImageVanilla };
 
 //# sourceMappingURL=Image.vanilla.js.map

package/dist/components/Input/Input.cjs

@@ -4,7 +4,7 @@ const require_Elevation = require("../Elevation/Elevation.cjs");
 let react = require("react");
 react = require_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/Input/Input.tsx
+// components/Input/Input.tsx
 var FOCUS_SHADOW = require_Elevation.elevationVariants[1].boxShadow;
 var StyledInput = require_stitches_config.styled("input", {
 	appearance: "none",
@@ -261,7 +261,6 @@ var Input = react.default.forwardRef(({ size, startAdornment, endAdornment, css,
 		]
 	});
 });
-//#endregion
 exports.Input = Input;
 
 //# sourceMappingURL=Input.cjs.map

package/dist/components/Input/Input.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.cjs","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n  // Reset\n  appearance: 'none',\n  borderWidth: '0',\n  boxSizing: 'border-box',\n  fontFamily: '$rubik',\n  margin: '0',\n  outline: 'none',\n  padding: '0',\n  width: '100%',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Custom\n  position: 'relative',\n  backgroundColor: 'transparent',\n  borderRadius: 'inherit', // inherit border radius from InputWrapper\n  boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n  color: '$inputText',\n  fontVariantNumeric: 'tabular-nums',\n  transition: 'box-shadow .1s ease-in-out',\n\n  '&[type=\"number\"]': {\n    pr: '0', // remove padding for number native controls\n  },\n\n  '&:-webkit-autofill,&:autofill': {\n    boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\n  },\n\n  '&:-webkit-autofill::first-line,&:autofill::first-line': {\n    fontFamily: '$rubik',\n    color: '$hiContrast',\n  },\n\n  '&:focus-visible': {\n    boxShadow: `inset 0 0 0 2px $colors$inputFocusBorder, ${FOCUS_SHADOW}`,\n  },\n\n  '&::placeholder': {\n    color: '$inputPlaceholder',\n  },\n\n  '&:read-only:not(:disabled)': {\n    boxShadow: 'none',\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    color: '$inputDisabledText',\n  },\n\n  variants: {\n    size: {\n      small: {\n        height: SMALL_HEIGHT,\n        fontSize: '$1',\n        px: '$2',\n        lineHeight: '$sizes$5',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$1',\n        },\n      },\n      medium: {\n        height: MEDIUM_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$6',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n      large: {\n        height: LARGE_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$7',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n    },\n    startAdornment: {\n      true: {},\n    },\n    endAdornment: {\n      true: {},\n    },\n    variant: {\n      ghost: {\n        boxShadow: 'none',\n        '&:disabled': {\n          boxShadow: 'none',\n        },\n        backgroundColor: 'transparent',\n        '&:focus-visible': {\n          backgroundColor: '$loContrast',\n        },\n      },\n    },\n    state: {\n      invalid: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n        '&:focus-visible': {\n          boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\n        },\n      },\n    },\n    cursor: {\n      default: {\n        cursor: 'default',\n        '@hover': {\n          '&:hover:not(:read-only)': {\n            cursor: 'text',\n          },\n        },\n        '&:focus-visible:not(:read-only)': {\n          cursor: 'text',\n        },\n      },\n      text: {\n        cursor: 'text',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    cursor: 'default',\n  },\n  compoundVariants: [\n    {\n      variant: 'ghost',\n      state: 'invalid',\n      css: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineStart: 'calc($2 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineEnd: 'calc($2 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n  ],\n});\n\nconst InputWrapper = styled('div', {\n  // Reset\n  outline: 'none',\n  lineHeight: 0,\n\n  position: 'relative',\n  backgroundColor: '$inputBg',\n  color: '$inputPlaceholder',\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n\n  '&:focus-visible': {\n    '&::before': {\n      backgroundColor: '$inputFocusBg',\n    },\n    '&::after': {\n      backgroundColor: '$primary',\n      opacity: 0.15,\n    },\n  },\n\n  '@hover': {\n    '&:hover': {\n      '&::before': {\n        backgroundColor: '$inputHoverBg',\n      },\n      '&::after': {\n        backgroundColor: '$primary',\n        opacity: 0.05,\n      },\n    },\n  },\n\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.7,\n        color: '$inputDisabledText',\n        '@hover': {\n          '&:hover': {\n            '&::before': {\n              backgroundColor: 'inherit',\n            },\n            '&::after': {\n              backgroundColor: 'inherit',\n            },\n          },\n        },\n      },\n    },\n    state: {\n      invalid: {\n        '@hover': {\n          '&:hover': {\n            '&::after': {\n              backgroundColor: '$inputInvalidBorder',\n            },\n          },\n        },\n      },\n    },\n    size: {\n      small: {\n        borderRadius: '$2',\n        '&::before, &::after': {\n          borderRadius: '$2',\n        },\n      },\n      medium: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n      large: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    disabled: false,\n  },\n});\n\nconst AdornmentWrapper = styled('div', {\n  position: 'absolute',\n  top: 0,\n  height: '100%',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  variants: {\n    size: {\n      small: {\n        mx: 'calc($2 / 2)',\n      },\n      medium: {\n        mx: 'calc($3 / 2)',\n      },\n      large: {\n        mx: 'calc($3 / 2)',\n      },\n    },\n    variant: {\n      start: {\n        left: 0,\n      },\n      end: {\n        right: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n  left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n  right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n  startAdornment?: React.ReactNode;\n  endAdornment?: React.ReactNode;\n  type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n  clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n  ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n    const inputRef = React.useRef<InputHandle>(null);\n\n    React.useImperativeHandle(\n      forwardedRef,\n      () => {\n        const { current } = inputRef;\n        if (current) {\n          current.clear = () => {\n            current.value = '';\n          };\n        }\n        return current as InputHandle;\n      },\n      [inputRef]\n    );\n\n    const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n    const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n    return (\n      <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n        {hasStartAdornment && (\n          <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n        )}\n\n        <StyledInput\n          ref={inputRef}\n          startAdornment={hasStartAdornment}\n          endAdornment={hasEndAdornment}\n          size={size}\n          {...props}\n        />\n        {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n      </InputWrapper>\n    );\n  }\n);\n"],"mappings":";;;;;;;AAMA,IAAM,eAAe,kBAAA,kBAAkB,EAAE,CAAC;AAM1C,IAAM,cAAc,wBAAA,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,IACN;CAEA,iCAAiC,EAC/B,WAAW,yEACb;CAEA,yDAAyD;EACvD,YAAY;EACZ,OAAO;CACT;CAEA,mBAAmB,EACjB,WAAW,6CAA6C,eAC1D;CAEA,kBAAkB,EAChB,OAAO,oBACT;CAEA,8BAA8B,EAC5B,WAAW,OACb;CAEA,cAAc;EACZ,eAAe;EACf,OAAO;CACT;CAEA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,QAAQ;IACN,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;EACF;EACA,gBAAgB,EACd,MAAM,CAAC,EACT;EACA,cAAc,EACZ,MAAM,CAAC,EACT;EACA,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,OACb;GACA,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,cACnB;EACF,EACF;EACA,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,eAC5D;EACF,EACF;EACA,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,OACV,EACF;IACA,mCAAmC,EACjC,QAAQ,OACV;GACF;GACA,MAAM,EACJ,QAAQ,OACV;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,QAAQ;CACV;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,6CACb;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;CACF;AACF,CAAC;AAED,IAAM,eAAe,wBAAA,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CAEA,mBAAmB;EACjB,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF;CAEA,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF,EACF;CAEA,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,UACnB;IACA,YAAY,EACV,iBAAiB,UACnB;GACF,EACF;EACF,EACF;EACA,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,sBACnB,EACF,EACF,EACF,EACF;EACA,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CAAC;AAED,IAAM,mBAAmB,wBAAA,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,eACN;GACA,QAAQ,EACN,IAAI,eACN;GACA,OAAO,EACL,IAAI,eACN;EACF;EACA,SAAS;GACP,OAAO,EACL,MAAM,EACR;GACA,KAAK,EACH,OAAO,EACT;EACF;CACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAED,IAAM,wBAAwB,wBAAA,OAAO,kBAAkB,EACrD,MAAM,EACR,CAAC;AAED,IAAM,sBAAsB,wBAAA,OAAO,kBAAkB,EACnD,OAAO,EACT,CAAC;AAgBD,IAAa,QAAQ,MAAA,QAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAA,QAAM,OAAoB,IAAI;CAE/C,MAAA,QAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,cAAc;GACpB,QAAQ,QAAQ;EAClB;EAEF,OAAO;CACT,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,oBAAoB,MAAA,QAAM,cAAc,QAAQ,cAAc,GAAG,CAAC,cAAc,CAAC;CAEvF,MAAM,kBAAkB,MAAA,QAAM,cAAc,QAAQ,YAAY,GAAG,CAAC,YAAY,CAAC;CAEjF,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;YAA/D;GACG,qBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD;IAA6B;cAAO;GAAsC,CAAA;GAG5E,iBAAA,GAAA,kBAAA,IAAA,CAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;GACL,CAAA;GACA,mBAAmB,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAD;IAA2B;cAAO;GAAkC,CAAA;EAC5E;;AAElB,CACF"}
+{"version":3,"file":"Input.cjs","names":["elevationVariants","styled","React"],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n  // Reset\n  appearance: 'none',\n  borderWidth: '0',\n  boxSizing: 'border-box',\n  fontFamily: '$rubik',\n  margin: '0',\n  outline: 'none',\n  padding: '0',\n  width: '100%',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Custom\n  position: 'relative',\n  backgroundColor: 'transparent',\n  borderRadius: 'inherit', // inherit border radius from InputWrapper\n  boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n  color: '$inputText',\n  fontVariantNumeric: 'tabular-nums',\n  transition: 'box-shadow .1s ease-in-out',\n\n  '&[type=\"number\"]': {\n    pr: '0', // remove padding for number native controls\n  },\n\n  '&:-webkit-autofill,&:autofill': {\n    boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\n  },\n\n  '&:-webkit-autofill::first-line,&:autofill::first-line': {\n    fontFamily: '$rubik',\n    color: '$hiContrast',\n  },\n\n  '&:focus-visible': {\n    boxShadow: `inset 0 0 0 2px $colors$inputFocusBorder, ${FOCUS_SHADOW}`,\n  },\n\n  '&::placeholder': {\n    color: '$inputPlaceholder',\n  },\n\n  '&:read-only:not(:disabled)': {\n    boxShadow: 'none',\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    color: '$inputDisabledText',\n  },\n\n  variants: {\n    size: {\n      small: {\n        height: SMALL_HEIGHT,\n        fontSize: '$1',\n        px: '$2',\n        lineHeight: '$sizes$5',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$1',\n        },\n      },\n      medium: {\n        height: MEDIUM_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$6',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n      large: {\n        height: LARGE_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$7',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n    },\n    startAdornment: {\n      true: {},\n    },\n    endAdornment: {\n      true: {},\n    },\n    variant: {\n      ghost: {\n        boxShadow: 'none',\n        '&:disabled': {\n          boxShadow: 'none',\n        },\n        backgroundColor: 'transparent',\n        '&:focus-visible': {\n          backgroundColor: '$loContrast',\n        },\n      },\n    },\n    state: {\n      invalid: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n        '&:focus-visible': {\n          boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\n        },\n      },\n    },\n    cursor: {\n      default: {\n        cursor: 'default',\n        '@hover': {\n          '&:hover:not(:read-only)': {\n            cursor: 'text',\n          },\n        },\n        '&:focus-visible:not(:read-only)': {\n          cursor: 'text',\n        },\n      },\n      text: {\n        cursor: 'text',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    cursor: 'default',\n  },\n  compoundVariants: [\n    {\n      variant: 'ghost',\n      state: 'invalid',\n      css: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineStart: 'calc($2 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineEnd: 'calc($2 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n  ],\n});\n\nconst InputWrapper = styled('div', {\n  // Reset\n  outline: 'none',\n  lineHeight: 0,\n\n  position: 'relative',\n  backgroundColor: '$inputBg',\n  color: '$inputPlaceholder',\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n\n  '&:focus-visible': {\n    '&::before': {\n      backgroundColor: '$inputFocusBg',\n    },\n    '&::after': {\n      backgroundColor: '$primary',\n      opacity: 0.15,\n    },\n  },\n\n  '@hover': {\n    '&:hover': {\n      '&::before': {\n        backgroundColor: '$inputHoverBg',\n      },\n      '&::after': {\n        backgroundColor: '$primary',\n        opacity: 0.05,\n      },\n    },\n  },\n\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.7,\n        color: '$inputDisabledText',\n        '@hover': {\n          '&:hover': {\n            '&::before': {\n              backgroundColor: 'inherit',\n            },\n            '&::after': {\n              backgroundColor: 'inherit',\n            },\n          },\n        },\n      },\n    },\n    state: {\n      invalid: {\n        '@hover': {\n          '&:hover': {\n            '&::after': {\n              backgroundColor: '$inputInvalidBorder',\n            },\n          },\n        },\n      },\n    },\n    size: {\n      small: {\n        borderRadius: '$2',\n        '&::before, &::after': {\n          borderRadius: '$2',\n        },\n      },\n      medium: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n      large: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    disabled: false,\n  },\n});\n\nconst AdornmentWrapper = styled('div', {\n  position: 'absolute',\n  top: 0,\n  height: '100%',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  variants: {\n    size: {\n      small: {\n        mx: 'calc($2 / 2)',\n      },\n      medium: {\n        mx: 'calc($3 / 2)',\n      },\n      large: {\n        mx: 'calc($3 / 2)',\n      },\n    },\n    variant: {\n      start: {\n        left: 0,\n      },\n      end: {\n        right: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n  left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n  right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n  startAdornment?: React.ReactNode;\n  endAdornment?: React.ReactNode;\n  type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n  clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n  ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n    const inputRef = React.useRef<InputHandle>(null);\n\n    React.useImperativeHandle(\n      forwardedRef,\n      () => {\n        const { current } = inputRef;\n        if (current) {\n          current.clear = () => {\n            current.value = '';\n          };\n        }\n        return current as InputHandle;\n      },\n      [inputRef]\n    );\n\n    const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n    const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n    return (\n      <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n        {hasStartAdornment && (\n          <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n        )}\n\n        <StyledInput\n          ref={inputRef}\n          startAdornment={hasStartAdornment}\n          endAdornment={hasEndAdornment}\n          size={size}\n          {...props}\n        />\n        {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n      </InputWrapper>\n    );\n  }\n);\n"],"mappings":";;;;;;;AAMA,IAAM,eAAeA,kBAAAA,kBAAkB,EAAE,CAAC;AAM1C,IAAM,cAAcC,wBAAAA,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,IACN;CAEA,iCAAiC,EAC/B,WAAW,yEACb;CAEA,yDAAyD;EACvD,YAAY;EACZ,OAAO;CACT;CAEA,mBAAmB,EACjB,WAAW,6CAA6C,eAC1D;CAEA,kBAAkB,EAChB,OAAO,oBACT;CAEA,8BAA8B,EAC5B,WAAW,OACb;CAEA,cAAc;EACZ,eAAe;EACf,OAAO;CACT;CAEA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,QAAQ;IACN,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;EACF;EACA,gBAAgB,EACd,MAAM,CAAC,EACT;EACA,cAAc,EACZ,MAAM,CAAC,EACT;EACA,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,OACb;GACA,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,cACnB;EACF,EACF;EACA,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,eAC5D;EACF,EACF;EACA,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,OACV,EACF;IACA,mCAAmC,EACjC,QAAQ,OACV;GACF;GACA,MAAM,EACJ,QAAQ,OACV;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,QAAQ;CACV;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,6CACb;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;CACF;AACF,CAAC;AAED,IAAM,eAAeA,wBAAAA,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CAEA,mBAAmB;EACjB,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF;CAEA,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF,EACF;CAEA,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,UACnB;IACA,YAAY,EACV,iBAAiB,UACnB;GACF,EACF;EACF,EACF;EACA,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,sBACnB,EACF,EACF,EACF,EACF;EACA,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CAAC;AAED,IAAM,mBAAmBA,wBAAAA,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,eACN;GACA,QAAQ,EACN,IAAI,eACN;GACA,OAAO,EACL,IAAI,eACN;EACF;EACA,SAAS;GACP,OAAO,EACL,MAAM,EACR;GACA,KAAK,EACH,OAAO,EACT;EACF;CACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAED,IAAM,wBAAwBA,wBAAAA,OAAO,kBAAkB,EACrD,MAAM,EACR,CAAC;AAED,IAAM,sBAAsBA,wBAAAA,OAAO,kBAAkB,EACnD,OAAO,EACT,CAAC;AAgBD,IAAa,QAAQC,MAAAA,QAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAWA,MAAAA,QAAM,OAAoB,IAAI;CAE/C,MAAA,QAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,cAAc;GACpB,QAAQ,QAAQ;EAClB;EAEF,OAAO;CACT,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,oBAAoBA,MAAAA,QAAM,cAAc,QAAQ,cAAc,GAAG,CAAC,cAAc,CAAC;CAEvF,MAAM,kBAAkBA,MAAAA,QAAM,cAAc,QAAQ,YAAY,GAAG,CAAC,YAAY,CAAC;CAEjF,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;EAA/D,UAAA;GACG,qBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD;IAA6B;IAAO,UAAA;GAAsC,CAAA;GAG5E,iBAAA,GAAA,kBAAA,IAAA,CAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;GACL,CAAA;GACA,mBAAmB,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAD;IAA2B;IAAO,UAAA;GAAkC,CAAA;EAC5E;;AAElB,CACF"}

package/dist/components/Input/Input.js

@@ -2,7 +2,7 @@ import { styled } from "../../stitches.config.js";
 import { elevationVariants } from "../Elevation/Elevation.js";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region components/Input/Input.tsx
+// components/Input/Input.tsx
 var FOCUS_SHADOW = elevationVariants[1].boxShadow;
 var StyledInput = styled("input", {
 	appearance: "none",
@@ -259,7 +259,6 @@ var Input = React.forwardRef(({ size, startAdornment, endAdornment, css, ...prop
 		]
 	});
 });
-//#endregion
 export { Input };
 
 //# sourceMappingURL=Input.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n  // Reset\n  appearance: 'none',\n  borderWidth: '0',\n  boxSizing: 'border-box',\n  fontFamily: '$rubik',\n  margin: '0',\n  outline: 'none',\n  padding: '0',\n  width: '100%',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Custom\n  position: 'relative',\n  backgroundColor: 'transparent',\n  borderRadius: 'inherit', // inherit border radius from InputWrapper\n  boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n  color: '$inputText',\n  fontVariantNumeric: 'tabular-nums',\n  transition: 'box-shadow .1s ease-in-out',\n\n  '&[type=\"number\"]': {\n    pr: '0', // remove padding for number native controls\n  },\n\n  '&:-webkit-autofill,&:autofill': {\n    boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\n  },\n\n  '&:-webkit-autofill::first-line,&:autofill::first-line': {\n    fontFamily: '$rubik',\n    color: '$hiContrast',\n  },\n\n  '&:focus-visible': {\n    boxShadow: `inset 0 0 0 2px $colors$inputFocusBorder, ${FOCUS_SHADOW}`,\n  },\n\n  '&::placeholder': {\n    color: '$inputPlaceholder',\n  },\n\n  '&:read-only:not(:disabled)': {\n    boxShadow: 'none',\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    color: '$inputDisabledText',\n  },\n\n  variants: {\n    size: {\n      small: {\n        height: SMALL_HEIGHT,\n        fontSize: '$1',\n        px: '$2',\n        lineHeight: '$sizes$5',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$1',\n        },\n      },\n      medium: {\n        height: MEDIUM_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$6',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n      large: {\n        height: LARGE_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$7',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n    },\n    startAdornment: {\n      true: {},\n    },\n    endAdornment: {\n      true: {},\n    },\n    variant: {\n      ghost: {\n        boxShadow: 'none',\n        '&:disabled': {\n          boxShadow: 'none',\n        },\n        backgroundColor: 'transparent',\n        '&:focus-visible': {\n          backgroundColor: '$loContrast',\n        },\n      },\n    },\n    state: {\n      invalid: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n        '&:focus-visible': {\n          boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\n        },\n      },\n    },\n    cursor: {\n      default: {\n        cursor: 'default',\n        '@hover': {\n          '&:hover:not(:read-only)': {\n            cursor: 'text',\n          },\n        },\n        '&:focus-visible:not(:read-only)': {\n          cursor: 'text',\n        },\n      },\n      text: {\n        cursor: 'text',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    cursor: 'default',\n  },\n  compoundVariants: [\n    {\n      variant: 'ghost',\n      state: 'invalid',\n      css: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineStart: 'calc($2 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineEnd: 'calc($2 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n  ],\n});\n\nconst InputWrapper = styled('div', {\n  // Reset\n  outline: 'none',\n  lineHeight: 0,\n\n  position: 'relative',\n  backgroundColor: '$inputBg',\n  color: '$inputPlaceholder',\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n\n  '&:focus-visible': {\n    '&::before': {\n      backgroundColor: '$inputFocusBg',\n    },\n    '&::after': {\n      backgroundColor: '$primary',\n      opacity: 0.15,\n    },\n  },\n\n  '@hover': {\n    '&:hover': {\n      '&::before': {\n        backgroundColor: '$inputHoverBg',\n      },\n      '&::after': {\n        backgroundColor: '$primary',\n        opacity: 0.05,\n      },\n    },\n  },\n\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.7,\n        color: '$inputDisabledText',\n        '@hover': {\n          '&:hover': {\n            '&::before': {\n              backgroundColor: 'inherit',\n            },\n            '&::after': {\n              backgroundColor: 'inherit',\n            },\n          },\n        },\n      },\n    },\n    state: {\n      invalid: {\n        '@hover': {\n          '&:hover': {\n            '&::after': {\n              backgroundColor: '$inputInvalidBorder',\n            },\n          },\n        },\n      },\n    },\n    size: {\n      small: {\n        borderRadius: '$2',\n        '&::before, &::after': {\n          borderRadius: '$2',\n        },\n      },\n      medium: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n      large: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    disabled: false,\n  },\n});\n\nconst AdornmentWrapper = styled('div', {\n  position: 'absolute',\n  top: 0,\n  height: '100%',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  variants: {\n    size: {\n      small: {\n        mx: 'calc($2 / 2)',\n      },\n      medium: {\n        mx: 'calc($3 / 2)',\n      },\n      large: {\n        mx: 'calc($3 / 2)',\n      },\n    },\n    variant: {\n      start: {\n        left: 0,\n      },\n      end: {\n        right: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n  left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n  right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n  startAdornment?: React.ReactNode;\n  endAdornment?: React.ReactNode;\n  type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n  clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n  ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n    const inputRef = React.useRef<InputHandle>(null);\n\n    React.useImperativeHandle(\n      forwardedRef,\n      () => {\n        const { current } = inputRef;\n        if (current) {\n          current.clear = () => {\n            current.value = '';\n          };\n        }\n        return current as InputHandle;\n      },\n      [inputRef]\n    );\n\n    const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n    const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n    return (\n      <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n        {hasStartAdornment && (\n          <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n        )}\n\n        <StyledInput\n          ref={inputRef}\n          startAdornment={hasStartAdornment}\n          endAdornment={hasEndAdornment}\n          size={size}\n          {...props}\n        />\n        {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n      </InputWrapper>\n    );\n  }\n);\n"],"mappings":";;;;;AAMA,IAAM,eAAe,kBAAkB,EAAE,CAAC;AAM1C,IAAM,cAAc,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,IACN;CAEA,iCAAiC,EAC/B,WAAW,yEACb;CAEA,yDAAyD;EACvD,YAAY;EACZ,OAAO;CACT;CAEA,mBAAmB,EACjB,WAAW,6CAA6C,eAC1D;CAEA,kBAAkB,EAChB,OAAO,oBACT;CAEA,8BAA8B,EAC5B,WAAW,OACb;CAEA,cAAc;EACZ,eAAe;EACf,OAAO;CACT;CAEA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,QAAQ;IACN,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;EACF;EACA,gBAAgB,EACd,MAAM,CAAC,EACT;EACA,cAAc,EACZ,MAAM,CAAC,EACT;EACA,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,OACb;GACA,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,cACnB;EACF,EACF;EACA,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,eAC5D;EACF,EACF;EACA,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,OACV,EACF;IACA,mCAAmC,EACjC,QAAQ,OACV;GACF;GACA,MAAM,EACJ,QAAQ,OACV;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,QAAQ;CACV;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,6CACb;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;CACF;AACF,CAAC;AAED,IAAM,eAAe,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CAEA,mBAAmB;EACjB,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF;CAEA,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF,EACF;CAEA,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,UACnB;IACA,YAAY,EACV,iBAAiB,UACnB;GACF,EACF;EACF,EACF;EACA,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,sBACnB,EACF,EACF,EACF,EACF;EACA,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CAAC;AAED,IAAM,mBAAmB,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,eACN;GACA,QAAQ,EACN,IAAI,eACN;GACA,OAAO,EACL,IAAI,eACN;EACF;EACA,SAAS;GACP,OAAO,EACL,MAAM,EACR;GACA,KAAK,EACH,OAAO,EACT;EACF;CACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAED,IAAM,wBAAwB,OAAO,kBAAkB,EACrD,MAAM,EACR,CAAC;AAED,IAAM,sBAAsB,OAAO,kBAAkB,EACnD,OAAO,EACT,CAAC;AAgBD,IAAa,QAAQ,MAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAM,OAAoB,IAAI;CAE/C,MAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,cAAc;GACpB,QAAQ,QAAQ;EAClB;EAEF,OAAO;CACT,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,oBAAoB,MAAM,cAAc,QAAQ,cAAc,GAAG,CAAC,cAAc,CAAC;CAEvF,MAAM,kBAAkB,MAAM,cAAc,QAAQ,YAAY,GAAG,CAAC,YAAY,CAAC;CAEjF,OACE,qBAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;YAA/D;GACG,qBACC,oBAAC,uBAAD;IAA6B;cAAO;GAAsC,CAAA;GAG5E,oBAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;GACL,CAAA;GACA,mBAAmB,oBAAC,qBAAD;IAA2B;cAAO;GAAkC,CAAA;EAC5E;;AAElB,CACF"}
+{"version":3,"file":"Input.js","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n  // Reset\n  appearance: 'none',\n  borderWidth: '0',\n  boxSizing: 'border-box',\n  fontFamily: '$rubik',\n  margin: '0',\n  outline: 'none',\n  padding: '0',\n  width: '100%',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n  // Custom\n  position: 'relative',\n  backgroundColor: 'transparent',\n  borderRadius: 'inherit', // inherit border radius from InputWrapper\n  boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n  color: '$inputText',\n  fontVariantNumeric: 'tabular-nums',\n  transition: 'box-shadow .1s ease-in-out',\n\n  '&[type=\"number\"]': {\n    pr: '0', // remove padding for number native controls\n  },\n\n  '&:-webkit-autofill,&:autofill': {\n    boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\n  },\n\n  '&:-webkit-autofill::first-line,&:autofill::first-line': {\n    fontFamily: '$rubik',\n    color: '$hiContrast',\n  },\n\n  '&:focus-visible': {\n    boxShadow: `inset 0 0 0 2px $colors$inputFocusBorder, ${FOCUS_SHADOW}`,\n  },\n\n  '&::placeholder': {\n    color: '$inputPlaceholder',\n  },\n\n  '&:read-only:not(:disabled)': {\n    boxShadow: 'none',\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    color: '$inputDisabledText',\n  },\n\n  variants: {\n    size: {\n      small: {\n        height: SMALL_HEIGHT,\n        fontSize: '$1',\n        px: '$2',\n        lineHeight: '$sizes$5',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$1',\n        },\n      },\n      medium: {\n        height: MEDIUM_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$6',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n      large: {\n        height: LARGE_HEIGHT,\n        fontSize: '$3',\n        px: '$3',\n        lineHeight: '$sizes$7',\n        '&:-webkit-autofill::first-line,&:autofill::first-line': {\n          fontSize: '$3',\n        },\n      },\n    },\n    startAdornment: {\n      true: {},\n    },\n    endAdornment: {\n      true: {},\n    },\n    variant: {\n      ghost: {\n        boxShadow: 'none',\n        '&:disabled': {\n          boxShadow: 'none',\n        },\n        backgroundColor: 'transparent',\n        '&:focus-visible': {\n          backgroundColor: '$loContrast',\n        },\n      },\n    },\n    state: {\n      invalid: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n        '&:focus-visible': {\n          boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\n        },\n      },\n    },\n    cursor: {\n      default: {\n        cursor: 'default',\n        '@hover': {\n          '&:hover:not(:read-only)': {\n            cursor: 'text',\n          },\n        },\n        '&:focus-visible:not(:read-only)': {\n          cursor: 'text',\n        },\n      },\n      text: {\n        cursor: 'text',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    cursor: 'default',\n  },\n  compoundVariants: [\n    {\n      variant: 'ghost',\n      state: 'invalid',\n      css: {\n        boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineStart: 'calc($2 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      startAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineStart: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      css: {\n        paddingInlineEnd: 'calc($2 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      css: {\n        paddingInlineEnd: 'calc($3 + 15px)',\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'small',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'medium',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n    {\n      endAdornment: true,\n      size: 'large',\n      state: 'invalid',\n      css: {\n        paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n      },\n    },\n  ],\n});\n\nconst InputWrapper = styled('div', {\n  // Reset\n  outline: 'none',\n  lineHeight: 0,\n\n  position: 'relative',\n  backgroundColor: '$inputBg',\n  color: '$inputPlaceholder',\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n  },\n\n  '&:focus-visible': {\n    '&::before': {\n      backgroundColor: '$inputFocusBg',\n    },\n    '&::after': {\n      backgroundColor: '$primary',\n      opacity: 0.15,\n    },\n  },\n\n  '@hover': {\n    '&:hover': {\n      '&::before': {\n        backgroundColor: '$inputHoverBg',\n      },\n      '&::after': {\n        backgroundColor: '$primary',\n        opacity: 0.05,\n      },\n    },\n  },\n\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.7,\n        color: '$inputDisabledText',\n        '@hover': {\n          '&:hover': {\n            '&::before': {\n              backgroundColor: 'inherit',\n            },\n            '&::after': {\n              backgroundColor: 'inherit',\n            },\n          },\n        },\n      },\n    },\n    state: {\n      invalid: {\n        '@hover': {\n          '&:hover': {\n            '&::after': {\n              backgroundColor: '$inputInvalidBorder',\n            },\n          },\n        },\n      },\n    },\n    size: {\n      small: {\n        borderRadius: '$2',\n        '&::before, &::after': {\n          borderRadius: '$2',\n        },\n      },\n      medium: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n      large: {\n        borderRadius: '$3',\n        '&::before, &::after': {\n          borderRadius: '$3',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n    disabled: false,\n  },\n});\n\nconst AdornmentWrapper = styled('div', {\n  position: 'absolute',\n  top: 0,\n  height: '100%',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  variants: {\n    size: {\n      small: {\n        mx: 'calc($2 / 2)',\n      },\n      medium: {\n        mx: 'calc($3 / 2)',\n      },\n      large: {\n        mx: 'calc($3 / 2)',\n      },\n    },\n    variant: {\n      start: {\n        left: 0,\n      },\n      end: {\n        right: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n  left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n  right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n  startAdornment?: React.ReactNode;\n  endAdornment?: React.ReactNode;\n  type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n  clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n  ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n    const inputRef = React.useRef<InputHandle>(null);\n\n    React.useImperativeHandle(\n      forwardedRef,\n      () => {\n        const { current } = inputRef;\n        if (current) {\n          current.clear = () => {\n            current.value = '';\n          };\n        }\n        return current as InputHandle;\n      },\n      [inputRef]\n    );\n\n    const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n    const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n    return (\n      <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n        {hasStartAdornment && (\n          <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n        )}\n\n        <StyledInput\n          ref={inputRef}\n          startAdornment={hasStartAdornment}\n          endAdornment={hasEndAdornment}\n          size={size}\n          {...props}\n        />\n        {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n      </InputWrapper>\n    );\n  }\n);\n"],"mappings":";;;;;AAMA,IAAM,eAAe,kBAAkB,EAAE,CAAC;AAM1C,IAAM,cAAc,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,IACN;CAEA,iCAAiC,EAC/B,WAAW,yEACb;CAEA,yDAAyD;EACvD,YAAY;EACZ,OAAO;CACT;CAEA,mBAAmB,EACjB,WAAW,6CAA6C,eAC1D;CAEA,kBAAkB,EAChB,OAAO,oBACT;CAEA,8BAA8B,EAC5B,WAAW,OACb;CAEA,cAAc;EACZ,eAAe;EACf,OAAO;CACT;CAEA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,QAAQ;IACN,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;GACA,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,KACZ;GACF;EACF;EACA,gBAAgB,EACd,MAAM,CAAC,EACT;EACA,cAAc,EACZ,MAAM,CAAC,EACT;EACA,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,OACb;GACA,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,cACnB;EACF,EACF;EACA,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,eAC5D;EACF,EACF;EACA,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,OACV,EACF;IACA,mCAAmC,EACjC,QAAQ,OACV;GACF;GACA,MAAM,EACJ,QAAQ,OACV;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,QAAQ;CACV;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,6CACb;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,kBACtB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;EACA;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,kBACpB;EACF;CACF;AACF,CAAC;AAED,IAAM,eAAe,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;CACjB;CAEA,mBAAmB;EACjB,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF;CAEA,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,gBACnB;EACA,YAAY;GACV,iBAAiB;GACjB,SAAS;EACX;CACF,EACF;CAEA,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,UACnB;IACA,YAAY,EACV,iBAAiB,UACnB;GACF,EACF;EACF,EACF;EACA,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,sBACnB,EACF,EACF,EACF,EACF;EACA,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;GACA,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,KAChB;GACF;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,UAAU;CACZ;AACF,CAAC;AAED,IAAM,mBAAmB,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,eACN;GACA,QAAQ,EACN,IAAI,eACN;GACA,OAAO,EACL,IAAI,eACN;EACF;EACA,SAAS;GACP,OAAO,EACL,MAAM,EACR;GACA,KAAK,EACH,OAAO,EACT;EACF;CACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAED,IAAM,wBAAwB,OAAO,kBAAkB,EACrD,MAAM,EACR,CAAC;AAED,IAAM,sBAAsB,OAAO,kBAAkB,EACnD,OAAO,EACT,CAAC;AAgBD,IAAa,QAAQ,MAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAM,OAAoB,IAAI;CAE/C,MAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,cAAc;GACpB,QAAQ,QAAQ;EAClB;EAEF,OAAO;CACT,GACA,CAAC,QAAQ,CACX;CAEA,MAAM,oBAAoB,MAAM,cAAc,QAAQ,cAAc,GAAG,CAAC,cAAc,CAAC;CAEvF,MAAM,kBAAkB,MAAM,cAAc,QAAQ,YAAY,GAAG,CAAC,YAAY,CAAC;CAEjF,OACE,qBAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;EAA/D,UAAA;GACG,qBACC,oBAAC,uBAAD;IAA6B;IAAO,UAAA;GAAsC,CAAA;GAG5E,oBAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;GACL,CAAA;GACA,mBAAmB,oBAAC,qBAAD;IAA2B;IAAO,UAAA;GAAkC,CAAA;EAC5E;;AAElB,CACF"}

package/dist/components/Input/Input.theme.cjs

@@ -1,7 +1,7 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 let tinycolor2 = require("tinycolor2");
 tinycolor2 = require_runtime.__toESM(tinycolor2, 1);
-//#region components/Input/Input.theme.ts
+// components/Input/Input.theme.ts
 var inputLightTheme = {
 	inputBg: "hsl(240, 14.0%, 99.0%)",
 	inputBorder: "hsl(208, 9.0%, 73.0%)",
@@ -24,7 +24,6 @@ var inputDarkTheme = {
 	inputDisabledText: (0, tinycolor2.default)("white").setAlpha(.35).toHslString(),
 	inputInvalidBorder: "hsl(358, 75%, 59%)"
 };
-//#endregion
 exports.inputDarkTheme = inputDarkTheme;
 exports.inputLightTheme = inputLightTheme;
 

package/dist/components/Input/Input.theme.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.theme.cjs","names":[],"sources":["../../../components/Input/Input.theme.ts"],"sourcesContent":["import tinycolor from 'tinycolor2';\n\n// Plain TypeScript color tokens (no vanilla-extract)\n// Using default blue primary color for static tokens\nexport const inputLightTheme = {\n  inputBg: 'hsl(240, 14.0%, 99.0%)', // $deepBlue1\n  inputBorder: 'hsl(208, 9.0%, 73.0%)', // $grayBlue9\n  inputFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n  inputFocusBorder: 'hsl(206, 100%, 50%)', // blue8\n  inputHoverBg: 'hsla(0, 0%, 100%, 0.372)', // $whiteA9\n  inputText: tinycolor('black').setAlpha(0.74).toHslString(),\n  inputPlaceholder: 'hsla(0, 0%, 0%, 0.498)', // $blackA10\n  inputDisabledText: tinycolor('black').setAlpha(0.35).toHslString(),\n  inputInvalidBorder: 'hsl(358, 75%, 59%)', // $red9\n};\n\nexport const inputDarkTheme = {\n  inputBg: 'hsl(209, 38.0%, 12.0%)', // $grayBlue7 dark\n  inputBorder: 'hsl(208, 11.0%, 45.0%)', // $grayBlue9 dark\n  inputFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n  inputFocusBorder: 'hsl(206, 100%, 70%)', // blue11\n  inputHoverBg: 'hsla(0, 0%, 100%, 0.104)', // $whiteA4\n  inputText: tinycolor('white').setAlpha(0.8).toHslString(),\n  inputPlaceholder: 'hsla(0, 0%, 100%, 0.455)', // $whiteA10\n  inputDisabledText: tinycolor('white').setAlpha(0.35).toHslString(),\n  inputInvalidBorder: 'hsl(358, 75%, 59%)', // $red9\n};\n"],"mappings":";;;;AAIA,IAAa,kBAAkB;CAC7B,SAAS;CACT,aAAa;CACb,eAAA,GAAA,WAAA,QAAA,CAAwB,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAC5D,kBAAkB;CAClB,cAAc;CACd,YAAA,GAAA,WAAA,QAAA,CAAqB,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CACzD,kBAAkB;CAClB,oBAAA,GAAA,WAAA,QAAA,CAA6B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CACjE,oBAAoB;AACtB;AAEA,IAAa,iBAAiB;CAC5B,SAAS;CACT,aAAa;CACb,eAAA,GAAA,WAAA,QAAA,CAAwB,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAC5D,kBAAkB;CAClB,cAAc;CACd,YAAA,GAAA,WAAA,QAAA,CAAqB,OAAO,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;CACxD,kBAAkB;CAClB,oBAAA,GAAA,WAAA,QAAA,CAA6B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CACjE,oBAAoB;AACtB"}
+{"version":3,"file":"Input.theme.cjs","names":["tinycolor"],"sources":["../../../components/Input/Input.theme.ts"],"sourcesContent":["import tinycolor from 'tinycolor2';\n\n// Plain TypeScript color tokens (no vanilla-extract)\n// Using default blue primary color for static tokens\nexport const inputLightTheme = {\n  inputBg: 'hsl(240, 14.0%, 99.0%)', // $deepBlue1\n  inputBorder: 'hsl(208, 9.0%, 73.0%)', // $grayBlue9\n  inputFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n  inputFocusBorder: 'hsl(206, 100%, 50%)', // blue8\n  inputHoverBg: 'hsla(0, 0%, 100%, 0.372)', // $whiteA9\n  inputText: tinycolor('black').setAlpha(0.74).toHslString(),\n  inputPlaceholder: 'hsla(0, 0%, 0%, 0.498)', // $blackA10\n  inputDisabledText: tinycolor('black').setAlpha(0.35).toHslString(),\n  inputInvalidBorder: 'hsl(358, 75%, 59%)', // $red9\n};\n\nexport const inputDarkTheme = {\n  inputBg: 'hsl(209, 38.0%, 12.0%)', // $grayBlue7 dark\n  inputBorder: 'hsl(208, 11.0%, 45.0%)', // $grayBlue9 dark\n  inputFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n  inputFocusBorder: 'hsl(206, 100%, 70%)', // blue11\n  inputHoverBg: 'hsla(0, 0%, 100%, 0.104)', // $whiteA4\n  inputText: tinycolor('white').setAlpha(0.8).toHslString(),\n  inputPlaceholder: 'hsla(0, 0%, 100%, 0.455)', // $whiteA10\n  inputDisabledText: tinycolor('white').setAlpha(0.35).toHslString(),\n  inputInvalidBorder: 'hsl(358, 75%, 59%)', // $red9\n};\n"],"mappings":";;;;AAIA,IAAa,kBAAkB;CAC7B,SAAS;CACT,aAAa;CACb,eAAA,GAAcA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAC5D,kBAAkB;CAClB,cAAc;CACd,YAAA,GAAWA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CACzD,kBAAkB;CAClB,oBAAA,GAAmBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CACjE,oBAAoB;AACtB;AAEA,IAAa,iBAAiB;CAC5B,SAAS;CACT,aAAa;CACb,eAAA,GAAcA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAC5D,kBAAkB;CAClB,cAAc;CACd,YAAA,GAAWA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;CACxD,kBAAkB;CAClB,oBAAA,GAAmBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CACjE,oBAAoB;AACtB"}

package/dist/components/Input/Input.theme.js

@@ -1,5 +1,5 @@
 import tinycolor from "tinycolor2";
-//#region components/Input/Input.theme.ts
+// components/Input/Input.theme.ts
 var inputLightTheme = {
 	inputBg: "hsl(240, 14.0%, 99.0%)",
 	inputBorder: "hsl(208, 9.0%, 73.0%)",
@@ -22,7 +22,6 @@ var inputDarkTheme = {
 	inputDisabledText: tinycolor("white").setAlpha(.35).toHslString(),
 	inputInvalidBorder: "hsl(358, 75%, 59%)"
 };
-//#endregion
 export { inputDarkTheme, inputLightTheme };
 
 //# sourceMappingURL=Input.theme.js.map