@traefik-labs/faency 12.3.8 → 13.0.0

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

@@ -1,6 +1,6 @@
 /* empty css                                */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
-//#region components/Card/Card.vanilla.css.ts
+// components/Card/Card.vanilla.css.ts
 var cardRecipe = createRuntimeFn({
 	defaultClassName: "kc9sar1 kc9sar0",
 	variantClassNames: {
@@ -41,7 +41,6 @@ var interactiveCardRecipe = createRuntimeFn({
 	defaultVariants: { elevation: 1 },
 	compoundVariants: []
 });
-//#endregion
 export { cardRecipe, interactiveCardRecipe };
 
 //# sourceMappingURL=Card.vanilla.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Card.vanilla.css.js","names":[],"sources":["../../../components/Card/Card.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { breakpoints } from '../../styles/breakpoints.css';\nimport { tokens } from '../../styles/tokens.css';\n\n// Elevation variants matching Elevation component\nconst elevationVariants = {\n  0: {\n    boxShadow: 'none',\n  },\n  1: {\n    backgroundColor: tokens.colors['01dp'],\n    boxShadow:\n      '0 1px 5px 0 hsla(0, 0%, 0%, 0.2), 0 3px 1px -2px hsla(0, 0%, 0%, 0.12), 0 2px 2px 0 hsla(0, 0%, 0%, 0.14)',\n  },\n  2: {\n    backgroundColor: tokens.colors['02dp'],\n    boxShadow:\n      '0 2px 4px -1px hsla(0, 0%, 0%, 0.2), 0 1px 10px 0 hsla(0, 0%, 0%, 0.12), 0 4px 5px 0 hsla(0, 0%, 0%, 0.14)',\n  },\n  3: {\n    backgroundColor: tokens.colors['03dp'],\n    boxShadow:\n      '0 3px 5px -1px hsla(0, 0%, 0%, 0.2), 0 1px 18px 0 hsla(0, 0%, 0%, 0.12), 0 6px 10px 0 hsla(0, 0%, 0%, 0.14)',\n  },\n  4: {\n    backgroundColor: tokens.colors['04dp'],\n    boxShadow:\n      '0 7px 8px -4px hsla(0, 0%, 0%, 0.2), 0 5px 22px 4px hsla(0, 0%, 0%, 0.12), 0 12px 17px 2px hsla(0, 0%, 0%, 0.14)',\n  },\n  5: {\n    backgroundColor: tokens.colors['05dp'],\n    boxShadow:\n      '0 11px 15px -7px hsla(0, 0%, 0%, 0.2), 0 9px 46px 8px hsla(0, 0%, 0%, 0.12), 0 24px 38px 3px hsla(0, 0%, 0%, 0.14)',\n  },\n} as const;\n\n// Base card styles\nconst cardBase = style({\n  appearance: 'none',\n  border: 'none',\n  boxSizing: 'border-box',\n  font: 'inherit',\n  lineHeight: '1',\n  outline: 'none',\n  padding: tokens.space['3'],\n  textAlign: 'inherit',\n  verticalAlign: 'middle',\n  WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',\n  backgroundColor: tokens.colors.cardBackground,\n  display: 'block',\n  textDecoration: 'none',\n  color: 'inherit',\n  borderRadius: tokens.radii['3'],\n  position: 'relative',\n\n  '::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    borderRadius: tokens.radii['3'],\n    pointerEvents: 'none',\n  },\n});\n\nexport const cardRecipe = recipe({\n  base: cardBase,\n\n  variants: {\n    elevation: elevationVariants,\n    variant: {\n      inner: {\n        backgroundColor: tokens.colors.innerCardBgColor,\n      },\n      ghost: {\n        backgroundColor: 'transparent',\n        boxShadow: 'none',\n      },\n    },\n    active: {\n      true: {\n        '::before': {\n          outline: `1px solid ${tokens.colors.cardActiveBorder}`,\n          backgroundColor: tokens.colors.cardActiveBackground,\n        },\n      },\n    },\n  },\n\n  defaultVariants: {\n    elevation: 1,\n  },\n});\n\n// Interactive card styles (for button element)\nconst interactiveCardBase = style([\n  cardBase,\n  {\n    '@media': {\n      [breakpoints.hover]: {\n        selectors: {\n          '&:hover': {\n            cursor: 'pointer',\n          },\n          '&:hover::before': {\n            outline: `1px solid ${tokens.colors.cardHoverBorder}`,\n            backgroundColor: tokens.colors.cardHoverBackground,\n          },\n        },\n      },\n    },\n    selectors: {\n      '&:focus': {\n        outline: `2px solid ${tokens.colors.primary}`,\n      },\n      '&:active::before': {\n        outline: `1px solid ${tokens.colors.cardActiveBorder}`,\n        backgroundColor: tokens.colors.cardActiveBackground,\n      },\n    },\n  },\n]);\n\nexport const interactiveCardRecipe = recipe({\n  base: interactiveCardBase,\n\n  variants: {\n    elevation: elevationVariants,\n    variant: {\n      inner: {\n        backgroundColor: tokens.colors.innerCardBgColor,\n      },\n      ghost: {\n        backgroundColor: 'transparent',\n        boxShadow: 'none',\n      },\n    },\n    active: {\n      true: {\n        '::before': {\n          outline: `1px solid ${tokens.colors.cardActiveBorder}`,\n          backgroundColor: tokens.colors.cardActiveBackground,\n        },\n      },\n    },\n  },\n\n  defaultVariants: {\n    elevation: 1,\n  },\n});\n"],"mappings":""}
+{"version":3,"file":"Card.vanilla.css.js","names":["_7a468"],"sources":["../../../components/Card/Card.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { breakpoints } from '../../styles/breakpoints.css';\nimport { tokens } from '../../styles/tokens.css';\n\n// Elevation variants matching Elevation component\nconst elevationVariants = {\n  0: {\n    boxShadow: 'none',\n  },\n  1: {\n    backgroundColor: tokens.colors['01dp'],\n    boxShadow:\n      '0 1px 5px 0 hsla(0, 0%, 0%, 0.2), 0 3px 1px -2px hsla(0, 0%, 0%, 0.12), 0 2px 2px 0 hsla(0, 0%, 0%, 0.14)',\n  },\n  2: {\n    backgroundColor: tokens.colors['02dp'],\n    boxShadow:\n      '0 2px 4px -1px hsla(0, 0%, 0%, 0.2), 0 1px 10px 0 hsla(0, 0%, 0%, 0.12), 0 4px 5px 0 hsla(0, 0%, 0%, 0.14)',\n  },\n  3: {\n    backgroundColor: tokens.colors['03dp'],\n    boxShadow:\n      '0 3px 5px -1px hsla(0, 0%, 0%, 0.2), 0 1px 18px 0 hsla(0, 0%, 0%, 0.12), 0 6px 10px 0 hsla(0, 0%, 0%, 0.14)',\n  },\n  4: {\n    backgroundColor: tokens.colors['04dp'],\n    boxShadow:\n      '0 7px 8px -4px hsla(0, 0%, 0%, 0.2), 0 5px 22px 4px hsla(0, 0%, 0%, 0.12), 0 12px 17px 2px hsla(0, 0%, 0%, 0.14)',\n  },\n  5: {\n    backgroundColor: tokens.colors['05dp'],\n    boxShadow:\n      '0 11px 15px -7px hsla(0, 0%, 0%, 0.2), 0 9px 46px 8px hsla(0, 0%, 0%, 0.12), 0 24px 38px 3px hsla(0, 0%, 0%, 0.14)',\n  },\n} as const;\n\n// Base card styles\nconst cardBase = style({\n  appearance: 'none',\n  border: 'none',\n  boxSizing: 'border-box',\n  font: 'inherit',\n  lineHeight: '1',\n  outline: 'none',\n  padding: tokens.space['3'],\n  textAlign: 'inherit',\n  verticalAlign: 'middle',\n  WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',\n  backgroundColor: tokens.colors.cardBackground,\n  display: 'block',\n  textDecoration: 'none',\n  color: 'inherit',\n  borderRadius: tokens.radii['3'],\n  position: 'relative',\n\n  '::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    borderRadius: tokens.radii['3'],\n    pointerEvents: 'none',\n  },\n});\n\nexport const cardRecipe = recipe({\n  base: cardBase,\n\n  variants: {\n    elevation: elevationVariants,\n    variant: {\n      inner: {\n        backgroundColor: tokens.colors.innerCardBgColor,\n      },\n      ghost: {\n        backgroundColor: 'transparent',\n        boxShadow: 'none',\n      },\n    },\n    active: {\n      true: {\n        '::before': {\n          outline: `1px solid ${tokens.colors.cardActiveBorder}`,\n          backgroundColor: tokens.colors.cardActiveBackground,\n        },\n      },\n    },\n  },\n\n  defaultVariants: {\n    elevation: 1,\n  },\n});\n\n// Interactive card styles (for button element)\nconst interactiveCardBase = style([\n  cardBase,\n  {\n    '@media': {\n      [breakpoints.hover]: {\n        selectors: {\n          '&:hover': {\n            cursor: 'pointer',\n          },\n          '&:hover::before': {\n            outline: `1px solid ${tokens.colors.cardHoverBorder}`,\n            backgroundColor: tokens.colors.cardHoverBackground,\n          },\n        },\n      },\n    },\n    selectors: {\n      '&:focus': {\n        outline: `2px solid ${tokens.colors.primary}`,\n      },\n      '&:active::before': {\n        outline: `1px solid ${tokens.colors.cardActiveBorder}`,\n        backgroundColor: tokens.colors.cardActiveBackground,\n      },\n    },\n  },\n]);\n\nexport const interactiveCardRecipe = recipe({\n  base: interactiveCardBase,\n\n  variants: {\n    elevation: elevationVariants,\n    variant: {\n      inner: {\n        backgroundColor: tokens.colors.innerCardBgColor,\n      },\n      ghost: {\n        backgroundColor: 'transparent',\n        boxShadow: 'none',\n      },\n    },\n    active: {\n      true: {\n        '::before': {\n          outline: `1px solid ${tokens.colors.cardActiveBorder}`,\n          backgroundColor: tokens.colors.cardActiveBackground,\n        },\n      },\n    },\n  },\n\n  defaultVariants: {\n    elevation: 1,\n  },\n});\n"],"mappings":""}

package/dist/components/Card/Card.vanilla.js

@@ -4,7 +4,7 @@ import { cardRecipe, interactiveCardRecipe } from "./Card.vanilla.css.js";
 import { forwardRef } from "react";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx } from "react/jsx-runtime";
-//#region components/Card/Card.vanilla.tsx
+// components/Card/Card.vanilla.tsx
 var CardVanillaComponentImpl = forwardRef(({ as, className, css, style, elevation, variant, active, interactive, ...props }, ref) => {
 	const Component = as || (interactive ? "button" : "div");
 	const { colors } = useVanillaExtractTheme();
@@ -30,7 +30,6 @@ var CardVanillaComponentImpl = forwardRef(({ as, className, css, style, elevatio
 });
 CardVanillaComponentImpl.displayName = "CardVanilla";
 var CardVanilla = CardVanillaComponentImpl;
-//#endregion
 export { CardVanilla };
 
 //# sourceMappingURL=Card.vanilla.js.map

package/dist/components/Checkbox/Checkbox.cjs

@@ -6,7 +6,7 @@ react = require_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
 let _radix_ui_react_checkbox = require("@radix-ui/react-checkbox");
 _radix_ui_react_checkbox = require_runtime.__toESM(_radix_ui_react_checkbox, 1);
-//#region components/Checkbox/Checkbox.tsx
+// components/Checkbox/Checkbox.tsx
 var StyledIndicator = require_stitches_config.styled(_radix_ui_react_checkbox.Indicator, {
 	alignItems: "center",
 	display: "flex",
@@ -81,7 +81,6 @@ var Checkbox = react.default.forwardRef((props, forwardedRef) => {
 		}) })
 	});
 });
-//#endregion
 exports.Checkbox = Checkbox;
 
 //# sourceMappingURL=Checkbox.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.cjs","names":[],"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"],"mappings":";;;;;;;;;AAMA,IAAM,kBAAkB,wBAAA,OAAO,yBAAkB,WAAW;CAC1D,YAAY;CACZ,SAAS;CACT,QAAQ;CACR,gBAAgB;CAChB,OAAO;AACT,CAAC;AAED,IAAM,iBAAiB,wBAAA,OAAO,yBAAkB,MAAM;CACpD,KAAK;CACL,QAAQ;CACR,WAAW;CACX,YAAY;CACZ,aAAa,EACX,WAAW,aACb;CACA,YAAY,EACV,WAAW,aACb;CAEA,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,yBAAyB;CACzB,UAAU;CAEV,yBAAyB;EACvB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW,EACT,iBAAiB,0BACnB,EACF;CACF;CAEA,2BAA2B;EACzB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW;GACT,iBAAiB;GACjB,WAAW;EACb,EACF;CACF;CAEA,WAAW;EACT,SAAS;EACT,WAAW;CACb;CAEA,cAAc;EACZ,eAAe;EACf,iBAAiB;EACjB,WAAW;EACX,kBAAkB,EAChB,OAAO,wBACT;GAEC,KAAK,oBAAoB,EACxB,YAAY,EACV,iBAAiB,+BACnB,EACF;CACF;CAEA,UAAU,EACR,MAAM;EACJ,QAAQ;GACN,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;EACA,OAAO;GACL,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;CACF,EACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAMD,IAAa,WAAW,MAAA,QAAM,YAC3B,OAAO,iBAAiB;CACvB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,gBAAD;EAAgB,GAAI;EAAO,KAAK;YAC9B,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,sBAAA,WAAD;GAAW,QAAQ;GAAI,OAAO;EAAK,CAAA,EACpB,CAAA;CACH,CAAA;AAEpB,CACF"}
+{"version":3,"file":"Checkbox.cjs","names":["styled","CheckboxPrimitive","React","CheckIcon"],"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"],"mappings":";;;;;;;;;AAMA,IAAM,kBAAkBA,wBAAAA,OAAOC,yBAAkB,WAAW;CAC1D,YAAY;CACZ,SAAS;CACT,QAAQ;CACR,gBAAgB;CAChB,OAAO;AACT,CAAC;AAED,IAAM,iBAAiBD,wBAAAA,OAAOC,yBAAkB,MAAM;CACpD,KAAK;CACL,QAAQ;CACR,WAAW;CACX,YAAY;CACZ,aAAa,EACX,WAAW,aACb;CACA,YAAY,EACV,WAAW,aACb;CAEA,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,yBAAyB;CACzB,UAAU;CAEV,yBAAyB;EACvB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW,EACT,iBAAiB,0BACnB,EACF;CACF;CAEA,2BAA2B;EACzB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW;GACT,iBAAiB;GACjB,WAAW;EACb,EACF;CACF;CAEA,WAAW;EACT,SAAS;EACT,WAAW;CACb;CAEA,cAAc;EACZ,eAAe;EACf,iBAAiB;EACjB,WAAW;EACX,kBAAkB,EAChB,OAAO,wBACT;GAEC,KAAK,oBAAoB,EACxB,YAAY,EACV,iBAAiB,+BACnB,EACF;CACF;CAEA,UAAU,EACR,MAAM;EACJ,QAAQ;GACN,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;EACA,OAAO;GACL,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;CACF,EACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAMD,IAAa,WAAWC,MAAAA,QAAM,YAC3B,OAAO,iBAAiB;CACvB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,gBAAD;EAAgB,GAAI;EAAO,KAAK;EAC9B,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,sBAAAA,WAAD;GAAW,QAAQ;GAAI,OAAO;EAAK,CAAA,EACpB,CAAA;CACH,CAAA;AAEpB,CACF"}

package/dist/components/Checkbox/Checkbox.js

@@ -3,7 +3,7 @@ import { CheckIcon } from "@radix-ui/react-icons";
 import React from "react";
 import { jsx } from "react/jsx-runtime";
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-//#region components/Checkbox/Checkbox.tsx
+// components/Checkbox/Checkbox.tsx
 var StyledIndicator = styled(CheckboxPrimitive.Indicator, {
 	alignItems: "center",
 	display: "flex",
@@ -78,7 +78,6 @@ var Checkbox = React.forwardRef((props, forwardedRef) => {
 		}) })
 	});
 });
-//#endregion
 export { Checkbox };
 
 //# sourceMappingURL=Checkbox.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":[],"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"],"mappings":";;;;;;AAMA,IAAM,kBAAkB,OAAO,kBAAkB,WAAW;CAC1D,YAAY;CACZ,SAAS;CACT,QAAQ;CACR,gBAAgB;CAChB,OAAO;AACT,CAAC;AAED,IAAM,iBAAiB,OAAO,kBAAkB,MAAM;CACpD,KAAK;CACL,QAAQ;CACR,WAAW;CACX,YAAY;CACZ,aAAa,EACX,WAAW,aACb;CACA,YAAY,EACV,WAAW,aACb;CAEA,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,yBAAyB;CACzB,UAAU;CAEV,yBAAyB;EACvB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW,EACT,iBAAiB,0BACnB,EACF;CACF;CAEA,2BAA2B;EACzB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW;GACT,iBAAiB;GACjB,WAAW;EACb,EACF;CACF;CAEA,WAAW;EACT,SAAS;EACT,WAAW;CACb;CAEA,cAAc;EACZ,eAAe;EACf,iBAAiB;EACjB,WAAW;EACX,kBAAkB,EAChB,OAAO,wBACT;GAEC,KAAK,oBAAoB,EACxB,YAAY,EACV,iBAAiB,+BACnB,EACF;CACF;CAEA,UAAU,EACR,MAAM;EACJ,QAAQ;GACN,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;EACA,OAAO;GACL,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;CACF,EACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAMD,IAAa,WAAW,MAAM,YAC3B,OAAO,iBAAiB;CACvB,OACE,oBAAC,gBAAD;EAAgB,GAAI;EAAO,KAAK;YAC9B,oBAAC,iBAAD,EAAA,UACE,oBAAC,WAAD;GAAW,QAAQ;GAAI,OAAO;EAAK,CAAA,EACpB,CAAA;CACH,CAAA;AAEpB,CACF"}
+{"version":3,"file":"Checkbox.js","names":[],"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"],"mappings":";;;;;;AAMA,IAAM,kBAAkB,OAAO,kBAAkB,WAAW;CAC1D,YAAY;CACZ,SAAS;CACT,QAAQ;CACR,gBAAgB;CAChB,OAAO;AACT,CAAC;AAED,IAAM,iBAAiB,OAAO,kBAAkB,MAAM;CACpD,KAAK;CACL,QAAQ;CACR,WAAW;CACX,YAAY;CACZ,aAAa,EACX,WAAW,aACb;CACA,YAAY,EACV,WAAW,aACb;CAEA,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,yBAAyB;CACzB,UAAU;CAEV,yBAAyB;EACvB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW,EACT,iBAAiB,0BACnB,EACF;CACF;CAEA,2BAA2B;EACzB,iBAAiB;EACjB,WAAW;EACX,OAAO;EAEP,UAAU,EACR,WAAW;GACT,iBAAiB;GACjB,WAAW;EACb,EACF;CACF;CAEA,WAAW;EACT,SAAS;EACT,WAAW;CACb;CAEA,cAAc;EACZ,eAAe;EACf,iBAAiB;EACjB,WAAW;EACX,kBAAkB,EAChB,OAAO,wBACT;GAEC,KAAK,oBAAoB,EACxB,YAAY,EACV,iBAAiB,+BACnB,EACF;CACF;CAEA,UAAU,EACR,MAAM;EACJ,QAAQ;GACN,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;EACA,OAAO;GACL,OAAO;GACP,QAAQ;GACR,cAAc;EAChB;CACF,EACF;CACA,iBAAiB,EACf,MAAM,SACR;AACF,CAAC;AAMD,IAAa,WAAW,MAAM,YAC3B,OAAO,iBAAiB;CACvB,OACE,oBAAC,gBAAD;EAAgB,GAAI;EAAO,KAAK;EAC9B,UAAA,oBAAC,iBAAD,EAAA,UACE,oBAAC,WAAD;GAAW,QAAQ;GAAI,OAAO;EAAK,CAAA,EACpB,CAAA;CACH,CAAA;AAEpB,CACF"}

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

@@ -1,7 +1,7 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 let tinycolor2 = require("tinycolor2");
 tinycolor2 = require_runtime.__toESM(tinycolor2, 1);
-//#region components/Checkbox/Checkbox.themes.ts
+// components/Checkbox/Checkbox.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = (primaryColor) => ({
@@ -33,7 +33,6 @@ var Theme;
 		checkboxIndicatorDisabledBg: "$deepBlue1"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 Object.defineProperty(exports, "Theme", {
 	enumerable: true,
 	get: function() {

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.themes.cjs","names":[],"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"],"mappings":";;;;AAKO,IAAA;;CAkBQ,OAAA,YAAqB,kBAAkB;EAClD,cAAc;EACd,YAAY;EACZ,gBAAgB;EAChB,mBAAmB;EACnB,qBAAqB;EACrB,yBAAA,GAAA,WAAA,QAAA,CAAkC,aAAa,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY;EAC3E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,8BAAA,GAAA,WAAA,QAAA,CAAuC,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;CACvF;CAEa,OAAA,WAAoB,kBAAkB;EACjD,cAAc;EACd,YAAY;EACZ,mBAAmB;EACnB,gBAAgB;EAChB,qBAAqB;EACrB,yBAAA,GAAA,WAAA,QAAA,CAAkC,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC9E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,qBAAA,GAAA,WAAA,QAAA,CAA8B,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EAC5E,wBAAwB;EACxB,6BAA6B;CAC/B;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"Checkbox.themes.cjs","names":["tinycolor"],"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"],"mappings":";;;;AAKO,IAAU;CAAV,SAAA,QAAA;CAkBQ,OAAA,YAAqB,kBAAkB;EAClD,cAAc;EACd,YAAY;EACZ,gBAAgB;EAChB,mBAAmB;EACnB,qBAAqB;EACrB,yBAAA,GAAwBA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY;EAC3E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,8BAAA,GAA6BA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;CACvF;CAEa,OAAA,WAAoB,kBAAkB;EACjD,cAAc;EACd,YAAY;EACZ,mBAAmB;EACnB,gBAAgB;EAChB,qBAAqB;EACrB,yBAAA,GAAwBA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC9E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,qBAAA,GAAoBA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EAC5E,wBAAwB;EACxB,6BAA6B;CAC/B;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

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

@@ -1,5 +1,5 @@
 import tinycolor from "tinycolor2";
-//#region components/Checkbox/Checkbox.themes.ts
+// components/Checkbox/Checkbox.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = (primaryColor) => ({
@@ -31,7 +31,6 @@ var Theme;
 		checkboxIndicatorDisabledBg: "$deepBlue1"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 export { Theme };
 
 //# sourceMappingURL=Checkbox.themes.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.themes.js","names":[],"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"],"mappings":";;AAKO,IAAA;;CAkBQ,OAAA,YAAqB,kBAAkB;EAClD,cAAc;EACd,YAAY;EACZ,gBAAgB;EAChB,mBAAmB;EACnB,qBAAqB;EACrB,wBAAwB,UAAU,aAAa,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY;EAC3E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,6BAA6B,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;CACvF;CAEa,OAAA,WAAoB,kBAAkB;EACjD,cAAc;EACd,YAAY;EACZ,mBAAmB;EACnB,gBAAgB;EAChB,qBAAqB;EACrB,wBAAwB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC9E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EAC5E,wBAAwB;EACxB,6BAA6B;CAC/B;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"Checkbox.themes.js","names":[],"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"],"mappings":";;AAKO,IAAU;CAAV,SAAA,QAAA;CAkBQ,OAAA,YAAqB,kBAAkB;EAClD,cAAc;EACd,YAAY;EACZ,gBAAgB;EAChB,mBAAmB;EACnB,qBAAqB;EACrB,wBAAwB,UAAU,aAAa,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY;EAC3E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,6BAA6B,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;CACvF;CAEa,OAAA,WAAoB,kBAAkB;EACjD,cAAc;EACd,YAAY;EACZ,mBAAmB;EACnB,gBAAgB;EAChB,qBAAqB;EACrB,wBAAwB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC9E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EAC5E,wBAAwB;EACxB,6BAA6B;CAC/B;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/CodeBlock/CodeBlock.cjs

@@ -10,7 +10,7 @@ let react = require("react");
 react = require_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
 let prism_react_renderer = require("prism-react-renderer");
-//#region components/CodeBlock/CodeBlock.tsx
+// components/CodeBlock/CodeBlock.tsx
 var Pre = require_stitches_config.styled("pre", {
 	m: 0,
 	borderRadius: "$2",
@@ -153,7 +153,6 @@ var CodeBlock = (0, react.forwardRef)(({ lang = "text", code, copyable = false,
 	});
 });
 CodeBlock.displayName = "CodeBlock";
-//#endregion
 exports.CodeBlock = CodeBlock;
 
 //# sourceMappingURL=CodeBlock.cjs.map

package/dist/components/CodeBlock/CodeBlock.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  ComponentProps,\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSS, styled } from '../../stitches.config';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { useColorScheme } from '../colorSchemeContext';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nconst Pre = styled('pre', {\n  m: 0,\n  borderRadius: '$2',\n  overflow: 'auto',\n  border: '1px solid $colors$deepBlue3',\n  fontSize: '$2',\n  lineHeight: 1.6,\n\n  variants: {\n    noBorder: {\n      true: { border: 'none' },\n    },\n  },\n});\n\nconst CopyButtonWrapper = styled('div', {\n  position: 'absolute',\n  zIndex: 1,\n  variants: {\n    position: {\n      top: { top: '$2', right: '$3' },\n      topLeft: { top: '$2', left: '$3' },\n      bottomRight: { bottom: '$2', right: '$3' },\n      bottomLeft: { bottom: '$2', left: '$3' },\n    },\n  },\n\n  defaultVariants: {\n    position: 'top',\n  },\n});\n\nexport type CodeBlockProps = {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n  css?: CSS;\n} & Omit<ComponentProps<typeof Pre>, 'css'>;\n\nexport const CodeBlock = forwardRef<HTMLPreElement, CodeBlockProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const systemScheme = useColorScheme();\n    const resolvedScheme = colorScheme ?? systemScheme;\n    const prismTheme = resolvedScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n    const buttonPosition = isBottom\n      ? isLeft\n        ? 'bottomLeft'\n        : 'bottomRight'\n      : isLeft\n        ? 'topLeft'\n        : 'top';\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const isBottomAlign = isBottom;\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottomAlign) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const copyButton = copyable ? (\n      <Button\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </Button>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <Box css={{ position: 'relative', ...css }}>\n            <Pre\n              ref={setPreRef}\n              className={[highlightClass, className].filter(Boolean).join(' ')}\n              style={{ maxHeight, ...highlightStyle, backgroundColor: 'inherit', ...style }}\n              noBorder={noBorder}\n              {...props}\n            >\n              <Box\n                css={{\n                  p: '$4',\n                  ...(copyable && isLeft && isBottom ? { pb: '$7' } : {}),\n                  ...(copyable && isLeft && !isBottom ? { pt: '$7' } : {}),\n                }}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </Box>\n            </Pre>\n            {copyButton && (\n              <CopyButtonWrapper ref={buttonWrapperRef} position={buttonPosition}>\n                {copyButton}\n              </CopyButtonWrapper>\n            )}\n          </Box>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlock.displayName = 'CodeBlock';\n"],"mappings":";;;;;;;;;;;;;AAmBA,IAAM,MAAM,wBAAA,OAAO,OAAO;CACxB,GAAG;CACH,cAAc;CACd,UAAU;CACV,QAAQ;CACR,UAAU;CACV,YAAY;CAEZ,UAAU,EACR,UAAU,EACR,MAAM,EAAE,QAAQ,OAAO,EACzB,EACF;AACF,CAAC;AAED,IAAM,oBAAoB,wBAAA,OAAO,OAAO;CACtC,UAAU;CACV,QAAQ;CACR,UAAU,EACR,UAAU;EACR,KAAK;GAAE,KAAK;GAAM,OAAO;EAAK;EAC9B,SAAS;GAAE,KAAK;GAAM,MAAM;EAAK;EACjC,aAAa;GAAE,QAAQ;GAAM,OAAO;EAAK;EACzC,YAAY;GAAE,QAAQ;GAAM,MAAM;EAAK;CACzC,EACF;CAEA,iBAAiB,EACf,UAAU,MACZ;AACF,CAAC;AAiBD,IAAa,aAAA,GAAA,MAAA,WAAA,EAET,EACE,OAAO,QACP,MACA,WAAW,OACX,UACA,YACA,kBAAkB,aAClB,QACA,UACA,WAAW,OACX,aACA,YAAY,KACZ,KACA,OACA,WACA,GAAG,SAEL,QACG;CACH,MAAM,eAAe,2BAAA,eAAe;CAEpC,MAAM,cADiB,eAAe,kBACA,SAAS,qBAAA,OAAO,WAAW,qBAAA,OAAO;CAExE,MAAM,WAAW,gBAAgB,SAAS,QAAQ;CAClD,MAAM,SAAS,gBAAgB,SAAS,MAAM;CAC9C,MAAM,iBAAiB,WACnB,SACE,eACA,gBACF,SACE,YACA;CAEN,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,SAAA,CAAsB,KAAK;CAE1C,MAAM,UAAA,GAAA,MAAA,OAAA,CACJ,IACF;CACA,MAAM,oBAAA,GAAA,MAAA,OAAA,CAA0C,IAAI;CAEpD,MAAM,aAAA,GAAA,MAAA,YAAA,EACH,SAAgC;EAC/B,OAAO,UAAU;EACjB,IAAI,OAAO,QAAQ,YAAY,IAAI,IAAI;OAClC,IAAI,KAAK,IAAuD,UAAU;CACjF,GACA,CAAC,GAAG,CACN;CAEA,CAAA,GAAA,MAAA,gBAAA,OAAsB;EACpB,IAAI,CAAC,UAAU;EACf,MAAM,MAAM,OAAO;EACnB,MAAM,UAAU,iBAAiB;EACjC,IAAI,CAAC,OAAO,CAAC,SAAS;EAEtB,MAAM,gBAAgB;EACtB,MAAM,UAAU,WAAW,IAAI;EAE/B,MAAM,eAAe;GACnB,IAAI,CAAC,QAAQ;IACX,MAAM,aAAa,KAAK,IAAI,GAAG,IAAI,cAAc,IAAI,cAAc,OAAO;IAC1E,QAAQ,MAAM,QAAQ,GAAG,KAAK,WAAW;GAC3C;GACA,IAAI,eAAe;IACjB,MAAM,aAAa,KAAK,IAAI,GAAG,IAAI,eAAe,IAAI,eAAe,OAAO;IAC5E,QAAQ,MAAM,SAAS,GAAG,IAAI,WAAW;GAC3C;EACF;EAEA,OAAO;EACP,MAAM,WAAW,IAAI,eAAe,MAAM;EAC1C,SAAS,QAAQ,GAAG;EACpB,aAAa,SAAS,WAAW;CACnC,GAAG;EAAC;EAAU;EAAU;EAAQ;CAAQ,CAAC;CAEzC,MAAM,aAAa,YAAY;EAC7B,IAAI;GACF,MAAM,UAAU,UAAU,UAAU,IAAI;GACxC,UAAU,IAAI;GACd,SAAS;GACT,iBAAiB,UAAU,KAAK,GAAG,IAAI;EACzC,QAAQ,CAER;CACF;CAEA,MAAM,aAAa,WACjB,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,QAAD;EACE,SAAQ;EACR,OAAA;EACA,MAAK;EACL,MAAK;EACL,SAAS;EACT,KAAK;GACH,OAAO;GACP,KAAK;GACL,iBAAiB;GACjB,QAAQ;EACV;YAXF,CAaE,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAA,gBAAD;GAAgB,OAAO,SAAS,WAAW;aACxC,SAAS,iBAAA,GAAA,kBAAA,IAAA,CAAC,sBAAA,WAAD,CAAY,CAAA,IAAI,iBAAA,GAAA,kBAAA,IAAA,CAAC,sBAAA,UAAD,CAAW,CAAA;EACvB,CAAA,GACf,SAAS,aAAa,QACjB;MACN;CAEJ,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAA,WAAD;EACE,OAAO;EACD;EACN,UAAW,qBAAA,MAAM,UAAU,SAAS,OAAO,OAAO;aAEhD,EACA,WAAW,gBACX,OAAO,gBACP,QACA,cACA,oBAEA,iBAAA,GAAA,kBAAA,KAAA,CAAC,YAAA,KAAD;GAAK,KAAK;IAAE,UAAU;IAAY,GAAG;GAAI;aAAzC,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;IACE,KAAK;IACL,WAAW,CAAC,gBAAgB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;IAC/D,OAAO;KAAE;KAAW,GAAG;KAAgB,iBAAiB;KAAW,GAAG;IAAM;IAClE;IACV,GAAI;cAEJ,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAA,KAAD;KACE,KAAK;MACH,GAAG;MACH,GAAI,YAAY,UAAU,WAAW,EAAE,IAAI,KAAK,IAAI,CAAC;MACrD,GAAI,YAAY,UAAU,CAAC,WAAW,EAAE,IAAI,KAAK,IAAI,CAAC;KACxD;eAEC,OAAO,KAAK,MAAM,MACjB,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;MAEE,GAAI,aAAa,EAAE,KAAK,CAAC;MACzB,OACE,WAAW;OAAE,YAAY;OAAY,WAAW;MAAY,IAAI,KAAA;gBAGjE,KAAK,KAAK,OAAO,QAChB,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAgB,GAAI,cAAc,EAAE,MAAM,CAAC,EAAI,GAApC,GAAoC,CAChD;KACE,GATE,CASF,CACN;IACE,CAAA;GACF,CAAA,GACJ,cACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAD;IAAmB,KAAK;IAAkB,UAAU;cACjD;GACgB,CAAA,CAElB;;CAEE,CAAA;AAEf,CACF;AAEA,UAAU,cAAc"}
+{"version":3,"file":"CodeBlock.cjs","names":["styled","forwardRef","useColorScheme","themes","useState","useRef","useCallback","Button","AccessibleIcon","CheckIcon","CopyIcon","Highlight","Prism","Box"],"sources":["../../../components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  ComponentProps,\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSS, styled } from '../../stitches.config';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { useColorScheme } from '../colorSchemeContext';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nconst Pre = styled('pre', {\n  m: 0,\n  borderRadius: '$2',\n  overflow: 'auto',\n  border: '1px solid $colors$deepBlue3',\n  fontSize: '$2',\n  lineHeight: 1.6,\n\n  variants: {\n    noBorder: {\n      true: { border: 'none' },\n    },\n  },\n});\n\nconst CopyButtonWrapper = styled('div', {\n  position: 'absolute',\n  zIndex: 1,\n  variants: {\n    position: {\n      top: { top: '$2', right: '$3' },\n      topLeft: { top: '$2', left: '$3' },\n      bottomRight: { bottom: '$2', right: '$3' },\n      bottomLeft: { bottom: '$2', left: '$3' },\n    },\n  },\n\n  defaultVariants: {\n    position: 'top',\n  },\n});\n\nexport type CodeBlockProps = {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n  css?: CSS;\n} & Omit<ComponentProps<typeof Pre>, 'css'>;\n\nexport const CodeBlock = forwardRef<HTMLPreElement, CodeBlockProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const systemScheme = useColorScheme();\n    const resolvedScheme = colorScheme ?? systemScheme;\n    const prismTheme = resolvedScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n    const buttonPosition = isBottom\n      ? isLeft\n        ? 'bottomLeft'\n        : 'bottomRight'\n      : isLeft\n        ? 'topLeft'\n        : 'top';\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const isBottomAlign = isBottom;\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottomAlign) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const copyButton = copyable ? (\n      <Button\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </Button>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <Box css={{ position: 'relative', ...css }}>\n            <Pre\n              ref={setPreRef}\n              className={[highlightClass, className].filter(Boolean).join(' ')}\n              style={{ maxHeight, ...highlightStyle, backgroundColor: 'inherit', ...style }}\n              noBorder={noBorder}\n              {...props}\n            >\n              <Box\n                css={{\n                  p: '$4',\n                  ...(copyable && isLeft && isBottom ? { pb: '$7' } : {}),\n                  ...(copyable && isLeft && !isBottom ? { pt: '$7' } : {}),\n                }}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </Box>\n            </Pre>\n            {copyButton && (\n              <CopyButtonWrapper ref={buttonWrapperRef} position={buttonPosition}>\n                {copyButton}\n              </CopyButtonWrapper>\n            )}\n          </Box>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlock.displayName = 'CodeBlock';\n"],"mappings":"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"}

package/dist/components/CodeBlock/CodeBlock.js

@@ -8,7 +8,7 @@ import { CheckIcon, CopyIcon } from "@radix-ui/react-icons";
 import { forwardRef, useCallback, useLayoutEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Highlight, themes } from "prism-react-renderer";
-//#region components/CodeBlock/CodeBlock.tsx
+// components/CodeBlock/CodeBlock.tsx
 var Pre = styled("pre", {
 	m: 0,
 	borderRadius: "$2",
@@ -151,7 +151,6 @@ var CodeBlock = forwardRef(({ lang = "text", code, copyable = false, copyText, c
 	});
 });
 CodeBlock.displayName = "CodeBlock";
-//#endregion
 export { CodeBlock };
 
 //# sourceMappingURL=CodeBlock.js.map

package/dist/components/CodeBlock/CodeBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  ComponentProps,\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSS, styled } from '../../stitches.config';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { useColorScheme } from '../colorSchemeContext';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nconst Pre = styled('pre', {\n  m: 0,\n  borderRadius: '$2',\n  overflow: 'auto',\n  border: '1px solid $colors$deepBlue3',\n  fontSize: '$2',\n  lineHeight: 1.6,\n\n  variants: {\n    noBorder: {\n      true: { border: 'none' },\n    },\n  },\n});\n\nconst CopyButtonWrapper = styled('div', {\n  position: 'absolute',\n  zIndex: 1,\n  variants: {\n    position: {\n      top: { top: '$2', right: '$3' },\n      topLeft: { top: '$2', left: '$3' },\n      bottomRight: { bottom: '$2', right: '$3' },\n      bottomLeft: { bottom: '$2', left: '$3' },\n    },\n  },\n\n  defaultVariants: {\n    position: 'top',\n  },\n});\n\nexport type CodeBlockProps = {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n  css?: CSS;\n} & Omit<ComponentProps<typeof Pre>, 'css'>;\n\nexport const CodeBlock = forwardRef<HTMLPreElement, CodeBlockProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const systemScheme = useColorScheme();\n    const resolvedScheme = colorScheme ?? systemScheme;\n    const prismTheme = resolvedScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n    const buttonPosition = isBottom\n      ? isLeft\n        ? 'bottomLeft'\n        : 'bottomRight'\n      : isLeft\n        ? 'topLeft'\n        : 'top';\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const isBottomAlign = isBottom;\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottomAlign) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const copyButton = copyable ? (\n      <Button\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </Button>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <Box css={{ position: 'relative', ...css }}>\n            <Pre\n              ref={setPreRef}\n              className={[highlightClass, className].filter(Boolean).join(' ')}\n              style={{ maxHeight, ...highlightStyle, backgroundColor: 'inherit', ...style }}\n              noBorder={noBorder}\n              {...props}\n            >\n              <Box\n                css={{\n                  p: '$4',\n                  ...(copyable && isLeft && isBottom ? { pb: '$7' } : {}),\n                  ...(copyable && isLeft && !isBottom ? { pt: '$7' } : {}),\n                }}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </Box>\n            </Pre>\n            {copyButton && (\n              <CopyButtonWrapper ref={buttonWrapperRef} position={buttonPosition}>\n                {copyButton}\n              </CopyButtonWrapper>\n            )}\n          </Box>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlock.displayName = 'CodeBlock';\n"],"mappings":"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"}
+{"version":3,"file":"CodeBlock.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  ComponentProps,\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSS, styled } from '../../stitches.config';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { useColorScheme } from '../colorSchemeContext';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nconst Pre = styled('pre', {\n  m: 0,\n  borderRadius: '$2',\n  overflow: 'auto',\n  border: '1px solid $colors$deepBlue3',\n  fontSize: '$2',\n  lineHeight: 1.6,\n\n  variants: {\n    noBorder: {\n      true: { border: 'none' },\n    },\n  },\n});\n\nconst CopyButtonWrapper = styled('div', {\n  position: 'absolute',\n  zIndex: 1,\n  variants: {\n    position: {\n      top: { top: '$2', right: '$3' },\n      topLeft: { top: '$2', left: '$3' },\n      bottomRight: { bottom: '$2', right: '$3' },\n      bottomLeft: { bottom: '$2', left: '$3' },\n    },\n  },\n\n  defaultVariants: {\n    position: 'top',\n  },\n});\n\nexport type CodeBlockProps = {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n  css?: CSS;\n} & Omit<ComponentProps<typeof Pre>, 'css'>;\n\nexport const CodeBlock = forwardRef<HTMLPreElement, CodeBlockProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const systemScheme = useColorScheme();\n    const resolvedScheme = colorScheme ?? systemScheme;\n    const prismTheme = resolvedScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n    const buttonPosition = isBottom\n      ? isLeft\n        ? 'bottomLeft'\n        : 'bottomRight'\n      : isLeft\n        ? 'topLeft'\n        : 'top';\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const isBottomAlign = isBottom;\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottomAlign) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const copyButton = copyable ? (\n      <Button\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </Button>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <Box css={{ position: 'relative', ...css }}>\n            <Pre\n              ref={setPreRef}\n              className={[highlightClass, className].filter(Boolean).join(' ')}\n              style={{ maxHeight, ...highlightStyle, backgroundColor: 'inherit', ...style }}\n              noBorder={noBorder}\n              {...props}\n            >\n              <Box\n                css={{\n                  p: '$4',\n                  ...(copyable && isLeft && isBottom ? { pb: '$7' } : {}),\n                  ...(copyable && isLeft && !isBottom ? { pt: '$7' } : {}),\n                }}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </Box>\n            </Pre>\n            {copyButton && (\n              <CopyButtonWrapper ref={buttonWrapperRef} position={buttonPosition}>\n                {copyButton}\n              </CopyButtonWrapper>\n            )}\n          </Box>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlock.displayName = 'CodeBlock';\n"],"mappings":"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"}

package/dist/components/CodeBlock/CodeBlock.themes.cjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.themes.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nexport namespace Theme {\n  type Colors = {\n    codeBlockCopyButtonBg: Property.Color;\n  };\n\n  export function getLight(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n\n  export function getDark(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n}\n"],"mappings":";AAEO,IAAA;;CAKE,SAAS,WAAmB;EACjC,OAAO,EACL,uBAAuB,cACzB;CACF;;CAEO,SAAS,UAAkB;EAChC,OAAO,EACL,uBAAuB,cACzB;CACF;;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"CodeBlock.themes.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nexport namespace Theme {\n  type Colors = {\n    codeBlockCopyButtonBg: Property.Color;\n  };\n\n  export function getLight(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n\n  export function getDark(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n}\n"],"mappings":";AAEO,IAAU;CAAV,SAAA,QAAA;CAKE,SAAS,WAAmB;EACjC,OAAO,EACL,uBAAuB,cACzB;CACF;;CAEO,SAAS,UAAkB;EAChC,OAAO,EACL,uBAAuB,cACzB;CACF;;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/CodeBlock/CodeBlock.themes.js

@@ -1,4 +1,4 @@
-//#region components/CodeBlock/CodeBlock.themes.ts
+// components/CodeBlock/CodeBlock.themes.ts
 var Theme;
 (function(_Theme) {
 	function getLight() {
@@ -10,7 +10,6 @@ var Theme;
 	}
 	_Theme.getDark = getDark;
 })(Theme || (Theme = {}));
-//#endregion
 export { Theme };
 
 //# sourceMappingURL=CodeBlock.themes.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.themes.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nexport namespace Theme {\n  type Colors = {\n    codeBlockCopyButtonBg: Property.Color;\n  };\n\n  export function getLight(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n\n  export function getDark(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n}\n"],"mappings":";AAEO,IAAA;;CAKE,SAAS,WAAmB;EACjC,OAAO,EACL,uBAAuB,cACzB;CACF;;CAEO,SAAS,UAAkB;EAChC,OAAO,EACL,uBAAuB,cACzB;CACF;;GACD,UAAA,QAAA,CAAA,EAAD"}
+{"version":3,"file":"CodeBlock.themes.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nexport namespace Theme {\n  type Colors = {\n    codeBlockCopyButtonBg: Property.Color;\n  };\n\n  export function getLight(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n\n  export function getDark(): Colors {\n    return {\n      codeBlockCopyButtonBg: 'transparent',\n    };\n  }\n}\n"],"mappings":";AAEO,IAAU;CAAV,SAAA,QAAA;CAKE,SAAS,WAAmB;EACjC,OAAO,EACL,uBAAuB,cACzB;CACF;;CAEO,SAAS,UAAkB;EAChC,OAAO,EACL,uBAAuB,cACzB;CACF;;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/CodeBlock/CodeBlock.vanilla.cjs

@@ -11,7 +11,7 @@ react = require_runtime.__toESM(react, 1);
 let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
 let react_jsx_runtime = require("react/jsx-runtime");
 let prism_react_renderer = require("prism-react-renderer");
-//#region components/CodeBlock/CodeBlock.vanilla.tsx
+// components/CodeBlock/CodeBlock.vanilla.tsx
 var CodeBlockVanilla = (0, react.forwardRef)(({ lang = "text", code, copyable = false, copyText, copiedText, copyButtonAlign = "top right", onCopy, noBorder, wrapText = false, colorScheme, maxHeight = 424, css, style, className, ...props }, ref) => {
 	const { colors, resolvedTheme } = require_themeContext.useVanillaExtractTheme();
 	const prismTheme = (colorScheme ?? resolvedTheme) === "dark" ? prism_react_renderer.themes.nightOwl : prism_react_renderer.themes.nightOwlLight;
@@ -128,7 +128,6 @@ var CodeBlockVanilla = (0, react.forwardRef)(({ lang = "text", code, copyable =
 	});
 });
 CodeBlockVanilla.displayName = "CodeBlockVanilla";
-//#endregion
 exports.CodeBlockVanilla = CodeBlockVanilla;
 
 //# sourceMappingURL=CodeBlock.vanilla.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.vanilla.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}
+{"version":3,"file":"CodeBlock.vanilla.cjs","names":["forwardRef","useVanillaExtractTheme","themes","processCSSProp","assignInlineVars","useState","useRef","useCallback","copyButtonWrapperBottomLeft","copyButtonWrapperBottomRight","copyButtonWrapperTopLeft","copyButtonWrapperTop","ButtonVanilla","AccessibleIcon","CheckIcon","CopyIcon","Highlight","Prism","pre","preNoBorder","codeContent","codeContentBottomPadding","codeContentTopPadding"],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 ;/* empty css                                       */
-//#region components/CodeBlock/CodeBlock.vanilla.css.ts
+// components/CodeBlock/CodeBlock.vanilla.css.ts
 var pre = "_1krwcuz0";
 var preNoBorder = "_1krwcuz1";
 var codeContent = "_1krwcuz2";
@@ -9,7 +9,6 @@ var copyButtonWrapperTop = "_1krwcuz5";
 var copyButtonWrapperTopLeft = "_1krwcuz6";
 var copyButtonWrapperBottomRight = "_1krwcuz7";
 var copyButtonWrapperBottomLeft = "_1krwcuz8";
-//#endregion
 exports.codeContent = codeContent;
 exports.codeContentBottomPadding = codeContentBottomPadding;
 exports.codeContentTopPadding = codeContentTopPadding;

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

@@ -1,5 +1,5 @@
 /* empty css                                     */
-//#region components/CodeBlock/CodeBlock.vanilla.css.ts
+// components/CodeBlock/CodeBlock.vanilla.css.ts
 var pre = "_1krwcuz0";
 var preNoBorder = "_1krwcuz1";
 var codeContent = "_1krwcuz2";
@@ -9,7 +9,6 @@ var copyButtonWrapperTop = "_1krwcuz5";
 var copyButtonWrapperTopLeft = "_1krwcuz6";
 var copyButtonWrapperBottomRight = "_1krwcuz7";
 var copyButtonWrapperBottomLeft = "_1krwcuz8";
-//#endregion
 export { codeContent, codeContentBottomPadding, codeContentTopPadding, copyButtonWrapperBottomLeft, copyButtonWrapperBottomRight, copyButtonWrapperTop, copyButtonWrapperTopLeft, pre, preNoBorder };
 
 //# sourceMappingURL=CodeBlock.vanilla.css.js.map

package/dist/components/CodeBlock/CodeBlock.vanilla.js

@@ -9,7 +9,7 @@ import { forwardRef, useCallback, useLayoutEffect, useRef, useState } from "reac
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Highlight, themes } from "prism-react-renderer";
-//#region components/CodeBlock/CodeBlock.vanilla.tsx
+// components/CodeBlock/CodeBlock.vanilla.tsx
 var CodeBlockVanilla = forwardRef(({ lang = "text", code, copyable = false, copyText, copiedText, copyButtonAlign = "top right", onCopy, noBorder, wrapText = false, colorScheme, maxHeight = 424, css, style, className, ...props }, ref) => {
 	const { colors, resolvedTheme } = useVanillaExtractTheme();
 	const prismTheme = (colorScheme ?? resolvedTheme) === "dark" ? themes.nightOwl : themes.nightOwlLight;
@@ -126,7 +126,6 @@ var CodeBlockVanilla = forwardRef(({ lang = "text", code, copyable = false, copy
 	});
 });
 CodeBlockVanilla.displayName = "CodeBlockVanilla";
-//#endregion
 export { CodeBlockVanilla };
 
 //# sourceMappingURL=CodeBlock.vanilla.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.vanilla.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}
+{"version":3,"file":"CodeBlock.vanilla.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}

package/dist/components/CodeBlock/prism-extend.cjs

@@ -17,10 +17,14 @@ require("prismjs/components/prism-ruby.js");
 require("prismjs/components/prism-scala.js");
 require("prismjs/components/prism-shell-session.js");
 require("prismjs/components/prism-toml.js");
-//#region components/CodeBlock/prism-extend.ts
+// components/CodeBlock/prism-extend.ts
 for (const [key, value] of Object.entries(prismjs.default.languages)) if (typeof value !== "function" && !(key in prism_react_renderer.Prism.languages)) prism_react_renderer.Prism.languages[key] = value;
 prism_react_renderer.Prism.languages.text = { text: /[\s\S]+/ };
-//#endregion
-exports.Prism = prism_react_renderer.Prism;
+Object.defineProperty(exports, "Prism", {
+	enumerable: true,
+	get: function() {
+		return prism_react_renderer.Prism;
+	}
+});
 
 //# sourceMappingURL=prism-extend.cjs.map