npm - @traefik-labs/faency - Versions diffs - 12.3.3 → 12.3.4 - Mend

@traefik-labs/faency 12.3.3 → 12.3.4

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 (237) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","names":[],"sources":["../../../components/Avatar/Avatar.tsx"],"sourcesContent":["import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\n\nconst StyledAvatar = styled(AvatarPrimitive.Root, {\n alignItems: 'center',\n justifyContent: 'center',\n verticalAlign: 'middle',\n overflow: 'hidden',\n userSelect: 'none',\n boxSizing: 'border-box',\n display: 'flex',\n flexShrink: 0,\n position: 'relative',\n border: 'none',\n fontFamily: 'inherit',\n lineHeight: '1',\n margin: '0',\n outline: 'none',\n padding: '0',\n fontWeight: '$medium',\n color: '$hiContrast',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n borderRadius: 'inherit',\n boxShadow: 'inset 0px 0px 1px rgba(0, 0, 0, 0.12)',\n },\n\n variants: {\n size: {\n '1': {\n width: '$3',\n height: '$3',\n },\n '2': {\n width: '$5',\n height: '$5',\n },\n '3': {\n width: '$6',\n height: '$6',\n },\n '4': {\n width: '$7',\n height: '$7',\n },\n '5': {\n width: '$8',\n height: '$8',\n },\n '6': {\n width: '$9',\n height: '$9',\n },\n },\n variant: {\n gray: {\n backgroundColor: '$slate5',\n },\n red: {\n backgroundColor: '$red5',\n },\n purple: {\n backgroundColor: '$purple5',\n },\n blue: {\n backgroundColor: '$blue5',\n },\n green: {\n backgroundColor: '$green5',\n },\n orange: {\n backgroundColor: '$orange5',\n },\n },\n shape: {\n square: {\n borderRadius: '$2',\n },\n circle: {\n borderRadius: '50%',\n },\n },\n },\n defaultVariants: {\n size: '2',\n variant: 'gray',\n shape: 'circle',\n },\n});\n\nconst StyledAvatarImage = styled(AvatarPrimitive.Image, {\n display: 'flex',\n objectFit: 'cover',\n boxSizing: 'border-box',\n height: '100%',\n verticalAlign: 'middle',\n width: '100%',\n});\n\nconst StyledAvatarFallback = styled(AvatarPrimitive.Fallback, {\n textTransform: 'uppercase',\n fontFamily: '$rubik',\n color: '$deepBlue10',\n\n variants: {\n size: {\n '1': {\n fontSize: '10px',\n lineHeight: '15px',\n },\n '2': {\n fontSize: '$3',\n },\n '3': {\n fontSize: '$6',\n },\n '4': {\n fontSize: '$7',\n },\n '5': {\n fontSize: '$8',\n },\n '6': {\n fontSize: '$9',\n },\n },\n },\n defaultVariants: {\n size: '2',\n },\n});\n\ntype AvatarVariants = VariantProps<typeof StyledAvatar>;\ntype AvatarPrimitiveProps = Omit<React.ComponentProps<typeof AvatarPrimitive.Root>, 'as'>;\ntype AvatarOwnProps = AvatarPrimitiveProps &\n AvatarVariants & {\n css?: CSS;\n alt?: string;\n src?: string;\n fallback?: React.ReactNode;\n // status?: StatusColors['variant'];\n };\n\nexport const Avatar = React.forwardRef<React.ElementRef<typeof StyledAvatar>, AvatarOwnProps>(\n ({ alt, src, fallback, size, variant, shape, css, ...props }, forwardedRef) => {\n return (\n <Box\n css={{\n ...css,\n position: 'relative',\n height: 'fit-content',\n width: 'fit-content',\n }}\n >\n <StyledAvatar {...props} ref={forwardedRef} size={size} variant={variant} shape={shape}>\n <StyledAvatarImage alt={alt} src={src} />\n <StyledAvatarFallback size={size}>{fallback}</StyledAvatarFallback>\n </StyledAvatar>\n </Box>\n );\n }\n);\n"],"mappings":";;;;;;AAMA,IAAM,eAAe,OAAO,gBAAgB,MAAM;CAChD,YAAY;CACZ,gBAAgB;CAChB,eAAe;CACf,UAAU;CACV,YAAY;CACZ,WAAW;CACX,SAAS;CACT,YAAY;CACZ,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,YAAY;CACZ,OAAO;CAEP,aAAa;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,cAAc;EACd,WAAW;~~EACZ~~;~~CAED~~,UAAU;EACR,MAAM;GACJ,KAAK;IACH,OAAO;IACP,QAAQ;~~IACT~~;~~GACD~~,KAAK;IACH,OAAO;IACP,QAAQ;~~IACT~~;~~GACD~~,KAAK;IACH,OAAO;IACP,QAAQ;~~IACT~~;~~GACD~~,KAAK;IACH,OAAO;IACP,QAAQ;~~IACT~~;~~GACD~~,KAAK;IACH,OAAO;IACP,QAAQ;~~IACT~~;~~GACD~~,KAAK;IACH,OAAO;IACP,QAAQ;~~IACT~~;~~GACF~~;~~EACD~~,SAAS;GACP,MAAM,EACJ,iBAAiB,~~WAClB~~;~~GACD~~,KAAK,EACH,iBAAiB,~~SAClB~~;~~GACD~~,QAAQ,EACN,iBAAiB,~~YAClB~~;~~GACD~~,MAAM,EACJ,iBAAiB,~~UAClB~~;~~GACD~~,OAAO,EACL,iBAAiB,~~WAClB~~;~~GACD~~,QAAQ,EACN,iBAAiB,~~YAClB~~;~~GACF~~;~~EACD~~,OAAO;GACL,QAAQ,EACN,cAAc,~~MACf~~;~~GACD~~,QAAQ,EACN,cAAc,~~OACf~~;~~GACF;~~EACF;~~CACD~~,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,OAAO;~~EACR~~;~~CACF~~,CAAC;~~AAEF~~,IAAM,oBAAoB,OAAO,gBAAgB,OAAO;CACtD,SAAS;CACT,WAAW;CACX,WAAW;CACX,QAAQ;CACR,eAAe;CACf,OAAO;~~CACR~~,CAAC;~~AAEF~~,IAAM,uBAAuB,OAAO,gBAAgB,UAAU;CAC5D,eAAe;CACf,YAAY;CACZ,OAAO;CAEP,UAAU,EACR,MAAM;EACJ,KAAK;GACH,UAAU;GACV,YAAY;~~GACb~~;~~EACD~~,KAAK,EACH,UAAU,~~MACX~~;~~EACD~~,KAAK,EACH,UAAU,~~MACX~~;~~EACD~~,KAAK,EACH,UAAU,~~MACX~~;~~EACD~~,KAAK,EACH,UAAU,~~MACX~~;~~EACD~~,KAAK,EACH,UAAU,~~MACX~~;~~EACF~~,EACF;~~CACD~~,iBAAiB,EACf,MAAM,~~KACP~~;~~CACF~~,CAAC;~~AAaF~~,IAAa,SAAS,MAAM,YACzB,EAAE,KAAK,KAAK,UAAU,MAAM,SAAS,OAAO,KAAK,GAAG,SAAS,iBAAiB;~~AAC7E~~,~~QACE~~,oBAAC,KAAD;EACE,KAAK;GACH,GAAG;GACH,UAAU;GACV,QAAQ;GACR,OAAO;~~GACR~~;~~YAED~~,qBAAC,cAAD;GAAc,GAAI;GAAO,KAAK;GAAoB;GAAe;GAAgB;aAAjF,CACE,oBAAC,mBAAD;IAAwB;IAAU;~~IAAO~~,CAAA,~~EACzC~~,oBAAC,sBAAD;IAA4B;cAAO;~~IAAgC~~,CAAA,CACtD;;~~EACX~~,CAAA;~~EAGX~~"}
1	+ {"version":3,"file":"Avatar.js","names":[],"sources":["../../../components/Avatar/Avatar.tsx"],"sourcesContent":["import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\n\nconst StyledAvatar = styled(AvatarPrimitive.Root, {\n alignItems: 'center',\n justifyContent: 'center',\n verticalAlign: 'middle',\n overflow: 'hidden',\n userSelect: 'none',\n boxSizing: 'border-box',\n display: 'flex',\n flexShrink: 0,\n position: 'relative',\n border: 'none',\n fontFamily: 'inherit',\n lineHeight: '1',\n margin: '0',\n outline: 'none',\n padding: '0',\n fontWeight: '$medium',\n color: '$hiContrast',\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n borderRadius: 'inherit',\n boxShadow: 'inset 0px 0px 1px rgba(0, 0, 0, 0.12)',\n },\n\n variants: {\n size: {\n '1': {\n width: '$3',\n height: '$3',\n },\n '2': {\n width: '$5',\n height: '$5',\n },\n '3': {\n width: '$6',\n height: '$6',\n },\n '4': {\n width: '$7',\n height: '$7',\n },\n '5': {\n width: '$8',\n height: '$8',\n },\n '6': {\n width: '$9',\n height: '$9',\n },\n },\n variant: {\n gray: {\n backgroundColor: '$slate5',\n },\n red: {\n backgroundColor: '$red5',\n },\n purple: {\n backgroundColor: '$purple5',\n },\n blue: {\n backgroundColor: '$blue5',\n },\n green: {\n backgroundColor: '$green5',\n },\n orange: {\n backgroundColor: '$orange5',\n },\n },\n shape: {\n square: {\n borderRadius: '$2',\n },\n circle: {\n borderRadius: '50%',\n },\n },\n },\n defaultVariants: {\n size: '2',\n variant: 'gray',\n shape: 'circle',\n },\n});\n\nconst StyledAvatarImage = styled(AvatarPrimitive.Image, {\n display: 'flex',\n objectFit: 'cover',\n boxSizing: 'border-box',\n height: '100%',\n verticalAlign: 'middle',\n width: '100%',\n});\n\nconst StyledAvatarFallback = styled(AvatarPrimitive.Fallback, {\n textTransform: 'uppercase',\n fontFamily: '$rubik',\n color: '$deepBlue10',\n\n variants: {\n size: {\n '1': {\n fontSize: '10px',\n lineHeight: '15px',\n },\n '2': {\n fontSize: '$3',\n },\n '3': {\n fontSize: '$6',\n },\n '4': {\n fontSize: '$7',\n },\n '5': {\n fontSize: '$8',\n },\n '6': {\n fontSize: '$9',\n },\n },\n },\n defaultVariants: {\n size: '2',\n },\n});\n\ntype AvatarVariants = VariantProps<typeof StyledAvatar>;\ntype AvatarPrimitiveProps = Omit<React.ComponentProps<typeof AvatarPrimitive.Root>, 'as'>;\ntype AvatarOwnProps = AvatarPrimitiveProps &\n AvatarVariants & {\n css?: CSS;\n alt?: string;\n src?: string;\n fallback?: React.ReactNode;\n // status?: StatusColors['variant'];\n };\n\nexport const Avatar = React.forwardRef<React.ElementRef<typeof StyledAvatar>, AvatarOwnProps>(\n ({ alt, src, fallback, size, variant, shape, css, ...props }, forwardedRef) => {\n return (\n <Box\n css={{\n ...css,\n position: 'relative',\n height: 'fit-content',\n width: 'fit-content',\n }}\n >\n <StyledAvatar {...props} ref={forwardedRef} size={size} variant={variant} shape={shape}>\n <StyledAvatarImage alt={alt} src={src} />\n <StyledAvatarFallback size={size}>{fallback}</StyledAvatarFallback>\n </StyledAvatar>\n </Box>\n );\n }\n);\n"],"mappings":";;;;;;AAMA,IAAM,eAAe,OAAO,gBAAgB,MAAM;CAChD,YAAY;CACZ,gBAAgB;CAChB,eAAe;CACf,UAAU;CACV,YAAY;CACZ,WAAW;CACX,SAAS;CACT,YAAY;CACZ,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,YAAY;CACZ,OAAO;CAEP,aAAa;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,cAAc;EACd,WAAW;CACb;CAEA,UAAU;EACR,MAAM;GACJ,KAAK;IACH,OAAO;IACP,QAAQ;GACV;GACA,KAAK;IACH,OAAO;IACP,QAAQ;GACV;GACA,KAAK;IACH,OAAO;IACP,QAAQ;GACV;GACA,KAAK;IACH,OAAO;IACP,QAAQ;GACV;GACA,KAAK;IACH,OAAO;IACP,QAAQ;GACV;GACA,KAAK;IACH,OAAO;IACP,QAAQ;GACV;EACF;EACA,SAAS;GACP,MAAM,EACJ,iBAAiB,UACnB;GACA,KAAK,EACH,iBAAiB,QACnB;GACA,QAAQ,EACN,iBAAiB,WACnB;GACA,MAAM,EACJ,iBAAiB,SACnB;GACA,OAAO,EACL,iBAAiB,UACnB;GACA,QAAQ,EACN,iBAAiB,WACnB;EACF;EACA,OAAO;GACL,QAAQ,EACN,cAAc,KAChB;GACA,QAAQ,EACN,cAAc,MAChB;EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,OAAO;CACT;AACF,CAAC;AAED,IAAM,oBAAoB,OAAO,gBAAgB,OAAO;CACtD,SAAS;CACT,WAAW;CACX,WAAW;CACX,QAAQ;CACR,eAAe;CACf,OAAO;AACT,CAAC;AAED,IAAM,uBAAuB,OAAO,gBAAgB,UAAU;CAC5D,eAAe;CACf,YAAY;CACZ,OAAO;CAEP,UAAU,EACR,MAAM;EACJ,KAAK;GACH,UAAU;GACV,YAAY;EACd;EACA,KAAK,EACH,UAAU,KACZ;EACA,KAAK,EACH,UAAU,KACZ;EACA,KAAK,EACH,UAAU,KACZ;EACA,KAAK,EACH,UAAU,KACZ;EACA,KAAK,EACH,UAAU,KACZ;CACF,EACF;CACA,iBAAiB,EACf,MAAM,IACR;AACF,CAAC;AAaD,IAAa,SAAS,MAAM,YACzB,EAAE,KAAK,KAAK,UAAU,MAAM,SAAS,OAAO,KAAK,GAAG,SAAS,iBAAiB;CAC7E,OACE,oBAAC,KAAD;EACE,KAAK;GACH,GAAG;GACH,UAAU;GACV,QAAQ;GACR,OAAO;EACT;YAEA,qBAAC,cAAD;GAAc,GAAI;GAAO,KAAK;GAAoB;GAAe;GAAgB;aAAjF,CACE,oBAAC,mBAAD;IAAwB;IAAU;GAAM,CAAA,GACxC,oBAAC,sBAAD;IAA4B;cAAO;GAA+B,CAAA,CACtD;;CACX,CAAA;AAET,CACF"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.vanilla.cjs","names":[],"sources":["../../../components/Avatar/Avatar.vanilla.tsx"],"sourcesContent":["import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React, { forwardRef } from 'react';\n\nimport { CSSProps } from '../../styles/cssProps';\nimport { BoxVanilla } from '../Box/Box.vanilla';\nimport { avatarFallbackRecipe, avatarImage, avatarRecipe } from './Avatar.vanilla.css';\n\ntype AvatarRecipeVariants = NonNullable<RecipeVariants<typeof avatarRecipe>>;\n\ninterface AvatarOwnProps extends AvatarRecipeVariants, CSSProps {\n alt?: string;\n src?: string;\n fallback?: React.ReactNode;\n}\n\nexport type AvatarVanillaProps = Omit<\n React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n keyof AvatarOwnProps\n> &\n AvatarOwnProps;\n\nconst AvatarVanillaComponent = forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarVanillaProps\n>(({ alt, src, fallback, size, variant, shape, css, style, ...props }, ref) => {\n const recipeClass = avatarRecipe({ size, variant, shape });\n const fallbackRecipeClass = avatarFallbackRecipe({ size });\n\n // This CSS will be processed by the Box component\n const wrapperCss = {\n ...css,\n position: 'relative' as const,\n height: 'fit-content' as const,\n width: 'fit-content' as const,\n };\n\n return (\n <BoxVanilla css={wrapperCss} style={style}>\n <AvatarPrimitive.Root ref={ref} className={recipeClass} {...props}>\n <AvatarPrimitive.Image className={avatarImage} alt={alt} src={src} />\n <AvatarPrimitive.Fallback className={fallbackRecipeClass}>\n {fallback}\n </AvatarPrimitive.Fallback>\n </AvatarPrimitive.Root>\n </BoxVanilla>\n );\n});\n\nAvatarVanillaComponent.displayName = 'AvatarVanilla';\n\nexport const AvatarVanilla = AvatarVanillaComponent;\n"],"mappings":";;;;;;;;;AAsBA,IAAM,0BAAA,GAAA,MAAA,aAGH,EAAE,KAAK,KAAK,UAAU,MAAM,SAAS,OAAO,KAAK,OAAO,GAAG,SAAS,QAAQ;CAC7E,MAAM,cAAc,2BAAA,aAAa;EAAE;EAAM;EAAS;~~EAAO~~,CAAC;~~CAC1D~~,MAAM,sBAAsB,2BAAA,qBAAqB,EAAE,~~MAAM~~,CAAC;~~AAU1D~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,oBAAA,YAAD;EAAY,KAAK;GAPjB,GAAG;GACH,UAAU;GACV,QAAQ;GACR,OAAO;~~GAIU~~;EAAmB;YAClC,iBAAA,GAAA,kBAAA,MAAC,uBAAgB,MAAjB;GAA2B;GAAK,WAAW;GAAa,GAAI;aAA5D,CACE,iBAAA,GAAA,kBAAA,KAAC,uBAAgB,OAAjB;IAAuB,WAAW,2BAAA;IAAkB;IAAU;~~IAAO~~,CAAA,~~EACrE~~,iBAAA,GAAA,kBAAA,KAAC,uBAAgB,UAAjB;IAA0B,WAAW;cAClC;~~IACwB~~,CAAA,CACN;;~~EACZ~~,CAAA;~~EAEf~~;~~AAEF~~,uBAAuB,cAAc;AAErC,IAAa,gBAAgB"}
1	+ {"version":3,"file":"Avatar.vanilla.cjs","names":[],"sources":["../../../components/Avatar/Avatar.vanilla.tsx"],"sourcesContent":["import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React, { forwardRef } from 'react';\n\nimport { CSSProps } from '../../styles/cssProps';\nimport { BoxVanilla } from '../Box/Box.vanilla';\nimport { avatarFallbackRecipe, avatarImage, avatarRecipe } from './Avatar.vanilla.css';\n\ntype AvatarRecipeVariants = NonNullable<RecipeVariants<typeof avatarRecipe>>;\n\ninterface AvatarOwnProps extends AvatarRecipeVariants, CSSProps {\n alt?: string;\n src?: string;\n fallback?: React.ReactNode;\n}\n\nexport type AvatarVanillaProps = Omit<\n React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n keyof AvatarOwnProps\n> &\n AvatarOwnProps;\n\nconst AvatarVanillaComponent = forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarVanillaProps\n>(({ alt, src, fallback, size, variant, shape, css, style, ...props }, ref) => {\n const recipeClass = avatarRecipe({ size, variant, shape });\n const fallbackRecipeClass = avatarFallbackRecipe({ size });\n\n // This CSS will be processed by the Box component\n const wrapperCss = {\n ...css,\n position: 'relative' as const,\n height: 'fit-content' as const,\n width: 'fit-content' as const,\n };\n\n return (\n <BoxVanilla css={wrapperCss} style={style}>\n <AvatarPrimitive.Root ref={ref} className={recipeClass} {...props}>\n <AvatarPrimitive.Image className={avatarImage} alt={alt} src={src} />\n <AvatarPrimitive.Fallback className={fallbackRecipeClass}>\n {fallback}\n </AvatarPrimitive.Fallback>\n </AvatarPrimitive.Root>\n </BoxVanilla>\n );\n});\n\nAvatarVanillaComponent.displayName = 'AvatarVanilla';\n\nexport const AvatarVanilla = AvatarVanillaComponent;\n"],"mappings":";;;;;;;;;AAsBA,IAAM,0BAAA,GAAA,MAAA,aAGH,EAAE,KAAK,KAAK,UAAU,MAAM,SAAS,OAAO,KAAK,OAAO,GAAG,SAAS,QAAQ;CAC7E,MAAM,cAAc,2BAAA,aAAa;EAAE;EAAM;EAAS;CAAM,CAAC;CACzD,MAAM,sBAAsB,2BAAA,qBAAqB,EAAE,KAAK,CAAC;CAUzD,OACE,iBAAA,GAAA,kBAAA,KAAC,oBAAA,YAAD;EAAY,KAAK;GAPjB,GAAG;GACH,UAAU;GACV,QAAQ;GACR,OAAO;EAIU;EAAmB;YAClC,iBAAA,GAAA,kBAAA,MAAC,uBAAgB,MAAjB;GAA2B;GAAK,WAAW;GAAa,GAAI;aAA5D,CACE,iBAAA,GAAA,kBAAA,KAAC,uBAAgB,OAAjB;IAAuB,WAAW,2BAAA;IAAkB;IAAU;GAAM,CAAA,GACpE,iBAAA,GAAA,kBAAA,KAAC,uBAAgB,UAAjB;IAA0B,WAAW;cAClC;GACuB,CAAA,CACN;;CACZ,CAAA;AAEhB,CAAC;AAED,uBAAuB,cAAc;AAErC,IAAa,gBAAgB"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.vanilla.js","names":[],"sources":["../../../components/Avatar/Avatar.vanilla.tsx"],"sourcesContent":["import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React, { forwardRef } from 'react';\n\nimport { CSSProps } from '../../styles/cssProps';\nimport { BoxVanilla } from '../Box/Box.vanilla';\nimport { avatarFallbackRecipe, avatarImage, avatarRecipe } from './Avatar.vanilla.css';\n\ntype AvatarRecipeVariants = NonNullable<RecipeVariants<typeof avatarRecipe>>;\n\ninterface AvatarOwnProps extends AvatarRecipeVariants, CSSProps {\n alt?: string;\n src?: string;\n fallback?: React.ReactNode;\n}\n\nexport type AvatarVanillaProps = Omit<\n React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n keyof AvatarOwnProps\n> &\n AvatarOwnProps;\n\nconst AvatarVanillaComponent = forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarVanillaProps\n>(({ alt, src, fallback, size, variant, shape, css, style, ...props }, ref) => {\n const recipeClass = avatarRecipe({ size, variant, shape });\n const fallbackRecipeClass = avatarFallbackRecipe({ size });\n\n // This CSS will be processed by the Box component\n const wrapperCss = {\n ...css,\n position: 'relative' as const,\n height: 'fit-content' as const,\n width: 'fit-content' as const,\n };\n\n return (\n <BoxVanilla css={wrapperCss} style={style}>\n <AvatarPrimitive.Root ref={ref} className={recipeClass} {...props}>\n <AvatarPrimitive.Image className={avatarImage} alt={alt} src={src} />\n <AvatarPrimitive.Fallback className={fallbackRecipeClass}>\n {fallback}\n </AvatarPrimitive.Fallback>\n </AvatarPrimitive.Root>\n </BoxVanilla>\n );\n});\n\nAvatarVanillaComponent.displayName = 'AvatarVanilla';\n\nexport const AvatarVanilla = AvatarVanillaComponent;\n"],"mappings":";;;;;;AAsBA,IAAM,yBAAyB,YAG5B,EAAE,KAAK,KAAK,UAAU,MAAM,SAAS,OAAO,KAAK,OAAO,GAAG,SAAS,QAAQ;CAC7E,MAAM,cAAc,aAAa;EAAE;EAAM;EAAS;~~EAAO~~,CAAC;~~CAC1D~~,MAAM,sBAAsB,qBAAqB,EAAE,~~MAAM~~,CAAC;~~AAU1D~~,~~QACE~~,oBAAC,YAAD;EAAY,KAAK;GAPjB,GAAG;GACH,UAAU;GACV,QAAQ;GACR,OAAO;~~GAIU~~;EAAmB;YAClC,qBAAC,gBAAgB,MAAjB;GAA2B;GAAK,WAAW;GAAa,GAAI;aAA5D,CACE,oBAAC,gBAAgB,OAAjB;IAAuB,WAAW;IAAkB;IAAU;~~IAAO~~,CAAA,~~EACrE~~,oBAAC,gBAAgB,UAAjB;IAA0B,WAAW;cAClC;~~IACwB~~,CAAA,CACN;;~~EACZ~~,CAAA;~~EAEf~~;~~AAEF~~,uBAAuB,cAAc;AAErC,IAAa,gBAAgB"}
1	+ {"version":3,"file":"Avatar.vanilla.js","names":[],"sources":["../../../components/Avatar/Avatar.vanilla.tsx"],"sourcesContent":["import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React, { forwardRef } from 'react';\n\nimport { CSSProps } from '../../styles/cssProps';\nimport { BoxVanilla } from '../Box/Box.vanilla';\nimport { avatarFallbackRecipe, avatarImage, avatarRecipe } from './Avatar.vanilla.css';\n\ntype AvatarRecipeVariants = NonNullable<RecipeVariants<typeof avatarRecipe>>;\n\ninterface AvatarOwnProps extends AvatarRecipeVariants, CSSProps {\n alt?: string;\n src?: string;\n fallback?: React.ReactNode;\n}\n\nexport type AvatarVanillaProps = Omit<\n React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n keyof AvatarOwnProps\n> &\n AvatarOwnProps;\n\nconst AvatarVanillaComponent = forwardRef<\n React.ElementRef<typeof AvatarPrimitive.Root>,\n AvatarVanillaProps\n>(({ alt, src, fallback, size, variant, shape, css, style, ...props }, ref) => {\n const recipeClass = avatarRecipe({ size, variant, shape });\n const fallbackRecipeClass = avatarFallbackRecipe({ size });\n\n // This CSS will be processed by the Box component\n const wrapperCss = {\n ...css,\n position: 'relative' as const,\n height: 'fit-content' as const,\n width: 'fit-content' as const,\n };\n\n return (\n <BoxVanilla css={wrapperCss} style={style}>\n <AvatarPrimitive.Root ref={ref} className={recipeClass} {...props}>\n <AvatarPrimitive.Image className={avatarImage} alt={alt} src={src} />\n <AvatarPrimitive.Fallback className={fallbackRecipeClass}>\n {fallback}\n </AvatarPrimitive.Fallback>\n </AvatarPrimitive.Root>\n </BoxVanilla>\n );\n});\n\nAvatarVanillaComponent.displayName = 'AvatarVanilla';\n\nexport const AvatarVanilla = AvatarVanillaComponent;\n"],"mappings":";;;;;;AAsBA,IAAM,yBAAyB,YAG5B,EAAE,KAAK,KAAK,UAAU,MAAM,SAAS,OAAO,KAAK,OAAO,GAAG,SAAS,QAAQ;CAC7E,MAAM,cAAc,aAAa;EAAE;EAAM;EAAS;CAAM,CAAC;CACzD,MAAM,sBAAsB,qBAAqB,EAAE,KAAK,CAAC;CAUzD,OACE,oBAAC,YAAD;EAAY,KAAK;GAPjB,GAAG;GACH,UAAU;GACV,QAAQ;GACR,OAAO;EAIU;EAAmB;YAClC,qBAAC,gBAAgB,MAAjB;GAA2B;GAAK,WAAW;GAAa,GAAI;aAA5D,CACE,oBAAC,gBAAgB,OAAjB;IAAuB,WAAW;IAAkB;IAAU;GAAM,CAAA,GACpE,oBAAC,gBAAgB,UAAjB;IAA0B,WAAW;cAClC;GACuB,CAAA,CACN;;CACZ,CAAA;AAEhB,CAAC;AAED,uBAAuB,cAAc;AAErC,IAAa,gBAAgB"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.cjs","names":[],"sources":["../../../components/Badge/Badge.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { ComponentProps, useMemo } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { COLORS } from './Badge.vanilla';\n\ntype COLOR_VALUES = (typeof COLORS)[number];\n\nconst getColorBadgeStyles = (color: COLOR_VALUES) => ({\n bc: `$${color}6`,\n color: `$${color}10`,\n border: `1px solid $${color}10`,\n});\n\ntype ColorVariants = Record<COLOR_VALUES, { bc: string; color: string }>;\nconst colorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: getColorBadgeStyles(color),\n }),\n {} as ColorVariants,\n);\n\nconst interactiveColorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: {\n ...getColorBadgeStyles(color),\n },\n }),\n {} as ColorVariants,\n);\n\nconst alphaColorCompoundVariants = COLORS.map((color) => ({\n alphaBg: true,\n variant: color,\n css: { bc: `$${color}A6` },\n}));\n\nconst BADGE_BASE_STYLES = {\n // Reset\n alignItems: 'center',\n appearance: 'none',\n border: 'none',\n boxSizing: 'border-box',\n display: 'inline-flex',\n flexShrink: 0,\n fontFamily: '$rubik',\n fontWeight: '$medium',\n justifyContent: 'center',\n lineHeight: '1',\n verticalAlign: 'middle',\n outline: 'none',\n padding: '0',\n textDecoration: 'none',\n userSelect: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n borderRadius: '$pill',\n whiteSpace: 'nowrap',\n fontVariantNumeric: 'tabular-nums',\n position: 'relative',\n\n '&:disabled': {\n backgroundColor: '$slate3',\n pointerEvents: 'none',\n color: '$slate8',\n },\n variants: {\n size: {\n small: {\n height: '$4',\n px: '$2',\n fontSize: '$2',\n },\n large: {\n height: '$5',\n px: '$3',\n fontSize: '$3',\n },\n },\n variant: colorVariants,\n alphaBg: {\n true: {},\n },\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n compoundVariants: alphaColorCompoundVariants,\n defaultVariants: {\n size: 'small',\n variant: 'gray',\n borderless: false,\n },\n};\n\nconst StyledSpanBadge = styled('span', BADGE_BASE_STYLES);\nconst StyledSpanBadgeSlot = styled(Slot, StyledSpanBadge);\n\nconst StyledButtonBadge = styled('button', BADGE_BASE_STYLES, {\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n borderRadius: 'inherit',\n },\n '&:focus-visible': {\n outline: '2px solid $primary',\n },\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundHover',\n },\n },\n '&:active': {\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundActive',\n },\n },\n\n variants: {\n variant: interactiveColorVariants,\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n});\nconst StyledButtonBadgeSlot = styled(Slot, StyledButtonBadge);\n\ntype BadgeProps = ComponentProps<typeof StyledButtonBadge> &\n VariantProps<typeof StyledButtonBadge> & {\n asChild?: boolean;\n interactive?: boolean;\n };\n\nexport const Badge = React.forwardRef<React.ElementRef<typeof StyledButtonBadge>, BadgeProps>(\n ({ interactive, asChild, ...props }, forwardedRef) => {\n const Component = useMemo(() => {\n if (interactive) {\n return asChild ? StyledButtonBadgeSlot : StyledButtonBadge;\n }\n return asChild ? StyledSpanBadgeSlot : StyledSpanBadge;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [asChild]);\n\n return <Component {...props} ref={forwardedRef} />;\n },\n);\n"],"mappings":";;;;;;;;AAQA,IAAM,uBAAuB,WAAyB;CACpD,IAAI,IAAI,MAAM;CACd,OAAO,IAAI,MAAM;CACjB,QAAQ,cAAc,MAAM;~~CAC7B~~;~~AAGD~~,IAAM,gBAA+B,sBAAA,OAAO,QACzC,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,oBAAoB,~~MAAM~~;~~CACpC~~,~~GACD~~,~~EAAE~~,CACH;~~AAED~~,IAAM,2BAA0C,sBAAA,OAAO,QACpD,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,EACP,GAAG,oBAAoB,~~MAAM~~,EAC9B;~~CACF~~,~~GACD~~,~~EAAE~~,CACH;~~AAED~~,IAAM,6BAA6B,sBAAA,OAAO,KAAK,WAAW;CACxD,SAAS;CACT,SAAS;CACT,KAAK,EAAE,IAAI,IAAI,MAAM,~~KAAK~~;~~CAC3B~~,EAAE;~~AAEH~~,IAAM,oBAAoB;CAExB,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,WAAW;CACX,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACZ,eAAe;CACf,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,yBAAyB;CACzB,cAAc;CACd,YAAY;CACZ,oBAAoB;CACpB,UAAU;CAEV,cAAc;EACZ,iBAAiB;EACjB,eAAe;EACf,OAAO;~~EACR~~;~~CACD~~,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;~~IACX~~;~~GACD~~,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;~~IACX~~;~~GACF~~;~~EACD~~,SAAS;EACT,SAAS,EACP,MAAM,~~EAAE~~,EACT;~~EACD~~,YAAY,EACV,MAAM,EACJ,QAAQ,~~QACT~~,EACF;~~EACF~~;~~CACD~~,kBAAkB;CAClB,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,YAAY;~~EACb~~;~~CACF~~;~~AAED~~,IAAM,kBAAkB,wBAAA,OAAO,QAAQ,~~kBAAkB~~;~~AACzD~~,IAAM,sBAAsB,wBAAA,OAAO,qBAAA,MAAM,~~gBAAgB~~;~~AAEzD~~,IAAM,oBAAoB,wBAAA,OAAO,UAAU,mBAAmB;CAC5D,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;~~EACf~~;~~CACD~~,mBAAmB,EACjB,SAAS,~~sBACV~~;~~CACD~~,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,~~oCAClB~~;~~EACF~~;~~CACD~~,YAAY,EACV,aAAa,EACX,iBAAiB,~~qCAClB~~,EACF;~~CAED~~,UAAU;EACR,SAAS;EACT,YAAY,EACV,MAAM,EACJ,QAAQ,~~QACT~~,EACF;~~EACF~~;~~CACF~~,CAAC;~~AACF~~,IAAM,wBAAwB,wBAAA,OAAO,qBAAA,MAAM,~~kBAAkB~~;~~AAQ7D~~,IAAa,QAAQ,MAAA,QAAM,YACxB,EAAE,aAAa,SAAS,GAAG,SAAS,iBAAiB;~~AASpD~~,~~QAAO~~,iBAAA,GAAA,kBAAA,MAAA,GAAA,MAAA,eARyB;~~AAC9B~~,~~MAAI~~,~~YACF~~,~~QAAO~~,UAAU,wBAAwB;~~AAE3C~~,~~SAAO~~,UAAU,sBAAsB;~~IAEtC~~,CAAC,~~QAAQ~~,~~CAEJ~~,~~EAAD~~;EAAW,GAAI;EAAO,KAAK;~~EAAgB~~,CAAA;~~EAErD~~"}
1	+ {"version":3,"file":"Badge.cjs","names":[],"sources":["../../../components/Badge/Badge.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { ComponentProps, useMemo } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { COLORS } from './Badge.vanilla';\n\ntype COLOR_VALUES = (typeof COLORS)[number];\n\nconst getColorBadgeStyles = (color: COLOR_VALUES) => ({\n bc: `$${color}6`,\n color: `$${color}10`,\n border: `1px solid $${color}10`,\n});\n\ntype ColorVariants = Record<COLOR_VALUES, { bc: string; color: string }>;\nconst colorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: getColorBadgeStyles(color),\n }),\n {} as ColorVariants,\n);\n\nconst interactiveColorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: {\n ...getColorBadgeStyles(color),\n },\n }),\n {} as ColorVariants,\n);\n\nconst alphaColorCompoundVariants = COLORS.map((color) => ({\n alphaBg: true,\n variant: color,\n css: { bc: `$${color}A6` },\n}));\n\nconst BADGE_BASE_STYLES = {\n // Reset\n alignItems: 'center',\n appearance: 'none',\n border: 'none',\n boxSizing: 'border-box',\n display: 'inline-flex',\n flexShrink: 0,\n fontFamily: '$rubik',\n fontWeight: '$medium',\n justifyContent: 'center',\n lineHeight: '1',\n verticalAlign: 'middle',\n outline: 'none',\n padding: '0',\n textDecoration: 'none',\n userSelect: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n borderRadius: '$pill',\n whiteSpace: 'nowrap',\n fontVariantNumeric: 'tabular-nums',\n position: 'relative',\n\n '&:disabled': {\n backgroundColor: '$slate3',\n pointerEvents: 'none',\n color: '$slate8',\n },\n variants: {\n size: {\n small: {\n height: '$4',\n px: '$2',\n fontSize: '$2',\n },\n large: {\n height: '$5',\n px: '$3',\n fontSize: '$3',\n },\n },\n variant: colorVariants,\n alphaBg: {\n true: {},\n },\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n compoundVariants: alphaColorCompoundVariants,\n defaultVariants: {\n size: 'small',\n variant: 'gray',\n borderless: false,\n },\n};\n\nconst StyledSpanBadge = styled('span', BADGE_BASE_STYLES);\nconst StyledSpanBadgeSlot = styled(Slot, StyledSpanBadge);\n\nconst StyledButtonBadge = styled('button', BADGE_BASE_STYLES, {\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n borderRadius: 'inherit',\n },\n '&:focus-visible': {\n outline: '2px solid $primary',\n },\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundHover',\n },\n },\n '&:active': {\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundActive',\n },\n },\n\n variants: {\n variant: interactiveColorVariants,\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n});\nconst StyledButtonBadgeSlot = styled(Slot, StyledButtonBadge);\n\ntype BadgeProps = ComponentProps<typeof StyledButtonBadge> &\n VariantProps<typeof StyledButtonBadge> & {\n asChild?: boolean;\n interactive?: boolean;\n };\n\nexport const Badge = React.forwardRef<React.ElementRef<typeof StyledButtonBadge>, BadgeProps>(\n ({ interactive, asChild, ...props }, forwardedRef) => {\n const Component = useMemo(() => {\n if (interactive) {\n return asChild ? StyledButtonBadgeSlot : StyledButtonBadge;\n }\n return asChild ? StyledSpanBadgeSlot : StyledSpanBadge;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [asChild]);\n\n return <Component {...props} ref={forwardedRef} />;\n },\n);\n"],"mappings":";;;;;;;;AAQA,IAAM,uBAAuB,WAAyB;CACpD,IAAI,IAAI,MAAM;CACd,OAAO,IAAI,MAAM;CACjB,QAAQ,cAAc,MAAM;AAC9B;AAGA,IAAM,gBAA+B,sBAAA,OAAO,QACzC,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,oBAAoB,KAAK;AACpC,IACA,CAAC,CACH;AAEA,IAAM,2BAA0C,sBAAA,OAAO,QACpD,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,EACP,GAAG,oBAAoB,KAAK,EAC9B;AACF,IACA,CAAC,CACH;AAEA,IAAM,6BAA6B,sBAAA,OAAO,KAAK,WAAW;CACxD,SAAS;CACT,SAAS;CACT,KAAK,EAAE,IAAI,IAAI,MAAM,IAAI;AAC3B,EAAE;AAEF,IAAM,oBAAoB;CAExB,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,WAAW;CACX,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACZ,eAAe;CACf,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,yBAAyB;CACzB,cAAc;CACd,YAAY;CACZ,oBAAoB;CACpB,UAAU;CAEV,cAAc;EACZ,iBAAiB;EACjB,eAAe;EACf,OAAO;CACT;CACA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;GACZ;GACA,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;GACZ;EACF;EACA,SAAS;EACT,SAAS,EACP,MAAM,CAAC,EACT;EACA,YAAY,EACV,MAAM,EACJ,QAAQ,OACV,EACF;CACF;CACA,kBAAkB;CAClB,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,YAAY;CACd;AACF;AAEA,IAAM,kBAAkB,wBAAA,OAAO,QAAQ,iBAAiB;AACxD,IAAM,sBAAsB,wBAAA,OAAO,qBAAA,MAAM,eAAe;AAExD,IAAM,oBAAoB,wBAAA,OAAO,UAAU,mBAAmB;CAC5D,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;CAChB;CACA,mBAAmB,EACjB,SAAS,qBACX;CACA,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,mCACnB;CACF;CACA,YAAY,EACV,aAAa,EACX,iBAAiB,oCACnB,EACF;CAEA,UAAU;EACR,SAAS;EACT,YAAY,EACV,MAAM,EACJ,QAAQ,OACV,EACF;CACF;AACF,CAAC;AACD,IAAM,wBAAwB,wBAAA,OAAO,qBAAA,MAAM,iBAAiB;AAQ5D,IAAa,QAAQ,MAAA,QAAM,YACxB,EAAE,aAAa,SAAS,GAAG,SAAS,iBAAiB;CASpD,OAAO,iBAAA,GAAA,kBAAA,MAAA,GAAA,MAAA,eARyB;EAC9B,IAAI,aACF,OAAO,UAAU,wBAAwB;EAE3C,OAAO,UAAU,sBAAsB;CAEzC,GAAG,CAAC,OAAO,CAEH,GAAD;EAAW,GAAI;EAAO,KAAK;CAAe,CAAA;AACnD,CACF"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.js","names":[],"sources":["../../../components/Badge/Badge.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { ComponentProps, useMemo } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { COLORS } from './Badge.vanilla';\n\ntype COLOR_VALUES = (typeof COLORS)[number];\n\nconst getColorBadgeStyles = (color: COLOR_VALUES) => ({\n bc: `$${color}6`,\n color: `$${color}10`,\n border: `1px solid $${color}10`,\n});\n\ntype ColorVariants = Record<COLOR_VALUES, { bc: string; color: string }>;\nconst colorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: getColorBadgeStyles(color),\n }),\n {} as ColorVariants,\n);\n\nconst interactiveColorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: {\n ...getColorBadgeStyles(color),\n },\n }),\n {} as ColorVariants,\n);\n\nconst alphaColorCompoundVariants = COLORS.map((color) => ({\n alphaBg: true,\n variant: color,\n css: { bc: `$${color}A6` },\n}));\n\nconst BADGE_BASE_STYLES = {\n // Reset\n alignItems: 'center',\n appearance: 'none',\n border: 'none',\n boxSizing: 'border-box',\n display: 'inline-flex',\n flexShrink: 0,\n fontFamily: '$rubik',\n fontWeight: '$medium',\n justifyContent: 'center',\n lineHeight: '1',\n verticalAlign: 'middle',\n outline: 'none',\n padding: '0',\n textDecoration: 'none',\n userSelect: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n borderRadius: '$pill',\n whiteSpace: 'nowrap',\n fontVariantNumeric: 'tabular-nums',\n position: 'relative',\n\n '&:disabled': {\n backgroundColor: '$slate3',\n pointerEvents: 'none',\n color: '$slate8',\n },\n variants: {\n size: {\n small: {\n height: '$4',\n px: '$2',\n fontSize: '$2',\n },\n large: {\n height: '$5',\n px: '$3',\n fontSize: '$3',\n },\n },\n variant: colorVariants,\n alphaBg: {\n true: {},\n },\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n compoundVariants: alphaColorCompoundVariants,\n defaultVariants: {\n size: 'small',\n variant: 'gray',\n borderless: false,\n },\n};\n\nconst StyledSpanBadge = styled('span', BADGE_BASE_STYLES);\nconst StyledSpanBadgeSlot = styled(Slot, StyledSpanBadge);\n\nconst StyledButtonBadge = styled('button', BADGE_BASE_STYLES, {\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n borderRadius: 'inherit',\n },\n '&:focus-visible': {\n outline: '2px solid $primary',\n },\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundHover',\n },\n },\n '&:active': {\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundActive',\n },\n },\n\n variants: {\n variant: interactiveColorVariants,\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n});\nconst StyledButtonBadgeSlot = styled(Slot, StyledButtonBadge);\n\ntype BadgeProps = ComponentProps<typeof StyledButtonBadge> &\n VariantProps<typeof StyledButtonBadge> & {\n asChild?: boolean;\n interactive?: boolean;\n };\n\nexport const Badge = React.forwardRef<React.ElementRef<typeof StyledButtonBadge>, BadgeProps>(\n ({ interactive, asChild, ...props }, forwardedRef) => {\n const Component = useMemo(() => {\n if (interactive) {\n return asChild ? StyledButtonBadgeSlot : StyledButtonBadge;\n }\n return asChild ? StyledSpanBadgeSlot : StyledSpanBadge;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [asChild]);\n\n return <Component {...props} ref={forwardedRef} />;\n },\n);\n"],"mappings":";;;;;;AAQA,IAAM,uBAAuB,WAAyB;CACpD,IAAI,IAAI,MAAM;CACd,OAAO,IAAI,MAAM;CACjB,QAAQ,cAAc,MAAM;~~CAC7B~~;~~AAGD~~,IAAM,gBAA+B,OAAO,QACzC,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,oBAAoB,~~MAAM~~;~~CACpC~~,~~GACD~~,~~EAAE~~,CACH;~~AAED~~,IAAM,2BAA0C,OAAO,QACpD,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,EACP,GAAG,oBAAoB,~~MAAM~~,EAC9B;~~CACF~~,~~GACD~~,~~EAAE~~,CACH;~~AAED~~,IAAM,6BAA6B,OAAO,KAAK,WAAW;CACxD,SAAS;CACT,SAAS;CACT,KAAK,EAAE,IAAI,IAAI,MAAM,~~KAAK~~;~~CAC3B~~,EAAE;~~AAEH~~,IAAM,oBAAoB;CAExB,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,WAAW;CACX,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACZ,eAAe;CACf,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,yBAAyB;CACzB,cAAc;CACd,YAAY;CACZ,oBAAoB;CACpB,UAAU;CAEV,cAAc;EACZ,iBAAiB;EACjB,eAAe;EACf,OAAO;~~EACR~~;~~CACD~~,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;~~IACX~~;~~GACD~~,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;~~IACX~~;~~GACF~~;~~EACD~~,SAAS;EACT,SAAS,EACP,MAAM,~~EAAE~~,EACT;~~EACD~~,YAAY,EACV,MAAM,EACJ,QAAQ,~~QACT~~,EACF;~~EACF~~;~~CACD~~,kBAAkB;CAClB,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,YAAY;~~EACb~~;~~CACF~~;~~AAED~~,IAAM,kBAAkB,OAAO,QAAQ,~~kBAAkB~~;~~AACzD~~,IAAM,sBAAsB,OAAO,MAAM,~~gBAAgB~~;~~AAEzD~~,IAAM,oBAAoB,OAAO,UAAU,mBAAmB;CAC5D,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;~~EACf~~;~~CACD~~,mBAAmB,EACjB,SAAS,~~sBACV~~;~~CACD~~,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,~~oCAClB~~;~~EACF~~;~~CACD~~,YAAY,EACV,aAAa,EACX,iBAAiB,~~qCAClB~~,EACF;~~CAED~~,UAAU;EACR,SAAS;EACT,YAAY,EACV,MAAM,EACJ,QAAQ,~~QACT~~,EACF;~~EACF~~;~~CACF~~,CAAC;~~AACF~~,IAAM,wBAAwB,OAAO,MAAM,~~kBAAkB~~;~~AAQ7D~~,IAAa,QAAQ,MAAM,YACxB,EAAE,aAAa,SAAS,GAAG,SAAS,iBAAiB;~~AASpD~~,~~QAAO~~,oBARW,cAAc;~~AAC9B~~,~~MAAI~~,~~YACF~~,~~QAAO~~,UAAU,wBAAwB;~~AAE3C~~,~~SAAO~~,UAAU,sBAAsB;~~IAEtC~~,CAAC,~~QAAQ~~,~~CAEJ~~,~~EAAD~~;EAAW,GAAI;EAAO,KAAK;~~EAAgB~~,CAAA;~~EAErD~~"}
1	+ {"version":3,"file":"Badge.js","names":[],"sources":["../../../components/Badge/Badge.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport React, { ComponentProps, useMemo } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { COLORS } from './Badge.vanilla';\n\ntype COLOR_VALUES = (typeof COLORS)[number];\n\nconst getColorBadgeStyles = (color: COLOR_VALUES) => ({\n bc: `$${color}6`,\n color: `$${color}10`,\n border: `1px solid $${color}10`,\n});\n\ntype ColorVariants = Record<COLOR_VALUES, { bc: string; color: string }>;\nconst colorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: getColorBadgeStyles(color),\n }),\n {} as ColorVariants,\n);\n\nconst interactiveColorVariants: ColorVariants = COLORS.reduce(\n (variants, color) => ({\n ...variants,\n [color]: {\n ...getColorBadgeStyles(color),\n },\n }),\n {} as ColorVariants,\n);\n\nconst alphaColorCompoundVariants = COLORS.map((color) => ({\n alphaBg: true,\n variant: color,\n css: { bc: `$${color}A6` },\n}));\n\nconst BADGE_BASE_STYLES = {\n // Reset\n alignItems: 'center',\n appearance: 'none',\n border: 'none',\n boxSizing: 'border-box',\n display: 'inline-flex',\n flexShrink: 0,\n fontFamily: '$rubik',\n fontWeight: '$medium',\n justifyContent: 'center',\n lineHeight: '1',\n verticalAlign: 'middle',\n outline: 'none',\n padding: '0',\n textDecoration: 'none',\n userSelect: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n borderRadius: '$pill',\n whiteSpace: 'nowrap',\n fontVariantNumeric: 'tabular-nums',\n position: 'relative',\n\n '&:disabled': {\n backgroundColor: '$slate3',\n pointerEvents: 'none',\n color: '$slate8',\n },\n variants: {\n size: {\n small: {\n height: '$4',\n px: '$2',\n fontSize: '$2',\n },\n large: {\n height: '$5',\n px: '$3',\n fontSize: '$3',\n },\n },\n variant: colorVariants,\n alphaBg: {\n true: {},\n },\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n compoundVariants: alphaColorCompoundVariants,\n defaultVariants: {\n size: 'small',\n variant: 'gray',\n borderless: false,\n },\n};\n\nconst StyledSpanBadge = styled('span', BADGE_BASE_STYLES);\nconst StyledSpanBadgeSlot = styled(Slot, StyledSpanBadge);\n\nconst StyledButtonBadge = styled('button', BADGE_BASE_STYLES, {\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n borderRadius: 'inherit',\n },\n '&:focus-visible': {\n outline: '2px solid $primary',\n },\n '&:hover': {\n cursor: 'pointer',\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundHover',\n },\n },\n '&:active': {\n '&::before': {\n backgroundColor: '$badgeInteractiveBackgroundActive',\n },\n },\n\n variants: {\n variant: interactiveColorVariants,\n borderless: {\n true: {\n border: 'none',\n },\n },\n },\n});\nconst StyledButtonBadgeSlot = styled(Slot, StyledButtonBadge);\n\ntype BadgeProps = ComponentProps<typeof StyledButtonBadge> &\n VariantProps<typeof StyledButtonBadge> & {\n asChild?: boolean;\n interactive?: boolean;\n };\n\nexport const Badge = React.forwardRef<React.ElementRef<typeof StyledButtonBadge>, BadgeProps>(\n ({ interactive, asChild, ...props }, forwardedRef) => {\n const Component = useMemo(() => {\n if (interactive) {\n return asChild ? StyledButtonBadgeSlot : StyledButtonBadge;\n }\n return asChild ? StyledSpanBadgeSlot : StyledSpanBadge;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [asChild]);\n\n return <Component {...props} ref={forwardedRef} />;\n },\n);\n"],"mappings":";;;;;;AAQA,IAAM,uBAAuB,WAAyB;CACpD,IAAI,IAAI,MAAM;CACd,OAAO,IAAI,MAAM;CACjB,QAAQ,cAAc,MAAM;AAC9B;AAGA,IAAM,gBAA+B,OAAO,QACzC,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,oBAAoB,KAAK;AACpC,IACA,CAAC,CACH;AAEA,IAAM,2BAA0C,OAAO,QACpD,UAAU,WAAW;CACpB,GAAG;EACF,QAAQ,EACP,GAAG,oBAAoB,KAAK,EAC9B;AACF,IACA,CAAC,CACH;AAEA,IAAM,6BAA6B,OAAO,KAAK,WAAW;CACxD,SAAS;CACT,SAAS;CACT,KAAK,EAAE,IAAI,IAAI,MAAM,IAAI;AAC3B,EAAE;AAEF,IAAM,oBAAoB;CAExB,YAAY;CACZ,YAAY;CACZ,QAAQ;CACR,WAAW;CACX,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,gBAAgB;CAChB,YAAY;CACZ,eAAe;CACf,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,yBAAyB;CACzB,cAAc;CACd,YAAY;CACZ,oBAAoB;CACpB,UAAU;CAEV,cAAc;EACZ,iBAAiB;EACjB,eAAe;EACf,OAAO;CACT;CACA,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;GACZ;GACA,OAAO;IACL,QAAQ;IACR,IAAI;IACJ,UAAU;GACZ;EACF;EACA,SAAS;EACT,SAAS,EACP,MAAM,CAAC,EACT;EACA,YAAY,EACV,MAAM,EACJ,QAAQ,OACV,EACF;CACF;CACA,kBAAkB;CAClB,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,YAAY;CACd;AACF;AAEA,IAAM,kBAAkB,OAAO,QAAQ,iBAAiB;AACxD,IAAM,sBAAsB,OAAO,MAAM,eAAe;AAExD,IAAM,oBAAoB,OAAO,UAAU,mBAAmB;CAC5D,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,cAAc;CAChB;CACA,mBAAmB,EACjB,SAAS,qBACX;CACA,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,mCACnB;CACF;CACA,YAAY,EACV,aAAa,EACX,iBAAiB,oCACnB,EACF;CAEA,UAAU;EACR,SAAS;EACT,YAAY,EACV,MAAM,EACJ,QAAQ,OACV,EACF;CACF;AACF,CAAC;AACD,IAAM,wBAAwB,OAAO,MAAM,iBAAiB;AAQ5D,IAAa,QAAQ,MAAM,YACxB,EAAE,aAAa,SAAS,GAAG,SAAS,iBAAiB;CASpD,OAAO,oBARW,cAAc;EAC9B,IAAI,aACF,OAAO,UAAU,wBAAwB;EAE3C,OAAO,UAAU,sBAAsB;CAEzC,GAAG,CAAC,OAAO,CAEH,GAAD;EAAW,GAAI;EAAO,KAAK;CAAe,CAAA;AACnD,CACF"}

package/dist/components/Badge/Badge.theme.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.theme.cjs","names":[],"sources":["../../../components/Badge/Badge.theme.ts"],"sourcesContent":["// Plain TypeScript color tokens (no vanilla-extract)\n// Can be safely imported by colors/index.ts for Stitches\nexport const badgeLightTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.05)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.1)',\n};\n\nexport const badgeDarkTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.1)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.2)',\n};\n"],"mappings":";AAEA,IAAa,kBAAkB;CAC7B,iCAAiC;CACjC,kCAAkC;~~CACnC~~;~~AAED~~,IAAa,iBAAiB;CAC5B,iCAAiC;CACjC,kCAAkC;~~CACnC~~"}
1	+ {"version":3,"file":"Badge.theme.cjs","names":[],"sources":["../../../components/Badge/Badge.theme.ts"],"sourcesContent":["// Plain TypeScript color tokens (no vanilla-extract)\n// Can be safely imported by colors/index.ts for Stitches\nexport const badgeLightTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.05)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.1)',\n};\n\nexport const badgeDarkTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.1)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.2)',\n};\n"],"mappings":";AAEA,IAAa,kBAAkB;CAC7B,iCAAiC;CACjC,kCAAkC;AACpC;AAEA,IAAa,iBAAiB;CAC5B,iCAAiC;CACjC,kCAAkC;AACpC"}

package/dist/components/Badge/Badge.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.theme.js","names":[],"sources":["../../../components/Badge/Badge.theme.ts"],"sourcesContent":["// Plain TypeScript color tokens (no vanilla-extract)\n// Can be safely imported by colors/index.ts for Stitches\nexport const badgeLightTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.05)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.1)',\n};\n\nexport const badgeDarkTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.1)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.2)',\n};\n"],"mappings":";AAEA,IAAa,kBAAkB;CAC7B,iCAAiC;CACjC,kCAAkC;~~CACnC~~;~~AAED~~,IAAa,iBAAiB;CAC5B,iCAAiC;CACjC,kCAAkC;~~CACnC~~"}
1	+ {"version":3,"file":"Badge.theme.js","names":[],"sources":["../../../components/Badge/Badge.theme.ts"],"sourcesContent":["// Plain TypeScript color tokens (no vanilla-extract)\n// Can be safely imported by colors/index.ts for Stitches\nexport const badgeLightTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.05)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.1)',\n};\n\nexport const badgeDarkTheme = {\n badgeInteractiveBackgroundHover: 'hsla(0, 0%, 0%, 0.1)',\n badgeInteractiveBackgroundActive: 'hsla(0, 0%, 0%, 0.2)',\n};\n"],"mappings":";AAEA,IAAa,kBAAkB;CAC7B,iCAAiC;CACjC,kCAAkC;AACpC;AAEA,IAAa,iBAAiB;CAC5B,iCAAiC;CACjC,kCAAkC;AACpC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.themes.cjs","names":[],"sources":["../../../components/Badge/Badge.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 badgeInteractiveBackgroundActive: Property.Color;\n badgeInteractiveBackgroundHover: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.1).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.05).toHslString(),\n });\n\n export const getDark: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.2).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.1).toHslString(),\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;~~AAQQ~~,~~QAAA~~,kBAA2B;EACtC,mCAAA,GAAA,WAAA,SAA4C,~~QAAQ~~,~~CAAC~~,SAAS,~~GAAI~~,~~CAAC~~,~~aAAa~~;~~EAChF~~,kCAAA,GAAA,WAAA,SAA2C,~~QAAQ~~,~~CAAC~~,SAAS,~~IAAK~~,~~CAAC~~,~~aAAa~~;~~EACjF~~;~~AAEY~~,~~QAAA~~,iBAA0B;EACrC,mCAAA,GAAA,WAAA,SAA4C,~~QAAQ~~,~~CAAC~~,SAAS,~~GAAI~~,~~CAAC~~,~~aAAa~~;~~EAChF~~,kCAAA,GAAA,WAAA,SAA2C,~~QAAQ~~,~~CAAC~~,SAAS,~~GAAI~~,~~CAAC~~,~~aAAa~~;~~EAChF~~;~~yBACF~~"}
1	+ {"version":3,"file":"Badge.themes.cjs","names":[],"sources":["../../../components/Badge/Badge.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 badgeInteractiveBackgroundActive: Property.Color;\n badgeInteractiveBackgroundHover: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.1).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.05).toHslString(),\n });\n\n export const getDark: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.2).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.1).toHslString(),\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAQQ,OAAA,kBAA2B;EACtC,mCAAA,GAAA,WAAA,SAA4C,OAAO,EAAE,SAAS,EAAG,EAAE,YAAY;EAC/E,kCAAA,GAAA,WAAA,SAA2C,OAAO,EAAE,SAAS,GAAI,EAAE,YAAY;CACjF;CAEa,OAAA,iBAA0B;EACrC,mCAAA,GAAA,WAAA,SAA4C,OAAO,EAAE,SAAS,EAAG,EAAE,YAAY;EAC/E,kCAAA,GAAA,WAAA,SAA2C,OAAO,EAAE,SAAS,EAAG,EAAE,YAAY;CAChF;wBACF"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.themes.js","names":[],"sources":["../../../components/Badge/Badge.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 badgeInteractiveBackgroundActive: Property.Color;\n badgeInteractiveBackgroundHover: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.1).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.05).toHslString(),\n });\n\n export const getDark: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.2).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.1).toHslString(),\n });\n}\n"],"mappings":";;AAKO,IAAA;;~~AAQQ~~,~~QAAA~~,kBAA2B;EACtC,kCAAkC,UAAU,~~QAAQ~~,~~CAAC~~,SAAS,~~GAAI~~,~~CAAC~~,~~aAAa~~;~~EAChF~~,iCAAiC,UAAU,~~QAAQ~~,~~CAAC~~,SAAS,~~IAAK~~,~~CAAC~~,~~aAAa~~;~~EACjF~~;~~AAEY~~,~~QAAA~~,iBAA0B;EACrC,kCAAkC,UAAU,~~QAAQ~~,~~CAAC~~,SAAS,~~GAAI~~,~~CAAC~~,~~aAAa~~;~~EAChF~~,iCAAiC,UAAU,~~QAAQ~~,~~CAAC~~,SAAS,~~GAAI~~,~~CAAC~~,~~aAAa~~;~~EAChF~~;~~yBACF~~"}
1	+ {"version":3,"file":"Badge.themes.js","names":[],"sources":["../../../components/Badge/Badge.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 badgeInteractiveBackgroundActive: Property.Color;\n badgeInteractiveBackgroundHover: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.1).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.05).toHslString(),\n });\n\n export const getDark: Factory = () => ({\n badgeInteractiveBackgroundActive: tinycolor('black').setAlpha(0.2).toHslString(),\n badgeInteractiveBackgroundHover: tinycolor('black').setAlpha(0.1).toHslString(),\n });\n}\n"],"mappings":";;AAKO,IAAA;;CAQQ,OAAA,kBAA2B;EACtC,kCAAkC,UAAU,OAAO,EAAE,SAAS,EAAG,EAAE,YAAY;EAC/E,iCAAiC,UAAU,OAAO,EAAE,SAAS,GAAI,EAAE,YAAY;CACjF;CAEa,OAAA,iBAA0B;EACrC,kCAAkC,UAAU,OAAO,EAAE,SAAS,EAAG,EAAE,YAAY;EAC/E,iCAAiC,UAAU,OAAO,EAAE,SAAS,EAAG,EAAE,YAAY;CAChF;wBACF"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.vanilla.cjs","names":[],"sources":["../../../components/Badge/Badge.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 { badgeRecipe, interactiveBadgeRecipe } from './Badge.vanilla.css';\n\nexport const COLORS = ['gray', 'red', 'blue', 'green', 'neon', 'orange', 'purple'] as const;\n\ntype BadgeRecipeVariants = RecipeVariants<typeof badgeRecipe>;\n\ninterface BadgeOwnProps extends Omit<BadgeRecipeVariants, 'color'>, CSSProps {\n interactive?: boolean;\n}\n\nexport type BadgeVanillaProps<C extends ElementType = 'span'> = PolymorphicComponentProps<\n C,\n BadgeOwnProps\n>;\n\ntype BadgeVanillaComponent = PolymorphicComponent<'span', BadgeVanillaProps<ElementType>>;\n\nconst BadgeVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'span'>(\n {\n as,\n interactive,\n className,\n css,\n style,\n size,\n variant,\n alphaBg,\n borderless,\n ...props\n }: BadgeVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'span');\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 recipe = interactive ? interactiveBadgeRecipe : badgeRecipe;\n const recipeClass = recipe({ size, variant, alphaBg, borderless });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBadgeVanillaComponentImpl.displayName = 'BadgeVanilla';\n\nexport const BadgeVanilla = BadgeVanillaComponentImpl as BadgeVanillaComponent;\n"],"mappings":";;;;;;;;AAaA,IAAa,SAAS;CAAC;CAAQ;CAAO;CAAQ;CAAS;CAAQ;CAAU;~~CAAS~~;~~AAelF~~,IAAM,6BAAA,GAAA,MAAA,aAEF,EACE,IACA,aACA,WACA,KACA,OACA,MACA,SACA,SACA,YACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAElD,MAAM,EAAE,WAAW,qBAAA,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,~~KAAK~~;~~EAC1B~~;~~AAKD~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,IANA,cAAc,0BAAA,yBAAyB,0BAAA,aAC3B;GAAE;GAAM;GAAS;GAAS;~~GAAY~~,~~CAK/C~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,0BAA0B,cAAc;AAExC,IAAa,eAAe"}
1	+ {"version":3,"file":"Badge.vanilla.cjs","names":[],"sources":["../../../components/Badge/Badge.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 { badgeRecipe, interactiveBadgeRecipe } from './Badge.vanilla.css';\n\nexport const COLORS = ['gray', 'red', 'blue', 'green', 'neon', 'orange', 'purple'] as const;\n\ntype BadgeRecipeVariants = RecipeVariants<typeof badgeRecipe>;\n\ninterface BadgeOwnProps extends Omit<BadgeRecipeVariants, 'color'>, CSSProps {\n interactive?: boolean;\n}\n\nexport type BadgeVanillaProps<C extends ElementType = 'span'> = PolymorphicComponentProps<\n C,\n BadgeOwnProps\n>;\n\ntype BadgeVanillaComponent = PolymorphicComponent<'span', BadgeVanillaProps<ElementType>>;\n\nconst BadgeVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'span'>(\n {\n as,\n interactive,\n className,\n css,\n style,\n size,\n variant,\n alphaBg,\n borderless,\n ...props\n }: BadgeVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'span');\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 recipe = interactive ? interactiveBadgeRecipe : badgeRecipe;\n const recipeClass = recipe({ size, variant, alphaBg, borderless });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBadgeVanillaComponentImpl.displayName = 'BadgeVanilla';\n\nexport const BadgeVanilla = BadgeVanillaComponentImpl as BadgeVanillaComponent;\n"],"mappings":";;;;;;;;AAaA,IAAa,SAAS;CAAC;CAAQ;CAAO;CAAQ;CAAS;CAAQ;CAAU;AAAQ;AAejF,IAAM,6BAAA,GAAA,MAAA,aAEF,EACE,IACA,aACA,WACA,KACA,OACA,MACA,SACA,SACA,YACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAElD,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;CAKA,OACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,IANA,cAAc,0BAAA,yBAAyB,0BAAA,aAC3B;GAAE;GAAM;GAAS;GAAS;EAAW,CAK9C,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,0BAA0B,cAAc;AAExC,IAAa,eAAe"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.vanilla.js","names":[],"sources":["../../../components/Badge/Badge.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 { badgeRecipe, interactiveBadgeRecipe } from './Badge.vanilla.css';\n\nexport const COLORS = ['gray', 'red', 'blue', 'green', 'neon', 'orange', 'purple'] as const;\n\ntype BadgeRecipeVariants = RecipeVariants<typeof badgeRecipe>;\n\ninterface BadgeOwnProps extends Omit<BadgeRecipeVariants, 'color'>, CSSProps {\n interactive?: boolean;\n}\n\nexport type BadgeVanillaProps<C extends ElementType = 'span'> = PolymorphicComponentProps<\n C,\n BadgeOwnProps\n>;\n\ntype BadgeVanillaComponent = PolymorphicComponent<'span', BadgeVanillaProps<ElementType>>;\n\nconst BadgeVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'span'>(\n {\n as,\n interactive,\n className,\n css,\n style,\n size,\n variant,\n alphaBg,\n borderless,\n ...props\n }: BadgeVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'span');\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 recipe = interactive ? interactiveBadgeRecipe : badgeRecipe;\n const recipeClass = recipe({ size, variant, alphaBg, borderless });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBadgeVanillaComponentImpl.displayName = 'BadgeVanilla';\n\nexport const BadgeVanilla = BadgeVanillaComponentImpl as BadgeVanillaComponent;\n"],"mappings":";;;;;;;AAaA,IAAa,SAAS;CAAC;CAAQ;CAAO;CAAQ;CAAS;CAAQ;CAAU;~~CAAS~~;~~AAelF~~,IAAM,4BAA4B,YAE9B,EACE,IACA,aACA,WACA,KACA,OACA,MACA,SACA,SACA,YACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAElD,MAAM,EAAE,WAAW,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,~~KAAK~~;~~EAC1B~~;~~AAKD~~,~~QACE~~,oBAAC,WAAD;EACO;EACL,WAAW,IANA,cAAc,yBAAyB,aAC3B;GAAE;GAAM;GAAS;GAAS;~~GAAY~~,~~CAK/C~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,0BAA0B,cAAc;AAExC,IAAa,eAAe"}
1	+ {"version":3,"file":"Badge.vanilla.js","names":[],"sources":["../../../components/Badge/Badge.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 { badgeRecipe, interactiveBadgeRecipe } from './Badge.vanilla.css';\n\nexport const COLORS = ['gray', 'red', 'blue', 'green', 'neon', 'orange', 'purple'] as const;\n\ntype BadgeRecipeVariants = RecipeVariants<typeof badgeRecipe>;\n\ninterface BadgeOwnProps extends Omit<BadgeRecipeVariants, 'color'>, CSSProps {\n interactive?: boolean;\n}\n\nexport type BadgeVanillaProps<C extends ElementType = 'span'> = PolymorphicComponentProps<\n C,\n BadgeOwnProps\n>;\n\ntype BadgeVanillaComponent = PolymorphicComponent<'span', BadgeVanillaProps<ElementType>>;\n\nconst BadgeVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'span'>(\n {\n as,\n interactive,\n className,\n css,\n style,\n size,\n variant,\n alphaBg,\n borderless,\n ...props\n }: BadgeVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| (interactive ? 'button' : 'span');\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 recipe = interactive ? interactiveBadgeRecipe : badgeRecipe;\n const recipeClass = recipe({ size, variant, alphaBg, borderless });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBadgeVanillaComponentImpl.displayName = 'BadgeVanilla';\n\nexport const BadgeVanilla = BadgeVanillaComponentImpl as BadgeVanillaComponent;\n"],"mappings":";;;;;;;AAaA,IAAa,SAAS;CAAC;CAAQ;CAAO;CAAQ;CAAS;CAAQ;CAAU;AAAQ;AAejF,IAAM,4BAA4B,YAE9B,EACE,IACA,aACA,WACA,KACA,OACA,MACA,SACA,SACA,YACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,OAAO,cAAc,WAAW;CAElD,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAKA,OACE,oBAAC,WAAD;EACO;EACL,WAAW,IANA,cAAc,yBAAyB,aAC3B;GAAE;GAAM;GAAS;GAAS;EAAW,CAK9C,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,0BAA0B,cAAc;AAExC,IAAa,eAAe"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Blockquote.cjs","names":[],"sources":["../../../components/Blockquote/Blockquote.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Text } from '../Text';\n\nexport const Blockquote = styled(Text, {\n borderLeft: '2px solid $textDefault',\n p: '$2 $3',\n});\n\nexport type BlockquoteVariants = VariantProps<typeof Blockquote>;\nexport type BlockquoteProps = BlockquoteVariants & { css?: CSS };\n"],"mappings":";;;AAGA,IAAa,aAAa,wBAAA,OAAO,aAAA,MAAM;CACrC,YAAY;CACZ,GAAG;~~CACJ~~,CAAC"}
1	+ {"version":3,"file":"Blockquote.cjs","names":[],"sources":["../../../components/Blockquote/Blockquote.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Text } from '../Text';\n\nexport const Blockquote = styled(Text, {\n borderLeft: '2px solid $textDefault',\n p: '$2 $3',\n});\n\nexport type BlockquoteVariants = VariantProps<typeof Blockquote>;\nexport type BlockquoteProps = BlockquoteVariants & { css?: CSS };\n"],"mappings":";;;AAGA,IAAa,aAAa,wBAAA,OAAO,aAAA,MAAM;CACrC,YAAY;CACZ,GAAG;AACL,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Blockquote.js","names":[],"sources":["../../../components/Blockquote/Blockquote.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Text } from '../Text';\n\nexport const Blockquote = styled(Text, {\n borderLeft: '2px solid $textDefault',\n p: '$2 $3',\n});\n\nexport type BlockquoteVariants = VariantProps<typeof Blockquote>;\nexport type BlockquoteProps = BlockquoteVariants & { css?: CSS };\n"],"mappings":";;;AAGA,IAAa,aAAa,OAAO,MAAM;CACrC,YAAY;CACZ,GAAG;~~CACJ~~,CAAC"}
1	+ {"version":3,"file":"Blockquote.js","names":[],"sources":["../../../components/Blockquote/Blockquote.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Text } from '../Text';\n\nexport const Blockquote = styled(Text, {\n borderLeft: '2px solid $textDefault',\n p: '$2 $3',\n});\n\nexport type BlockquoteVariants = VariantProps<typeof Blockquote>;\nexport type BlockquoteProps = BlockquoteVariants & { css?: CSS };\n"],"mappings":";;;AAGA,IAAa,aAAa,OAAO,MAAM;CACrC,YAAY;CACZ,GAAG;AACL,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Blockquote.vanilla.cjs","names":[],"sources":["../../../components/Blockquote/Blockquote.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 { blockquoteRecipe } from './Blockquote.vanilla.css';\n\ntype BlockquoteRecipeVariants = RecipeVariants<typeof blockquoteRecipe>;\n\ninterface BlockquoteOwnProps extends Omit<BlockquoteRecipeVariants, never>, CSSProps {}\n\nexport type BlockquoteVanillaProps<C extends ElementType = 'blockquote'> =\n PolymorphicComponentProps<C, BlockquoteOwnProps>;\n\ntype BlockquoteComponent = PolymorphicComponent<'blockquote', BlockquoteVanillaProps<ElementType>>;\n\nconst BlockquoteVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'blockquote'>(\n {\n as,\n className,\n css,\n style,\n size,\n weight,\n variant,\n gradient,\n transform,\n noWrap,\n ...props\n }: BlockquoteVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'blockquote') as ElementType;\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 = blockquoteRecipe({ size, weight, variant, gradient, transform, noWrap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBlockquoteVanillaComponentImpl.displayName = 'BlockquoteVanilla';\n\nexport const BlockquoteVanilla = BlockquoteVanillaComponentImpl as BlockquoteComponent;\n"],"mappings":";;;;;;;;AAsBA,IAAM,kCAAA,GAAA,MAAA,aAEF,EACE,IACA,WACA,KACA,OACA,MACA,QACA,SACA,UACA,WACA,QACA,GAAG,SAEL,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,qBAAA,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,~~KAAK~~;~~EAC1B~~;~~AAID~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,+BAAA,iBAAiB;GAAE;GAAM;GAAQ;GAAS;GAAU;GAAW;~~GAAQ~~,~~CAKzE~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
1	+ {"version":3,"file":"Blockquote.vanilla.cjs","names":[],"sources":["../../../components/Blockquote/Blockquote.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 { blockquoteRecipe } from './Blockquote.vanilla.css';\n\ntype BlockquoteRecipeVariants = RecipeVariants<typeof blockquoteRecipe>;\n\ninterface BlockquoteOwnProps extends Omit<BlockquoteRecipeVariants, never>, CSSProps {}\n\nexport type BlockquoteVanillaProps<C extends ElementType = 'blockquote'> =\n PolymorphicComponentProps<C, BlockquoteOwnProps>;\n\ntype BlockquoteComponent = PolymorphicComponent<'blockquote', BlockquoteVanillaProps<ElementType>>;\n\nconst BlockquoteVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'blockquote'>(\n {\n as,\n className,\n css,\n style,\n size,\n weight,\n variant,\n gradient,\n transform,\n noWrap,\n ...props\n }: BlockquoteVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'blockquote') as ElementType;\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 = blockquoteRecipe({ size, weight, variant, gradient, transform, noWrap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBlockquoteVanillaComponentImpl.displayName = 'BlockquoteVanilla';\n\nexport const BlockquoteVanilla = BlockquoteVanillaComponentImpl as BlockquoteComponent;\n"],"mappings":";;;;;;;;AAsBA,IAAM,kCAAA,GAAA,MAAA,aAEF,EACE,IACA,WACA,KACA,OACA,MACA,QACA,SACA,UACA,WACA,QACA,GAAG,SAEL,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;CAIA,OACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,+BAAA,iBAAiB;GAAE;GAAM;GAAQ;GAAS;GAAU;GAAW;EAAO,CAKxE,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Blockquote.vanilla.js","names":[],"sources":["../../../components/Blockquote/Blockquote.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 { blockquoteRecipe } from './Blockquote.vanilla.css';\n\ntype BlockquoteRecipeVariants = RecipeVariants<typeof blockquoteRecipe>;\n\ninterface BlockquoteOwnProps extends Omit<BlockquoteRecipeVariants, never>, CSSProps {}\n\nexport type BlockquoteVanillaProps<C extends ElementType = 'blockquote'> =\n PolymorphicComponentProps<C, BlockquoteOwnProps>;\n\ntype BlockquoteComponent = PolymorphicComponent<'blockquote', BlockquoteVanillaProps<ElementType>>;\n\nconst BlockquoteVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'blockquote'>(\n {\n as,\n className,\n css,\n style,\n size,\n weight,\n variant,\n gradient,\n transform,\n noWrap,\n ...props\n }: BlockquoteVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'blockquote') as ElementType;\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 = blockquoteRecipe({ size, weight, variant, gradient, transform, noWrap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBlockquoteVanillaComponentImpl.displayName = 'BlockquoteVanilla';\n\nexport const BlockquoteVanilla = BlockquoteVanillaComponentImpl as BlockquoteComponent;\n"],"mappings":";;;;;;;AAsBA,IAAM,iCAAiC,YAEnC,EACE,IACA,WACA,KACA,OACA,MACA,QACA,SACA,UACA,WACA,QACA,GAAG,SAEL,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,~~KAAK~~;~~EAC1B~~;~~AAID~~,~~QACE~~,oBAAC,WAAD;EACO;EACL,WAAW,GALK,iBAAiB;GAAE;GAAM;GAAQ;GAAS;GAAU;GAAW;~~GAAQ~~,~~CAKzE~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
1	+ {"version":3,"file":"Blockquote.vanilla.js","names":[],"sources":["../../../components/Blockquote/Blockquote.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 { blockquoteRecipe } from './Blockquote.vanilla.css';\n\ntype BlockquoteRecipeVariants = RecipeVariants<typeof blockquoteRecipe>;\n\ninterface BlockquoteOwnProps extends Omit<BlockquoteRecipeVariants, never>, CSSProps {}\n\nexport type BlockquoteVanillaProps<C extends ElementType = 'blockquote'> =\n PolymorphicComponentProps<C, BlockquoteOwnProps>;\n\ntype BlockquoteComponent = PolymorphicComponent<'blockquote', BlockquoteVanillaProps<ElementType>>;\n\nconst BlockquoteVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'blockquote'>(\n {\n as,\n className,\n css,\n style,\n size,\n weight,\n variant,\n gradient,\n transform,\n noWrap,\n ...props\n }: BlockquoteVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = (as \|\| 'blockquote') as ElementType;\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 = blockquoteRecipe({ size, weight, variant, gradient, transform, noWrap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBlockquoteVanillaComponentImpl.displayName = 'BlockquoteVanilla';\n\nexport const BlockquoteVanilla = BlockquoteVanillaComponentImpl as BlockquoteComponent;\n"],"mappings":";;;;;;;AAsBA,IAAM,iCAAiC,YAEnC,EACE,IACA,WACA,KACA,OACA,MACA,QACA,SACA,UACA,WACA,QACA,GAAG,SAEL,QACG;CACH,MAAM,YAAa,MAAM;CACzB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAIA,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,iBAAiB;GAAE;GAAM;GAAQ;GAAS;GAAU;GAAW;EAAO,CAKxE,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Box.cjs","names":[],"sources":["../../../components/Box/Box.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Box = styled('div', {\n // Reset\n boxSizing: 'border-box',\n});\n"],"mappings":";AAEA,IAAa,~~0CAAM~~,~~CAAA~~,OAAO,OAAO,EAE/B,WAAW,~~cACZ~~,CAAC"}
1	+ {"version":3,"file":"Box.cjs","names":[],"sources":["../../../components/Box/Box.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Box = styled('div', {\n // Reset\n boxSizing: 'border-box',\n});\n"],"mappings":";AAEA,IAAa,yCAAM,EAAA,OAAO,OAAO,EAE/B,WAAW,aACb,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Box.js","names":[],"sources":["../../../components/Box/Box.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Box = styled('div', {\n // Reset\n boxSizing: 'border-box',\n});\n"],"mappings":";;AAEA,IAAa,MAAM,OAAO,OAAO,EAE/B,WAAW,~~cACZ~~,CAAC"}
1	+ {"version":3,"file":"Box.js","names":[],"sources":["../../../components/Box/Box.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Box = styled('div', {\n // Reset\n boxSizing: 'border-box',\n});\n"],"mappings":";;AAEA,IAAa,MAAM,OAAO,OAAO,EAE/B,WAAW,aACb,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Box.vanilla.cjs","names":[],"sources":["../../../components/Box/Box.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { box } from './Box.vanilla.css';\n\nexport type BoxProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, CSSProps>;\n\ntype BoxComponent = PolymorphicComponent<'div', BoxProps<ElementType>>;\n\nconst BoxVanillaComponent = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, ...props }: BoxProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n return (\n <Component\n ref={ref}\n className={`${box} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBoxVanillaComponent.displayName = 'BoxVanilla';\n\nexport const BoxVanilla = BoxVanillaComponent as BoxComponent;\n"],"mappings":";;;;;;;;AAgBA,IAAM,uBAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,GAAG,SAChC,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,~~KAAK~~;~~EAC1B~~;~~AAED~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GAAG,wBAAA,IAAI,GAAG,aAAa,KAAK,~~MAAM~~;~~EAC7C~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,oBAAoB,cAAc;AAElC,IAAa,aAAa"}
1	+ {"version":3,"file":"Box.vanilla.cjs","names":[],"sources":["../../../components/Box/Box.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { box } from './Box.vanilla.css';\n\nexport type BoxProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, CSSProps>;\n\ntype BoxComponent = PolymorphicComponent<'div', BoxProps<ElementType>>;\n\nconst BoxVanillaComponent = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, ...props }: BoxProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n return (\n <Component\n ref={ref}\n className={`${box} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBoxVanillaComponent.displayName = 'BoxVanilla';\n\nexport const BoxVanilla = BoxVanillaComponent as BoxComponent;\n"],"mappings":";;;;;;;;AAgBA,IAAM,uBAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,GAAG,SAChC,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;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GAAG,wBAAA,IAAI,GAAG,aAAa,KAAK,KAAK;EAC5C,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,oBAAoB,cAAc;AAElC,IAAa,aAAa"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Box.vanilla.js","names":[],"sources":["../../../components/Box/Box.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { box } from './Box.vanilla.css';\n\nexport type BoxProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, CSSProps>;\n\ntype BoxComponent = PolymorphicComponent<'div', BoxProps<ElementType>>;\n\nconst BoxVanillaComponent = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, ...props }: BoxProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n return (\n <Component\n ref={ref}\n className={`${box} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBoxVanillaComponent.displayName = 'BoxVanilla';\n\nexport const BoxVanilla = BoxVanillaComponent as BoxComponent;\n"],"mappings":";;;;;;;AAgBA,IAAM,sBAAsB,YAExB,EAAE,IAAI,WAAW,KAAK,OAAO,GAAG,SAChC,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,~~KAAK~~;~~EAC1B~~;~~AAED~~,~~QACE~~,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,IAAI,GAAG,aAAa,KAAK,~~MAAM~~;~~EAC7C~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,oBAAoB,cAAc;AAElC,IAAa,aAAa"}
1	+ {"version":3,"file":"Box.vanilla.js","names":[],"sources":["../../../components/Box/Box.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { box } from './Box.vanilla.css';\n\nexport type BoxProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, CSSProps>;\n\ntype BoxComponent = PolymorphicComponent<'div', BoxProps<ElementType>>;\n\nconst BoxVanillaComponent = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, ...props }: BoxProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n return (\n <Component\n ref={ref}\n className={`${box} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBoxVanillaComponent.displayName = 'BoxVanilla';\n\nexport const BoxVanilla = BoxVanillaComponent as BoxComponent;\n"],"mappings":";;;;;;;AAgBA,IAAM,sBAAsB,YAExB,EAAE,IAAI,WAAW,KAAK,OAAO,GAAG,SAChC,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAEA,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GAAG,IAAI,GAAG,aAAa,KAAK,KAAK;EAC5C,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,oBAAoB,cAAc;AAElC,IAAa,aAAa"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Bubble.cjs","names":[],"sources":["../../../components/Bubble/Bubble.tsx"],"sourcesContent":["import { keyframes, styled } from '../../stitches.config';\n\nconst bip = keyframes({\n '0%': {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n opacity: 1,\n },\n '100%': {\n top: -8,\n right: -8,\n bottom: -8,\n left: -8,\n opacity: 0,\n },\n});\n\nexport const Bubble = styled('div', {\n display: 'inline-block',\n size: '$4',\n bc: '$red8',\n borderRadius: '50%',\n position: 'relative',\n\n '&::before': {\n animation: `${bip} 1s ease infinite`,\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n boxShadow: 'inset 0 0 0 1px rgba(255,255,255,.5)',\n borderRadius: '50%',\n pointerEvents: 'none',\n zIndex: -1,\n },\n\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 5,\n right: 5,\n bottom: 5,\n left: 5,\n bc: 'rgba(255,255,255,.1)',\n borderRadius: '50%',\n pointerEvents: 'none',\n },\n\n variants: {\n variant: {\n red: { bc: '$red8', '&::before': { bc: '$red8' } },\n green: { bc: '$green8', '&::before': { bc: '$green8' } },\n orange: { bc: '$orange8', '&::before': { bc: '$orange8' } },\n blue: { bc: '$blue8', '&::before': { bc: '$blue8' } },\n yellow: { bc: '$neon8', '&::before': { bc: '$neon8' } },\n purple: { bc: '$purple8', '&::before': { bc: '$purple8' } },\n gray: { bc: '$slate8', '&::before': { bc: '$slate8' } },\n },\n size: {\n 'x-small': { size: '$1' },\n small: { size: '$2' },\n medium: { size: '$3' },\n large: { size: '$4' },\n 'x-large': { size: '$5' },\n },\n noAnimation: {\n true: {\n '&::before': { content: 'none' },\n },\n },\n },\n\n defaultVariants: {\n size: 'small',\n noAnimation: false,\n },\n});\n"],"mappings":";;AAEA,IAAM,MAAM,wBAAA,UAAU;CACpB,MAAM;EACJ,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,SAAS;~~EACV~~;~~CACD~~,QAAQ;EACN,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,SAAS;~~EACV~~;~~CACF~~,CAAC;~~AAEF~~,IAAa,SAAS,wBAAA,OAAO,OAAO;CAClC,SAAS;CACT,MAAM;CACN,IAAI;CACJ,cAAc;CACd,UAAU;CAEV,aAAa;EACX,WAAW,GAAG,IAAI;EAClB,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,WAAW;EACX,cAAc;EACd,eAAe;EACf,QAAQ;~~EACT~~;~~CAED~~,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,IAAI;EACJ,cAAc;EACd,eAAe;~~EAChB~~;~~CAED~~,UAAU;EACR,SAAS;GACP,KAAK;IAAE,IAAI;IAAS,aAAa,EAAE,IAAI,~~SAAS~~;~~IAAE~~;~~GAClD~~,OAAO;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,~~WAAW~~;~~IAAE~~;~~GACxD~~,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,~~YAAY~~;~~IAAE~~;~~GAC3D~~,MAAM;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,~~UAAU~~;~~IAAE~~;~~GACrD~~,QAAQ;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,~~UAAU~~;~~IAAE~~;~~GACvD~~,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,~~YAAY~~;~~IAAE~~;~~GAC3D~~,MAAM;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,~~WAAW~~;~~IAAE~~;~~GACxD~~;~~EACD~~,MAAM;GACJ,WAAW,EAAE,MAAM,~~MAAM~~;~~GACzB~~,OAAO,EAAE,MAAM,~~MAAM~~;~~GACrB~~,QAAQ,EAAE,MAAM,~~MAAM~~;~~GACtB~~,OAAO,EAAE,MAAM,~~MAAM~~;~~GACrB~~,WAAW,EAAE,MAAM,~~MAAM~~;~~GAC1B~~;~~EACD~~,aAAa,EACX,MAAM,EACJ,aAAa,EAAE,SAAS,~~QAAQ~~,EACjC,EACF;~~EACF~~;~~CAED~~,iBAAiB;EACf,MAAM;EACN,aAAa;~~EACd~~;~~CACF~~,CAAC"}
1	+ {"version":3,"file":"Bubble.cjs","names":[],"sources":["../../../components/Bubble/Bubble.tsx"],"sourcesContent":["import { keyframes, styled } from '../../stitches.config';\n\nconst bip = keyframes({\n '0%': {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n opacity: 1,\n },\n '100%': {\n top: -8,\n right: -8,\n bottom: -8,\n left: -8,\n opacity: 0,\n },\n});\n\nexport const Bubble = styled('div', {\n display: 'inline-block',\n size: '$4',\n bc: '$red8',\n borderRadius: '50%',\n position: 'relative',\n\n '&::before': {\n animation: `${bip} 1s ease infinite`,\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n boxShadow: 'inset 0 0 0 1px rgba(255,255,255,.5)',\n borderRadius: '50%',\n pointerEvents: 'none',\n zIndex: -1,\n },\n\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 5,\n right: 5,\n bottom: 5,\n left: 5,\n bc: 'rgba(255,255,255,.1)',\n borderRadius: '50%',\n pointerEvents: 'none',\n },\n\n variants: {\n variant: {\n red: { bc: '$red8', '&::before': { bc: '$red8' } },\n green: { bc: '$green8', '&::before': { bc: '$green8' } },\n orange: { bc: '$orange8', '&::before': { bc: '$orange8' } },\n blue: { bc: '$blue8', '&::before': { bc: '$blue8' } },\n yellow: { bc: '$neon8', '&::before': { bc: '$neon8' } },\n purple: { bc: '$purple8', '&::before': { bc: '$purple8' } },\n gray: { bc: '$slate8', '&::before': { bc: '$slate8' } },\n },\n size: {\n 'x-small': { size: '$1' },\n small: { size: '$2' },\n medium: { size: '$3' },\n large: { size: '$4' },\n 'x-large': { size: '$5' },\n },\n noAnimation: {\n true: {\n '&::before': { content: 'none' },\n },\n },\n },\n\n defaultVariants: {\n size: 'small',\n noAnimation: false,\n },\n});\n"],"mappings":";;AAEA,IAAM,MAAM,wBAAA,UAAU;CACpB,MAAM;EACJ,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,SAAS;CACX;CACA,QAAQ;EACN,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,SAAS;CACX;AACF,CAAC;AAED,IAAa,SAAS,wBAAA,OAAO,OAAO;CAClC,SAAS;CACT,MAAM;CACN,IAAI;CACJ,cAAc;CACd,UAAU;CAEV,aAAa;EACX,WAAW,GAAG,IAAI;EAClB,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,WAAW;EACX,cAAc;EACd,eAAe;EACf,QAAQ;CACV;CAEA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,IAAI;EACJ,cAAc;EACd,eAAe;CACjB;CAEA,UAAU;EACR,SAAS;GACP,KAAK;IAAE,IAAI;IAAS,aAAa,EAAE,IAAI,QAAQ;GAAE;GACjD,OAAO;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,UAAU;GAAE;GACvD,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,WAAW;GAAE;GAC1D,MAAM;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,SAAS;GAAE;GACpD,QAAQ;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,SAAS;GAAE;GACtD,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,WAAW;GAAE;GAC1D,MAAM;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,UAAU;GAAE;EACxD;EACA,MAAM;GACJ,WAAW,EAAE,MAAM,KAAK;GACxB,OAAO,EAAE,MAAM,KAAK;GACpB,QAAQ,EAAE,MAAM,KAAK;GACrB,OAAO,EAAE,MAAM,KAAK;GACpB,WAAW,EAAE,MAAM,KAAK;EAC1B;EACA,aAAa,EACX,MAAM,EACJ,aAAa,EAAE,SAAS,OAAO,EACjC,EACF;CACF;CAEA,iBAAiB;EACf,MAAM;EACN,aAAa;CACf;AACF,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Bubble.js","names":[],"sources":["../../../components/Bubble/Bubble.tsx"],"sourcesContent":["import { keyframes, styled } from '../../stitches.config';\n\nconst bip = keyframes({\n '0%': {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n opacity: 1,\n },\n '100%': {\n top: -8,\n right: -8,\n bottom: -8,\n left: -8,\n opacity: 0,\n },\n});\n\nexport const Bubble = styled('div', {\n display: 'inline-block',\n size: '$4',\n bc: '$red8',\n borderRadius: '50%',\n position: 'relative',\n\n '&::before': {\n animation: `${bip} 1s ease infinite`,\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n boxShadow: 'inset 0 0 0 1px rgba(255,255,255,.5)',\n borderRadius: '50%',\n pointerEvents: 'none',\n zIndex: -1,\n },\n\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 5,\n right: 5,\n bottom: 5,\n left: 5,\n bc: 'rgba(255,255,255,.1)',\n borderRadius: '50%',\n pointerEvents: 'none',\n },\n\n variants: {\n variant: {\n red: { bc: '$red8', '&::before': { bc: '$red8' } },\n green: { bc: '$green8', '&::before': { bc: '$green8' } },\n orange: { bc: '$orange8', '&::before': { bc: '$orange8' } },\n blue: { bc: '$blue8', '&::before': { bc: '$blue8' } },\n yellow: { bc: '$neon8', '&::before': { bc: '$neon8' } },\n purple: { bc: '$purple8', '&::before': { bc: '$purple8' } },\n gray: { bc: '$slate8', '&::before': { bc: '$slate8' } },\n },\n size: {\n 'x-small': { size: '$1' },\n small: { size: '$2' },\n medium: { size: '$3' },\n large: { size: '$4' },\n 'x-large': { size: '$5' },\n },\n noAnimation: {\n true: {\n '&::before': { content: 'none' },\n },\n },\n },\n\n defaultVariants: {\n size: 'small',\n noAnimation: false,\n },\n});\n"],"mappings":";AAmBA,IAAa,SAAS,OAAO,OAAO;CAClC,SAAS;CACT,MAAM;CACN,IAAI;CACJ,cAAc;CACd,UAAU;CAEV,aAAa;EACX,WAAW,GAzBH,UAAU;GACpB,MAAM;IACJ,KAAK;IACL,OAAO;IACP,QAAQ;IACR,MAAM;IACN,SAAS;~~IACV~~;~~GACD~~,QAAQ;IACN,KAAK;IACL,OAAO;IACP,QAAQ;IACR,MAAM;IACN,SAAS;~~IACV~~;~~GACF~~,~~CAUiB~~,~~CAAI~~;EAClB,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,WAAW;EACX,cAAc;EACd,eAAe;EACf,QAAQ;~~EACT~~;~~CAED~~,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,IAAI;EACJ,cAAc;EACd,eAAe;~~EAChB~~;~~CAED~~,UAAU;EACR,SAAS;GACP,KAAK;IAAE,IAAI;IAAS,aAAa,EAAE,IAAI,~~SAAS~~;~~IAAE~~;~~GAClD~~,OAAO;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,~~WAAW~~;~~IAAE~~;~~GACxD~~,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,~~YAAY~~;~~IAAE~~;~~GAC3D~~,MAAM;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,~~UAAU~~;~~IAAE~~;~~GACrD~~,QAAQ;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,~~UAAU~~;~~IAAE~~;~~GACvD~~,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,~~YAAY~~;~~IAAE~~;~~GAC3D~~,MAAM;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,~~WAAW~~;~~IAAE~~;~~GACxD~~;~~EACD~~,MAAM;GACJ,WAAW,EAAE,MAAM,~~MAAM~~;~~GACzB~~,OAAO,EAAE,MAAM,~~MAAM~~;~~GACrB~~,QAAQ,EAAE,MAAM,~~MAAM~~;~~GACtB~~,OAAO,EAAE,MAAM,~~MAAM~~;~~GACrB~~,WAAW,EAAE,MAAM,~~MAAM~~;~~GAC1B~~;~~EACD~~,aAAa,EACX,MAAM,EACJ,aAAa,EAAE,SAAS,~~QAAQ~~,EACjC,EACF;~~EACF~~;~~CAED~~,iBAAiB;EACf,MAAM;EACN,aAAa;~~EACd~~;~~CACF~~,CAAC"}
1	+ {"version":3,"file":"Bubble.js","names":[],"sources":["../../../components/Bubble/Bubble.tsx"],"sourcesContent":["import { keyframes, styled } from '../../stitches.config';\n\nconst bip = keyframes({\n '0%': {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n opacity: 1,\n },\n '100%': {\n top: -8,\n right: -8,\n bottom: -8,\n left: -8,\n opacity: 0,\n },\n});\n\nexport const Bubble = styled('div', {\n display: 'inline-block',\n size: '$4',\n bc: '$red8',\n borderRadius: '50%',\n position: 'relative',\n\n '&::before': {\n animation: `${bip} 1s ease infinite`,\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n boxShadow: 'inset 0 0 0 1px rgba(255,255,255,.5)',\n borderRadius: '50%',\n pointerEvents: 'none',\n zIndex: -1,\n },\n\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n top: 5,\n right: 5,\n bottom: 5,\n left: 5,\n bc: 'rgba(255,255,255,.1)',\n borderRadius: '50%',\n pointerEvents: 'none',\n },\n\n variants: {\n variant: {\n red: { bc: '$red8', '&::before': { bc: '$red8' } },\n green: { bc: '$green8', '&::before': { bc: '$green8' } },\n orange: { bc: '$orange8', '&::before': { bc: '$orange8' } },\n blue: { bc: '$blue8', '&::before': { bc: '$blue8' } },\n yellow: { bc: '$neon8', '&::before': { bc: '$neon8' } },\n purple: { bc: '$purple8', '&::before': { bc: '$purple8' } },\n gray: { bc: '$slate8', '&::before': { bc: '$slate8' } },\n },\n size: {\n 'x-small': { size: '$1' },\n small: { size: '$2' },\n medium: { size: '$3' },\n large: { size: '$4' },\n 'x-large': { size: '$5' },\n },\n noAnimation: {\n true: {\n '&::before': { content: 'none' },\n },\n },\n },\n\n defaultVariants: {\n size: 'small',\n noAnimation: false,\n },\n});\n"],"mappings":";AAmBA,IAAa,SAAS,OAAO,OAAO;CAClC,SAAS;CACT,MAAM;CACN,IAAI;CACJ,cAAc;CACd,UAAU;CAEV,aAAa;EACX,WAAW,GAzBH,UAAU;GACpB,MAAM;IACJ,KAAK;IACL,OAAO;IACP,QAAQ;IACR,MAAM;IACN,SAAS;GACX;GACA,QAAQ;IACN,KAAK;IACL,OAAO;IACP,QAAQ;IACR,MAAM;IACN,SAAS;GACX;EACF,CAUkB,EAAI;EAClB,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,WAAW;EACX,cAAc;EACd,eAAe;EACf,QAAQ;CACV;CAEA,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,KAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAM;EACN,IAAI;EACJ,cAAc;EACd,eAAe;CACjB;CAEA,UAAU;EACR,SAAS;GACP,KAAK;IAAE,IAAI;IAAS,aAAa,EAAE,IAAI,QAAQ;GAAE;GACjD,OAAO;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,UAAU;GAAE;GACvD,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,WAAW;GAAE;GAC1D,MAAM;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,SAAS;GAAE;GACpD,QAAQ;IAAE,IAAI;IAAU,aAAa,EAAE,IAAI,SAAS;GAAE;GACtD,QAAQ;IAAE,IAAI;IAAY,aAAa,EAAE,IAAI,WAAW;GAAE;GAC1D,MAAM;IAAE,IAAI;IAAW,aAAa,EAAE,IAAI,UAAU;GAAE;EACxD;EACA,MAAM;GACJ,WAAW,EAAE,MAAM,KAAK;GACxB,OAAO,EAAE,MAAM,KAAK;GACpB,QAAQ,EAAE,MAAM,KAAK;GACrB,OAAO,EAAE,MAAM,KAAK;GACpB,WAAW,EAAE,MAAM,KAAK;EAC1B;EACA,aAAa,EACX,MAAM,EACJ,aAAa,EAAE,SAAS,OAAO,EACjC,EACF;CACF;CAEA,iBAAiB;EACf,MAAM;EACN,aAAa;CACf;AACF,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Bubble.vanilla.cjs","names":[],"sources":["../../../components/Bubble/Bubble.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 { bubbleRecipe } from './Bubble.vanilla.css';\n\ntype BubbleRecipeVariants = NonNullable<RecipeVariants<typeof bubbleRecipe>>;\n\ninterface BubbleOwnProps extends BubbleRecipeVariants, CSSProps {}\n\nexport type BubbleVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n BubbleOwnProps\n>;\n\ntype BubbleVanillaComponent = PolymorphicComponent<'div', BubbleVanillaProps<ElementType>>;\n\nconst BubbleVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, variant, noAnimation, ...props }: BubbleVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = bubbleRecipe({ size, variant, noAnimation });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBubbleVanillaComponentImpl.displayName = 'BubbleVanilla';\n\nexport const BubbleVanilla = BubbleVanillaComponentImpl as BubbleVanillaComponent;\n"],"mappings":";;;;;;;;AAwBA,IAAM,8BAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,aAAa,GAAG,SAC5D,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,~~KAAK~~;~~EAC1B~~;~~AAID~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,2BAAA,aAAa;GAAE;GAAM;GAAS;~~GAAa~~,~~CAK7C~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,2BAA2B,cAAc;AAEzC,IAAa,gBAAgB"}
1	+ {"version":3,"file":"Bubble.vanilla.cjs","names":[],"sources":["../../../components/Bubble/Bubble.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 { bubbleRecipe } from './Bubble.vanilla.css';\n\ntype BubbleRecipeVariants = NonNullable<RecipeVariants<typeof bubbleRecipe>>;\n\ninterface BubbleOwnProps extends BubbleRecipeVariants, CSSProps {}\n\nexport type BubbleVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n BubbleOwnProps\n>;\n\ntype BubbleVanillaComponent = PolymorphicComponent<'div', BubbleVanillaProps<ElementType>>;\n\nconst BubbleVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, variant, noAnimation, ...props }: BubbleVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = bubbleRecipe({ size, variant, noAnimation });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBubbleVanillaComponentImpl.displayName = 'BubbleVanilla';\n\nexport const BubbleVanilla = BubbleVanillaComponentImpl as BubbleVanillaComponent;\n"],"mappings":";;;;;;;;AAwBA,IAAM,8BAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,aAAa,GAAG,SAC5D,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;EAAY,CAK5C,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,2BAA2B,cAAc;AAEzC,IAAa,gBAAgB"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Bubble.vanilla.js","names":[],"sources":["../../../components/Bubble/Bubble.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 { bubbleRecipe } from './Bubble.vanilla.css';\n\ntype BubbleRecipeVariants = NonNullable<RecipeVariants<typeof bubbleRecipe>>;\n\ninterface BubbleOwnProps extends BubbleRecipeVariants, CSSProps {}\n\nexport type BubbleVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n BubbleOwnProps\n>;\n\ntype BubbleVanillaComponent = PolymorphicComponent<'div', BubbleVanillaProps<ElementType>>;\n\nconst BubbleVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, variant, noAnimation, ...props }: BubbleVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = bubbleRecipe({ size, variant, noAnimation });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBubbleVanillaComponentImpl.displayName = 'BubbleVanilla';\n\nexport const BubbleVanilla = BubbleVanillaComponentImpl as BubbleVanillaComponent;\n"],"mappings":";;;;;;;AAwBA,IAAM,6BAA6B,YAE/B,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,aAAa,GAAG,SAC5D,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,~~KAAK~~;~~EAC1B~~;~~AAID~~,~~QACE~~,oBAAC,WAAD;EACO;EACL,WAAW,GALK,aAAa;GAAE;GAAM;GAAS;~~GAAa~~,~~CAK7C~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,2BAA2B,cAAc;AAEzC,IAAa,gBAAgB"}
1	+ {"version":3,"file":"Bubble.vanilla.js","names":[],"sources":["../../../components/Bubble/Bubble.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 { bubbleRecipe } from './Bubble.vanilla.css';\n\ntype BubbleRecipeVariants = NonNullable<RecipeVariants<typeof bubbleRecipe>>;\n\ninterface BubbleOwnProps extends BubbleRecipeVariants, CSSProps {}\n\nexport type BubbleVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n BubbleOwnProps\n>;\n\ntype BubbleVanillaComponent = PolymorphicComponent<'div', BubbleVanillaProps<ElementType>>;\n\nconst BubbleVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, variant, noAnimation, ...props }: BubbleVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as \|\| 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = bubbleRecipe({ size, variant, noAnimation });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className \|\| ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nBubbleVanillaComponentImpl.displayName = 'BubbleVanilla';\n\nexport const BubbleVanilla = BubbleVanillaComponentImpl as BubbleVanillaComponent;\n"],"mappings":";;;;;;;AAwBA,IAAM,6BAA6B,YAE/B,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,aAAa,GAAG,SAC5D,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAE7D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,IAAI;CAC1B;CAIA,OACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,aAAa;GAAE;GAAM;GAAS;EAAY,CAK5C,EAAY,GAAG,aAAa,KAAK,KAAK;EACpD,OAAO;EACP,GAAI;CACL,CAAA;AAEL,CACF;AAEA,2BAA2B,cAAc;AAEzC,IAAa,gBAAgB"}

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;EACV;CACF;AAED,IAAM,WAAW;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,IAAM,2BAA2B,UAAiC;CAChE,UAAU,SAAS;CACnB,gBAAgB;CAChB,iBAAiB;;;;;;;CAOjB,WAAW,GAAG,wBAAA,UAAU,EACtB,QAAQ,EAAE,WAAW,wBAAwB,EAC9C,CAAC,CAAC;CACJ;AAED,IAAa,eAAe,wBAAA,OAAO,UAAU,oBAAoB;CAE/D,KAAK;CACL,YAAY;CACZ,UAAU;CAEV,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACR;CACD,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACR;CAGD,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,6BAClB;EACD,YAAY,EACV,SAAS,KACV;EACF;CAED,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,6BAClB;EACD,YAAY,EACV,SAAS,KACV;EACF,EACF;CAED,YAAY,EACV,aAAa,EACX,iBAAiB,uBAClB,EACF;CAED,UAAU;EACR,MAAM;GACJ,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;IACb;GACD,QAAQ;IACN,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;IACb;GACD,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;IACb;GACF;EACD,SAAS;GACP,SAAS;IACP,IAAI;IACJ,GAAG;IACH,mBAAmB,EACjB,WAAW,oDACZ;IACD,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,oBAClB,EACF,EACF;IACF;GACD,WAAW;IACT,IAAI;IACJ,GAAG;IACH,WAAW;IACX,YAAY,EACV,WAAW,iDACZ;IACD,mBAAmB,EACjB,WAAW,sDACZ;IACD,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,oBAClB,EACF,EACF;IACF;GACD,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,mBAAmB,EACjB,WAAW,4CACZ;IACF;GACF;EACD,OAAO;GACL,QAAQ;IACN,IAAI;IACJ,GAAG;IACH,YAAY,EACV,iBAAiB,cAClB;IACF;GACD,SAAS;IACP,IAAI;IACJ,WAAW;IACX,GAAG;IACH,UAAU;IACV,eAAe;IACf,YAAY;KACV,MAAM;KACN,OAAO;KACP,GAAG,wBAAwB,SAAS;KACrC;IACF;GACF;EACD,OAAO,EACL,MAAM;GACJ,WAAW;GACX,UAAU,EACR,WAAW,EACT,WAAW,QACZ,EACF;GACF,EACF;EACD,SAAS,EACP,MAAM,EACJ,cAAc,SACf,EACF;EACF;CACD,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;KAClB,EACF;IACF;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;IACZ;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACR;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;IACZ;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACR;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;IACZ;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;KAClB,EACF;IACF;GACF;EACD;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,QAAQ,EAC7C;GACF;EACD;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,QAAQ,EAC7C;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,SAAS;EACV;CACF,CAAC;AACF,IAAM,mBAAmB,wBAAA,OAAO,qBAAA,MAAM,aAAa;AAUnD,IAAa,SAAS,MAAA,QAAM,YACzB,EAAE,UAAU,SAAS,GAAG,SAAS,iBAAiB;AAEjD,QACE,iBAAA,GAAA,kBAAA,MAAA,GAAA,MAAA,eAF+B,UAAU,mBAAmB,cAAe,CAAC,QAAQ,CAEnF,EAAD;EAAW,KAAK;EAAc,GAAI;EAC/B;EACS,CAAA;EAGjB"}
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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","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;EACV;CACF;AAED,IAAM,WAAW;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,IAAM,2BAA2B,UAAiC;CAChE,UAAU,SAAS;CACnB,gBAAgB;CAChB,iBAAiB;;;;;;;CAOjB,WAAW,GAAG,UAAU,EACtB,QAAQ,EAAE,WAAW,wBAAwB,EAC9C,CAAC,CAAC;CACJ;AAED,IAAa,eAAe,OAAO,UAAU,oBAAoB;CAE/D,KAAK;CACL,YAAY;CACZ,UAAU;CAEV,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACR;CACD,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACR;CAGD,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,6BAClB;EACD,YAAY,EACV,SAAS,KACV;EACF;CAED,UAAU,EACR,WAAW;EACT,QAAQ;EACR,aAAa,EACX,iBAAiB,6BAClB;EACD,YAAY,EACV,SAAS,KACV;EACF,EACF;CAED,YAAY,EACV,aAAa,EACX,iBAAiB,uBAClB,EACF;CAED,UAAU;EACR,MAAM;GACJ,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;IACb;GACD,QAAQ;IACN,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;IACb;GACD,OAAO;IACL,cAAc;IACd,QAAQ;IACR,IAAI;IACJ,UAAU;IACV,YAAY;IACb;GACF;EACD,SAAS;GACP,SAAS;IACP,IAAI;IACJ,GAAG;IACH,mBAAmB,EACjB,WAAW,oDACZ;IACD,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,oBAClB,EACF,EACF;IACF;GACD,WAAW;IACT,IAAI;IACJ,GAAG;IACH,WAAW;IACX,YAAY,EACV,WAAW,iDACZ;IACD,mBAAmB,EACjB,WAAW,sDACZ;IACD,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,oBAClB,EACF,EACF;IACF;GACD,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,mBAAmB,EACjB,WAAW,4CACZ;IACF;GACF;EACD,OAAO;GACL,QAAQ;IACN,IAAI;IACJ,GAAG;IACH,YAAY,EACV,iBAAiB,cAClB;IACF;GACD,SAAS;IACP,IAAI;IACJ,WAAW;IACX,GAAG;IACH,UAAU;IACV,eAAe;IACf,YAAY;KACV,MAAM;KACN,OAAO;KACP,GAAG,wBAAwB,SAAS;KACrC;IACF;GACF;EACD,OAAO,EACL,MAAM;GACJ,WAAW;GACX,UAAU,EACR,WAAW,EACT,WAAW,QACZ,EACF;GACF,EACF;EACD,SAAS,EACP,MAAM,EACJ,cAAc,SACf,EACF;EACF;CACD,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;KAClB,EACF;IACF;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;IACZ;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACR;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;IACZ;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACR;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,iBAAiB;IACjB,OAAO;IACP,WAAW;IACZ;GACF;EACD;GACE,SAAS;GACT,OAAO;GACP,KAAK;IACH,OAAO;IACP,iBAAiB;IACjB,UAAU,EACR,WAAW;KACT,OAAO;KACP,iBAAiB;KAClB,EACF;IACF;GACF;EACD;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,QAAQ,EAC7C;GACF;EACD;GACE,MAAM;GACN,OAAO;GACP,KAAK,EACH,YAAY,wBAAwB,QAAQ,EAC7C;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,SAAS;EACV;CACF,CAAC;AACF,IAAM,mBAAmB,OAAO,MAAM,aAAa;AAUnD,IAAa,SAAS,MAAM,YACzB,EAAE,UAAU,SAAS,GAAG,SAAS,iBAAiB;AAEjD,QACE,oBAFgB,cAAe,UAAU,mBAAmB,cAAe,CAAC,QAAQ,CAEnF,EAAD;EAAW,KAAK;EAAc,GAAI;EAC/B;EACS,CAAA;EAGjB"}
1	+ {"version":3,"file":"Button.js","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,UAAU,EACtB,QAAQ,EAAE,WAAW,uBAAuB,EAC9C,CAAC,EAAE;AACL;AAEA,IAAa,eAAe,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,OAAO,MAAM,YAAY;AAUlD,IAAa,SAAS,MAAM,YACzB,EAAE,UAAU,SAAS,GAAG,SAAS,iBAAiB;CAEjD,OACE,oBAFgB,cAAe,UAAU,mBAAmB,cAAe,CAAC,OAAO,CAElF,GAAD;EAAW,KAAK;EAAc,GAAI;EAC/B;CACQ,CAAA;AAEf,CACF"}

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;;~~AAoBQ~~,~~QAAA~~,YAAqB,kBAAkB;EAClD,iBAAiB;EACjB,uBAAA,GAAA,WAAA,SAAgC,aAAa,~~MAAM~~,~~CAAC~~,QAAQ,~~GAAG~~,~~CAAC~~,~~aAAa~~;~~EAC7E~~,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,GAAG,EAAE,OAAO,~~MAAM~~,CAAC;~~EAC5E~~,6BAA6B;EAE7B,mBAAmB;EACnB,qBAAqB;EACrB,uBAAuB;EACvB,6BAAA,GAAA,WAAA,SAAsC,aAAa,~~MAAM~~,~~CAAC~~,SAAS,~~IAAK~~,~~CAAC~~,~~aAAa~~;~~EAEtF~~,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;~~EACnB~~;~~AAEY~~,~~QAAA~~,WAAoB,kBAAkB;EACjD,iBAAiB;EACjB,uBAAA,GAAA,WAAA,SAAgC,aAAa,~~MAAM~~,~~CAAC~~,QAAQ,~~GAAG~~,~~CAAC~~,~~aAAa~~;~~EAC7E~~,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,IAAI,EAAE,OAAO,~~MAAM~~,CAAC;~~EAC7E~~,8BAAA,GAAA,WAAA,SAAuC,aAAa,~~MAAM~~,~~CAAC~~,QAAQ,~~GAAG~~,~~CAAC~~,~~aAAa~~;~~EAEpF~~,mBAAmB;EACnB,sBAAA,GAAA,WAAA,SAA+B,~~QAAQ~~,~~CAAC~~,SAAS,~~IAAK~~,~~CAAC~~,~~aAAa~~;~~EACpE~~,uBAAuB;EACvB,4BAA4B;EAE5B,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;~~EACnB~~;~~yBACF~~"}
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"}

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;;~~AAoBQ~~,~~QAAA~~,YAAqB,kBAAkB;EAClD,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,~~MAAM~~,~~CAAC~~,QAAQ,~~GAAG~~,~~CAAC~~,~~aAAa~~;~~EAC7E~~,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,GAAG,EAAE,OAAO,~~MAAM~~,CAAC;~~EAC5E~~,6BAA6B;EAE7B,mBAAmB;EACnB,qBAAqB;EACrB,uBAAuB;EACvB,4BAA4B,UAAU,aAAa,~~MAAM~~,~~CAAC~~,SAAS,~~IAAK~~,~~CAAC~~,~~aAAa~~;~~EAEtF~~,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;~~EACnB~~;~~AAEY~~,~~QAAA~~,WAAoB,kBAAkB;EACjD,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,~~MAAM~~,~~CAAC~~,QAAQ,~~GAAG~~,~~CAAC~~,~~aAAa~~;~~EAC7E~~,mBAAmB;EACnB,0BAA0B,aAAa,QAAQ,UAAU,IAAI,EAAE,OAAO,~~MAAM~~,CAAC;~~EAC7E~~,6BAA6B,UAAU,aAAa,~~MAAM~~,~~CAAC~~,QAAQ,~~GAAG~~,~~CAAC~~,~~aAAa~~;~~EAEpF~~,mBAAmB;EACnB,qBAAqB,UAAU,~~QAAQ~~,~~CAAC~~,SAAS,~~IAAK~~,~~CAAC~~,~~aAAa~~;~~EACpE~~,uBAAuB;EACvB,4BAA4B;EAE5B,aAAa;EACb,eAAe;EACf,oBAAoB;EACpB,kBAAkB;~~EACnB~~;~~yBACF~~"}
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"}

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,~~wBAAwB~~;~~CAE3C~~,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,~~OAAO~~;~~CAE9D~~,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,~~KAAK~~;~~EAC1B~~;~~AAID~~,~~QACE~~,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,2BAAA,aAAa;GAAE;GAAM;GAAS;GAAO;GAAO;~~GAAS~~,~~CAKvD~~,~~CAAY~~,GAAG,aAAa,KAAK,~~MAAM~~;~~EACrD~~,OAAO;EACP,GAAI;~~EACJ~~,CAAA;~~EAGP~~;~~AAED~~,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,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"}