@traefik-labs/faency 12.0.7

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,98 @@
+import { jsx } from "react/jsx-runtime";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { CheckIcon } from "@radix-ui/react-icons";
+import React from "react";
+import { styled } from "../../stitches.config.js";
+const StyledIndicator = styled(CheckboxPrimitive.Indicator, {
+  alignItems: "center",
+  display: "flex",
+  height: "100%",
+  justifyContent: "center",
+  width: "100%"
+});
+const StyledCheckbox = styled(CheckboxPrimitive.Root, {
+  all: "unset",
+  border: "none",
+  boxSizing: "border-box",
+  userSelect: "none",
+  "&::before": {
+    boxSizing: "border-box"
+  },
+  "&::after": {
+    boxSizing: "border-box"
+  },
+  alignItems: "center",
+  appearance: "none",
+  display: "inline-flex",
+  justifyContent: "center",
+  lineHeight: "1",
+  margin: "0",
+  outline: "none",
+  padding: "0",
+  WebkitTapHighlightColor: "rgba(0,0,0,0)",
+  overflow: "hidden",
+  "&[data-state=checked]": {
+    backgroundColor: "$checkboxCheckedBg",
+    boxShadow: "inset 0 0 0 1px transparent",
+    color: "$checkboxCheckedIcon",
+    "@hover": {
+      "&:hover": {
+        backgroundColor: "$checkboxCheckedHoverBg"
+      }
+    }
+  },
+  "&[data-state=unchecked]": {
+    backgroundColor: "$checkboxBg",
+    boxShadow: "inset 0 0 0 1px $colors$checkboxBorder",
+    color: "$checkboxIcon",
+    "@hover": {
+      "&:hover": {
+        backgroundColor: "$checkboxHoverBg",
+        boxShadow: "inset 0 0 0 1px $colors$checkboxHoverBorder"
+      }
+    }
+  },
+  "&:focus": {
+    outline: "none",
+    boxShadow: "inset 0 0 0 1px $colors$checkboxFocusBorder"
+  },
+  "&:disabled": {
+    pointerEvents: "none",
+    backgroundColor: "$checkboxDisabledBg",
+    boxShadow: "inset 0 0 0 1px $colors$checkboxDisabledBorder",
+    "&::placeholder": {
+      color: "$checkboxDisabledText"
+    },
+    [`& ${StyledIndicator}`]: {
+      "&::after": {
+        backgroundColor: "$checkboxIndicatorDisabledBg"
+      }
+    }
+  },
+  variants: {
+    size: {
+      medium: {
+        width: 18,
+        height: 18,
+        borderRadius: "$2"
+      },
+      large: {
+        width: "$5",
+        height: "$5",
+        borderRadius: "$3"
+      }
+    }
+  },
+  defaultVariants: {
+    size: "medium"
+  }
+});
+const Checkbox = React.forwardRef(
+  (props, forwardedRef) => {
+    return /* @__PURE__ */ jsx(StyledCheckbox, { ...props, ref: forwardedRef, children: /* @__PURE__ */ jsx(StyledIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { height: 40, width: 40 }) }) });
+  }
+);
+export {
+  Checkbox
+};
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../components/Checkbox/Checkbox.tsx"],"sourcesContent":["import * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport { CheckIcon } from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\n\nconst StyledIndicator = styled(CheckboxPrimitive.Indicator, {\n  alignItems: 'center',\n  display: 'flex',\n  height: '100%',\n  justifyContent: 'center',\n  width: '100%',\n});\n\nconst StyledCheckbox = styled(CheckboxPrimitive.Root, {\n  all: 'unset',\n  border: 'none',\n  boxSizing: 'border-box',\n  userSelect: 'none',\n  '&::before': {\n    boxSizing: 'border-box',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n  },\n\n  alignItems: 'center',\n  appearance: 'none',\n  display: 'inline-flex',\n  justifyContent: 'center',\n  lineHeight: '1',\n  margin: '0',\n  outline: 'none',\n  padding: '0',\n  WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n  overflow: 'hidden',\n\n  '&[data-state=checked]': {\n    backgroundColor: '$checkboxCheckedBg',\n    boxShadow: 'inset 0 0 0 1px transparent',\n    color: '$checkboxCheckedIcon',\n\n    '@hover': {\n      '&:hover': {\n        backgroundColor: '$checkboxCheckedHoverBg',\n      },\n    },\n  },\n\n  '&[data-state=unchecked]': {\n    backgroundColor: '$checkboxBg',\n    boxShadow: 'inset 0 0 0 1px $colors$checkboxBorder',\n    color: '$checkboxIcon',\n\n    '@hover': {\n      '&:hover': {\n        backgroundColor: '$checkboxHoverBg',\n        boxShadow: 'inset 0 0 0 1px $colors$checkboxHoverBorder',\n      },\n    },\n  },\n\n  '&:focus': {\n    outline: 'none',\n    boxShadow: 'inset 0 0 0 1px $colors$checkboxFocusBorder',\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    backgroundColor: '$checkboxDisabledBg',\n    boxShadow: 'inset 0 0 0 1px $colors$checkboxDisabledBorder',\n    '&::placeholder': {\n      color: '$checkboxDisabledText',\n    },\n\n    [`& ${StyledIndicator}`]: {\n      '&::after': {\n        backgroundColor: '$checkboxIndicatorDisabledBg',\n      },\n    },\n  },\n\n  variants: {\n    size: {\n      medium: {\n        width: 18,\n        height: 18,\n        borderRadius: '$2',\n      },\n      large: {\n        width: '$5',\n        height: '$5',\n        borderRadius: '$3',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\ntype CheckboxPrimitiveProps = Omit<React.ComponentProps<typeof CheckboxPrimitive.Root>, 'as'>;\nexport type CheckboxVariants = VariantProps<typeof StyledCheckbox>;\nexport type CheckboxProps = CheckboxPrimitiveProps & CheckboxVariants & { css?: CSS };\n\nexport const Checkbox = React.forwardRef<React.ElementRef<typeof StyledCheckbox>, CheckboxProps>(\n  (props, forwardedRef) => {\n    return (\n      <StyledCheckbox {...props} ref={forwardedRef}>\n        <StyledIndicator>\n          <CheckIcon height={40} width={40} />\n        </StyledIndicator>\n      </StyledCheckbox>\n    );\n  }\n);\n"],"names":[],"mappings":";;;;;AAMA,MAAM,kBAAkB,OAAO,kBAAkB,WAAW;AAAA,EAC1D,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,gBAAgB;AAAA,EAChB,OAAO;AACT,CAAC;AAED,MAAM,iBAAiB,OAAO,kBAAkB,MAAM;AAAA,EACpD,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AAAA,IACX,WAAW;AAAA,EAAA;AAAA,EAEb,YAAY;AAAA,IACV,WAAW;AAAA,EAAA;AAAA,EAGb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,yBAAyB;AAAA,EACzB,UAAU;AAAA,EAEV,yBAAyB;AAAA,IACvB,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,OAAO;AAAA,IAEP,UAAU;AAAA,MACR,WAAW;AAAA,QACT,iBAAiB;AAAA,MAAA;AAAA,IACnB;AAAA,EACF;AAAA,EAGF,2BAA2B;AAAA,IACzB,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,OAAO;AAAA,IAEP,UAAU;AAAA,MACR,WAAW;AAAA,QACT,iBAAiB;AAAA,QACjB,WAAW;AAAA,MAAA;AAAA,IACb;AAAA,EACF;AAAA,EAGF,WAAW;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,EAAA;AAAA,EAGb,cAAc;AAAA,IACZ,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,kBAAkB;AAAA,MAChB,OAAO;AAAA,IAAA;AAAA,IAGT,CAAC,KAAK,eAAe,EAAE,GAAG;AAAA,MACxB,YAAY;AAAA,QACV,iBAAiB;AAAA,MAAA;AAAA,IACnB;AAAA,EACF;AAAA,EAGF,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,QAAQ;AAAA,QACN,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,MAAA;AAAA,MAEhB,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA,EACF;AAAA,EAEF,iBAAiB;AAAA,IACf,MAAM;AAAA,EAAA;AAEV,CAAC;AAMM,MAAM,WAAW,MAAM;AAAA,EAC5B,CAAC,OAAO,iBAAiB;AACvB,WACE,oBAAC,gBAAA,EAAgB,GAAG,OAAO,KAAK,cAC9B,UAAA,oBAAC,iBAAA,EACC,UAAA,oBAAC,aAAU,QAAQ,IAAI,OAAO,GAAA,CAAI,GACpC,GACF;AAAA,EAEJ;AACF;"}

package/dist/components/Checkbox/Checkbox.themes.cjs

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const tinycolor = require("tinycolor2");
+exports.Theme = void 0;
+((Theme2) => {
+  Theme2.getLight = (primaryColor) => ({
+    checkboxIcon: "$deepBlue11",
+    checkboxBg: "transparent",
+    checkboxBorder: "$slate8",
+    checkboxCheckedBg: "$primary",
+    checkboxCheckedIcon: "white",
+    checkboxCheckedHoverBg: tinycolor(primaryColor.value).darken().toHslString(),
+    checkboxHoverBg: "transparent",
+    checkboxHoverBorder: "$primary",
+    checkboxFocusBorder: "$primary",
+    checkboxDisabledBg: "$deepBlue3",
+    checkboxDisabledBorder: "$deepBlue5",
+    checkboxIndicatorDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString()
+  });
+  Theme2.getDark = (primaryColor) => ({
+    checkboxIcon: "$deepBlue1",
+    checkboxBg: "transparent",
+    checkboxCheckedBg: "$primary",
+    checkboxBorder: "$slate9",
+    checkboxCheckedIcon: "$deepBlue1",
+    checkboxCheckedHoverBg: tinycolor(primaryColor.value).lighten(10).toHslString(),
+    checkboxHoverBg: "$deepBlue3",
+    checkboxHoverBorder: "$primary",
+    checkboxFocusBorder: "$primary",
+    checkboxDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),
+    checkboxDisabledBorder: "transparent",
+    checkboxIndicatorDisabledBg: "$deepBlue1"
+  });
+})(exports.Theme || (exports.Theme = {}));
+//# sourceMappingURL=Checkbox.themes.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.themes.cjs","sources":["../../../components/Checkbox/Checkbox.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    checkboxIcon: Property.Color;\n    checkboxBg: Property.Color;\n    checkboxCheckedBg: Property.Color;\n    checkboxBorder: Property.Color;\n    checkboxCheckedIcon: Property.Color;\n    checkboxCheckedHoverBg: Property.Color;\n    checkboxHoverBg: Property.Color;\n    checkboxHoverBorder: Property.Color;\n    checkboxFocusBorder: Property.Color;\n    checkboxDisabledBg: Property.Color;\n    checkboxDisabledBorder: Property.Color;\n    checkboxIndicatorDisabledBg: Property.Color;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = (primaryColor) => ({\n    checkboxIcon: '$deepBlue11',\n    checkboxBg: 'transparent',\n    checkboxBorder: '$slate8',\n    checkboxCheckedBg: '$primary',\n    checkboxCheckedIcon: 'white',\n    checkboxCheckedHoverBg: tinycolor(primaryColor.value).darken().toHslString(),\n    checkboxHoverBg: 'transparent',\n    checkboxHoverBorder: '$primary',\n    checkboxFocusBorder: '$primary',\n    checkboxDisabledBg: '$deepBlue3',\n    checkboxDisabledBorder: '$deepBlue5',\n    checkboxIndicatorDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n  });\n\n  export const getDark: Factory = (primaryColor) => ({\n    checkboxIcon: '$deepBlue1',\n    checkboxBg: 'transparent',\n    checkboxCheckedBg: '$primary',\n    checkboxBorder: '$slate9',\n    checkboxCheckedIcon: '$deepBlue1',\n    checkboxCheckedHoverBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n    checkboxHoverBg: '$deepBlue3',\n    checkboxHoverBorder: '$primary',\n    checkboxFocusBorder: '$primary',\n    checkboxDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n    checkboxDisabledBorder: 'transparent',\n    checkboxIndicatorDisabledBg: '$deepBlue1',\n  });\n}\n"],"names":["Theme"],"mappings":";;;AAKiBA,QAAAA,QAAAA;AAAAA,CAAV,CAAUA,WAAV;AAkBQA,SAAA,WAAoB,CAAC,kBAAkB;AAAA,IAClD,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,wBAAwB,UAAU,aAAa,KAAK,EAAE,OAAA,EAAS,YAAA;AAAA,IAC/D,iBAAiB;AAAA,IACjB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,oBAAoB;AAAA,IACpB,wBAAwB;AAAA,IACxB,6BAA6B,UAAU,aAAa,KAAK,EAAE,SAAS,GAAG,EAAE,YAAA;AAAA,EAAY;AAG1EA,SAAA,UAAmB,CAAC,kBAAkB;AAAA,IACjD,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,qBAAqB;AAAA,IACrB,wBAAwB,UAAU,aAAa,KAAK,EAAE,QAAQ,EAAE,EAAE,YAAA;AAAA,IAClE,iBAAiB;AAAA,IACjB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,oBAAoB,UAAU,aAAa,KAAK,EAAE,SAAS,GAAG,EAAE,YAAA;AAAA,IAChE,wBAAwB;AAAA,IACxB,6BAA6B;AAAA,EAAA;AAC/B,GA9CeA,QAAAA,UAAAA,gBAAA,CAAA,EAAA;"}

package/dist/components/Checkbox/Checkbox.themes.js

@@ -0,0 +1,36 @@
+import tinycolor from "tinycolor2";
+var Theme;
+((Theme2) => {
+  Theme2.getLight = (primaryColor) => ({
+    checkboxIcon: "$deepBlue11",
+    checkboxBg: "transparent",
+    checkboxBorder: "$slate8",
+    checkboxCheckedBg: "$primary",
+    checkboxCheckedIcon: "white",
+    checkboxCheckedHoverBg: tinycolor(primaryColor.value).darken().toHslString(),
+    checkboxHoverBg: "transparent",
+    checkboxHoverBorder: "$primary",
+    checkboxFocusBorder: "$primary",
+    checkboxDisabledBg: "$deepBlue3",
+    checkboxDisabledBorder: "$deepBlue5",
+    checkboxIndicatorDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString()
+  });
+  Theme2.getDark = (primaryColor) => ({
+    checkboxIcon: "$deepBlue1",
+    checkboxBg: "transparent",
+    checkboxCheckedBg: "$primary",
+    checkboxBorder: "$slate9",
+    checkboxCheckedIcon: "$deepBlue1",
+    checkboxCheckedHoverBg: tinycolor(primaryColor.value).lighten(10).toHslString(),
+    checkboxHoverBg: "$deepBlue3",
+    checkboxHoverBorder: "$primary",
+    checkboxFocusBorder: "$primary",
+    checkboxDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),
+    checkboxDisabledBorder: "transparent",
+    checkboxIndicatorDisabledBg: "$deepBlue1"
+  });
+})(Theme || (Theme = {}));
+export {
+  Theme
+};
+//# sourceMappingURL=Checkbox.themes.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.themes.js","sources":["../../../components/Checkbox/Checkbox.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    checkboxIcon: Property.Color;\n    checkboxBg: Property.Color;\n    checkboxCheckedBg: Property.Color;\n    checkboxBorder: Property.Color;\n    checkboxCheckedIcon: Property.Color;\n    checkboxCheckedHoverBg: Property.Color;\n    checkboxHoverBg: Property.Color;\n    checkboxHoverBorder: Property.Color;\n    checkboxFocusBorder: Property.Color;\n    checkboxDisabledBg: Property.Color;\n    checkboxDisabledBorder: Property.Color;\n    checkboxIndicatorDisabledBg: Property.Color;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = (primaryColor) => ({\n    checkboxIcon: '$deepBlue11',\n    checkboxBg: 'transparent',\n    checkboxBorder: '$slate8',\n    checkboxCheckedBg: '$primary',\n    checkboxCheckedIcon: 'white',\n    checkboxCheckedHoverBg: tinycolor(primaryColor.value).darken().toHslString(),\n    checkboxHoverBg: 'transparent',\n    checkboxHoverBorder: '$primary',\n    checkboxFocusBorder: '$primary',\n    checkboxDisabledBg: '$deepBlue3',\n    checkboxDisabledBorder: '$deepBlue5',\n    checkboxIndicatorDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n  });\n\n  export const getDark: Factory = (primaryColor) => ({\n    checkboxIcon: '$deepBlue1',\n    checkboxBg: 'transparent',\n    checkboxCheckedBg: '$primary',\n    checkboxBorder: '$slate9',\n    checkboxCheckedIcon: '$deepBlue1',\n    checkboxCheckedHoverBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n    checkboxHoverBg: '$deepBlue3',\n    checkboxHoverBorder: '$primary',\n    checkboxFocusBorder: '$primary',\n    checkboxDisabledBg: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n    checkboxDisabledBorder: 'transparent',\n    checkboxIndicatorDisabledBg: '$deepBlue1',\n  });\n}\n"],"names":["Theme"],"mappings":";AAKO,IAAU;AAAA,CAAV,CAAUA,WAAV;AAkBQA,SAAA,WAAoB,CAAC,kBAAkB;AAAA,IAClD,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,wBAAwB,UAAU,aAAa,KAAK,EAAE,OAAA,EAAS,YAAA;AAAA,IAC/D,iBAAiB;AAAA,IACjB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,oBAAoB;AAAA,IACpB,wBAAwB;AAAA,IACxB,6BAA6B,UAAU,aAAa,KAAK,EAAE,SAAS,GAAG,EAAE,YAAA;AAAA,EAAY;AAG1EA,SAAA,UAAmB,CAAC,kBAAkB;AAAA,IACjD,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,qBAAqB;AAAA,IACrB,wBAAwB,UAAU,aAAa,KAAK,EAAE,QAAQ,EAAE,EAAE,YAAA;AAAA,IAClE,iBAAiB;AAAA,IACjB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,oBAAoB,UAAU,aAAa,KAAK,EAAE,SAAS,GAAG,EAAE,YAAA;AAAA,IAChE,wBAAwB;AAAA,IACxB,6BAA6B;AAAA,EAAA;AAC/B,GA9Ce,UAAA,QAAA,CAAA,EAAA;"}

package/dist/components/Container/Container.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const stitches_config = require("../../stitches.config.cjs");
+const Container = stitches_config.styled("div", {
+  // Reset
+  boxSizing: "border-box",
+  flexShrink: 0,
+  // Custom
+  ml: "auto",
+  mr: "auto",
+  px: "$5",
+  variants: {
+    size: {
+      "1": {
+        maxWidth: "425px"
+      },
+      "2": {
+        maxWidth: "768px"
+      },
+      "3": {
+        maxWidth: "1440px"
+      },
+      "4": {
+        maxWidth: "none"
+      }
+    },
+    noGutter: {
+      true: {
+        px: 0
+      }
+    }
+  },
+  defaultVariants: {
+    size: "4"
+  }
+});
+exports.Container = Container;
+//# sourceMappingURL=Container.cjs.map

package/dist/components/Container/Container.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.cjs","sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n  // Reset\n  boxSizing: 'border-box',\n  flexShrink: 0,\n\n  // Custom\n  ml: 'auto',\n  mr: 'auto',\n  px: '$5',\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        px: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"names":["styled"],"mappings":";;;AAEO,MAAM,YAAYA,gBAAAA,OAAO,OAAO;AAAA;AAAA,EAErC,WAAW;AAAA,EACX,YAAY;AAAA;AAAA,EAGZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EAEJ,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,IAEF,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,EACF;AAAA,EAEF,iBAAiB;AAAA,IACf,MAAM;AAAA,EAAA;AAEV,CAAC;;"}

package/dist/components/Container/Container.js

@@ -0,0 +1,38 @@
+import { styled } from "../../stitches.config.js";
+const Container = styled("div", {
+  // Reset
+  boxSizing: "border-box",
+  flexShrink: 0,
+  // Custom
+  ml: "auto",
+  mr: "auto",
+  px: "$5",
+  variants: {
+    size: {
+      "1": {
+        maxWidth: "425px"
+      },
+      "2": {
+        maxWidth: "768px"
+      },
+      "3": {
+        maxWidth: "1440px"
+      },
+      "4": {
+        maxWidth: "none"
+      }
+    },
+    noGutter: {
+      true: {
+        px: 0
+      }
+    }
+  },
+  defaultVariants: {
+    size: "4"
+  }
+});
+export {
+  Container
+};
+//# sourceMappingURL=Container.js.map

package/dist/components/Container/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n  // Reset\n  boxSizing: 'border-box',\n  flexShrink: 0,\n\n  // Custom\n  ml: 'auto',\n  mr: 'auto',\n  px: '$5',\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        px: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,YAAY,OAAO,OAAO;AAAA;AAAA,EAErC,WAAW;AAAA,EACX,YAAY;AAAA;AAAA,EAGZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EAEJ,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,IAEF,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,EACF;AAAA,EAEF,iBAAiB;AAAA,IACf,MAAM;AAAA,EAAA;AAEV,CAAC;"}

package/dist/components/Container/Container.vanilla.cjs

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const dynamic = require("@vanilla-extract/dynamic");
+const React = require("react");
+const cssProps = require("../../styles/cssProps.cjs");
+const themeContext = require("../../styles/themeContext.cjs");
+const Container_vanilla_css = require("./Container.vanilla.css.cjs");
+const ContainerVanillaComponent = React.forwardRef(
+  ({ as, className, css, style, size, noGutter, ...props }, ref) => {
+    const Component = as || "div";
+    const { colors } = themeContext.useVanillaExtractTheme();
+    const { style: cssStyles, vars } = cssProps.processCSSProp(css, colors);
+    const mergedStyles = {
+      ...cssStyles,
+      ...style,
+      ...dynamic.assignInlineVars(vars)
+    };
+    const recipeClass = Container_vanilla_css.containerRecipe({ size, noGutter });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Component,
+      {
+        ref,
+        className: `${recipeClass} ${className || ""}`.trim(),
+        style: mergedStyles,
+        ...props
+      }
+    );
+  }
+);
+ContainerVanillaComponent.displayName = "ContainerVanilla";
+const ContainerVanilla = ContainerVanillaComponent;
+exports.ContainerVanilla = ContainerVanilla;
+exports.ContainerVanillaComponent = ContainerVanillaComponent;
+//# sourceMappingURL=Container.vanilla.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Container.vanilla.cjs","sources":["../../../components/Container/Container.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 { containerRecipe } from './Container.vanilla.css';\n\ninterface ContainerOwnProps extends CSSProps {\n  size?: '1' | '2' | '3' | '4';\n  noGutter?: boolean;\n}\n\nexport type ContainerProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  ContainerOwnProps\n>;\ntype ContainerComponent = PolymorphicComponent<'div', ContainerProps<ElementType>>;\n\nexport const ContainerVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    { as, className, css, style, size, noGutter, ...props }: ContainerProps<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 = containerRecipe({ size, noGutter });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nContainerVanillaComponent.displayName = 'ContainerVanilla';\n\nexport const ContainerVanilla = ContainerVanillaComponent as ContainerComponent;\n"],"names":["useVanillaExtractTheme","processCSSProp","assignInlineVars","containerRecipe","jsx"],"mappings":";;;;;;;;AAuBO,MAAM,4BAA4B,MAAM;AAAA,EAC7C,CACE,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,MAAA,GAChD,QACG;AACH,UAAM,YAAY,MAAM;AAExB,UAAM,EAAE,OAAA,IAAWA,oCAAA;AAEnB,UAAM,EAAE,OAAO,WAAW,SAASC,SAAAA,eAAe,KAAK,MAAM;AAE7D,UAAM,eAAe;AAAA,MACnB,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAGC,QAAAA,iBAAiB,IAAI;AAAA,IAAA;AAG1B,UAAM,cAAcC,sBAAAA,gBAAgB,EAAE,MAAM,UAAU;AAEtD,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,WAAW,IAAI,aAAa,EAAE,GAAG,KAAA;AAAA,QAC/C,OAAO;AAAA,QACN,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,0BAA0B,cAAc;AAEjC,MAAM,mBAAmB;;;"}

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

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+;/* empty css                                       */
+;/* empty css                                      */
+;/* empty css                                       */
+const createRuntimeFn62c9670f_esm = require("../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs");
+var containerRecipe = createRuntimeFn62c9670f_esm.c({ defaultClassName: "ayuv8i1 ayuv8i0", variantClassNames: { size: { "1": "ayuv8i2", "2": "ayuv8i3", "3": "ayuv8i4", "4": "ayuv8i5" }, noGutter: { true: "ayuv8i6" } }, defaultVariants: { size: "4" }, compoundVariants: [] });
+exports.containerRecipe = containerRecipe;
+//# sourceMappingURL=Container.vanilla.css.cjs.map

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

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

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

@@ -0,0 +1,9 @@
+/* empty css                                     */
+/* empty css                                    */
+/* empty css                                     */
+import { c as createRuntimeFn } from "../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";
+var containerRecipe = createRuntimeFn({ defaultClassName: "ayuv8i1 ayuv8i0", variantClassNames: { size: { "1": "ayuv8i2", "2": "ayuv8i3", "3": "ayuv8i4", "4": "ayuv8i5" }, noGutter: { true: "ayuv8i6" } }, defaultVariants: { size: "4" }, compoundVariants: [] });
+export {
+  containerRecipe
+};
+//# sourceMappingURL=Container.vanilla.css.js.map

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

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

package/dist/components/Container/Container.vanilla.js

@@ -0,0 +1,35 @@
+import { jsx } from "react/jsx-runtime";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import React from "react";
+import { processCSSProp } from "../../styles/cssProps.js";
+import { useVanillaExtractTheme } from "../../styles/themeContext.js";
+import { containerRecipe } from "./Container.vanilla.css.js";
+const ContainerVanillaComponent = React.forwardRef(
+  ({ as, className, css, style, size, noGutter, ...props }, ref) => {
+    const Component = as || "div";
+    const { colors } = useVanillaExtractTheme();
+    const { style: cssStyles, vars } = processCSSProp(css, colors);
+    const mergedStyles = {
+      ...cssStyles,
+      ...style,
+      ...assignInlineVars(vars)
+    };
+    const recipeClass = containerRecipe({ size, noGutter });
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        ref,
+        className: `${recipeClass} ${className || ""}`.trim(),
+        style: mergedStyles,
+        ...props
+      }
+    );
+  }
+);
+ContainerVanillaComponent.displayName = "ContainerVanilla";
+const ContainerVanilla = ContainerVanillaComponent;
+export {
+  ContainerVanilla,
+  ContainerVanillaComponent
+};
+//# sourceMappingURL=Container.vanilla.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Container.vanilla.js","sources":["../../../components/Container/Container.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 { containerRecipe } from './Container.vanilla.css';\n\ninterface ContainerOwnProps extends CSSProps {\n  size?: '1' | '2' | '3' | '4';\n  noGutter?: boolean;\n}\n\nexport type ContainerProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n  C,\n  ContainerOwnProps\n>;\ntype ContainerComponent = PolymorphicComponent<'div', ContainerProps<ElementType>>;\n\nexport const ContainerVanillaComponent = React.forwardRef(\n  <C extends ElementType = 'div'>(\n    { as, className, css, style, size, noGutter, ...props }: ContainerProps<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 = containerRecipe({ size, noGutter });\n\n    return (\n      <Component\n        ref={ref}\n        className={`${recipeClass} ${className || ''}`.trim()}\n        style={mergedStyles}\n        {...props}\n      />\n    );\n  },\n);\n\nContainerVanillaComponent.displayName = 'ContainerVanilla';\n\nexport const ContainerVanilla = ContainerVanillaComponent as ContainerComponent;\n"],"names":[],"mappings":";;;;;;AAuBO,MAAM,4BAA4B,MAAM;AAAA,EAC7C,CACE,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,MAAA,GAChD,QACG;AACH,UAAM,YAAY,MAAM;AAExB,UAAM,EAAE,OAAA,IAAW,uBAAA;AAEnB,UAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;AAE7D,UAAM,eAAe;AAAA,MACnB,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG,iBAAiB,IAAI;AAAA,IAAA;AAG1B,UAAM,cAAc,gBAAgB,EAAE,MAAM,UAAU;AAEtD,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,WAAW,IAAI,aAAa,EAAE,GAAG,KAAA;AAAA,QAC/C,OAAO;AAAA,QACN,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,0BAA0B,cAAc;AAEjC,MAAM,mBAAmB;"}