@traefik-labs/faency 12.3.8 → 13.0.0

package/dist/components/FaencyProvider.js

@@ -2,9 +2,8 @@ import { ColorSchemeProvider } from "./colorSchemeContext.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { Provider } from "@radix-ui/react-tooltip";
-//#region components/FaencyProvider.tsx
+// components/FaencyProvider.tsx
 var FaencyProvider = ({ children }) => /* @__PURE__ */ jsx(Provider, { children: /* @__PURE__ */ jsx(ColorSchemeProvider, { children }) });
-//#endregion
 export { FaencyProvider };
 
 //# sourceMappingURL=FaencyProvider.js.map

package/dist/components/FaencyProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"FaencyProvider.js","names":[],"sources":["../../components/FaencyProvider.tsx"],"sourcesContent":["import { Provider as TooltipProvider } from '@radix-ui/react-tooltip';\nimport React from 'react';\n\nimport { ColorSchemeProvider } from './colorSchemeContext';\n\ninterface FaencyProviderProps {\n  children?: React.ReactNode;\n}\n\nexport const FaencyProvider = ({ children }: FaencyProviderProps) => (\n  <TooltipProvider>\n    <ColorSchemeProvider>{children}</ColorSchemeProvider>\n  </TooltipProvider>\n);\n"],"mappings":";;;;;AASA,IAAa,kBAAkB,EAAE,eAC/B,oBAAC,UAAD,EAAA,UACE,oBAAC,qBAAD,EAAsB,SAA8B,CAAA,EACrC,CAAA"}
+{"version":3,"file":"FaencyProvider.js","names":["TooltipProvider"],"sources":["../../components/FaencyProvider.tsx"],"sourcesContent":["import { Provider as TooltipProvider } from '@radix-ui/react-tooltip';\nimport React from 'react';\n\nimport { ColorSchemeProvider } from './colorSchemeContext';\n\ninterface FaencyProviderProps {\n  children?: React.ReactNode;\n}\n\nexport const FaencyProvider = ({ children }: FaencyProviderProps) => (\n  <TooltipProvider>\n    <ColorSchemeProvider>{children}</ColorSchemeProvider>\n  </TooltipProvider>\n);\n"],"mappings":";;;;;AASA,IAAa,kBAAkB,EAAE,eAC/B,oBAACA,UAAD,EAAA,UACE,oBAAC,qBAAD,EAAsB,SAA8B,CAAA,EACrC,CAAA"}

package/dist/components/Flex/Flex.cjs

@@ -1,4 +1,4 @@
-//#region components/Flex/Flex.tsx
+// components/Flex/Flex.tsx
 var Flex = require("../../stitches.config.cjs").styled("div", {
 	boxSizing: "border-box",
 	display: "flex",
@@ -52,7 +52,6 @@ var Flex = require("../../stitches.config.cjs").styled("div", {
 		wrap: "noWrap"
 	}
 });
-//#endregion
 exports.Flex = Flex;
 
 //# sourceMappingURL=Flex.cjs.map

package/dist/components/Flex/Flex.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.cjs","names":[],"sources":["../../../components/Flex/Flex.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Flex = styled('div', {\n  boxSizing: 'border-box',\n  display: 'flex',\n\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n      },\n      column: {\n        flexDirection: 'column',\n      },\n      rowReverse: {\n        flexDirection: 'row-reverse',\n      },\n      columnReverse: {\n        flexDirection: 'column-reverse',\n      },\n    },\n    align: {\n      start: {\n        alignItems: 'flex-start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'flex-end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n      ['space-evenly']: {\n        alignItems: 'space-evenly',\n      },\n      ['space-between']: {\n        alignItems: 'space-between',\n      },\n      ['space-around']: {\n        alignItems: 'space-around',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'flex-start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'flex-end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n      ['space-evenly']: {\n        justifyContent: 'space-evenly',\n      },\n      ['space-between']: {\n        justifyContent: 'space-between',\n      },\n      ['space-around']: {\n        justifyContent: 'space-around',\n      },\n    },\n    wrap: {\n      noWrap: {\n        flexWrap: 'nowrap',\n      },\n      wrap: {\n        flexWrap: 'wrap',\n      },\n      wrapReverse: {\n        flexWrap: 'wrap-reverse',\n      },\n    },\n    gap: {\n      1: {\n        gap: '$1',\n      },\n      2: {\n        gap: '$2',\n      },\n      3: {\n        gap: '$3',\n      },\n      4: {\n        gap: '$4',\n      },\n      5: {\n        gap: '$5',\n      },\n      6: {\n        gap: '$6',\n      },\n      7: {\n        gap: '$7',\n      },\n      8: {\n        gap: '$8',\n      },\n      9: {\n        gap: '$9',\n      },\n    },\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap',\n  },\n});\n"],"mappings":";AAEA,IAAa,0CAAO,CAAA,CAAA,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,WAAW;GACT,KAAK,EACH,eAAe,MACjB;GACA,QAAQ,EACN,eAAe,SACjB;GACA,YAAY,EACV,eAAe,cACjB;GACA,eAAe,EACb,eAAe,iBACjB;EACF;EACA,OAAO;GACL,OAAO,EACL,YAAY,aACd;GACA,QAAQ,EACN,YAAY,SACd;GACA,KAAK,EACH,YAAY,WACd;GACA,SAAS,EACP,YAAY,UACd;GACA,UAAU,EACR,YAAY,WACd;IACC,iBAAiB,EAChB,YAAY,eACd;IACC,kBAAkB,EACjB,YAAY,gBACd;IACC,iBAAiB,EAChB,YAAY,eACd;EACF;EACA,SAAS;GACP,OAAO,EACL,gBAAgB,aAClB;GACA,QAAQ,EACN,gBAAgB,SAClB;GACA,KAAK,EACH,gBAAgB,WAClB;GACA,SAAS,EACP,gBAAgB,gBAClB;IACC,iBAAiB,EAChB,gBAAgB,eAClB;IACC,kBAAkB,EACjB,gBAAgB,gBAClB;IACC,iBAAiB,EAChB,gBAAgB,eAClB;EACF;EACA,MAAM;GACJ,QAAQ,EACN,UAAU,SACZ;GACA,MAAM,EACJ,UAAU,OACZ;GACA,aAAa,EACX,UAAU,eACZ;EACF;EACA,KAAK;GACH,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;EACF;CACF;CACA,iBAAiB;EACf,WAAW;EACX,OAAO;EACP,SAAS;EACT,MAAM;CACR;AACF,CAAC"}
+{"version":3,"file":"Flex.cjs","names":["styled"],"sources":["../../../components/Flex/Flex.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Flex = styled('div', {\n  boxSizing: 'border-box',\n  display: 'flex',\n\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n      },\n      column: {\n        flexDirection: 'column',\n      },\n      rowReverse: {\n        flexDirection: 'row-reverse',\n      },\n      columnReverse: {\n        flexDirection: 'column-reverse',\n      },\n    },\n    align: {\n      start: {\n        alignItems: 'flex-start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'flex-end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n      ['space-evenly']: {\n        alignItems: 'space-evenly',\n      },\n      ['space-between']: {\n        alignItems: 'space-between',\n      },\n      ['space-around']: {\n        alignItems: 'space-around',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'flex-start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'flex-end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n      ['space-evenly']: {\n        justifyContent: 'space-evenly',\n      },\n      ['space-between']: {\n        justifyContent: 'space-between',\n      },\n      ['space-around']: {\n        justifyContent: 'space-around',\n      },\n    },\n    wrap: {\n      noWrap: {\n        flexWrap: 'nowrap',\n      },\n      wrap: {\n        flexWrap: 'wrap',\n      },\n      wrapReverse: {\n        flexWrap: 'wrap-reverse',\n      },\n    },\n    gap: {\n      1: {\n        gap: '$1',\n      },\n      2: {\n        gap: '$2',\n      },\n      3: {\n        gap: '$3',\n      },\n      4: {\n        gap: '$4',\n      },\n      5: {\n        gap: '$5',\n      },\n      6: {\n        gap: '$6',\n      },\n      7: {\n        gap: '$7',\n      },\n      8: {\n        gap: '$8',\n      },\n      9: {\n        gap: '$9',\n      },\n    },\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap',\n  },\n});\n"],"mappings":";AAEA,IAAa,O,mCAAOA,CAAAA,CAAAA,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,WAAW;GACT,KAAK,EACH,eAAe,MACjB;GACA,QAAQ,EACN,eAAe,SACjB;GACA,YAAY,EACV,eAAe,cACjB;GACA,eAAe,EACb,eAAe,iBACjB;EACF;EACA,OAAO;GACL,OAAO,EACL,YAAY,aACd;GACA,QAAQ,EACN,YAAY,SACd;GACA,KAAK,EACH,YAAY,WACd;GACA,SAAS,EACP,YAAY,UACd;GACA,UAAU,EACR,YAAY,WACd;IACC,iBAAiB,EAChB,YAAY,eACd;IACC,kBAAkB,EACjB,YAAY,gBACd;IACC,iBAAiB,EAChB,YAAY,eACd;EACF;EACA,SAAS;GACP,OAAO,EACL,gBAAgB,aAClB;GACA,QAAQ,EACN,gBAAgB,SAClB;GACA,KAAK,EACH,gBAAgB,WAClB;GACA,SAAS,EACP,gBAAgB,gBAClB;IACC,iBAAiB,EAChB,gBAAgB,eAClB;IACC,kBAAkB,EACjB,gBAAgB,gBAClB;IACC,iBAAiB,EAChB,gBAAgB,eAClB;EACF;EACA,MAAM;GACJ,QAAQ,EACN,UAAU,SACZ;GACA,MAAM,EACJ,UAAU,OACZ;GACA,aAAa,EACX,UAAU,eACZ;EACF;EACA,KAAK;GACH,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;EACF;CACF;CACA,iBAAiB;EACf,WAAW;EACX,OAAO;EACP,SAAS;EACT,MAAM;CACR;AACF,CAAC"}

package/dist/components/Flex/Flex.js

@@ -1,5 +1,5 @@
 import { styled } from "../../stitches.config.js";
-//#region components/Flex/Flex.tsx
+// components/Flex/Flex.tsx
 var Flex = styled("div", {
 	boxSizing: "border-box",
 	display: "flex",
@@ -53,7 +53,6 @@ var Flex = styled("div", {
 		wrap: "noWrap"
 	}
 });
-//#endregion
 export { Flex };
 
 //# sourceMappingURL=Flex.js.map

package/dist/components/Flex/Flex.vanilla.cjs

@@ -6,7 +6,7 @@ let react = require("react");
 react = require_runtime.__toESM(react, 1);
 let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/Flex/Flex.vanilla.tsx
+// components/Flex/Flex.vanilla.tsx
 var FlexVanillaComponent = react.default.forwardRef(({ as, className, css, style, direction, align, justify, wrap, gap, ...props }, ref) => {
 	const Component = as || "div";
 	const { colors } = require_themeContext.useVanillaExtractTheme();
@@ -16,22 +16,22 @@ var FlexVanillaComponent = react.default.forwardRef(({ as, className, css, style
 		...style,
 		...(0, _vanilla_extract_dynamic.assignInlineVars)(vars)
 	};
+	const recipeClass = require_Flex_vanilla_css.flexRecipe({
+		direction,
+		align,
+		justify,
+		wrap,
+		gap
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
 		ref,
-		className: `${require_Flex_vanilla_css.flexRecipe({
-			direction,
-			align,
-			justify,
-			wrap,
-			gap
-		})} ${className || ""}`.trim(),
+		className: `${recipeClass} ${className || ""}`.trim(),
 		style: mergedStyles,
 		...props
 	});
 });
 FlexVanillaComponent.displayName = "FlexVanilla";
 var FlexVanilla = FlexVanillaComponent;
-//#endregion
 exports.FlexVanilla = FlexVanilla;
 exports.FlexVanillaComponent = FlexVanillaComponent;
 

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.vanilla.cjs","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type {\n  FlexAlignSimplified,\n  FlexDirection,\n  FlexJustifySimplified,\n  Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n  direction?: FlexDirection;\n  align?: FlexAlignSimplified;\n  justify?: FlexJustifySimplified;\n  wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n  gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\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 = flexRecipe({ direction, align, justify, wrap, gap });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;;;AA6BA,IAAa,uBAAuB,MAAA,QAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,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,yBAAA,WAAW;GAAE;GAAW;GAAO;GAAS;GAAM;EAAI,CAKpD,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
+{"version":3,"file":"Flex.vanilla.cjs","names":["React","useVanillaExtractTheme","processCSSProp","assignInlineVars","flexRecipe"],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type {\n  FlexAlignSimplified,\n  FlexDirection,\n  FlexJustifySimplified,\n  Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n  direction?: FlexDirection;\n  align?: FlexAlignSimplified;\n  justify?: FlexJustifySimplified;\n  wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n  gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\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 = flexRecipe({ direction, align, justify, wrap, gap });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;;;AA6BA,IAAa,uBAAuBA,MAAAA,QAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,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,yBAAAA,WAAW;EAAE;EAAW;EAAO;EAAS;EAAM;CAAI,CAAC;CAEvE,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,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}

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

@@ -1,7 +1,7 @@
 ;/* empty css                                       */
 ;/* empty css                                      */
 ;/* empty css                                  */
-//#region components/Flex/Flex.vanilla.css.ts
+// components/Flex/Flex.vanilla.css.ts
 var flexRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").createRuntimeFn)({
 	defaultClassName: "qtrdwq1 qtrdwq0",
 	variantClassNames: {
@@ -51,7 +51,6 @@ var flexRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").createR
 	},
 	compoundVariants: []
 });
-//#endregion
 exports.flexRecipe = flexRecipe;
 
 //# sourceMappingURL=Flex.vanilla.css.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.vanilla.css.cjs","names":[],"sources":["../../../components/Flex/Flex.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst flex = style({\n  boxSizing: 'border-box',\n  display: 'flex',\n});\n\nexport const flexRecipe = recipe({\n  base: flex,\n\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n      },\n      column: {\n        flexDirection: 'column',\n      },\n      rowReverse: {\n        flexDirection: 'row-reverse',\n      },\n      columnReverse: {\n        flexDirection: 'column-reverse',\n      },\n    },\n    align: {\n      start: {\n        alignItems: 'flex-start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'flex-end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'flex-start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'flex-end',\n      },\n      ['space-evenly']: {\n        justifyContent: 'space-evenly',\n      },\n      ['space-between']: {\n        justifyContent: 'space-between',\n      },\n      ['space-around']: {\n        justifyContent: 'space-around',\n      },\n    },\n    wrap: {\n      noWrap: {\n        flexWrap: 'nowrap',\n      },\n      wrap: {\n        flexWrap: 'wrap',\n      },\n      wrapReverse: {\n        flexWrap: 'wrap-reverse',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap',\n  },\n});\n"],"mappings":""}
+{"version":3,"file":"Flex.vanilla.css.cjs","names":["_7a468"],"sources":["../../../components/Flex/Flex.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst flex = style({\n  boxSizing: 'border-box',\n  display: 'flex',\n});\n\nexport const flexRecipe = recipe({\n  base: flex,\n\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n      },\n      column: {\n        flexDirection: 'column',\n      },\n      rowReverse: {\n        flexDirection: 'row-reverse',\n      },\n      columnReverse: {\n        flexDirection: 'column-reverse',\n      },\n    },\n    align: {\n      start: {\n        alignItems: 'flex-start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'flex-end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'flex-start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'flex-end',\n      },\n      ['space-evenly']: {\n        justifyContent: 'space-evenly',\n      },\n      ['space-between']: {\n        justifyContent: 'space-between',\n      },\n      ['space-around']: {\n        justifyContent: 'space-around',\n      },\n    },\n    wrap: {\n      noWrap: {\n        flexWrap: 'nowrap',\n      },\n      wrap: {\n        flexWrap: 'wrap',\n      },\n      wrapReverse: {\n        flexWrap: 'wrap-reverse',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap',\n  },\n});\n"],"mappings":""}

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

@@ -2,7 +2,7 @@
 /* empty css                                    */
 /* empty css                                */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
-//#region components/Flex/Flex.vanilla.css.ts
+// components/Flex/Flex.vanilla.css.ts
 var flexRecipe = createRuntimeFn({
 	defaultClassName: "qtrdwq1 qtrdwq0",
 	variantClassNames: {
@@ -52,7 +52,6 @@ var flexRecipe = createRuntimeFn({
 	},
 	compoundVariants: []
 });
-//#endregion
 export { flexRecipe };
 
 //# sourceMappingURL=Flex.vanilla.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.vanilla.css.js","names":[],"sources":["../../../components/Flex/Flex.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst flex = style({\n  boxSizing: 'border-box',\n  display: 'flex',\n});\n\nexport const flexRecipe = recipe({\n  base: flex,\n\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n      },\n      column: {\n        flexDirection: 'column',\n      },\n      rowReverse: {\n        flexDirection: 'row-reverse',\n      },\n      columnReverse: {\n        flexDirection: 'column-reverse',\n      },\n    },\n    align: {\n      start: {\n        alignItems: 'flex-start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'flex-end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'flex-start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'flex-end',\n      },\n      ['space-evenly']: {\n        justifyContent: 'space-evenly',\n      },\n      ['space-between']: {\n        justifyContent: 'space-between',\n      },\n      ['space-around']: {\n        justifyContent: 'space-around',\n      },\n    },\n    wrap: {\n      noWrap: {\n        flexWrap: 'nowrap',\n      },\n      wrap: {\n        flexWrap: 'wrap',\n      },\n      wrapReverse: {\n        flexWrap: 'wrap-reverse',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap',\n  },\n});\n"],"mappings":""}
+{"version":3,"file":"Flex.vanilla.css.js","names":["_7a468"],"sources":["../../../components/Flex/Flex.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst flex = style({\n  boxSizing: 'border-box',\n  display: 'flex',\n});\n\nexport const flexRecipe = recipe({\n  base: flex,\n\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n      },\n      column: {\n        flexDirection: 'column',\n      },\n      rowReverse: {\n        flexDirection: 'row-reverse',\n      },\n      columnReverse: {\n        flexDirection: 'column-reverse',\n      },\n    },\n    align: {\n      start: {\n        alignItems: 'flex-start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'flex-end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'flex-start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'flex-end',\n      },\n      ['space-evenly']: {\n        justifyContent: 'space-evenly',\n      },\n      ['space-between']: {\n        justifyContent: 'space-between',\n      },\n      ['space-around']: {\n        justifyContent: 'space-around',\n      },\n    },\n    wrap: {\n      noWrap: {\n        flexWrap: 'nowrap',\n      },\n      wrap: {\n        flexWrap: 'wrap',\n      },\n      wrapReverse: {\n        flexWrap: 'wrap-reverse',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap',\n  },\n});\n"],"mappings":""}

package/dist/components/Flex/Flex.vanilla.js

@@ -4,7 +4,7 @@ import { flexRecipe } from "./Flex.vanilla.css.js";
 import React from "react";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx } from "react/jsx-runtime";
-//#region components/Flex/Flex.vanilla.tsx
+// components/Flex/Flex.vanilla.tsx
 var FlexVanillaComponent = React.forwardRef(({ as, className, css, style, direction, align, justify, wrap, gap, ...props }, ref) => {
 	const Component = as || "div";
 	const { colors } = useVanillaExtractTheme();
@@ -14,22 +14,22 @@ var FlexVanillaComponent = React.forwardRef(({ as, className, css, style, direct
 		...style,
 		...assignInlineVars(vars)
 	};
+	const recipeClass = flexRecipe({
+		direction,
+		align,
+		justify,
+		wrap,
+		gap
+	});
 	return /* @__PURE__ */ jsx(Component, {
 		ref,
-		className: `${flexRecipe({
-			direction,
-			align,
-			justify,
-			wrap,
-			gap
-		})} ${className || ""}`.trim(),
+		className: `${recipeClass} ${className || ""}`.trim(),
 		style: mergedStyles,
 		...props
 	});
 });
 FlexVanillaComponent.displayName = "FlexVanilla";
 var FlexVanilla = FlexVanillaComponent;
-//#endregion
 export { FlexVanilla, FlexVanillaComponent };
 
 //# sourceMappingURL=Flex.vanilla.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.vanilla.js","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type {\n  FlexAlignSimplified,\n  FlexDirection,\n  FlexJustifySimplified,\n  Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n  direction?: FlexDirection;\n  align?: FlexAlignSimplified;\n  justify?: FlexJustifySimplified;\n  wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n  gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\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 = flexRecipe({ direction, align, justify, wrap, gap });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;AA6BA,IAAa,uBAAuB,MAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,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,WAAW;GAAE;GAAW;GAAO;GAAS;GAAM;EAAI,CAKpD,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
+{"version":3,"file":"Flex.vanilla.js","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type {\n  FlexAlignSimplified,\n  FlexDirection,\n  FlexJustifySimplified,\n  Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n  direction?: FlexDirection;\n  align?: FlexAlignSimplified;\n  justify?: FlexJustifySimplified;\n  wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n  gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\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 = flexRecipe({ direction, align, justify, wrap, gap });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;AA6BA,IAAa,uBAAuB,MAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,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,WAAW;EAAE;EAAW;EAAO;EAAS;EAAM;CAAI,CAAC;CAEvE,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}

package/dist/components/Grid/Grid.cjs

@@ -1,4 +1,4 @@
-//#region components/Grid/Grid.tsx
+// components/Grid/Grid.tsx
 var Grid = require("../../stitches.config.cjs").styled("div", {
 	boxSizing: "border-box",
 	display: "grid",
@@ -64,7 +64,6 @@ var Grid = require("../../stitches.config.cjs").styled("div", {
 		}
 	}
 });
-//#endregion
 exports.Grid = Grid;
 
 //# sourceMappingURL=Grid.cjs.map

package/dist/components/Grid/Grid.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.cjs","names":[],"sources":["../../../components/Grid/Grid.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Grid = styled('div', {\n  boxSizing: 'border-box',\n  display: 'grid',\n\n  variants: {\n    align: {\n      start: {\n        alignItems: 'start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n    },\n    flow: {\n      row: {\n        gridAutoFlow: 'row',\n      },\n      column: {\n        gridAutoFlow: 'column',\n      },\n      dense: {\n        gridAutoFlow: 'dense',\n      },\n      rowDense: {\n        gridAutoFlow: 'row dense',\n      },\n      columnDense: {\n        gridAutoFlow: 'column dense',\n      },\n    },\n    columns: {\n      1: {\n        gridTemplateColumns: 'repeat(1, 1fr)',\n      },\n      2: {\n        gridTemplateColumns: 'repeat(2, 1fr)',\n      },\n      3: {\n        gridTemplateColumns: 'repeat(3, 1fr)',\n      },\n      4: {\n        gridTemplateColumns: 'repeat(4, 1fr)',\n      },\n    },\n    gap: {\n      1: {\n        gap: '$1',\n      },\n      2: {\n        gap: '$2',\n      },\n      3: {\n        gap: '$3',\n      },\n      4: {\n        gap: '$4',\n      },\n      5: {\n        gap: '$5',\n      },\n      6: {\n        gap: '$6',\n      },\n      7: {\n        gap: '$7',\n      },\n      8: {\n        gap: '$8',\n      },\n      9: {\n        gap: '$9',\n      },\n    },\n    gapX: {\n      1: {\n        columnGap: '$1',\n      },\n      2: {\n        columnGap: '$2',\n      },\n      3: {\n        columnGap: '$3',\n      },\n      4: {\n        columnGap: '$4',\n      },\n      5: {\n        columnGap: '$5',\n      },\n      6: {\n        columnGap: '$6',\n      },\n      7: {\n        columnGap: '$7',\n      },\n      8: {\n        columnGap: '$8',\n      },\n      9: {\n        columnGap: '$9',\n      },\n    },\n    gapY: {\n      1: {\n        rowGap: '$1',\n      },\n      2: {\n        rowGap: '$2',\n      },\n      3: {\n        rowGap: '$3',\n      },\n      4: {\n        rowGap: '$4',\n      },\n      5: {\n        rowGap: '$5',\n      },\n      6: {\n        rowGap: '$6',\n      },\n      7: {\n        rowGap: '$7',\n      },\n      8: {\n        rowGap: '$8',\n      },\n      9: {\n        rowGap: '$9',\n      },\n    },\n  },\n});\n"],"mappings":";AAEA,IAAa,0CAAO,CAAA,CAAA,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,OAAO;GACL,OAAO,EACL,YAAY,QACd;GACA,QAAQ,EACN,YAAY,SACd;GACA,KAAK,EACH,YAAY,MACd;GACA,SAAS,EACP,YAAY,UACd;GACA,UAAU,EACR,YAAY,WACd;EACF;EACA,SAAS;GACP,OAAO,EACL,gBAAgB,QAClB;GACA,QAAQ,EACN,gBAAgB,SAClB;GACA,KAAK,EACH,gBAAgB,MAClB;GACA,SAAS,EACP,gBAAgB,gBAClB;EACF;EACA,MAAM;GACJ,KAAK,EACH,cAAc,MAChB;GACA,QAAQ,EACN,cAAc,SAChB;GACA,OAAO,EACL,cAAc,QAChB;GACA,UAAU,EACR,cAAc,YAChB;GACA,aAAa,EACX,cAAc,eAChB;EACF;EACA,SAAS;GACP,GAAG,EACD,qBAAqB,iBACvB;GACA,GAAG,EACD,qBAAqB,iBACvB;GACA,GAAG,EACD,qBAAqB,iBACvB;GACA,GAAG,EACD,qBAAqB,iBACvB;EACF;EACA,KAAK;GACH,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;EACF;EACA,MAAM;GACJ,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;EACF;EACA,MAAM;GACJ,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;EACF;CACF;AACF,CAAC"}
+{"version":3,"file":"Grid.cjs","names":["styled"],"sources":["../../../components/Grid/Grid.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Grid = styled('div', {\n  boxSizing: 'border-box',\n  display: 'grid',\n\n  variants: {\n    align: {\n      start: {\n        alignItems: 'start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n    },\n    flow: {\n      row: {\n        gridAutoFlow: 'row',\n      },\n      column: {\n        gridAutoFlow: 'column',\n      },\n      dense: {\n        gridAutoFlow: 'dense',\n      },\n      rowDense: {\n        gridAutoFlow: 'row dense',\n      },\n      columnDense: {\n        gridAutoFlow: 'column dense',\n      },\n    },\n    columns: {\n      1: {\n        gridTemplateColumns: 'repeat(1, 1fr)',\n      },\n      2: {\n        gridTemplateColumns: 'repeat(2, 1fr)',\n      },\n      3: {\n        gridTemplateColumns: 'repeat(3, 1fr)',\n      },\n      4: {\n        gridTemplateColumns: 'repeat(4, 1fr)',\n      },\n    },\n    gap: {\n      1: {\n        gap: '$1',\n      },\n      2: {\n        gap: '$2',\n      },\n      3: {\n        gap: '$3',\n      },\n      4: {\n        gap: '$4',\n      },\n      5: {\n        gap: '$5',\n      },\n      6: {\n        gap: '$6',\n      },\n      7: {\n        gap: '$7',\n      },\n      8: {\n        gap: '$8',\n      },\n      9: {\n        gap: '$9',\n      },\n    },\n    gapX: {\n      1: {\n        columnGap: '$1',\n      },\n      2: {\n        columnGap: '$2',\n      },\n      3: {\n        columnGap: '$3',\n      },\n      4: {\n        columnGap: '$4',\n      },\n      5: {\n        columnGap: '$5',\n      },\n      6: {\n        columnGap: '$6',\n      },\n      7: {\n        columnGap: '$7',\n      },\n      8: {\n        columnGap: '$8',\n      },\n      9: {\n        columnGap: '$9',\n      },\n    },\n    gapY: {\n      1: {\n        rowGap: '$1',\n      },\n      2: {\n        rowGap: '$2',\n      },\n      3: {\n        rowGap: '$3',\n      },\n      4: {\n        rowGap: '$4',\n      },\n      5: {\n        rowGap: '$5',\n      },\n      6: {\n        rowGap: '$6',\n      },\n      7: {\n        rowGap: '$7',\n      },\n      8: {\n        rowGap: '$8',\n      },\n      9: {\n        rowGap: '$9',\n      },\n    },\n  },\n});\n"],"mappings":";AAEA,IAAa,O,mCAAOA,CAAAA,CAAAA,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,OAAO;GACL,OAAO,EACL,YAAY,QACd;GACA,QAAQ,EACN,YAAY,SACd;GACA,KAAK,EACH,YAAY,MACd;GACA,SAAS,EACP,YAAY,UACd;GACA,UAAU,EACR,YAAY,WACd;EACF;EACA,SAAS;GACP,OAAO,EACL,gBAAgB,QAClB;GACA,QAAQ,EACN,gBAAgB,SAClB;GACA,KAAK,EACH,gBAAgB,MAClB;GACA,SAAS,EACP,gBAAgB,gBAClB;EACF;EACA,MAAM;GACJ,KAAK,EACH,cAAc,MAChB;GACA,QAAQ,EACN,cAAc,SAChB;GACA,OAAO,EACL,cAAc,QAChB;GACA,UAAU,EACR,cAAc,YAChB;GACA,aAAa,EACX,cAAc,eAChB;EACF;EACA,SAAS;GACP,GAAG,EACD,qBAAqB,iBACvB;GACA,GAAG,EACD,qBAAqB,iBACvB;GACA,GAAG,EACD,qBAAqB,iBACvB;GACA,GAAG,EACD,qBAAqB,iBACvB;EACF;EACA,KAAK;GACH,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;GACA,GAAG,EACD,KAAK,KACP;EACF;EACA,MAAM;GACJ,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;GACA,GAAG,EACD,WAAW,KACb;EACF;EACA,MAAM;GACJ,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;GACA,GAAG,EACD,QAAQ,KACV;EACF;CACF;AACF,CAAC"}

package/dist/components/Grid/Grid.js

@@ -1,5 +1,5 @@
 import { styled } from "../../stitches.config.js";
-//#region components/Grid/Grid.tsx
+// components/Grid/Grid.tsx
 var Grid = styled("div", {
 	boxSizing: "border-box",
 	display: "grid",
@@ -65,7 +65,6 @@ var Grid = styled("div", {
 		}
 	}
 });
-//#endregion
 export { Grid };
 
 //# sourceMappingURL=Grid.js.map

package/dist/components/Grid/Grid.vanilla.cjs

@@ -6,7 +6,7 @@ let react = require("react");
 react = require_runtime.__toESM(react, 1);
 let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/Grid/Grid.vanilla.tsx
+// components/Grid/Grid.vanilla.tsx
 var GridVanillaComponent = react.default.forwardRef(({ as, className, css, style, align, justify, flow, columns, gap, gapX, gapY, ...props }, ref) => {
 	const Component = as || "div";
 	const { colors } = require_themeContext.useVanillaExtractTheme();
@@ -19,23 +19,23 @@ var GridVanillaComponent = react.default.forwardRef(({ as, className, css, style
 		...style,
 		...(0, _vanilla_extract_dynamic.assignInlineVars)(vars)
 	};
+	const recipeClass = require_Grid_vanilla_css.gridRecipe({
+		align,
+		justify,
+		flow,
+		gap,
+		gapX,
+		gapY
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
 		ref,
-		className: `${require_Grid_vanilla_css.gridRecipe({
-			align,
-			justify,
-			flow,
-			gap,
-			gapX,
-			gapY
-		})} ${className || ""}`.trim(),
+		className: `${recipeClass} ${className || ""}`.trim(),
 		style: mergedStyles,
 		...props
 	});
 });
 GridVanillaComponent.displayName = "GridVanilla";
 var GridVanilla = GridVanillaComponent;
-//#endregion
 exports.GridVanilla = GridVanilla;
 exports.GridVanillaComponent = GridVanillaComponent;
 

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

@@ -1 +1 @@
-{"version":3,"file":"Grid.vanilla.cjs","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n  align?: GridAlign;\n  justify?: GridJustify;\n  flow?: GridFlow;\n  columns?: number;\n  gap?: Gap;\n  gapX?: Gap;\n  gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    {\n      as,\n      className,\n      css,\n      style,\n      align,\n      justify,\n      flow,\n      columns,\n      gap,\n      gapX,\n      gapY,\n      ...props\n    }: GridProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const dynamicStyles: React.CSSProperties = {};\n\n    // To support any value on the columns props\n    if (columns !== undefined) {\n      dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n    }\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...dynamicStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;;;AA0BA,IAAa,uBAAuB,MAAA,QAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,gBAAqC,CAAC;CAG5C,IAAI,YAAY,KAAA,GACd,cAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAC1B;CAIA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GALK,yBAAA,WAAW;GAAE;GAAO;GAAS;GAAM;GAAK;GAAM;EAAK,CAKrD,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
+{"version":3,"file":"Grid.vanilla.cjs","names":["React","useVanillaExtractTheme","processCSSProp","assignInlineVars","gridRecipe"],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n  align?: GridAlign;\n  justify?: GridJustify;\n  flow?: GridFlow;\n  columns?: number;\n  gap?: Gap;\n  gapX?: Gap;\n  gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    {\n      as,\n      className,\n      css,\n      style,\n      align,\n      justify,\n      flow,\n      columns,\n      gap,\n      gapX,\n      gapY,\n      ...props\n    }: GridProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const dynamicStyles: React.CSSProperties = {};\n\n    // To support any value on the columns props\n    if (columns !== undefined) {\n      dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n    }\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...dynamicStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;;;AA0BA,IAAa,uBAAuBA,MAAAA,QAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAWC,qBAAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAASC,iBAAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,gBAAqC,CAAC;CAG5C,IAAI,YAAY,KAAA,GACd,cAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,IAAA,GAAGC,yBAAAA,iBAAAA,CAAiB,IAAI;CAC1B;CAEA,MAAM,cAAcC,yBAAAA,WAAW;EAAE;EAAO;EAAS;EAAM;EAAK;EAAM;CAAK,CAAC;CAExE,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,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}

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

@@ -1,7 +1,7 @@
 ;/* empty css                                       */
 ;/* empty css                                      */
 ;/* empty css                                  */
-//#region components/Grid/Grid.vanilla.css.ts
+// components/Grid/Grid.vanilla.css.ts
 var gridRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").createRuntimeFn)({
 	defaultClassName: "_1qwrd2o1 _1qwrd2o0",
 	variantClassNames: {
@@ -62,7 +62,6 @@ var gridRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").createR
 	defaultVariants: {},
 	compoundVariants: []
 });
-//#endregion
 exports.gridRecipe = gridRecipe;
 
 //# sourceMappingURL=Grid.vanilla.css.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Grid.vanilla.css.cjs","names":[],"sources":["../../../components/Grid/Grid.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst grid = style({\n  boxSizing: 'border-box',\n  display: 'grid',\n});\n\nexport const gridRecipe = recipe({\n  base: grid,\n\n  variants: {\n    align: {\n      start: {\n        alignItems: 'start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n    },\n    flow: {\n      row: {\n        gridAutoFlow: 'row',\n      },\n      column: {\n        gridAutoFlow: 'column',\n      },\n      dense: {\n        gridAutoFlow: 'dense',\n      },\n      rowDense: {\n        gridAutoFlow: 'row dense',\n      },\n      columnDense: {\n        gridAutoFlow: 'column dense',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n    gapX: {\n      1: {\n        columnGap: tokens.space[1],\n      },\n      2: {\n        columnGap: tokens.space[2],\n      },\n      3: {\n        columnGap: tokens.space[3],\n      },\n      4: {\n        columnGap: tokens.space[4],\n      },\n      5: {\n        columnGap: tokens.space[5],\n      },\n      6: {\n        columnGap: tokens.space[6],\n      },\n      7: {\n        columnGap: tokens.space[7],\n      },\n      8: {\n        columnGap: tokens.space[8],\n      },\n      9: {\n        columnGap: tokens.space[9],\n      },\n    },\n    gapY: {\n      1: {\n        rowGap: tokens.space[1],\n      },\n      2: {\n        rowGap: tokens.space[2],\n      },\n      3: {\n        rowGap: tokens.space[3],\n      },\n      4: {\n        rowGap: tokens.space[4],\n      },\n      5: {\n        rowGap: tokens.space[5],\n      },\n      6: {\n        rowGap: tokens.space[6],\n      },\n      7: {\n        rowGap: tokens.space[7],\n      },\n      8: {\n        rowGap: tokens.space[8],\n      },\n      9: {\n        rowGap: tokens.space[9],\n      },\n    },\n  },\n});\n"],"mappings":""}
+{"version":3,"file":"Grid.vanilla.css.cjs","names":["_7a468"],"sources":["../../../components/Grid/Grid.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst grid = style({\n  boxSizing: 'border-box',\n  display: 'grid',\n});\n\nexport const gridRecipe = recipe({\n  base: grid,\n\n  variants: {\n    align: {\n      start: {\n        alignItems: 'start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n    },\n    flow: {\n      row: {\n        gridAutoFlow: 'row',\n      },\n      column: {\n        gridAutoFlow: 'column',\n      },\n      dense: {\n        gridAutoFlow: 'dense',\n      },\n      rowDense: {\n        gridAutoFlow: 'row dense',\n      },\n      columnDense: {\n        gridAutoFlow: 'column dense',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n    gapX: {\n      1: {\n        columnGap: tokens.space[1],\n      },\n      2: {\n        columnGap: tokens.space[2],\n      },\n      3: {\n        columnGap: tokens.space[3],\n      },\n      4: {\n        columnGap: tokens.space[4],\n      },\n      5: {\n        columnGap: tokens.space[5],\n      },\n      6: {\n        columnGap: tokens.space[6],\n      },\n      7: {\n        columnGap: tokens.space[7],\n      },\n      8: {\n        columnGap: tokens.space[8],\n      },\n      9: {\n        columnGap: tokens.space[9],\n      },\n    },\n    gapY: {\n      1: {\n        rowGap: tokens.space[1],\n      },\n      2: {\n        rowGap: tokens.space[2],\n      },\n      3: {\n        rowGap: tokens.space[3],\n      },\n      4: {\n        rowGap: tokens.space[4],\n      },\n      5: {\n        rowGap: tokens.space[5],\n      },\n      6: {\n        rowGap: tokens.space[6],\n      },\n      7: {\n        rowGap: tokens.space[7],\n      },\n      8: {\n        rowGap: tokens.space[8],\n      },\n      9: {\n        rowGap: tokens.space[9],\n      },\n    },\n  },\n});\n"],"mappings":""}

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

@@ -2,7 +2,7 @@
 /* empty css                                    */
 /* empty css                                */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
-//#region components/Grid/Grid.vanilla.css.ts
+// components/Grid/Grid.vanilla.css.ts
 var gridRecipe = createRuntimeFn({
 	defaultClassName: "_1qwrd2o1 _1qwrd2o0",
 	variantClassNames: {
@@ -63,7 +63,6 @@ var gridRecipe = createRuntimeFn({
 	defaultVariants: {},
 	compoundVariants: []
 });
-//#endregion
 export { gridRecipe };
 
 //# sourceMappingURL=Grid.vanilla.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Grid.vanilla.css.js","names":[],"sources":["../../../components/Grid/Grid.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst grid = style({\n  boxSizing: 'border-box',\n  display: 'grid',\n});\n\nexport const gridRecipe = recipe({\n  base: grid,\n\n  variants: {\n    align: {\n      start: {\n        alignItems: 'start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n    },\n    flow: {\n      row: {\n        gridAutoFlow: 'row',\n      },\n      column: {\n        gridAutoFlow: 'column',\n      },\n      dense: {\n        gridAutoFlow: 'dense',\n      },\n      rowDense: {\n        gridAutoFlow: 'row dense',\n      },\n      columnDense: {\n        gridAutoFlow: 'column dense',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n    gapX: {\n      1: {\n        columnGap: tokens.space[1],\n      },\n      2: {\n        columnGap: tokens.space[2],\n      },\n      3: {\n        columnGap: tokens.space[3],\n      },\n      4: {\n        columnGap: tokens.space[4],\n      },\n      5: {\n        columnGap: tokens.space[5],\n      },\n      6: {\n        columnGap: tokens.space[6],\n      },\n      7: {\n        columnGap: tokens.space[7],\n      },\n      8: {\n        columnGap: tokens.space[8],\n      },\n      9: {\n        columnGap: tokens.space[9],\n      },\n    },\n    gapY: {\n      1: {\n        rowGap: tokens.space[1],\n      },\n      2: {\n        rowGap: tokens.space[2],\n      },\n      3: {\n        rowGap: tokens.space[3],\n      },\n      4: {\n        rowGap: tokens.space[4],\n      },\n      5: {\n        rowGap: tokens.space[5],\n      },\n      6: {\n        rowGap: tokens.space[6],\n      },\n      7: {\n        rowGap: tokens.space[7],\n      },\n      8: {\n        rowGap: tokens.space[8],\n      },\n      9: {\n        rowGap: tokens.space[9],\n      },\n    },\n  },\n});\n"],"mappings":""}
+{"version":3,"file":"Grid.vanilla.css.js","names":["_7a468"],"sources":["../../../components/Grid/Grid.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst grid = style({\n  boxSizing: 'border-box',\n  display: 'grid',\n});\n\nexport const gridRecipe = recipe({\n  base: grid,\n\n  variants: {\n    align: {\n      start: {\n        alignItems: 'start',\n      },\n      center: {\n        alignItems: 'center',\n      },\n      end: {\n        alignItems: 'end',\n      },\n      stretch: {\n        alignItems: 'stretch',\n      },\n      baseline: {\n        alignItems: 'baseline',\n      },\n    },\n    justify: {\n      start: {\n        justifyContent: 'start',\n      },\n      center: {\n        justifyContent: 'center',\n      },\n      end: {\n        justifyContent: 'end',\n      },\n      between: {\n        justifyContent: 'space-between',\n      },\n    },\n    flow: {\n      row: {\n        gridAutoFlow: 'row',\n      },\n      column: {\n        gridAutoFlow: 'column',\n      },\n      dense: {\n        gridAutoFlow: 'dense',\n      },\n      rowDense: {\n        gridAutoFlow: 'row dense',\n      },\n      columnDense: {\n        gridAutoFlow: 'column dense',\n      },\n    },\n    gap: {\n      1: {\n        gap: tokens.space[1],\n      },\n      2: {\n        gap: tokens.space[2],\n      },\n      3: {\n        gap: tokens.space[3],\n      },\n      4: {\n        gap: tokens.space[4],\n      },\n      5: {\n        gap: tokens.space[5],\n      },\n      6: {\n        gap: tokens.space[6],\n      },\n      7: {\n        gap: tokens.space[7],\n      },\n      8: {\n        gap: tokens.space[8],\n      },\n      9: {\n        gap: tokens.space[9],\n      },\n    },\n    gapX: {\n      1: {\n        columnGap: tokens.space[1],\n      },\n      2: {\n        columnGap: tokens.space[2],\n      },\n      3: {\n        columnGap: tokens.space[3],\n      },\n      4: {\n        columnGap: tokens.space[4],\n      },\n      5: {\n        columnGap: tokens.space[5],\n      },\n      6: {\n        columnGap: tokens.space[6],\n      },\n      7: {\n        columnGap: tokens.space[7],\n      },\n      8: {\n        columnGap: tokens.space[8],\n      },\n      9: {\n        columnGap: tokens.space[9],\n      },\n    },\n    gapY: {\n      1: {\n        rowGap: tokens.space[1],\n      },\n      2: {\n        rowGap: tokens.space[2],\n      },\n      3: {\n        rowGap: tokens.space[3],\n      },\n      4: {\n        rowGap: tokens.space[4],\n      },\n      5: {\n        rowGap: tokens.space[5],\n      },\n      6: {\n        rowGap: tokens.space[6],\n      },\n      7: {\n        rowGap: tokens.space[7],\n      },\n      8: {\n        rowGap: tokens.space[8],\n      },\n      9: {\n        rowGap: tokens.space[9],\n      },\n    },\n  },\n});\n"],"mappings":""}

package/dist/components/Grid/Grid.vanilla.js

@@ -4,7 +4,7 @@ import { gridRecipe } from "./Grid.vanilla.css.js";
 import React from "react";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx } from "react/jsx-runtime";
-//#region components/Grid/Grid.vanilla.tsx
+// components/Grid/Grid.vanilla.tsx
 var GridVanillaComponent = React.forwardRef(({ as, className, css, style, align, justify, flow, columns, gap, gapX, gapY, ...props }, ref) => {
 	const Component = as || "div";
 	const { colors } = useVanillaExtractTheme();
@@ -17,23 +17,23 @@ var GridVanillaComponent = React.forwardRef(({ as, className, css, style, align,
 		...style,
 		...assignInlineVars(vars)
 	};
+	const recipeClass = gridRecipe({
+		align,
+		justify,
+		flow,
+		gap,
+		gapX,
+		gapY
+	});
 	return /* @__PURE__ */ jsx(Component, {
 		ref,
-		className: `${gridRecipe({
-			align,
-			justify,
-			flow,
-			gap,
-			gapX,
-			gapY
-		})} ${className || ""}`.trim(),
+		className: `${recipeClass} ${className || ""}`.trim(),
 		style: mergedStyles,
 		...props
 	});
 });
 GridVanillaComponent.displayName = "GridVanilla";
 var GridVanilla = GridVanillaComponent;
-//#endregion
 export { GridVanilla, GridVanillaComponent };
 
 //# sourceMappingURL=Grid.vanilla.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Grid.vanilla.js","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n  align?: GridAlign;\n  justify?: GridJustify;\n  flow?: GridFlow;\n  columns?: number;\n  gap?: Gap;\n  gapX?: Gap;\n  gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    {\n      as,\n      className,\n      css,\n      style,\n      align,\n      justify,\n      flow,\n      columns,\n      gap,\n      gapX,\n      gapY,\n      ...props\n    }: GridProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const dynamicStyles: React.CSSProperties = {};\n\n    // To support any value on the columns props\n    if (columns !== undefined) {\n      dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n    }\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...dynamicStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;AA0BA,IAAa,uBAAuB,MAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,gBAAqC,CAAC;CAG5C,IAAI,YAAY,KAAA,GACd,cAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAIA,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,WAAW;GAAE;GAAO;GAAS;GAAM;GAAK;GAAM;EAAK,CAKrD,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
+{"version":3,"file":"Grid.vanilla.js","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } 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 type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n  align?: GridAlign;\n  justify?: GridJustify;\n  flow?: GridFlow;\n  columns?: number;\n  gap?: Gap;\n  gapX?: Gap;\n  gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    {\n      as,\n      className,\n      css,\n      style,\n      align,\n      justify,\n      flow,\n      columns,\n      gap,\n      gapX,\n      gapY,\n      ...props\n    }: GridProps<C>,\n    ref?: PolymorphicRef<C>,\n  ) => {\n    const Component = as || 'div';\n\n    const { colors } = useVanillaExtractTheme();\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n    const dynamicStyles: React.CSSProperties = {};\n\n    // To support any value on the columns props\n    if (columns !== undefined) {\n      dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n    }\n\n    const mergedStyles = {\n      ...cssStyles,\n      ...dynamicStyles,\n      ...style,\n      ...assignInlineVars(vars),\n    };\n\n    const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;AA0BA,IAAa,uBAAuB,MAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,gBAAqC,CAAC;CAG5C,IAAI,YAAY,KAAA,GACd,cAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAEA,MAAM,cAAc,WAAW;EAAE;EAAO;EAAS;EAAM;EAAK;EAAM;CAAK,CAAC;CAExE,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}

package/dist/components/Heading/Heading.cjs

@@ -1,5 +1,5 @@
 const require_stitches_config = require("../../stitches.config.cjs");
-//#region components/Heading/Heading.tsx
+// components/Heading/Heading.tsx
 var HEADING_BASE_STYLES = {
 	fontFamily: "$rubik",
 	fontVariantNumeric: "proportional-nums",
@@ -41,7 +41,6 @@ var H6 = require_stitches_config.styled("h6", {
 	...HEADING_BASE_STYLES,
 	fontSize: "$4"
 });
-//#endregion
 exports.H1 = H1;
 exports.H2 = H2;
 exports.H3 = H3;

package/dist/components/Heading/Heading.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.cjs","names":[],"sources":["../../../components/Heading/Heading.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nconst HEADING_BASE_STYLES = {\n  fontFamily: '$rubik',\n  fontVariantNumeric: 'proportional-nums',\n  display: 'block',\n  lineHeight: '1.25',\n  fontWeight: '$medium',\n  margin: 0,\n  color: '$headingDefault',\n  variants: {\n    transform: {\n      uppercase: {\n        textTransform: 'uppercase',\n      },\n      capitalize: {\n        // WARNING: this will only work with block elements (display block/inline-block)\n        // @see https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter\n        display: 'block',\n        '&::first-letter': {\n          textTransform: 'uppercase',\n        },\n      },\n      capitalizeWords: {\n        textTransform: 'capitalize',\n      },\n    },\n  },\n};\n\nexport const H1 = styled('h1', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$12',\n});\n\nexport const H2 = styled('h2', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$10',\n});\n\nexport const H3 = styled('h3', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$8',\n});\n\nexport const H4 = styled('h4', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$7',\n});\n\nexport const H5 = styled('h5', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$6',\n});\n\nexport const H6 = styled('h6', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$4',\n});\n"],"mappings":";;AAEA,IAAM,sBAAsB;CAC1B,YAAY;CACZ,oBAAoB;CACpB,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,OAAO;CACP,UAAU,EACR,WAAW;EACT,WAAW,EACT,eAAe,YACjB;EACA,YAAY;GAGV,SAAS;GACT,mBAAmB,EACjB,eAAe,YACjB;EACF;EACA,iBAAiB,EACf,eAAe,aACjB;CACF,EACF;AACF;AAEA,IAAa,KAAK,wBAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAK,wBAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAK,wBAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAK,wBAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAK,wBAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAK,wBAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC"}
+{"version":3,"file":"Heading.cjs","names":["styled"],"sources":["../../../components/Heading/Heading.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nconst HEADING_BASE_STYLES = {\n  fontFamily: '$rubik',\n  fontVariantNumeric: 'proportional-nums',\n  display: 'block',\n  lineHeight: '1.25',\n  fontWeight: '$medium',\n  margin: 0,\n  color: '$headingDefault',\n  variants: {\n    transform: {\n      uppercase: {\n        textTransform: 'uppercase',\n      },\n      capitalize: {\n        // WARNING: this will only work with block elements (display block/inline-block)\n        // @see https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter\n        display: 'block',\n        '&::first-letter': {\n          textTransform: 'uppercase',\n        },\n      },\n      capitalizeWords: {\n        textTransform: 'capitalize',\n      },\n    },\n  },\n};\n\nexport const H1 = styled('h1', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$12',\n});\n\nexport const H2 = styled('h2', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$10',\n});\n\nexport const H3 = styled('h3', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$8',\n});\n\nexport const H4 = styled('h4', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$7',\n});\n\nexport const H5 = styled('h5', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$6',\n});\n\nexport const H6 = styled('h6', {\n  ...HEADING_BASE_STYLES,\n  fontSize: '$4',\n});\n"],"mappings":";;AAEA,IAAM,sBAAsB;CAC1B,YAAY;CACZ,oBAAoB;CACpB,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,OAAO;CACP,UAAU,EACR,WAAW;EACT,WAAW,EACT,eAAe,YACjB;EACA,YAAY;GAGV,SAAS;GACT,mBAAmB,EACjB,eAAe,YACjB;EACF;EACA,iBAAiB,EACf,eAAe,aACjB;CACF,EACF;AACF;AAEA,IAAa,KAAKA,wBAAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAKA,wBAAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAKA,wBAAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAKA,wBAAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAKA,wBAAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC;AAED,IAAa,KAAKA,wBAAAA,OAAO,MAAM;CAC7B,GAAG;CACH,UAAU;AACZ,CAAC"}

package/dist/components/Heading/Heading.js

@@ -1,5 +1,5 @@
 import { styled } from "../../stitches.config.js";
-//#region components/Heading/Heading.tsx
+// components/Heading/Heading.tsx
 var HEADING_BASE_STYLES = {
 	fontFamily: "$rubik",
 	fontVariantNumeric: "proportional-nums",
@@ -41,7 +41,6 @@ var H6 = styled("h6", {
 	...HEADING_BASE_STYLES,
 	fontSize: "$4"
 });
-//#endregion
 export { H1, H2, H3, H4, H5, H6 };
 
 //# sourceMappingURL=Heading.js.map

package/dist/components/Heading/Heading.themes.cjs

@@ -1,13 +1,12 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 let tinycolor2 = require("tinycolor2");
 tinycolor2 = require_runtime.__toESM(tinycolor2, 1);
-//#region components/Heading/Heading.themes.ts
+// components/Heading/Heading.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = () => ({ headingDefault: (0, tinycolor2.default)("black").setAlpha(.74).toHslString() });
 	_Theme.getDark = () => ({ headingDefault: (0, tinycolor2.default)("white").setAlpha(.74).toHslString() });
 })(Theme || (Theme = {}));
-//#endregion
 Object.defineProperty(exports, "Theme", {
 	enumerable: true,
 	get: function() {

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

@@ -1 +1 @@
-{"version":3,"file":"Heading.themes.cjs","names":[],"sources":["../../../components/Heading/Heading.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    headingDefault: Property.Color;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    headingDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n  });\n\n  export const getDark: Factory = () => ({\n    headingDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n  });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAOQ,OAAA,kBAA2B,EACtC,iBAAA,GAAA,WAAA,QAAA,CAA0B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;CAEa,OAAA,iBAA0B,EACrC,iBAAA,GAAA,WAAA,QAAA,CAA0B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"Heading.themes.cjs","names":["tinycolor"],"sources":["../../../components/Heading/Heading.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    headingDefault: Property.Color;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    headingDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n  });\n\n  export const getDark: Factory = () => ({\n    headingDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n  });\n}\n"],"mappings":";;;;AAKO,IAAU;CAAV,SAAA,QAAA;CAOQ,OAAA,kBAA2B,EACtC,iBAAA,GAAgBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;CAEa,OAAA,iBAA0B,EACrC,iBAAA,GAAgBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Heading/Heading.themes.js

@@ -1,11 +1,10 @@
 import tinycolor from "tinycolor2";
-//#region components/Heading/Heading.themes.ts
+// components/Heading/Heading.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = () => ({ headingDefault: tinycolor("black").setAlpha(.74).toHslString() });
 	_Theme.getDark = () => ({ headingDefault: tinycolor("white").setAlpha(.74).toHslString() });
 })(Theme || (Theme = {}));
-//#endregion
 export { Theme };
 
 //# sourceMappingURL=Heading.themes.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Heading.themes.js","names":[],"sources":["../../../components/Heading/Heading.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    headingDefault: Property.Color;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    headingDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n  });\n\n  export const getDark: Factory = () => ({\n    headingDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n  });\n}\n"],"mappings":";;AAKO,IAAA;;CAOQ,OAAA,kBAA2B,EACtC,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;CAEa,OAAA,iBAA0B,EACrC,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"Heading.themes.js","names":[],"sources":["../../../components/Heading/Heading.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    headingDefault: Property.Color;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    headingDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n  });\n\n  export const getDark: Factory = () => ({\n    headingDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n  });\n}\n"],"mappings":";;AAKO,IAAU;CAAV,SAAA,QAAA;CAOQ,OAAA,kBAA2B,EACtC,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;CAEa,OAAA,iBAA0B,EACrC,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY,EAChE;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/IconButton/IconButton.cjs

@@ -1,6 +1,6 @@
 const require_stitches_config = require("../../stitches.config.cjs");
 const require_Button = require("../Button/Button.cjs");
-//#region components/IconButton/IconButton.tsx
+// components/IconButton/IconButton.tsx
 var IconButton = require_stitches_config.styled("button", {
 	...require_Button.BUTTON_BASE_STYLES,
 	alignItems: "center",
@@ -76,7 +76,6 @@ var IconButton = require_stitches_config.styled("button", {
 		size: "2"
 	}
 });
-//#endregion
 exports.IconButton = IconButton;
 
 //# sourceMappingURL=IconButton.cjs.map