npm - @traefik-labs/faency - Versions diffs - 12.3.7 → 12.3.8 - Mend

@traefik-labs/faency 12.3.7 → 12.3.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (164) hide show

package/dist/components/Button/Button.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.cjs","names":[],"sources":["../../../components/Button/Button.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { ComponentProps, useMemo } from 'react';\n\nimport { CSS, keyframes, styled, VariantProps } from '../../stitches.config';\n\nexport const BUTTON_BASE_STYLES = {\n appearance: 'none',\n userSelect: 'none',\n boxSizing: 'border-box',\n border: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n '&:disabled': {\n pointerEvents: 'none',\n opacity: 0.5,\n },\n};\n\nconst BG_SIZES = {\n small: '$sizes$8',\n medium: '$sizes$9',\n large: '$sizes$10',\n};\n\nconst backgroundSizeAnimation = (size: keyof typeof BG_SIZES) => ({\n $$bgSize: BG_SIZES[size],\n backgroundSize: '$$bgSize',\n backgroundImage: `linear-gradient(\n -45deg,\n transparent 33%,\n $colors$deepBlue4 33%,\n $colors$deepBlue4 66%,\n transparent 66%\n )`,\n animation: `${keyframes({\n '100%': { transform: 'translateX($$bgSize)' },\n })} 500ms linear infinite`,\n});\n\nexport const StyledButton = styled('button', BUTTON_BASE_STYLES, {\n // Reset\n all: 'unset',\n alignItems: 'center',\n overflow: 'hidden',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n },\n\n // Custom reset?\n display: 'inline-flex',\n flexShrink: 0,\n justifyContent: 'center',\n lineHeight: '1',\n\n // Custom\n position: 'relative',\n height: '$5',\n px: '$2',\n fontFamily: '$rubik',\n fontSize: '$3',\n fontWeight: '$medium',\n fontVariantNumeric: 'tabular-nums',\n\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$focusOutline`,\n '&::before': {\n backgroundColor: 'rgba(255, 255, 255, 0.15)',\n },\n '&::after': {\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n backgroundColor: 'rgba(255, 255, 255, 0.15)',\n },\n '&::after': {\n opacity: 0.05,\n },\n },\n },\n\n '&:active': {\n '&::before': {\n backgroundColor: 'rgba(0, 0, 0, 0.15)',\n },\n },\n\n variants: {\n size: {\n small: {\n borderRadius: '$button',\n height: '$5',\n px: '$2',\n fontSize: '$1',\n lineHeight: '$sizes$5',\n },\n medium: {\n borderRadius: '$button',\n height: '$6',\n px: '$3',\n fontSize: '$3',\n lineHeight: '$sizes$6',\n },\n large: {\n borderRadius: '$button',\n height: '$7',\n px: '$3',\n fontSize: '$3',\n lineHeight: '$sizes$7',\n },\n },\n variant: {\n primary: {\n bc: '$buttonPrimaryBg',\n c: '$buttonPrimaryText',\n '&:focus-visible': {\n boxShadow: 'inset 0 0 0 2px $colors$buttonPrimaryFocusBorder',\n },\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$buttonPrimaryBg',\n },\n },\n },\n },\n secondary: {\n bc: '$buttonSecondaryBg',\n c: '$buttonSecondaryText',\n boxShadow: 'inset 0 0 0 2px $colors$buttonSecondaryBorder',\n '&:active': {\n boxShadow: 'inset 0 0 0 1px $colors$buttonSecondaryBorder',\n },\n '&:focus-visible': {\n boxShadow: 'inset 0 0 0 2px $colors$buttonSecondaryFocusBorder',\n },\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$buttonPrimaryBg',\n },\n },\n },\n },\n red: {\n backgroundColor: '$buttonRedBg',\n color: '$buttonRedText',\n '&:focus-visible': {\n boxShadow: 'inset 0 0 0 2px $colors$buttonRedFocusBg',\n },\n },\n },\n state: {\n active: {\n bc: '$deepBlue5',\n c: '$deepBlue11',\n '&:active': {\n backgroundColor: '$deepBlue5',\n },\n },\n waiting: {\n bc: '$deepBlue3',\n boxShadow: `inset 0 0 0 1px $deepBlue4`,\n c: 'transparent',\n overflow: 'hidden',\n pointerEvents: 'none',\n '&::after': {\n left: '-100%',\n width: '200%',\n ...backgroundSizeAnimation('medium'),\n },\n },\n },\n ghost: {\n true: {\n boxShadow: 'none',\n '@hover': {\n '&:hover': {\n boxShadow: 'none',\n },\n },\n },\n },\n rounded: {\n true: {\n borderRadius: '$pill',\n },\n },\n },\n compoundVariants: [\n {\n variant: 'primary',\n ghost: 'true',\n css: {\n color: '$buttonPrimaryBg',\n backgroundColor: 'transparent',\n '@hover': {\n '&:hover': {\n color: '$buttonPrimaryGhostHoverText',\n backgroundColor: 'transparent',\n },\n },\n },\n },\n {\n variant: 'primary',\n state: 'active',\n css: {\n backgroundColor: '$buttonPrimaryFocusBg',\n color: '$buttonPrimaryText',\n boxShadow: 'inset 0 0 0 2px white',\n },\n },\n {\n variant: 'secondary',\n state: 'waiting',\n css: {\n backgroundColor: '$deepBlue3',\n color: 'transparent',\n },\n },\n {\n variant: 'secondary',\n ghost: true,\n css: {\n backgroundColor: 'transparent',\n color: '$buttonSecondaryText',\n boxShadow: 'none',\n },\n },\n {\n variant: 'red',\n state: 'waiting',\n css: {\n backgroundColor: '$deepBlue3',\n color: 'transparent',\n },\n },\n {\n variant: 'red',\n state: 'active',\n css: {\n backgroundColor: '$buttonRedFocusBg',\n color: '$buttonRedText',\n boxShadow: 'inset 0 0 0 2px white',\n },\n },\n {\n variant: 'red',\n ghost: 'true',\n css: {\n color: '$buttonRedBg',\n backgroundColor: 'transparent',\n '@hover': {\n '&:hover': {\n color: '$buttonRedHoverText',\n backgroundColor: 'transparent',\n },\n },\n },\n },\n {\n size: 'small',\n state: 'waiting',\n css: {\n '&::after': backgroundSizeAnimation('small'),\n },\n },\n {\n size: 'large',\n state: 'waiting',\n css: {\n '&::after': backgroundSizeAnimation('large'),\n },\n },\n ],\n defaultVariants: {\n size: 'medium',\n variant: 'primary',\n },\n});\nconst StyledButtonSlot = styled(Slot, StyledButton);\n\nexport interface ButtonVariants extends VariantProps<typeof StyledButton> {}\nexport type ButtonProps = ComponentProps<typeof StyledButton> &\n ButtonVariants & {\n css?: CSS;\n asChild?: boolean;\n as?: string;\n };\n\nexport const Button = React.forwardRef<React.ElementRef<typeof StyledButton>, ButtonProps>(\n ({ children, asChild, ...props }, forwardedRef) => {\n const Component = useMemo(() => (asChild ? StyledButtonSlot : StyledButton), [asChild]);\n return (\n <Component ref={forwardedRef} {...props}>\n {children}\n </Component>\n );\n },\n);\n"],"mappings":";;;;;;;AAKA,IAAa,qBAAqB;CAChC,YAAY;CACZ,YAAY;CACZ,WAAW;CACX,QAAQ;CACR,yBAAyB;CACzB,cAAc;EACZ,eAAe;EACf,SAAS;CACX;AACF;AAEA,IAAM,WAAW;CACf,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,IAAM,2BAA2B,UAAiC;CAChE,UAAU,SAAS;CACnB,gBAAgB;CAChB,iBAAiB;;;;;;;CAOjB,WAAW,GAAG,wBAAA,UAAU,EACtB,QAAQ,EAAE,WAAW,uBAAuB,EAC9C,CAAC,EAAE;AACL;AAEA,IAAa,eAAe,wBAAA,OAAO,UAAU,oBAAoB;CAE/D,KAAK;CACL,YAAY;CACZ,UAAU;CAEV,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;CACT;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;CACT;CAGA,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,YAAY;CAGZ,UAAU;CACV,QAAQ;CACR,IAAI;CACJ,YAAY;CACZ,UAAU;CACV,YAAY;CACZ,oBAAoB;CAEpB,mBAAmB;EACjB,WAAW;EACX,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF;CAEA,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF,EACF;CAEA,YAAY,EACV,aAAa,EACX,iBAAiB,sBACnB,EACF;CAEA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;GACd;GACA,QAAQ;IACN,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;GACd;GACA,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;GACd;EACF;EACA,SAAS;GACP,SAAS;IACP,IAAI;IACJ,GAAG;IACH,mBAAmB,EACjB,WAAW,mDACb;IACA,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,mBACnB,EACF,EACF;GACF;GACA,WAAW;IACT,IAAI;IACJ,GAAG;IACH,WAAW;IACX,YAAY,EACV,WAAW,gDACb;IACA,mBAAmB,EACjB,WAAW,qDACb;IACA,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,mBACnB,EACF,EACF;GACF;GACA,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,mBAAmB,EACjB,WAAW,2CACb;GACF;EACF;EACA,OAAO;GACL,QAAQ;IACN,IAAI;IACJ,GAAG;IACH,YAAY,EACV,iBAAiB,aACnB;GACF;GACA,SAAS;IACP,IAAI;IACJ,WAAW;IACX,GAAG;IACH,UAAU;IACV,eAAe;IACf,YAAY;KACV,MAAM;KACN,OAAO;KACP,GAAG,wBAAwB,QAAQ;IACrC;GACF;EACF;EACA,OAAO,EACL,MAAM;GACJ,WAAW;GACX,UAAU,EACR,WAAW,EACT,WAAW,OACb,EACF;EACF,EACF;EACA,SAAS,EACP,MAAM,EACJ,cAAc,QAChB,EACF;CACF;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;IACnB,EACF;GACF;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;GACb;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;GACT;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;GACb;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;GACT;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;GACb;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;IACnB,EACF;GACF;EACF;EACA;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,OAAO,EAC7C;EACF;EACA;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,OAAO,EAC7C;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;CACX;AACF,CAAC;AACD,IAAM,mBAAmB,wBAAA,OAAO,qBAAA,MAAM,YAAY;AAUlD,IAAa,SAAS,MAAA,QAAM,YACzB,EAAE,UAAU,SAAS,GAAG,SAAS,iBAAiB;CAEjD,OACE,iBAAA,GAAA,kBAAA,MAAA,GAAA,MAAA,eAF+B,UAAU,mBAAmB,cAAe,CAAC,OAAO,CAElF,GAAD;EAAW,KAAK;EAAc,GAAI;EAC/B;CACQ,CAAA;AAEf,CACF"}
1	+ {"version":3,"file":"Button.cjs","names":[],"sources":["../../../components/Button/Button.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { ComponentProps, useMemo } from 'react';\n\nimport { CSS, keyframes, styled, VariantProps } from '../../stitches.config';\n\nexport const BUTTON_BASE_STYLES = {\n appearance: 'none',\n userSelect: 'none',\n boxSizing: 'border-box',\n border: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n '&:disabled': {\n pointerEvents: 'none',\n opacity: 0.5,\n },\n};\n\nconst BG_SIZES = {\n small: '$sizes$8',\n medium: '$sizes$9',\n large: '$sizes$10',\n};\n\nconst backgroundSizeAnimation = (size: keyof typeof BG_SIZES) => ({\n $$bgSize: BG_SIZES[size],\n backgroundSize: '$$bgSize',\n backgroundImage: `linear-gradient(\n -45deg,\n transparent 33%,\n $colors$deepBlue4 33%,\n $colors$deepBlue4 66%,\n transparent 66%\n )`,\n animation: `${keyframes({\n '100%': { transform: 'translateX($$bgSize)' },\n })} 500ms linear infinite`,\n});\n\nexport const StyledButton = styled('button', BUTTON_BASE_STYLES, {\n // Reset\n all: 'unset',\n alignItems: 'center',\n overflow: 'hidden',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n },\n\n // Custom reset?\n display: 'inline-flex',\n flexShrink: 0,\n justifyContent: 'center',\n lineHeight: '1',\n\n // Custom\n position: 'relative',\n height: '$5',\n px: '$2',\n fontFamily: '$rubik',\n fontSize: '$3',\n fontWeight: '$medium',\n fontVariantNumeric: 'tabular-nums',\n\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$focusOutline`,\n '&::before': {\n backgroundColor: 'rgba(255, 255, 255, 0.15)',\n },\n '&::after': {\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n backgroundColor: 'rgba(255, 255, 255, 0.15)',\n },\n '&::after': {\n opacity: 0.05,\n },\n },\n },\n\n '&:active': {\n '&::before': {\n backgroundColor: 'rgba(0, 0, 0, 0.15)',\n },\n },\n\n variants: {\n size: {\n small: {\n borderRadius: '$button',\n height: '$5',\n px: '$2',\n fontSize: '$1',\n lineHeight: '$sizes$5',\n },\n medium: {\n borderRadius: '$button',\n height: '$6',\n px: '$3',\n fontSize: '$3',\n lineHeight: '$sizes$6',\n },\n large: {\n borderRadius: '$button',\n height: '$7',\n px: '$3',\n fontSize: '$3',\n lineHeight: '$sizes$7',\n },\n },\n variant: {\n primary: {\n bc: '$buttonPrimaryBg',\n c: '$buttonPrimaryText',\n '&:focus-visible': {\n boxShadow: 'inset 0 0 0 2px $colors$buttonPrimaryFocusBorder',\n },\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$buttonPrimaryBg',\n },\n },\n },\n },\n secondary: {\n bc: '$buttonSecondaryBg',\n c: '$buttonSecondaryText',\n boxShadow: 'inset 0 0 0 2px $colors$buttonSecondaryBorder',\n '&:active': {\n boxShadow: 'inset 0 0 0 1px $colors$buttonSecondaryBorder',\n },\n '&:focus-visible': {\n boxShadow: 'inset 0 0 0 2px $colors$buttonSecondaryFocusBorder',\n },\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$buttonPrimaryBg',\n },\n },\n },\n },\n red: {\n backgroundColor: '$buttonRedBg',\n color: '$buttonRedText',\n '&:focus-visible': {\n boxShadow: 'inset 0 0 0 2px $colors$buttonRedFocusBg',\n },\n },\n },\n state: {\n active: {\n bc: '$deepBlue5',\n c: '$deepBlue11',\n '&:active': {\n backgroundColor: '$deepBlue5',\n },\n },\n waiting: {\n bc: '$deepBlue3',\n boxShadow: `inset 0 0 0 1px $deepBlue4`,\n c: 'transparent',\n overflow: 'hidden',\n pointerEvents: 'none',\n '&::after': {\n left: '-100%',\n width: '200%',\n ...backgroundSizeAnimation('medium'),\n },\n },\n },\n ghost: {\n true: {\n boxShadow: 'none',\n '@hover': {\n '&:hover': {\n boxShadow: 'none',\n },\n },\n },\n },\n rounded: {\n true: {\n borderRadius: '$pill',\n },\n },\n },\n compoundVariants: [\n {\n variant: 'primary',\n ghost: 'true',\n css: {\n color: '$buttonPrimaryBg',\n backgroundColor: 'transparent',\n '@hover': {\n '&:hover': {\n color: '$buttonPrimaryGhostHoverText',\n backgroundColor: 'transparent',\n },\n },\n },\n },\n {\n variant: 'primary',\n state: 'active',\n css: {\n backgroundColor: '$buttonPrimaryFocusBg',\n color: '$buttonPrimaryText',\n boxShadow: 'inset 0 0 0 2px white',\n },\n },\n {\n variant: 'secondary',\n state: 'waiting',\n css: {\n backgroundColor: '$deepBlue3',\n color: 'transparent',\n },\n },\n {\n variant: 'secondary',\n ghost: true,\n css: {\n backgroundColor: 'transparent',\n color: '$buttonSecondaryText',\n boxShadow: 'none',\n },\n },\n {\n variant: 'red',\n state: 'waiting',\n css: {\n backgroundColor: '$deepBlue3',\n color: 'transparent',\n },\n },\n {\n variant: 'red',\n state: 'active',\n css: {\n backgroundColor: '$buttonRedFocusBg',\n color: '$buttonRedText',\n boxShadow: 'inset 0 0 0 2px white',\n },\n },\n {\n variant: 'red',\n ghost: 'true',\n css: {\n color: '$buttonRedBg',\n backgroundColor: 'transparent',\n '@hover': {\n '&:hover': {\n color: '$buttonRedHoverText',\n backgroundColor: 'transparent',\n },\n },\n },\n },\n {\n size: 'small',\n state: 'waiting',\n css: {\n '&::after': backgroundSizeAnimation('small'),\n },\n },\n {\n size: 'large',\n state: 'waiting',\n css: {\n '&::after': backgroundSizeAnimation('large'),\n },\n },\n ],\n defaultVariants: {\n size: 'medium',\n variant: 'primary',\n },\n});\nconst StyledButtonSlot = styled(Slot, StyledButton);\n\nexport interface ButtonVariants extends VariantProps<typeof StyledButton> {}\nexport type ButtonProps = ComponentProps<typeof StyledButton> &\n ButtonVariants & {\n css?: CSS;\n asChild?: boolean;\n as?: string;\n };\n\nexport const Button = React.forwardRef<React.ElementRef<typeof StyledButton>, ButtonProps>(\n ({ children, asChild, ...props }, forwardedRef) => {\n const Component = useMemo(() => (asChild ? StyledButtonSlot : StyledButton), [asChild]);\n return (\n <Component ref={forwardedRef} {...props}>\n {children}\n </Component>\n );\n },\n);\n"],"mappings":";;;;;;;AAKA,IAAa,qBAAqB;CAChC,YAAY;CACZ,YAAY;CACZ,WAAW;CACX,QAAQ;CACR,yBAAyB;CACzB,cAAc;EACZ,eAAe;EACf,SAAS;CACX;AACF;AAEA,IAAM,WAAW;CACf,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,IAAM,2BAA2B,UAAiC;CAChE,UAAU,SAAS;CACnB,gBAAgB;CAChB,iBAAiB;;;;;;;CAOjB,WAAW,GAAG,wBAAA,UAAU,EACtB,QAAQ,EAAE,WAAW,uBAAuB,EAC9C,CAAC,EAAE;AACL;AAEA,IAAa,eAAe,wBAAA,OAAO,UAAU,oBAAoB;CAE/D,KAAK;CACL,YAAY;CACZ,UAAU;CAEV,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;CACT;CACA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;CACT;CAGA,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,YAAY;CAGZ,UAAU;CACV,QAAQ;CACR,IAAI;CACJ,YAAY;CACZ,UAAU;CACV,YAAY;CACZ,oBAAoB;CAEpB,mBAAmB;EACjB,WAAW;EACX,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF;CAEA,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,4BACnB;EACA,YAAY,EACV,SAAS,IACX;CACF,EACF;CAEA,YAAY,EACV,aAAa,EACX,iBAAiB,sBACnB,EACF;CAEA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;GACd;GACA,QAAQ;IACN,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;GACd;GACA,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;GACd;EACF;EACA,SAAS;GACP,SAAS;IACP,IAAI;IACJ,GAAG;IACH,mBAAmB,EACjB,WAAW,mDACb;IACA,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,mBACnB,EACF,EACF;GACF;GACA,WAAW;IACT,IAAI;IACJ,GAAG;IACH,WAAW;IACX,YAAY,EACV,WAAW,gDACb;IACA,mBAAmB,EACjB,WAAW,qDACb;IACA,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,mBACnB,EACF,EACF;GACF;GACA,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,mBAAmB,EACjB,WAAW,2CACb;GACF;EACF;EACA,OAAO;GACL,QAAQ;IACN,IAAI;IACJ,GAAG;IACH,YAAY,EACV,iBAAiB,aACnB;GACF;GACA,SAAS;IACP,IAAI;IACJ,WAAW;IACX,GAAG;IACH,UAAU;IACV,eAAe;IACf,YAAY;KACV,MAAM;KACN,OAAO;KACP,GAAG,wBAAwB,QAAQ;IACrC;GACF;EACF;EACA,OAAO,EACL,MAAM;GACJ,WAAW;GACX,UAAU,EACR,WAAW,EACT,WAAW,OACb,EACF;EACF,EACF;EACA,SAAS,EACP,MAAM,EACJ,cAAc,QAChB,EACF;CACF;CACA,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;IACnB,EACF;GACF;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;GACb;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;GACT;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;GACb;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;GACT;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;GACb;EACF;EACA;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;IACnB,EACF;GACF;EACF;EACA;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,OAAO,EAC7C;EACF;EACA;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,OAAO,EAC7C;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;CACX;AACF,CAAC;AACD,IAAM,mBAAmB,wBAAA,OAAO,qBAAA,MAAM,YAAY;AAUlD,IAAa,SAAS,MAAA,QAAM,YACzB,EAAE,UAAU,SAAS,GAAG,SAAS,iBAAiB;CAEjD,OACE,iBAAA,GAAA,kBAAA,IAAA,EAAA,GAAA,MAAA,QAAA,OAF+B,UAAU,mBAAmB,cAAe,CAAC,OAAO,CAElF,GAAD;EAAW,KAAK;EAAc,GAAI;EAC/B;CACQ,CAAA;AAEf,CACF"}

package/dist/components/Button/Button.js CHANGED Viewed

@@ -232,6 +232,6 @@ var Button = React.forwardRef(({ children, asChild, ...props }, forwardedRef) =>
 	});
 });
 //#endregion
-export { BUTTON_BASE_STYLES, Button };
+export { BUTTON_BASE_STYLES, Button, StyledButton };
 //# sourceMappingURL=Button.js.map

package/dist/components/Button/Button.themes.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.themes.cjs","names":[],"sources":["../../../components/Button/Button.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 buttonPrimaryBg: Property.Color;\n buttonPrimaryText: Property.Color;\n buttonPrimaryFocusBorder: Property.Color;\n buttonPrimaryGhostHoverText: Property.Color;\n\n buttonSecondaryBg: Property.Color;\n buttonSecondaryText: Property.Color;\n buttonSecondaryBorder: Property.Color;\n buttonSecondaryFocusBorder: Property.Color;\n\n buttonRedBg: Property.Color;\n buttonRedText: Property.Color;\n buttonRedHoverText: Property.Color;\n buttonRedFocusBg: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: 'white',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(6, { alpha: true }),\n buttonPrimaryGhostHoverText: '$deepBlue9',\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: 'hsla(0, 0%, 0%, 0.54)',\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: tinycolor(primaryColor.value).setAlpha(0.19).toHslString(),\n\n buttonRedBg: '$red9',\n buttonRedText: '$loContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA8',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: '$deepBlue2',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(12, { alpha: true }),\n buttonPrimaryGhostHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: tinycolor('white').setAlpha(0.74).toHslString(),\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: '$primary',\n\n buttonRedBg: '$red10',\n buttonRedText: '$hiContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA11',\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAoBQ,OAAA,YAAqB,kBAAkB;EAClD,iBAAiB;EACjB,uBAAA,GAAA,WAAA,~~SAAgC~~,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,GAAG,EAAE,OAAO,KAAK,CAAC;EAC3E,6BAA6B;EAE7B,mBAAmB;EACnB,qBAAqB;EACrB,uBAAuB;EACvB,6BAAA,GAAA,WAAA,~~SAAsC~~,aAAa,KAAK,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;EAErF,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,iBAAiB;EACjB,uBAAA,GAAA,WAAA,~~SAAgC~~,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,IAAI,EAAE,OAAO,KAAK,CAAC;EAC5E,8BAAA,GAAA,WAAA,~~SAAuC~~,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAEnF,mBAAmB;EACnB,sBAAA,GAAA,WAAA,~~SAA~~+B,OAAO,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;EACnE,uBAAuB;EACvB,4BAA4B;EAE5B,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;~~wBACF~~"}
1	+ {"version":3,"file":"Button.themes.cjs","names":[],"sources":["../../../components/Button/Button.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 buttonPrimaryBg: Property.Color;\n buttonPrimaryText: Property.Color;\n buttonPrimaryFocusBorder: Property.Color;\n buttonPrimaryGhostHoverText: Property.Color;\n\n buttonSecondaryBg: Property.Color;\n buttonSecondaryText: Property.Color;\n buttonSecondaryBorder: Property.Color;\n buttonSecondaryFocusBorder: Property.Color;\n\n buttonRedBg: Property.Color;\n buttonRedText: Property.Color;\n buttonRedHoverText: Property.Color;\n buttonRedFocusBg: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: 'white',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(6, { alpha: true }),\n buttonPrimaryGhostHoverText: '$deepBlue9',\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: 'hsla(0, 0%, 0%, 0.54)',\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: tinycolor(primaryColor.value).setAlpha(0.19).toHslString(),\n\n buttonRedBg: '$red9',\n buttonRedText: '$loContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA8',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: '$deepBlue2',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(12, { alpha: true }),\n buttonPrimaryGhostHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: tinycolor('white').setAlpha(0.74).toHslString(),\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: '$primary',\n\n buttonRedBg: '$red10',\n buttonRedText: '$hiContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA11',\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAoBQ,OAAA,YAAqB,kBAAkB;EAClD,iBAAiB;EACjB,uBAAA,GAAA,WAAA,QAAA,CAAgC,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,GAAG,EAAE,OAAO,KAAK,CAAC;EAC3E,6BAA6B;EAE7B,mBAAmB;EACnB,qBAAqB;EACrB,uBAAuB;EACvB,6BAAA,GAAA,WAAA,QAAA,CAAsC,aAAa,KAAK,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAErF,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,iBAAiB;EACjB,uBAAA,GAAA,WAAA,QAAA,CAAgC,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,IAAI,EAAE,OAAO,KAAK,CAAC;EAC5E,8BAAA,GAAA,WAAA,QAAA,CAAuC,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAEnF,mBAAmB;EACnB,sBAAA,GAAA,WAAA,QAAA,CAA+B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACnE,uBAAuB;EACvB,4BAA4B;EAE5B,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;GACD,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Button/Button.themes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.themes.js","names":[],"sources":["../../../components/Button/Button.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 buttonPrimaryBg: Property.Color;\n buttonPrimaryText: Property.Color;\n buttonPrimaryFocusBorder: Property.Color;\n buttonPrimaryGhostHoverText: Property.Color;\n\n buttonSecondaryBg: Property.Color;\n buttonSecondaryText: Property.Color;\n buttonSecondaryBorder: Property.Color;\n buttonSecondaryFocusBorder: Property.Color;\n\n buttonRedBg: Property.Color;\n buttonRedText: Property.Color;\n buttonRedHoverText: Property.Color;\n buttonRedFocusBg: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: 'white',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(6, { alpha: true }),\n buttonPrimaryGhostHoverText: '$deepBlue9',\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: 'hsla(0, 0%, 0%, 0.54)',\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: tinycolor(primaryColor.value).setAlpha(0.19).toHslString(),\n\n buttonRedBg: '$red9',\n buttonRedText: '$loContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA8',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: '$deepBlue2',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(12, { alpha: true }),\n buttonPrimaryGhostHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: tinycolor('white').setAlpha(0.74).toHslString(),\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: '$primary',\n\n buttonRedBg: '$red10',\n buttonRedText: '$hiContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA11',\n });\n}\n"],"mappings":";;AAKO,IAAA;;CAoBQ,OAAA,YAAqB,kBAAkB;EAClD,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,GAAG,EAAE,OAAO,KAAK,CAAC;EAC3E,6BAA6B;EAE7B,mBAAmB;EACnB,qBAAqB;EACrB,uBAAuB;EACvB,4BAA4B,UAAU,aAAa,KAAK,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;EAErF,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,IAAI,EAAE,OAAO,KAAK,CAAC;EAC5E,6BAA6B,UAAU,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAEnF,mBAAmB;EACnB,qBAAqB,UAAU,OAAO,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;EACnE,uBAAuB;EACvB,4BAA4B;EAE5B,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;~~wBACF~~"}
1	+ {"version":3,"file":"Button.themes.js","names":[],"sources":["../../../components/Button/Button.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 buttonPrimaryBg: Property.Color;\n buttonPrimaryText: Property.Color;\n buttonPrimaryFocusBorder: Property.Color;\n buttonPrimaryGhostHoverText: Property.Color;\n\n buttonSecondaryBg: Property.Color;\n buttonSecondaryText: Property.Color;\n buttonSecondaryBorder: Property.Color;\n buttonSecondaryFocusBorder: Property.Color;\n\n buttonRedBg: Property.Color;\n buttonRedText: Property.Color;\n buttonRedHoverText: Property.Color;\n buttonRedFocusBg: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: 'white',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(6, { alpha: true }),\n buttonPrimaryGhostHoverText: '$deepBlue9',\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: 'hsla(0, 0%, 0%, 0.54)',\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: tinycolor(primaryColor.value).setAlpha(0.19).toHslString(),\n\n buttonRedBg: '$red9',\n buttonRedText: '$loContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA8',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n buttonPrimaryBg: '$primary',\n buttonPrimaryFocusBg: tinycolor(primaryColor.value).lighten(10).toHslString(),\n buttonPrimaryText: '$deepBlue2',\n buttonPrimaryFocusBorder: primaryColor.helpers.pickScale(12, { alpha: true }),\n buttonPrimaryGhostHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n\n buttonSecondaryBg: 'transparent',\n buttonSecondaryText: tinycolor('white').setAlpha(0.74).toHslString(),\n buttonSecondaryBorder: '$grayBlue9',\n buttonSecondaryFocusBorder: '$primary',\n\n buttonRedBg: '$red10',\n buttonRedText: '$hiContrast',\n buttonRedHoverText: '$red10',\n buttonRedFocusBg: '$redA11',\n });\n}\n"],"mappings":";;AAKO,IAAA;;CAoBQ,OAAA,YAAqB,kBAAkB;EAClD,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,GAAG,EAAE,OAAO,KAAK,CAAC;EAC3E,6BAA6B;EAE7B,mBAAmB;EACnB,qBAAqB;EACrB,uBAAuB;EACvB,4BAA4B,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAErF,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,IAAI,EAAE,OAAO,KAAK,CAAC;EAC5E,6BAA6B,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAEnF,mBAAmB;EACnB,qBAAqB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACnE,uBAAuB;EACvB,4BAA4B;EAE5B,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;CACpB;GACD,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Button/Button.vanilla.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.vanilla.cjs","names":[],"sources":["../../../components/Button/Button.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { buttonRecipe } from './Button.vanilla.css';\n\ntype ButtonRecipeVariants = RecipeVariants<typeof buttonRecipe>;\n\ninterface ButtonOwnProps extends Omit<ButtonRecipeVariants, never>, CSSProps {}\n\nexport type ButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n C,\n ButtonOwnProps\n>;\n\ntype ButtonVanillaComponent = PolymorphicComponent<'button', ButtonVanillaProps<ElementType>>;\n\nconst ButtonVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'button'>(\n {\n as,\n className,\n css,\n style,\n size,\n variant,\n state,\n ghost,\n rounded,\n ...props\n }: ButtonVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'button';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = buttonRecipe({ size, variant, state, ghost, rounded });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nButtonVanillaComponentImpl.displayName = 'ButtonVanilla';\n\nexport const ButtonVanilla = ButtonVanillaComponentImpl as ButtonVanillaComponent;\n"],"mappings":";;;;;;;AAwBA,IAAM,8BAAA,GAAA,MAAA,~~aAEF~~,EACE,IACA,WACA,KACA,OACA,MACA,SACA,OACA,OACA,SACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,~~kBAAoB~~,IAAI;CAC1B;CAIA,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,WAAD;EACO;EACL,WAAW,GALK,2BAAA,aAAa;GAAE;GAAM;GAAS;GAAO;GAAO;EAAQ,CAKtD,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,2BAA2B,cAAc;AAEzC,IAAa,gBAAgB"}
1	+ {"version":3,"file":"Button.vanilla.cjs","names":[],"sources":["../../../components/Button/Button.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { buttonRecipe } from './Button.vanilla.css';\n\ntype ButtonRecipeVariants = RecipeVariants<typeof buttonRecipe>;\n\ninterface ButtonOwnProps extends Omit<ButtonRecipeVariants, never>, CSSProps {}\n\nexport type ButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n C,\n ButtonOwnProps\n>;\n\ntype ButtonVanillaComponent = PolymorphicComponent<'button', ButtonVanillaProps<ElementType>>;\n\nconst ButtonVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'button'>(\n {\n as,\n className,\n css,\n style,\n size,\n variant,\n state,\n ghost,\n rounded,\n ...props\n }: ButtonVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'button';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = buttonRecipe({ size, variant, state, ghost, rounded });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nButtonVanillaComponentImpl.displayName = 'ButtonVanilla';\n\nexport const ButtonVanilla = ButtonVanillaComponentImpl as ButtonVanillaComponent;\n"],"mappings":";;;;;;;AAwBA,IAAM,8BAAA,GAAA,MAAA,WAAA,EAEF,EACE,IACA,WACA,KACA,OACA,MACA,SACA,OACA,OACA,SACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAC1B;CAIA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GALK,2BAAA,aAAa;GAAE;GAAM;GAAS;GAAO;GAAO;EAAQ,CAKtD,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,2BAA2B,cAAc;AAEzC,IAAa,gBAAgB"}

package/dist/components/ButtonSwitch/ButtonSwitch.themes.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonSwitch.themes.cjs","names":[],"sources":["../../../components/ButtonSwitch/ButtonSwitch.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n buttonSwitchContainerBg: Property.Color;\n buttonSwitchActiveBg: Property.Color;\n buttonSwitchOffBg: Property.Color;\n buttonSwitchOffColor: Property.Color;\n buttonSwitchActiveColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: 'white',\n });\n\n export const getDark: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;CAWQ,OAAA,kBAA2B;EACtC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;CAEa,OAAA,iBAA0B;EACrC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;~~wBACF~~"}
1	+ {"version":3,"file":"ButtonSwitch.themes.cjs","names":[],"sources":["../../../components/ButtonSwitch/ButtonSwitch.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n buttonSwitchContainerBg: Property.Color;\n buttonSwitchActiveBg: Property.Color;\n buttonSwitchOffBg: Property.Color;\n buttonSwitchOffColor: Property.Color;\n buttonSwitchActiveColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: 'white',\n });\n\n export const getDark: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;CAWQ,OAAA,kBAA2B;EACtC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;CAEa,OAAA,iBAA0B;EACrC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;GACD,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/ButtonSwitch/ButtonSwitch.themes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonSwitch.themes.js","names":[],"sources":["../../../components/ButtonSwitch/ButtonSwitch.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n buttonSwitchContainerBg: Property.Color;\n buttonSwitchActiveBg: Property.Color;\n buttonSwitchOffBg: Property.Color;\n buttonSwitchOffColor: Property.Color;\n buttonSwitchActiveColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: 'white',\n });\n\n export const getDark: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;CAWQ,OAAA,kBAA2B;EACtC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;CAEa,OAAA,iBAA0B;EACrC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;~~wBACF~~"}
1	+ {"version":3,"file":"ButtonSwitch.themes.js","names":[],"sources":["../../../components/ButtonSwitch/ButtonSwitch.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n buttonSwitchContainerBg: Property.Color;\n buttonSwitchActiveBg: Property.Color;\n buttonSwitchOffBg: Property.Color;\n buttonSwitchOffColor: Property.Color;\n buttonSwitchActiveColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: 'white',\n });\n\n export const getDark: Factory = () => ({\n buttonSwitchContainerBg: '$02dp',\n buttonSwitchActiveBg: '$primary',\n buttonSwitchOffBg: 'transparent',\n buttonSwitchOffColor: '$hiContrast',\n buttonSwitchActiveColor: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;CAWQ,OAAA,kBAA2B;EACtC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;CAEa,OAAA,iBAA0B;EACrC,yBAAyB;EACzB,sBAAsB;EACtB,mBAAmB;EACnB,sBAAsB;EACtB,yBAAyB;CAC3B;GACD,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/ButtonSwitch/ButtonSwitch.vanilla.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonSwitch.vanilla.cjs","names":[],"sources":["../../../components/ButtonSwitch/ButtonSwitch.vanilla.tsx"],"sourcesContent":["import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { buttonSwitchContainer, buttonSwitchItem } from './ButtonSwitch.vanilla.css';\n\n// Container Component\ninterface ButtonSwitchContainerOwnProps extends CSSProps {\n type?: 'single' \| 'multiple';\n value?: string \| string[];\n defaultValue?: string \| string[];\n onValueChange?: (value: any) => void;\n disabled?: boolean;\n rovingFocus?: boolean;\n loop?: boolean;\n orientation?: 'horizontal' \| 'vertical';\n dir?: 'ltr' \| 'rtl';\n}\n\nexport type ButtonSwitchContainerVanillaProps<C extends ElementType = 'div'> =\n PolymorphicComponentProps<C, ButtonSwitchContainerOwnProps>;\n\ntype ButtonSwitchContainerVanillaComponent = PolymorphicComponent<\n 'div',\n ButtonSwitchContainerVanillaProps<ElementType>\n>;\n\nconst ButtonSwitchContainerVanillaImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, children, ...props }: ButtonSwitchContainerVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'div') as any;\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n if (as) {\n return (\n <Component\n ref={ref}\n className={`${buttonSwitchContainer} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n role=\"group\"\n {...props}\n >\n {children}\n </Component>\n );\n }\n\n return (\n <ToggleGroupPrimitive.Root\n ref={ref as any}\n className={`${buttonSwitchContainer} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...(props as any)}\n >\n {children}\n </ToggleGroupPrimitive.Root>\n );\n },\n);\n\nButtonSwitchContainerVanillaImpl.displayName = 'ButtonSwitchContainerVanilla';\n\nexport const ButtonSwitchContainerVanilla =\n ButtonSwitchContainerVanillaImpl as ButtonSwitchContainerVanillaComponent;\n\n// Item Component\ninterface ButtonSwitchItemOwnProps extends CSSProps {\n value: string;\n disabled?: boolean;\n}\n\nexport type ButtonSwitchItemVanillaProps<C extends ElementType = 'button'> =\n PolymorphicComponentProps<C, ButtonSwitchItemOwnProps>;\n\ntype ButtonSwitchItemVanillaComponent = PolymorphicComponent<\n 'button',\n ButtonSwitchItemVanillaProps<ElementType>\n>;\n\nconst ButtonSwitchItemVanillaImpl = forwardRef(\n <C extends ElementType = 'button'>(\n { as, className, css, style, children, ...props }: ButtonSwitchItemVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'button') as any;\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n if (as) {\n return (\n <Component\n ref={ref}\n className={`${buttonSwitchItem} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n role=\"radio\"\n {...props}\n >\n {children}\n </Component>\n );\n }\n\n return (\n <ToggleGroupPrimitive.Item\n ref={ref as any}\n className={`${buttonSwitchItem} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...(props as any)}\n >\n {children}\n </ToggleGroupPrimitive.Item>\n );\n },\n);\n\nButtonSwitchItemVanillaImpl.displayName = 'ButtonSwitchItemVanilla';\n\nexport const ButtonSwitchItemVanilla =\n ButtonSwitchItemVanillaImpl as ButtonSwitchItemVanillaComponent;\n"],"mappings":";;;;;;;;;;AAkCA,IAAM,oCAAA,GAAA,MAAA,~~aAEF~~,EAAE,IAAI,WAAW,KAAK,OAAO,UAAU,GAAG,SAC1C,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,~~kBAAoB~~,IAAI;CAC1B;CAEA,IAAI,IACF,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,WAAD;EACO;EACL,WAAW,GAAG,iCAAA,sBAAsB,GAAG,aAAa,KAAK,KAAK;EAC9D,OAAO;EACP,MAAK;EACL,GAAI;EAEH;CACQ,CAAA;CAIf,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,6BAAqB,MAAtB;EACO;EACL,WAAW,GAAG,iCAAA,sBAAsB,GAAG,aAAa,KAAK,KAAK;EAC9D,OAAO;EACP,GAAK;EAEJ;CACwB,CAAA;AAE/B,CACF;AAEA,iCAAiC,cAAc;AAE/C,IAAa,+BACX;AAgBF,IAAM,+BAAA,GAAA,MAAA,~~aAEF~~,EAAE,IAAI,WAAW,KAAK,OAAO,UAAU,GAAG,SAC1C,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,~~kBAAoB~~,IAAI;CAC1B;CAEA,IAAI,IACF,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,WAAD;EACO;EACL,WAAW,GAAG,iCAAA,iBAAiB,GAAG,aAAa,KAAK,KAAK;EACzD,OAAO;EACP,MAAK;EACL,GAAI;EAEH;CACQ,CAAA;CAIf,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,6BAAqB,MAAtB;EACO;EACL,WAAW,GAAG,iCAAA,iBAAiB,GAAG,aAAa,KAAK,KAAK;EACzD,OAAO;EACP,GAAK;EAEJ;CACwB,CAAA;AAE/B,CACF;AAEA,4BAA4B,cAAc;AAE1C,IAAa,0BACX"}
1	+ {"version":3,"file":"ButtonSwitch.vanilla.cjs","names":[],"sources":["../../../components/ButtonSwitch/ButtonSwitch.vanilla.tsx"],"sourcesContent":["import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { buttonSwitchContainer, buttonSwitchItem } from './ButtonSwitch.vanilla.css';\n\n// Container Component\ninterface ButtonSwitchContainerOwnProps extends CSSProps {\n type?: 'single' \| 'multiple';\n value?: string \| string[];\n defaultValue?: string \| string[];\n onValueChange?: (value: any) => void;\n disabled?: boolean;\n rovingFocus?: boolean;\n loop?: boolean;\n orientation?: 'horizontal' \| 'vertical';\n dir?: 'ltr' \| 'rtl';\n}\n\nexport type ButtonSwitchContainerVanillaProps<C extends ElementType = 'div'> =\n PolymorphicComponentProps<C, ButtonSwitchContainerOwnProps>;\n\ntype ButtonSwitchContainerVanillaComponent = PolymorphicComponent<\n 'div',\n ButtonSwitchContainerVanillaProps<ElementType>\n>;\n\nconst ButtonSwitchContainerVanillaImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, children, ...props }: ButtonSwitchContainerVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'div') as any;\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n if (as) {\n return (\n <Component\n ref={ref}\n className={`${buttonSwitchContainer} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n role=\"group\"\n {...props}\n >\n {children}\n </Component>\n );\n }\n\n return (\n <ToggleGroupPrimitive.Root\n ref={ref as any}\n className={`${buttonSwitchContainer} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...(props as any)}\n >\n {children}\n </ToggleGroupPrimitive.Root>\n );\n },\n);\n\nButtonSwitchContainerVanillaImpl.displayName = 'ButtonSwitchContainerVanilla';\n\nexport const ButtonSwitchContainerVanilla =\n ButtonSwitchContainerVanillaImpl as ButtonSwitchContainerVanillaComponent;\n\n// Item Component\ninterface ButtonSwitchItemOwnProps extends CSSProps {\n value: string;\n disabled?: boolean;\n}\n\nexport type ButtonSwitchItemVanillaProps<C extends ElementType = 'button'> =\n PolymorphicComponentProps<C, ButtonSwitchItemOwnProps>;\n\ntype ButtonSwitchItemVanillaComponent = PolymorphicComponent<\n 'button',\n ButtonSwitchItemVanillaProps<ElementType>\n>;\n\nconst ButtonSwitchItemVanillaImpl = forwardRef(\n <C extends ElementType = 'button'>(\n { as, className, css, style, children, ...props }: ButtonSwitchItemVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'button') as any;\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n if (as) {\n return (\n <Component\n ref={ref}\n className={`${buttonSwitchItem} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n role=\"radio\"\n {...props}\n >\n {children}\n </Component>\n );\n }\n\n return (\n <ToggleGroupPrimitive.Item\n ref={ref as any}\n className={`${buttonSwitchItem} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...(props as any)}\n >\n {children}\n </ToggleGroupPrimitive.Item>\n );\n },\n);\n\nButtonSwitchItemVanillaImpl.displayName = 'ButtonSwitchItemVanilla';\n\nexport const ButtonSwitchItemVanilla =\n ButtonSwitchItemVanillaImpl as ButtonSwitchItemVanillaComponent;\n"],"mappings":";;;;;;;;;;AAkCA,IAAM,oCAAA,GAAA,MAAA,WAAA,EAEF,EAAE,IAAI,WAAW,KAAK,OAAO,UAAU,GAAG,SAC1C,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAC1B;CAEA,IAAI,IACF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GAAG,iCAAA,sBAAsB,GAAG,aAAa,KAAK,KAAK;EAC9D,OAAO;EACP,MAAK;EACL,GAAI;EAEH;CACQ,CAAA;CAIf,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,6BAAqB,MAAtB;EACO;EACL,WAAW,GAAG,iCAAA,sBAAsB,GAAG,aAAa,KAAK,KAAK;EAC9D,OAAO;EACP,GAAK;EAEJ;CACwB,CAAA;AAE/B,CACF;AAEA,iCAAiC,cAAc;AAE/C,IAAa,+BACX;AAgBF,IAAM,+BAAA,GAAA,MAAA,WAAA,EAEF,EAAE,IAAI,WAAW,KAAK,OAAO,UAAU,GAAG,SAC1C,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAC1B;CAEA,IAAI,IACF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GAAG,iCAAA,iBAAiB,GAAG,aAAa,KAAK,KAAK;EACzD,OAAO;EACP,MAAK;EACL,GAAI;EAEH;CACQ,CAAA;CAIf,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,6BAAqB,MAAtB;EACO;EACL,WAAW,GAAG,iCAAA,iBAAiB,GAAG,aAAa,KAAK,KAAK;EACzD,OAAO;EACP,GAAK;EAEJ;CACwB,CAAA;AAE/B,CACF;AAEA,4BAA4B,cAAc;AAE1C,IAAa,0BACX"}

package/dist/components/Card/Card.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.cjs","names":[],"sources":["../../../components/Card/Card.tsx"],"sourcesContent":["import React, { ComponentProps, ElementRef } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation/Elevation';\n\nconst StyledCard = styled('div', {\n appearance: 'none',\n border: 'none',\n boxSizing: 'border-box',\n font: 'inherit',\n lineHeight: '1',\n outline: 'none',\n padding: '$3',\n textAlign: 'inherit',\n verticalAlign: 'middle',\n WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',\n\n backgroundColor: '$cardBackground',\n display: 'block',\n textDecoration: 'none',\n color: 'inherit',\n borderRadius: '$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: '$3',\n pointerEvents: 'none',\n },\n\n variants: {\n elevation: elevationVariants,\n variant: {\n inner: {\n backgroundColor: '$innerCardBgColor',\n },\n ghost: {\n backgroundColor: 'transparent',\n boxShadow: 'none',\n },\n },\n active: {\n true: {\n '&::before': {\n outline: '1px solid $colors$cardActiveBorder',\n backgroundColor: '$cardActiveBackground',\n },\n },\n },\n },\n defaultVariants: {\n elevation: 1,\n },\n});\n\nconst StyledInteractiveCard = styled('button', StyledCard, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n outline: '1px solid $colors$cardHoverBorder',\n backgroundColor: '$cardHoverBackground',\n },\n },\n },\n '&:focus': {\n outline: '2px solid $primary',\n },\n '&:active': {\n '&::before': {\n outline: '1px solid $colors$cardActiveBorder',\n backgroundColor: '$cardActiveBackground',\n },\n },\n});\n\nexport type CardVariantProps = ComponentProps<typeof StyledCard> &\n VariantProps<typeof StyledCard> & {\n interactive?: false;\n };\nexport type InteractiveCardProps = VariantProps<typeof StyledInteractiveCard> &\n ComponentProps<typeof StyledInteractiveCard> & {\n interactive: true;\n };\nexport type CardProps = CardVariantProps \| InteractiveCardProps;\n\nexport const Card = React.forwardRef<ElementRef<typeof StyledCard>, CardProps>(\n ({ interactive, ...props }, forwardedRef) => {\n if (interactive) {\n return (\n <StyledInteractiveCard\n tabIndex={0}\n ref={forwardedRef as React.RefObject<HTMLButtonElement>}\n {...(props as InteractiveCardProps)}\n />\n );\n }\n return (\n <StyledCard\n ref={forwardedRef as React.RefObject<HTMLDivElement>}\n {...(props as CardVariantProps)}\n />\n );\n },\n);\n"],"mappings":";;;;;;;AAKA,IAAM,aAAa,wBAAA,OAAO,OAAO;CAC/B,YAAY;CACZ,QAAQ;CACR,WAAW;CACX,MAAM;CACN,YAAY;CACZ,SAAS;CACT,SAAS;CACT,WAAW;CACX,eAAe;CACf,yBAAyB;CAEzB,iBAAiB;CACjB,SAAS;CACT,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CAEV,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,cAAc;EACd,eAAe;CACjB;CAEA,UAAU;EACR,WAAW,kBAAA;EACX,SAAS;GACP,OAAO,EACL,iBAAiB,oBACnB;GACA,OAAO;IACL,iBAAiB;IACjB,WAAW;GACb;EACF;EACA,QAAQ,EACN,MAAM,EACJ,aAAa;GACX,SAAS;GACT,iBAAiB;EACnB,EACF,EACF;CACF;CACA,iBAAiB,EACf,WAAW,EACb;AACF,CAAC;AAED,IAAM,wBAAwB,wBAAA,OAAO,UAAU,YAAY;CACzD,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa;GACX,SAAS;GACT,iBAAiB;EACnB;CACF,EACF;CACA,WAAW,EACT,SAAS,qBACX;CACA,YAAY,EACV,aAAa;EACX,SAAS;EACT,iBAAiB;CACnB,EACF;AACF,CAAC;AAYD,IAAa,OAAO,MAAA,QAAM,YACvB,EAAE,aAAa,GAAG,SAAS,iBAAiB;CAC3C,IAAI,aACF,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,uBAAD;EACE,UAAU;EACV,KAAK;EACL,GAAK;CACN,CAAA;CAGL,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,YAAD;EACE,KAAK;EACL,GAAK;CACN,CAAA;AAEL,CACF"}
1	+ {"version":3,"file":"Card.cjs","names":[],"sources":["../../../components/Card/Card.tsx"],"sourcesContent":["import React, { ComponentProps, ElementRef } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation/Elevation';\n\nconst StyledCard = styled('div', {\n appearance: 'none',\n border: 'none',\n boxSizing: 'border-box',\n font: 'inherit',\n lineHeight: '1',\n outline: 'none',\n padding: '$3',\n textAlign: 'inherit',\n verticalAlign: 'middle',\n WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',\n\n backgroundColor: '$cardBackground',\n display: 'block',\n textDecoration: 'none',\n color: 'inherit',\n borderRadius: '$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: '$3',\n pointerEvents: 'none',\n },\n\n variants: {\n elevation: elevationVariants,\n variant: {\n inner: {\n backgroundColor: '$innerCardBgColor',\n },\n ghost: {\n backgroundColor: 'transparent',\n boxShadow: 'none',\n },\n },\n active: {\n true: {\n '&::before': {\n outline: '1px solid $colors$cardActiveBorder',\n backgroundColor: '$cardActiveBackground',\n },\n },\n },\n },\n defaultVariants: {\n elevation: 1,\n },\n});\n\nconst StyledInteractiveCard = styled('button', StyledCard, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n outline: '1px solid $colors$cardHoverBorder',\n backgroundColor: '$cardHoverBackground',\n },\n },\n },\n '&:focus': {\n outline: '2px solid $primary',\n },\n '&:active': {\n '&::before': {\n outline: '1px solid $colors$cardActiveBorder',\n backgroundColor: '$cardActiveBackground',\n },\n },\n});\n\nexport type CardVariantProps = ComponentProps<typeof StyledCard> &\n VariantProps<typeof StyledCard> & {\n interactive?: false;\n };\nexport type InteractiveCardProps = VariantProps<typeof StyledInteractiveCard> &\n ComponentProps<typeof StyledInteractiveCard> & {\n interactive: true;\n };\nexport type CardProps = CardVariantProps \| InteractiveCardProps;\n\nexport const Card = React.forwardRef<ElementRef<typeof StyledCard>, CardProps>(\n ({ interactive, ...props }, forwardedRef) => {\n if (interactive) {\n return (\n <StyledInteractiveCard\n tabIndex={0}\n ref={forwardedRef as React.RefObject<HTMLButtonElement>}\n {...(props as InteractiveCardProps)}\n />\n );\n }\n return (\n <StyledCard\n ref={forwardedRef as React.RefObject<HTMLDivElement>}\n {...(props as CardVariantProps)}\n />\n );\n },\n);\n"],"mappings":";;;;;;;AAKA,IAAM,aAAa,wBAAA,OAAO,OAAO;CAC/B,YAAY;CACZ,QAAQ;CACR,WAAW;CACX,MAAM;CACN,YAAY;CACZ,SAAS;CACT,SAAS;CACT,WAAW;CACX,eAAe;CACf,yBAAyB;CAEzB,iBAAiB;CACjB,SAAS;CACT,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CAEV,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,cAAc;EACd,eAAe;CACjB;CAEA,UAAU;EACR,WAAW,kBAAA;EACX,SAAS;GACP,OAAO,EACL,iBAAiB,oBACnB;GACA,OAAO;IACL,iBAAiB;IACjB,WAAW;GACb;EACF;EACA,QAAQ,EACN,MAAM,EACJ,aAAa;GACX,SAAS;GACT,iBAAiB;EACnB,EACF,EACF;CACF;CACA,iBAAiB,EACf,WAAW,EACb;AACF,CAAC;AAED,IAAM,wBAAwB,wBAAA,OAAO,UAAU,YAAY;CACzD,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa;GACX,SAAS;GACT,iBAAiB;EACnB;CACF,EACF;CACA,WAAW,EACT,SAAS,qBACX;CACA,YAAY,EACV,aAAa;EACX,SAAS;EACT,iBAAiB;CACnB,EACF;AACF,CAAC;AAYD,IAAa,OAAO,MAAA,QAAM,YACvB,EAAE,aAAa,GAAG,SAAS,iBAAiB;CAC3C,IAAI,aACF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD;EACE,UAAU;EACV,KAAK;EACL,GAAK;CACN,CAAA;CAGL,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAD;EACE,KAAK;EACL,GAAK;CACN,CAAA;AAEL,CACF"}

package/dist/components/Card/Card.themes.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.themes.cjs","names":[],"sources":["../../../components/Card/Card.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 cardBackground: Property.Color;\n cardBorder: Property.Color;\n cardShadow: Property.Color;\n cardHoverBackground: Property.Color;\n cardHoverBorder: Property.Color;\n cardActiveBackground: Property.Color;\n cardActiveBorder: Property.Color;\n cardGhostBackground: Property.Color;\n innerCardBgColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n cardBackground: 'white',\n cardBorder: '$deepBlue3',\n cardShadow: 'rgba(0,0,0,.1)',\n cardHoverBackground: 'rgba(0,0,0,.05)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(0,0,0,.03)',\n cardActiveBorder: '$primary',\n cardGhostBackground: '$deepBlue2',\n innerCardBgColor: tinycolor('black').setAlpha(0.04).toHslString(),\n });\n\n export const getDark: Factory = (primaryColor) => ({\n cardBackground: '$deepBlue2',\n cardBorder: '$deepBlue3',\n cardShadow: 'transparent',\n cardHoverBackground: 'rgba(255,255,255,.12)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(255,255,255,.07)',\n cardActiveBorder: tinycolor(primaryColor.value).setAlpha(0.4).toHslString(),\n cardGhostBackground: '$deepBlue1',\n innerCardBgColor: tinycolor('white').setAlpha(0.07).toHslString(),\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAeQ,OAAA,YAAqB,kBAAkB;EAClD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,kBAAA,GAAA,WAAA,~~SAA2B~~,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EACzE,sBAAsB;EACtB,kBAAkB;EAClB,qBAAqB;EACrB,mBAAA,GAAA,WAAA,~~SAA4B~~,OAAO,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;CAClE;CAEa,OAAA,WAAoB,kBAAkB;EACjD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,kBAAA,GAAA,WAAA,~~SAA2B~~,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EACzE,sBAAsB;EACtB,mBAAA,GAAA,WAAA,~~SAA4B~~,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EAC1E,qBAAqB;EACrB,mBAAA,GAAA,WAAA,~~SAA4B~~,OAAO,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;CAClE;~~wBACF~~"}
1	+ {"version":3,"file":"Card.themes.cjs","names":[],"sources":["../../../components/Card/Card.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 cardBackground: Property.Color;\n cardBorder: Property.Color;\n cardShadow: Property.Color;\n cardHoverBackground: Property.Color;\n cardHoverBorder: Property.Color;\n cardActiveBackground: Property.Color;\n cardActiveBorder: Property.Color;\n cardGhostBackground: Property.Color;\n innerCardBgColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n cardBackground: 'white',\n cardBorder: '$deepBlue3',\n cardShadow: 'rgba(0,0,0,.1)',\n cardHoverBackground: 'rgba(0,0,0,.05)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(0,0,0,.03)',\n cardActiveBorder: '$primary',\n cardGhostBackground: '$deepBlue2',\n innerCardBgColor: tinycolor('black').setAlpha(0.04).toHslString(),\n });\n\n export const getDark: Factory = (primaryColor) => ({\n cardBackground: '$deepBlue2',\n cardBorder: '$deepBlue3',\n cardShadow: 'transparent',\n cardHoverBackground: 'rgba(255,255,255,.12)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(255,255,255,.07)',\n cardActiveBorder: tinycolor(primaryColor.value).setAlpha(0.4).toHslString(),\n cardGhostBackground: '$deepBlue1',\n innerCardBgColor: tinycolor('white').setAlpha(0.07).toHslString(),\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAeQ,OAAA,YAAqB,kBAAkB;EAClD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,kBAAA,GAAA,WAAA,QAAA,CAA2B,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EACzE,sBAAsB;EACtB,kBAAkB;EAClB,qBAAqB;EACrB,mBAAA,GAAA,WAAA,QAAA,CAA4B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAClE;CAEa,OAAA,WAAoB,kBAAkB;EACjD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,kBAAA,GAAA,WAAA,QAAA,CAA2B,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EACzE,sBAAsB;EACtB,mBAAA,GAAA,WAAA,QAAA,CAA4B,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EAC1E,qBAAqB;EACrB,mBAAA,GAAA,WAAA,QAAA,CAA4B,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAClE;GACD,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Card/Card.themes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.themes.js","names":[],"sources":["../../../components/Card/Card.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 cardBackground: Property.Color;\n cardBorder: Property.Color;\n cardShadow: Property.Color;\n cardHoverBackground: Property.Color;\n cardHoverBorder: Property.Color;\n cardActiveBackground: Property.Color;\n cardActiveBorder: Property.Color;\n cardGhostBackground: Property.Color;\n innerCardBgColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n cardBackground: 'white',\n cardBorder: '$deepBlue3',\n cardShadow: 'rgba(0,0,0,.1)',\n cardHoverBackground: 'rgba(0,0,0,.05)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(0,0,0,.03)',\n cardActiveBorder: '$primary',\n cardGhostBackground: '$deepBlue2',\n innerCardBgColor: tinycolor('black').setAlpha(0.04).toHslString(),\n });\n\n export const getDark: Factory = (primaryColor) => ({\n cardBackground: '$deepBlue2',\n cardBorder: '$deepBlue3',\n cardShadow: 'transparent',\n cardHoverBackground: 'rgba(255,255,255,.12)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(255,255,255,.07)',\n cardActiveBorder: tinycolor(primaryColor.value).setAlpha(0.4).toHslString(),\n cardGhostBackground: '$deepBlue1',\n innerCardBgColor: tinycolor('white').setAlpha(0.07).toHslString(),\n });\n}\n"],"mappings":";;AAKO,IAAA;;CAeQ,OAAA,YAAqB,kBAAkB;EAClD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,iBAAiB,UAAU,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EACzE,sBAAsB;EACtB,kBAAkB;EAClB,qBAAqB;EACrB,kBAAkB,UAAU,OAAO,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;CAClE;CAEa,OAAA,WAAoB,kBAAkB;EACjD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,iBAAiB,UAAU,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EACzE,sBAAsB;EACtB,kBAAkB,UAAU,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EAC1E,qBAAqB;EACrB,kBAAkB,UAAU,OAAO,~~EAAE~~,SAAS,GAAI,~~EAAE~~,YAAY;CAClE;~~wBACF~~"}
1	+ {"version":3,"file":"Card.themes.js","names":[],"sources":["../../../components/Card/Card.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 cardBackground: Property.Color;\n cardBorder: Property.Color;\n cardShadow: Property.Color;\n cardHoverBackground: Property.Color;\n cardHoverBorder: Property.Color;\n cardActiveBackground: Property.Color;\n cardActiveBorder: Property.Color;\n cardGhostBackground: Property.Color;\n innerCardBgColor: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n cardBackground: 'white',\n cardBorder: '$deepBlue3',\n cardShadow: 'rgba(0,0,0,.1)',\n cardHoverBackground: 'rgba(0,0,0,.05)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(0,0,0,.03)',\n cardActiveBorder: '$primary',\n cardGhostBackground: '$deepBlue2',\n innerCardBgColor: tinycolor('black').setAlpha(0.04).toHslString(),\n });\n\n export const getDark: Factory = (primaryColor) => ({\n cardBackground: '$deepBlue2',\n cardBorder: '$deepBlue3',\n cardShadow: 'transparent',\n cardHoverBackground: 'rgba(255,255,255,.12)',\n cardHoverBorder: tinycolor(primaryColor.value).setAlpha(0.6).toHslString(),\n cardActiveBackground: 'rgba(255,255,255,.07)',\n cardActiveBorder: tinycolor(primaryColor.value).setAlpha(0.4).toHslString(),\n cardGhostBackground: '$deepBlue1',\n innerCardBgColor: tinycolor('white').setAlpha(0.07).toHslString(),\n });\n}\n"],"mappings":";;AAKO,IAAA;;CAeQ,OAAA,YAAqB,kBAAkB;EAClD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,iBAAiB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EACzE,sBAAsB;EACtB,kBAAkB;EAClB,qBAAqB;EACrB,kBAAkB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAClE;CAEa,OAAA,WAAoB,kBAAkB;EACjD,gBAAgB;EAChB,YAAY;EACZ,YAAY;EACZ,qBAAqB;EACrB,iBAAiB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EACzE,sBAAsB;EACtB,kBAAkB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,EAAG,CAAC,CAAC,YAAY;EAC1E,qBAAqB;EACrB,kBAAkB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;CAClE;GACD,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Card/Card.vanilla.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.vanilla.cjs","names":[],"sources":["../../../components/Card/Card.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { cardRecipe, interactiveCardRecipe } from './Card.vanilla.css';\n\ntype CardRecipeVariants = NonNullable<RecipeVariants<typeof cardRecipe>>;\n\ninterface CardOwnProps extends CSSProps {\n elevation?: CardRecipeVariants['elevation'];\n variant?: CardRecipeVariants['variant'];\n active?: CardRecipeVariants['active'];\n interactive?: boolean;\n}\n\nexport type CardVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n CardOwnProps\n>;\n\ntype CardVanillaComponent = PolymorphicComponent<'div', CardVanillaProps<ElementType>>;\n\nconst CardVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n elevation,\n variant,\n active,\n interactive,\n ...props\n }: CardVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'div');\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const recipe = interactive ? interactiveCardRecipe : cardRecipe;\n const recipeClass = recipe({ elevation, variant, active });\n\n const additionalProps = interactive && !as ? { tabIndex: 0 } : {};\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...additionalProps}\n {...props}\n />\n );\n },\n);\n\nCardVanillaComponentImpl.displayName = 'CardVanilla';\n\nexport const CardVanilla = CardVanillaComponentImpl as CardVanillaComponent;\n"],"mappings":";;;;;;;AA6BA,IAAM,4BAAA,GAAA,MAAA,~~aAEF~~,EACE,IACA,WACA,KACA,OACA,WACA,SACA,QACA,aACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAClD,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAC1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAC7D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,IAAA,GAAA,yBAAA,~~kBAAoB~~,IAAI;CAAE;CAGzE,MAAM,eADS,cAAc,yBAAA,wBAAwB,yBAAA,~~YAC1B~~;EAAE;EAAW;EAAS;CAAO,CAAC;CAEzD,MAAM,kBAAkB,eAAe,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;CAEhE,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;EACJ,GAAI;CACL,CAAA;AAEL,CACF;AAEA,yBAAyB,cAAc;AAEvC,IAAa,cAAc"}
1	+ {"version":3,"file":"Card.vanilla.cjs","names":[],"sources":["../../../components/Card/Card.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { cardRecipe, interactiveCardRecipe } from './Card.vanilla.css';\n\ntype CardRecipeVariants = NonNullable<RecipeVariants<typeof cardRecipe>>;\n\ninterface CardOwnProps extends CSSProps {\n elevation?: CardRecipeVariants['elevation'];\n variant?: CardRecipeVariants['variant'];\n active?: CardRecipeVariants['active'];\n interactive?: boolean;\n}\n\nexport type CardVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n CardOwnProps\n>;\n\ntype CardVanillaComponent = PolymorphicComponent<'div', CardVanillaProps<ElementType>>;\n\nconst CardVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n elevation,\n variant,\n active,\n interactive,\n ...props\n }: CardVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'div');\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const recipe = interactive ? interactiveCardRecipe : cardRecipe;\n const recipeClass = recipe({ elevation, variant, active });\n\n const additionalProps = interactive && !as ? { tabIndex: 0 } : {};\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...additionalProps}\n {...props}\n />\n );\n },\n);\n\nCardVanillaComponentImpl.displayName = 'CardVanilla';\n\nexport const CardVanilla = CardVanillaComponentImpl as CardVanillaComponent;\n"],"mappings":";;;;;;;AA6BA,IAAM,4BAAA,GAAA,MAAA,WAAA,EAEF,EACE,IACA,WACA,KACA,OACA,WACA,SACA,QACA,aACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAClD,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAC1C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAC7D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,IAAA,GAAA,yBAAA,iBAAA,CAAoB,IAAI;CAAE;CAGzE,MAAM,eADS,cAAc,yBAAA,wBAAwB,yBAAA,WAAA,CAC1B;EAAE;EAAW;EAAS;CAAO,CAAC;CAEzD,MAAM,kBAAkB,eAAe,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;CAEhE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;EACJ,GAAI;CACL,CAAA;AAEL,CACF;AAEA,yBAAyB,cAAc;AAEvC,IAAa,cAAc"}

package/dist/components/Card/Card.vanilla.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.vanilla.js","names":[],"sources":["../../../components/Card/Card.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { cardRecipe, interactiveCardRecipe } from './Card.vanilla.css';\n\ntype CardRecipeVariants = NonNullable<RecipeVariants<typeof cardRecipe>>;\n\ninterface CardOwnProps extends CSSProps {\n elevation?: CardRecipeVariants['elevation'];\n variant?: CardRecipeVariants['variant'];\n active?: CardRecipeVariants['active'];\n interactive?: boolean;\n}\n\nexport type CardVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n CardOwnProps\n>;\n\ntype CardVanillaComponent = PolymorphicComponent<'div', CardVanillaProps<ElementType>>;\n\nconst CardVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n elevation,\n variant,\n active,\n interactive,\n ...props\n }: CardVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'div');\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const recipe = interactive ? interactiveCardRecipe : cardRecipe;\n const recipeClass = recipe({ elevation, variant, active });\n\n const additionalProps = interactive && !as ? { tabIndex: 0 } : {};\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...additionalProps}\n {...props}\n />\n );\n },\n);\n\nCardVanillaComponentImpl.displayName = 'CardVanilla';\n\nexport const CardVanilla = CardVanillaComponentImpl as CardVanillaComponent;\n"],"mappings":";;;;;;;AA6BA,IAAM,2BAA2B,YAE7B,EACE,IACA,WACA,KACA,OACA,WACA,SACA,QACA,aACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAClD,MAAM,EAAE,WAAW,uBAAuB;CAC1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAC7D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,GAAG,iBAAiB,IAAI;CAAE;CAGzE,MAAM,eADS,cAAc,wBAAwB,~~YAC1B~~;EAAE;EAAW;EAAS;CAAO,CAAC;CAEzD,MAAM,kBAAkB,eAAe,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;CAEhE,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;EACJ,GAAI;CACL,CAAA;AAEL,CACF;AAEA,yBAAyB,cAAc;AAEvC,IAAa,cAAc"}
1	+ {"version":3,"file":"Card.vanilla.js","names":[],"sources":["../../../components/Card/Card.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { cardRecipe, interactiveCardRecipe } from './Card.vanilla.css';\n\ntype CardRecipeVariants = NonNullable<RecipeVariants<typeof cardRecipe>>;\n\ninterface CardOwnProps extends CSSProps {\n elevation?: CardRecipeVariants['elevation'];\n variant?: CardRecipeVariants['variant'];\n active?: CardRecipeVariants['active'];\n interactive?: boolean;\n}\n\nexport type CardVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n CardOwnProps\n>;\n\ntype CardVanillaComponent = PolymorphicComponent<'div', CardVanillaProps<ElementType>>;\n\nconst CardVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n elevation,\n variant,\n active,\n interactive,\n ...props\n }: CardVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'div');\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const recipe = interactive ? interactiveCardRecipe : cardRecipe;\n const recipeClass = recipe({ elevation, variant, active });\n\n const additionalProps = interactive && !as ? { tabIndex: 0 } : {};\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...additionalProps}\n {...props}\n />\n );\n },\n);\n\nCardVanillaComponentImpl.displayName = 'CardVanilla';\n\nexport const CardVanilla = CardVanillaComponentImpl as CardVanillaComponent;\n"],"mappings":";;;;;;;AA6BA,IAAM,2BAA2B,YAE7B,EACE,IACA,WACA,KACA,OACA,WACA,SACA,QACA,aACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAClD,MAAM,EAAE,WAAW,uBAAuB;CAC1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAC7D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,GAAG,iBAAiB,IAAI;CAAE;CAGzE,MAAM,eADS,cAAc,wBAAwB,WAAA,CAC1B;EAAE;EAAW;EAAS;CAAO,CAAC;CAEzD,MAAM,kBAAkB,eAAe,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;CAEhE,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,YAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;EACJ,GAAI;CACL,CAAA;AAEL,CACF;AAEA,yBAAyB,cAAc;AAEvC,IAAa,cAAc"}

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

	@@ -1 +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,~~KAAC~~,gBAAD;EAAgB,GAAI;EAAO,KAAK;YAC9B,iBAAA,GAAA,kBAAA,~~KAAC~~,iBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,~~KAAC~~,sBAAA,WAAD;GAAW,QAAQ;GAAI,OAAO;EAAK,CAAA,EACpB,CAAA;CACH,CAAA;AAEpB,CACF"}
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"}

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

	@@ -1 +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,~~SAAkC~~,aAAa,KAAK,~~EAAE~~,OAAO,~~EAAE~~,YAAY;EAC3E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,8BAAA,GAAA,WAAA,~~SAAuC~~,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;CACvF;CAEa,OAAA,WAAoB,kBAAkB;EACjD,cAAc;EACd,YAAY;EACZ,mBAAmB;EACnB,gBAAgB;EAChB,qBAAqB;EACrB,yBAAA,GAAA,WAAA,~~SAAkC~~,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAC9E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,qBAAA,GAAA,WAAA,~~SAA8B~~,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EAC5E,wBAAwB;EACxB,6BAA6B;CAC/B;~~wBACF~~"}
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"}

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

	@@ -1 +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,~~EAAE~~,OAAO,~~EAAE~~,YAAY;EAC3E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,6BAA6B,UAAU,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;CACvF;CAEa,OAAA,WAAoB,kBAAkB;EACjD,cAAc;EACd,YAAY;EACZ,mBAAmB;EACnB,gBAAgB;EAChB,qBAAqB;EACrB,wBAAwB,UAAU,aAAa,KAAK,~~EAAE~~,QAAQ,EAAE,~~EAAE~~,YAAY;EAC9E,iBAAiB;EACjB,qBAAqB;EACrB,qBAAqB;EACrB,oBAAoB,UAAU,aAAa,KAAK,~~EAAE~~,SAAS,EAAG,~~EAAE~~,YAAY;EAC5E,wBAAwB;EACxB,6BAA6B;CAC/B;~~wBACF~~"}
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"}

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

	@@ -1 +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,~~aAET~~,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,~~UAAsB~~,KAAK;CAE1C,MAAM,UAAA,GAAA,MAAA,~~QACJ~~,IACF;CACA,MAAM,oBAAA,GAAA,MAAA,~~QAA0C~~,IAAI;CAEpD,MAAM,aAAA,GAAA,MAAA,~~cACH~~,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,~~uBAAsB~~;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,~~MAAC~~,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,~~KAAC~~,uBAAA,gBAAD;GAAgB,OAAO,SAAS,WAAW;aACxC,SAAS,iBAAA,GAAA,kBAAA,~~KAAC~~,sBAAA,WAAD,CAAY,CAAA,IAAI,iBAAA,GAAA,kBAAA,~~KAAC~~,sBAAA,UAAD,CAAW,CAAA;EACvB,CAAA,GACf,SAAS,aAAa,QACjB;MACN;CAEJ,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,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,~~MAAC~~,YAAA,KAAD;GAAK,KAAK;IAAE,UAAU;IAAY,GAAG;GAAI;aAAzC,CACE,iBAAA,GAAA,kBAAA,~~KAAC~~,KAAD;IACE,KAAK;IACL,WAAW,CAAC,gBAAgB,SAAS,~~EAAE~~,OAAO,OAAO,~~EAAE~~,KAAK,GAAG;IAC/D,OAAO;KAAE;KAAW,GAAG;KAAgB,iBAAiB;KAAW,GAAG;IAAM;IAClE;IACV,GAAI;cAEJ,iBAAA,GAAA,kBAAA,~~KAAC~~,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,~~KAAC~~,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,~~KAAC~~,QAAD,EAAgB,GAAI,cAAc,EAAE,MAAM,CAAC,EAAI,GAApC,GAAoC,CAChD;KACE,GATE,CASF,CACN;IACE,CAAA;GACF,CAAA,GACJ,cACC,iBAAA,GAAA,kBAAA,~~KAAC~~,mBAAD;IAAmB,KAAK;IAAkB,UAAU;cACjD;GACgB,CAAA,CAElB;;CAEE,CAAA;AAEf,CACF;AAEA,UAAU,cAAc"}
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":"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"}

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

	@@ -1 +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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~~EAAE~~,OAAO,OAAO,~~EAAE~~,KAAK,GAAG;IAC/D,OAAO;KAAE;KAAW,GAAG;KAAgB,iBAAiB;KAAW,GAAG;IAAM;IAClE;IACV,GAAI;cAEJ,oBAAC,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,oBAAC,OAAD;MAEE,GAAI,aAAa,EAAE,KAAK,CAAC;MACzB,OACE,WAAW;OAAE,YAAY;OAAY,WAAW;MAAY,IAAI,KAAA;gBAGjE,KAAK,KAAK,OAAO,QAChB,oBAAC,QAAD,EAAgB,GAAI,cAAc,EAAE,MAAM,CAAC,EAAI,GAApC,GAAoC,CAChD;KACE,GATE,CASF,CACN;IACE,CAAA;GACF,CAAA,GACJ,cACC,oBAAC,mBAAD;IAAmB,KAAK;IAAkB,UAAU;cACjD;GACgB,CAAA,CAElB;;CAEE,CAAA;AAEf,CACF;AAEA,UAAU,cAAc"}
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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"}

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

	@@ -1 +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;;~~wBACF~~"}
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"}

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

	@@ -1 +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;;~~wBACF~~"}
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"}

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

	@@ -1 +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":";;;;;;;;;;;;;;AA6CA,IAAa,oBAAA,GAAA,MAAA,~~aAET~~,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,QAAQ,kBAAkB,qBAAA,uBAAuB;CAEzD,MAAM,cADkB,eAAe,mBACA,SAAS,qBAAA,OAAO,WAAW,qBAAA,OAAO;CAEzE,MAAM,WAAW,gBAAgB,SAAS,QAAQ;CAClD,MAAM,SAAS,gBAAgB,SAAS,MAAM;CAE9C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAC7D,MAAM,kBAAkB;EACtB,UAAU;EACV,GAAG;EACH,IAAA,GAAA,yBAAA,~~kBAAoB~~,IAAI;CAC1B;CAEA,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,~~UAAsB~~,KAAK;CAE1C,MAAM,UAAA,GAAA,MAAA,~~QACJ~~,IACF;CACA,MAAM,oBAAA,GAAA,MAAA,~~QAA0C~~,IAAI;CAEpD,MAAM,aAAA,GAAA,MAAA,~~cACH~~,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,~~uBAAsB~~;EACpB,IAAI,CAAC,UAAU;EACf,MAAM,MAAM,OAAO;EACnB,MAAM,UAAU,iBAAiB;EACjC,IAAI,CAAC,OAAO,CAAC,SAAS;EAEtB,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,UAAU;IACZ,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,sBAAsB,WACxB,SACE,8BAAA,8BACA,8BAAA,+BACF,SACE,8BAAA,2BACA,8BAAA;CAEN,MAAM,aAAa,WACjB,iBAAA,GAAA,kBAAA,~~MAAC~~,uBAAA,eAAD;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,~~KAAC~~,uBAAA,gBAAD;GAAgB,OAAO,SAAS,WAAW;aACxC,SAAS,iBAAA,GAAA,kBAAA,~~KAAC~~,sBAAA,WAAD,CAAY,CAAA,IAAI,iBAAA,GAAA,kBAAA,~~KAAC~~,sBAAA,UAAD,CAAW,CAAA;EACvB,CAAA,GACf,SAAS,aAAa,QACV;MACb;CAEJ,OACE,iBAAA,GAAA,kBAAA,~~KAAC~~,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,~~MAAC~~,OAAD;GAAK,OAAO;aAAZ,CACE,iBAAA,GAAA,kBAAA,~~KAAC~~,OAAD;IACE,KAAK;IACL,WAAW;KAAC,8BAAA;KAAK,WAAW,8BAAA,cAAc;KAAI;KAAgB;IAAS,~~EACpE~~,OAAO,OAAO,~~EACd~~,KAAK,GAAG;IACX,OAAO;KACL;KACA,GAAG;KACH,iBAAiB;KACjB,GAAG;IACL;IACA,GAAI;cAEJ,iBAAA,GAAA,kBAAA,~~KAAC~~,OAAD;KACE,WAAW;MACT,8BAAA;MACA,YAAY,UAAU,WAAW,8BAAA,2BAA2B;MAC5D,YAAY,UAAU,CAAC,WAAW,8BAAA,wBAAwB;KAC5D,~~EACG~~,OAAO,OAAO,~~EACd~~,KAAK,GAAG;eAEV,OAAO,KAAK,MAAM,MACjB,iBAAA,GAAA,kBAAA,~~KAAC~~,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,~~KAAC~~,QAAD,EAAgB,GAAI,cAAc,EAAE,MAAM,CAAC,EAAI,GAApC,GAAoC,CAChD;KACE,GATE,CASF,CACN;IACE,CAAA;GACF,CAAA,GACJ,cACC,iBAAA,GAAA,kBAAA,~~KAAC~~,OAAD;IAAK,KAAK;IAAkB,WAAW;cACpC;GACE,CAAA,CAEJ;;CAEE,CAAA;AAEf,CACF;AAEA,iBAAiB,cAAc"}
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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"}

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

	@@ -1 +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":";;;;;;;;;;;;AA6CA,IAAa,mBAAmB,YAE5B,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,QAAQ,kBAAkB,uBAAuB;CAEzD,MAAM,cADkB,eAAe,mBACA,SAAS,OAAO,WAAW,OAAO;CAEzE,MAAM,WAAW,gBAAgB,SAAS,QAAQ;CAClD,MAAM,SAAS,gBAAgB,SAAS,MAAM;CAE9C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAC7D,MAAM,kBAAkB;EACtB,UAAU;EACV,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAEA,MAAM,CAAC,QAAQ,aAAa,SAAS,KAAK;CAE1C,MAAM,SAAS,OACb,IACF;CACA,MAAM,mBAAmB,OAAuB,IAAI;CAEpD,MAAM,YAAY,aACf,SAAgC;EAC/B,OAAO,UAAU;EACjB,IAAI,OAAO,QAAQ,YAAY,IAAI,IAAI;OAClC,IAAI,KAAK,IAAuD,UAAU;CACjF,GACA,CAAC,GAAG,CACN;CAEA,sBAAsB;EACpB,IAAI,CAAC,UAAU;EACf,MAAM,MAAM,OAAO;EACnB,MAAM,UAAU,iBAAiB;EACjC,IAAI,CAAC,OAAO,CAAC,SAAS;EAEtB,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,UAAU;IACZ,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,sBAAsB,WACxB,SACE,8BACA,+BACF,SACE,2BACA;CAEN,MAAM,aAAa,WACjB,qBAAC,eAAD;EACE,SAAQ;EACR,OAAA;EACA,MAAK;EACL,MAAK;EACL,SAAS;EACT,KAAK;GACH,OAAO;GACP,KAAK;GACL,iBAAiB;GACjB,QAAQ;EACV;YAXF,CAaE,oBAAC,gBAAD;GAAgB,OAAO,SAAS,WAAW;aACxC,SAAS,oBAAC,WAAD,CAAY,CAAA,IAAI,oBAAC,UAAD,CAAW,CAAA;EACvB,CAAA,GACf,SAAS,aAAa,QACV;MACb;CAEJ,OACE,oBAAC,WAAD;EACE,OAAO;EACD;EACN,UAAW,MAAM,UAAU,SAAS,OAAO,OAAO;aAEhD,EACA,WAAW,gBACX,OAAO,gBACP,QACA,cACA,oBAEA,qBAAC,OAAD;GAAK,OAAO;aAAZ,CACE,oBAAC,OAAD;IACE,KAAK;IACL,WAAW;KAAC;KAAK,WAAW,cAAc;KAAI;KAAgB;IAAS,~~EACpE~~,OAAO,OAAO,~~EACd~~,KAAK,GAAG;IACX,OAAO;KACL;KACA,GAAG;KACH,iBAAiB;KACjB,GAAG;IACL;IACA,GAAI;cAEJ,oBAAC,OAAD;KACE,WAAW;MACT;MACA,YAAY,UAAU,WAAW,2BAA2B;MAC5D,YAAY,UAAU,CAAC,WAAW,wBAAwB;KAC5D,~~EACG~~,OAAO,OAAO,~~EACd~~,KAAK,GAAG;eAEV,OAAO,KAAK,MAAM,MACjB,oBAAC,OAAD;MAEE,GAAI,aAAa,EAAE,KAAK,CAAC;MACzB,OACE,WAAW;OAAE,YAAY;OAAY,WAAW;MAAY,IAAI,KAAA;gBAGjE,KAAK,KAAK,OAAO,QAChB,oBAAC,QAAD,EAAgB,GAAI,cAAc,EAAE,MAAM,CAAC,EAAI,GAApC,GAAoC,CAChD;KACE,GATE,CASF,CACN;IACE,CAAA;GACF,CAAA,GACJ,cACC,oBAAC,OAAD;IAAK,KAAK;IAAkB,WAAW;cACpC;GACE,CAAA,CAEJ;;CAEE,CAAA;AAEf,CACF;AAEA,iBAAiB,cAAc"}
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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"}

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

@@ -21,5 +21,6 @@ require("prismjs/components/prism-toml.js");
 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;
 //# sourceMappingURL=prism-extend.cjs.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Container.cjs","names":[],"sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n // Reset\n boxSizing: 'border-box',\n flexShrink: 0,\n\n // Custom\n ml: 'auto',\n mr: 'auto',\n px: '$5',\n\n variants: {\n size: {\n '1': {\n maxWidth: '425px',\n },\n '2': {\n maxWidth: '768px',\n },\n '3': {\n maxWidth: '1440px',\n },\n '4': {\n maxWidth: 'none',\n },\n },\n noGutter: {\n true: {\n px: 0,\n },\n },\n },\n defaultVariants: {\n size: '4',\n },\n});\n"],"mappings":";AAEA,IAAa,+CAAY,~~EAAA~~,OAAO,OAAO;CAErC,WAAW;CACX,YAAY;CAGZ,IAAI;CACJ,IAAI;CACJ,IAAI;CAEJ,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,QACZ;GACA,KAAK,EACH,UAAU,QACZ;GACA,KAAK,EACH,UAAU,SACZ;GACA,KAAK,EACH,UAAU,OACZ;EACF;EACA,UAAU,EACR,MAAM,EACJ,IAAI,EACN,EACF;CACF;CACA,iBAAiB,EACf,MAAM,IACR;AACF,CAAC"}
1	+ {"version":3,"file":"Container.cjs","names":[],"sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n // Reset\n boxSizing: 'border-box',\n flexShrink: 0,\n\n // Custom\n ml: 'auto',\n mr: 'auto',\n px: '$5',\n\n variants: {\n size: {\n '1': {\n maxWidth: '425px',\n },\n '2': {\n maxWidth: '768px',\n },\n '3': {\n maxWidth: '1440px',\n },\n '4': {\n maxWidth: 'none',\n },\n },\n noGutter: {\n true: {\n px: 0,\n },\n },\n },\n defaultVariants: {\n size: '4',\n },\n});\n"],"mappings":";AAEA,IAAa,+CAAY,CAAA,CAAA,OAAO,OAAO;CAErC,WAAW;CACX,YAAY;CAGZ,IAAI;CACJ,IAAI;CACJ,IAAI;CAEJ,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,QACZ;GACA,KAAK,EACH,UAAU,QACZ;GACA,KAAK,EACH,UAAU,SACZ;GACA,KAAK,EACH,UAAU,OACZ;EACF;EACA,UAAU,EACR,MAAM,EACJ,IAAI,EACN,EACF;CACF;CACA,iBAAiB,EACf,MAAM,IACR;AACF,CAAC"}