@traefik-labs/faency 12.3.2 → 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.
- package/dist/colors/deepBlue.cjs.map +1 -1
- package/dist/colors/deepBlue.js.map +1 -1
- package/dist/colors/elevation.cjs.map +1 -1
- package/dist/colors/elevation.js.map +1 -1
- package/dist/colors/grayBlue.cjs.map +1 -1
- package/dist/colors/grayBlue.js.map +1 -1
- package/dist/colors/index.cjs.map +1 -1
- package/dist/colors/index.js.map +1 -1
- package/dist/colors/neon.cjs.map +1 -1
- package/dist/colors/neon.js.map +1 -1
- package/dist/colors/orange.cjs.map +1 -1
- package/dist/colors/orange.js.map +1 -1
- package/dist/colors/red.cjs.map +1 -1
- package/dist/colors/red.js.map +1 -1
- package/dist/components/Accordion/Accordion.cjs.map +1 -1
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/Accordion/Accordion.themes.cjs.map +1 -1
- package/dist/components/Accordion/Accordion.themes.js.map +1 -1
- package/dist/components/Alert/Alert.cjs.map +1 -1
- package/dist/components/Alert/Alert.js.map +1 -1
- package/dist/components/AriaTable/AriaTable.cjs.map +1 -1
- package/dist/components/AriaTable/AriaTable.js.map +1 -1
- package/dist/components/Avatar/Avatar.cjs.map +1 -1
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/Avatar/Avatar.vanilla.cjs.map +1 -1
- package/dist/components/Avatar/Avatar.vanilla.js.map +1 -1
- package/dist/components/Badge/Badge.cjs.map +1 -1
- package/dist/components/Badge/Badge.js.map +1 -1
- package/dist/components/Badge/Badge.theme.cjs.map +1 -1
- package/dist/components/Badge/Badge.theme.js.map +1 -1
- package/dist/components/Badge/Badge.themes.cjs.map +1 -1
- package/dist/components/Badge/Badge.themes.js.map +1 -1
- package/dist/components/Badge/Badge.vanilla.cjs.map +1 -1
- package/dist/components/Badge/Badge.vanilla.js.map +1 -1
- package/dist/components/Blockquote/Blockquote.cjs.map +1 -1
- package/dist/components/Blockquote/Blockquote.js.map +1 -1
- package/dist/components/Blockquote/Blockquote.vanilla.cjs.map +1 -1
- package/dist/components/Blockquote/Blockquote.vanilla.css.cjs +0 -1
- package/dist/components/Blockquote/Blockquote.vanilla.css.js +0 -1
- package/dist/components/Blockquote/Blockquote.vanilla.js.map +1 -1
- package/dist/components/Box/Box.cjs.map +1 -1
- package/dist/components/Box/Box.js.map +1 -1
- package/dist/components/Box/Box.vanilla.cjs.map +1 -1
- package/dist/components/Box/Box.vanilla.js.map +1 -1
- package/dist/components/Bubble/Bubble.cjs.map +1 -1
- package/dist/components/Bubble/Bubble.js.map +1 -1
- package/dist/components/Bubble/Bubble.vanilla.cjs.map +1 -1
- package/dist/components/Bubble/Bubble.vanilla.js.map +1 -1
- package/dist/components/Button/Button.cjs.map +1 -1
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Button/Button.themes.cjs.map +1 -1
- package/dist/components/Button/Button.themes.js.map +1 -1
- package/dist/components/Button/Button.vanilla.cjs.map +1 -1
- package/dist/components/Button/Button.vanilla.js.map +1 -1
- package/dist/components/ButtonSwitch/ButtonSwitch.cjs.map +1 -1
- package/dist/components/ButtonSwitch/ButtonSwitch.js.map +1 -1
- package/dist/components/ButtonSwitch/ButtonSwitch.themes.cjs.map +1 -1
- package/dist/components/ButtonSwitch/ButtonSwitch.themes.js.map +1 -1
- package/dist/components/ButtonSwitch/ButtonSwitch.vanilla.cjs.map +1 -1
- package/dist/components/ButtonSwitch/ButtonSwitch.vanilla.js.map +1 -1
- package/dist/components/Card/Card.cjs.map +1 -1
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/Card/Card.theme.cjs.map +1 -1
- package/dist/components/Card/Card.theme.js.map +1 -1
- package/dist/components/Card/Card.themes.cjs.map +1 -1
- package/dist/components/Card/Card.themes.js.map +1 -1
- package/dist/components/Card/Card.vanilla.cjs.map +1 -1
- package/dist/components/Card/Card.vanilla.css.cjs +0 -1
- package/dist/components/Card/Card.vanilla.css.js +0 -1
- package/dist/components/Card/Card.vanilla.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.cjs.map +1 -1
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.themes.cjs.map +1 -1
- package/dist/components/Checkbox/Checkbox.themes.js.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.cjs +1 -0
- package/dist/components/CodeBlock/CodeBlock.cjs.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.js.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.themes.cjs.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.themes.js.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.vanilla.cjs +1 -0
- package/dist/components/CodeBlock/CodeBlock.vanilla.cjs.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.vanilla.js.map +1 -1
- package/dist/components/CodeBlock/prism-extend.cjs +25 -0
- package/dist/components/CodeBlock/prism-extend.cjs.map +1 -0
- package/dist/components/CodeBlock/prism-extend.js.map +1 -1
- package/dist/components/Container/Container.cjs.map +1 -1
- package/dist/components/Container/Container.js.map +1 -1
- package/dist/components/Container/Container.vanilla.cjs.map +1 -1
- package/dist/components/Container/Container.vanilla.js.map +1 -1
- package/dist/components/DateTimePicker/DateTimePicker.cjs.map +1 -1
- package/dist/components/DateTimePicker/DateTimePicker.js.map +1 -1
- package/dist/components/DateTimePickerInput/DateTimePickerInput.cjs.map +1 -1
- package/dist/components/DateTimePickerInput/DateTimePickerInput.js.map +1 -1
- package/dist/components/Dialog/Dialog.cjs.map +1 -1
- package/dist/components/Dialog/Dialog.js.map +1 -1
- package/dist/components/Dialog/Dialog.themes.cjs.map +1 -1
- package/dist/components/Dialog/Dialog.themes.js.map +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.cjs.map +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.js.map +1 -1
- package/dist/components/DropdownMenu/styles.cjs.map +1 -1
- package/dist/components/DropdownMenu/styles.js.map +1 -1
- package/dist/components/Elevation/Elevation.cjs.map +1 -1
- package/dist/components/Elevation/Elevation.js.map +1 -1
- package/dist/components/Elevation/Elevation.vanilla.cjs.map +1 -1
- package/dist/components/Elevation/Elevation.vanilla.js.map +1 -1
- package/dist/components/FaencyProvider.cjs.map +1 -1
- package/dist/components/FaencyProvider.js.map +1 -1
- package/dist/components/Flex/Flex.cjs.map +1 -1
- package/dist/components/Flex/Flex.js.map +1 -1
- package/dist/components/Flex/Flex.vanilla.cjs.map +1 -1
- package/dist/components/Flex/Flex.vanilla.js.map +1 -1
- package/dist/components/Grid/Grid.cjs.map +1 -1
- package/dist/components/Grid/Grid.js.map +1 -1
- package/dist/components/Grid/Grid.vanilla.cjs.map +1 -1
- package/dist/components/Grid/Grid.vanilla.js.map +1 -1
- package/dist/components/Heading/Heading.cjs.map +1 -1
- package/dist/components/Heading/Heading.js.map +1 -1
- package/dist/components/Heading/Heading.themes.cjs.map +1 -1
- package/dist/components/Heading/Heading.themes.js.map +1 -1
- package/dist/components/IconButton/IconButton.cjs.map +1 -1
- package/dist/components/IconButton/IconButton.js.map +1 -1
- package/dist/components/IconButton/IconButton.themes.cjs.map +1 -1
- package/dist/components/IconButton/IconButton.themes.js.map +1 -1
- package/dist/components/IconButton/IconButton.vanilla.cjs.map +1 -1
- package/dist/components/IconButton/IconButton.vanilla.js.map +1 -1
- package/dist/components/Image/Image.cjs.map +1 -1
- package/dist/components/Image/Image.js.map +1 -1
- package/dist/components/Image/Image.vanilla.cjs.map +1 -1
- package/dist/components/Image/Image.vanilla.js.map +1 -1
- package/dist/components/Input/Input.cjs.map +1 -1
- package/dist/components/Input/Input.js.map +1 -1
- package/dist/components/Input/Input.theme.cjs.map +1 -1
- package/dist/components/Input/Input.theme.js.map +1 -1
- package/dist/components/Input/Input.themes.cjs.map +1 -1
- package/dist/components/Input/Input.themes.js.map +1 -1
- package/dist/components/Input/Input.vanilla.cjs.map +1 -1
- package/dist/components/Input/Input.vanilla.css.cjs +1 -0
- package/dist/components/Input/Input.vanilla.css.js +1 -0
- package/dist/components/Input/Input.vanilla.js.map +1 -1
- package/dist/components/Label/Label.cjs.map +1 -1
- package/dist/components/Label/Label.js.map +1 -1
- package/dist/components/Label/Label.vanilla.cjs.map +1 -1
- package/dist/components/Label/Label.vanilla.js.map +1 -1
- package/dist/components/Link/Link.cjs.map +1 -1
- package/dist/components/Link/Link.js.map +1 -1
- package/dist/components/Link/Link.themes.cjs.map +1 -1
- package/dist/components/Link/Link.themes.js.map +1 -1
- package/dist/components/List/List.cjs.map +1 -1
- package/dist/components/List/List.js.map +1 -1
- package/dist/components/List/List.themes.cjs.map +1 -1
- package/dist/components/List/List.themes.js.map +1 -1
- package/dist/components/Navigation/Navigation.cjs.map +1 -1
- package/dist/components/Navigation/Navigation.js.map +1 -1
- package/dist/components/Navigation/Navigation.themes.cjs.map +1 -1
- package/dist/components/Navigation/Navigation.themes.js.map +1 -1
- package/dist/components/NavigationMenu/NavigationMenu.cjs.map +1 -1
- package/dist/components/NavigationMenu/NavigationMenu.js.map +1 -1
- package/dist/components/NavigationTree/NavigationTreeContainer.cjs.map +1 -1
- package/dist/components/NavigationTree/NavigationTreeContainer.js.map +1 -1
- package/dist/components/NavigationTree/NavigationTreeDrawer.cjs.map +1 -1
- package/dist/components/NavigationTree/NavigationTreeDrawer.js.map +1 -1
- package/dist/components/NavigationTree/NavigationTreeItem.cjs.map +1 -1
- package/dist/components/NavigationTree/NavigationTreeItem.js.map +1 -1
- package/dist/components/Overlay.cjs.map +1 -1
- package/dist/components/Overlay.js.map +1 -1
- package/dist/components/Panel/Panel.cjs.map +1 -1
- package/dist/components/Panel/Panel.js.map +1 -1
- package/dist/components/Panel/Panel.theme.cjs.map +1 -1
- package/dist/components/Panel/Panel.theme.js.map +1 -1
- package/dist/components/Panel/Panel.vanilla.cjs.map +1 -1
- package/dist/components/Panel/Panel.vanilla.js.map +1 -1
- package/dist/components/Paragraph/Paragraph.cjs.map +1 -1
- package/dist/components/Paragraph/Paragraph.js.map +1 -1
- package/dist/components/Paragraph/Paragraph.vanilla.cjs.map +1 -1
- package/dist/components/Paragraph/Paragraph.vanilla.js.map +1 -1
- package/dist/components/Popover/Popover.cjs.map +1 -1
- package/dist/components/Popover/Popover.js.map +1 -1
- package/dist/components/Radio/Radio.cjs.map +1 -1
- package/dist/components/Radio/Radio.js.map +1 -1
- package/dist/components/Radio/Radio.themes.cjs.map +1 -1
- package/dist/components/Radio/Radio.themes.js.map +1 -1
- package/dist/components/RadioAccordion/RadioAccordion.cjs.map +1 -1
- package/dist/components/RadioAccordion/RadioAccordion.js.map +1 -1
- package/dist/components/Select/Select.cjs.map +1 -1
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/Select/Select.themes.cjs.map +1 -1
- package/dist/components/Select/Select.themes.js.map +1 -1
- package/dist/components/SidePanel/SidePanel.cjs.map +1 -1
- package/dist/components/SidePanel/SidePanel.js.map +1 -1
- package/dist/components/SidePanel/SidePanel.themes.cjs.map +1 -1
- package/dist/components/SidePanel/SidePanel.themes.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.cjs.map +1 -1
- package/dist/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.themes.cjs.map +1 -1
- package/dist/components/Skeleton/Skeleton.themes.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.vanilla.cjs.map +1 -1
- package/dist/components/Skeleton/Skeleton.vanilla.js.map +1 -1
- package/dist/components/Switch/Switch.cjs.map +1 -1
- package/dist/components/Switch/Switch.js.map +1 -1
- package/dist/components/Switch/Switch.themes.cjs.map +1 -1
- package/dist/components/Switch/Switch.themes.js.map +1 -1
- package/dist/components/Table/Table.cjs.map +1 -1
- package/dist/components/Table/Table.js.map +1 -1
- package/dist/components/Table/Table.themes.cjs.map +1 -1
- package/dist/components/Table/Table.themes.js.map +1 -1
- package/dist/components/Tabs/Tabs.cjs.map +1 -1
- package/dist/components/Tabs/Tabs.js.map +1 -1
- package/dist/components/Text/Text.cjs.map +1 -1
- package/dist/components/Text/Text.js.map +1 -1
- package/dist/components/Text/Text.themes.cjs.map +1 -1
- package/dist/components/Text/Text.themes.js.map +1 -1
- package/dist/components/TextField/TextField.cjs.map +1 -1
- package/dist/components/TextField/TextField.js.map +1 -1
- package/dist/components/TextField/TextField.vanilla.cjs.map +1 -1
- package/dist/components/TextField/TextField.vanilla.js.map +1 -1
- package/dist/components/Textarea/Textarea.cjs.map +1 -1
- package/dist/components/Textarea/Textarea.js.map +1 -1
- package/dist/components/Textarea/Textarea.theme.cjs.map +1 -1
- package/dist/components/Textarea/Textarea.theme.js.map +1 -1
- package/dist/components/Textarea/Textarea.themes.cjs.map +1 -1
- package/dist/components/Textarea/Textarea.themes.js.map +1 -1
- package/dist/components/Textarea/Textarea.vanilla.cjs.map +1 -1
- package/dist/components/Textarea/Textarea.vanilla.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.cjs.map +1 -1
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.themes.cjs.map +1 -1
- package/dist/components/Tooltip/Tooltip.themes.js.map +1 -1
- package/dist/components/colorSchemeContext.cjs.map +1 -1
- package/dist/components/colorSchemeContext.js.map +1 -1
- package/dist/stitches.config.cjs.map +1 -1
- package/dist/stitches.config.js.map +1 -1
- package/dist/styles/cssProps.cjs.map +1 -1
- package/dist/styles/cssProps.js.map +1 -1
- package/dist/styles/themeContext.cjs.map +1 -1
- package/dist/styles/themeContext.js.map +1 -1
- package/dist/utils/deepMerge.cjs.map +1 -1
- package/dist/utils/deepMerge.js.map +1 -1
- package/dist/utils/getPrimaryColorInfo.cjs.map +1 -1
- package/dist/utils/getPrimaryColorInfo.js.map +1 -1
- package/package.json +26 -23
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.vanilla.cjs","names":[],"sources":["../../../components/Textarea/Textarea.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { LabelVanilla } from '../Label';\nimport {\n adornmentWrapperEnd,\n styledTextareaRecipe,\n textareaWrapperRecipe,\n} from './Textarea.vanilla.css';\n\ntype StyledTextareaRecipeVariants = NonNullable<RecipeVariants<typeof styledTextareaRecipe>>;\n\nexport interface TextareaVanillaOwnProps extends CSSProps {\n variant?: StyledTextareaRecipeVariants['variant'];\n state?: StyledTextareaRecipeVariants['state'];\n cursor?: StyledTextareaRecipeVariants['cursor'];\n resize?: StyledTextareaRecipeVariants['resize'];\n label?: string;\n endAdornment?: React.ReactNode;\n rootCss?: CSSProps['css'];\n}\n\nexport type TextareaVanillaProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> &\n TextareaVanillaOwnProps;\n\nexport const TextareaVanilla = React.forwardRef<HTMLTextAreaElement, TextareaVanillaProps>(\n (\n {\n state,\n disabled,\n onFocus,\n onBlur,\n label,\n id,\n rootCss,\n css,\n endAdornment,\n variant,\n cursor,\n resize,\n className,\n style,\n ...props\n },\n forwardedRef,\n ) => {\n const [hasFocus, setHasFocus] = React.useState(false);\n const { colors } = useVanillaExtractTheme();\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (hasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, hasFocus]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setHasFocus(true);\n },\n [onFocus, setHasFocus],\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setHasFocus(false);\n },\n [onBlur, setHasFocus],\n );\n\n const { style: rootCssStyles, vars: rootVars } = processCSSProp(rootCss, colors);\n const rootMergedStyles = { ...rootCssStyles, ...assignInlineVars(rootVars) };\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const textareaWrapperClass = textareaWrapperRecipe({ state, disabled });\n const styledTextareaClass = styledTextareaRecipe({\n variant,\n state,\n cursor,\n resize,\n endAdornment: hasEndAdornment,\n });\n\n return (\n <div style={rootMergedStyles}>\n {label && (\n <LabelVanilla variant={labelVariant} htmlFor={id} css={{ display: 'block' }}>\n {label}\n </LabelVanilla>\n )}\n <div className={textareaWrapperClass}>\n <textarea\n id={id}\n ref={forwardedRef}\n className={`${styledTextareaClass} ${className || ''}`.trim()}\n style={mergedStyles}\n disabled={disabled}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n {hasEndAdornment && <div className={adornmentWrapperEnd}>{endAdornment}</div>}\n </div>\n </div>\n );\n },\n);\n\nTextareaVanilla.displayName = 'TextareaVanilla';\n"],"mappings":";;;;;;;;;;AA4BA,IAAa,kBAAkB,MAAA,QAAM,YAEjC,EACE,OACA,UACA,SACA,QACA,OACA,IACA,SACA,KACA,cACA,SACA,QACA,QACA,WACA,OACA,GAAG,SAEL,iBACG;CACH,MAAM,CAAC,UAAU,eAAe,MAAA,QAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"Textarea.vanilla.cjs","names":[],"sources":["../../../components/Textarea/Textarea.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { LabelVanilla } from '../Label';\nimport {\n adornmentWrapperEnd,\n styledTextareaRecipe,\n textareaWrapperRecipe,\n} from './Textarea.vanilla.css';\n\ntype StyledTextareaRecipeVariants = NonNullable<RecipeVariants<typeof styledTextareaRecipe>>;\n\nexport interface TextareaVanillaOwnProps extends CSSProps {\n variant?: StyledTextareaRecipeVariants['variant'];\n state?: StyledTextareaRecipeVariants['state'];\n cursor?: StyledTextareaRecipeVariants['cursor'];\n resize?: StyledTextareaRecipeVariants['resize'];\n label?: string;\n endAdornment?: React.ReactNode;\n rootCss?: CSSProps['css'];\n}\n\nexport type TextareaVanillaProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> &\n TextareaVanillaOwnProps;\n\nexport const TextareaVanilla = React.forwardRef<HTMLTextAreaElement, TextareaVanillaProps>(\n (\n {\n state,\n disabled,\n onFocus,\n onBlur,\n label,\n id,\n rootCss,\n css,\n endAdornment,\n variant,\n cursor,\n resize,\n className,\n style,\n ...props\n },\n forwardedRef,\n ) => {\n const [hasFocus, setHasFocus] = React.useState(false);\n const { colors } = useVanillaExtractTheme();\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (hasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, hasFocus]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setHasFocus(true);\n },\n [onFocus, setHasFocus],\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setHasFocus(false);\n },\n [onBlur, setHasFocus],\n );\n\n const { style: rootCssStyles, vars: rootVars } = processCSSProp(rootCss, colors);\n const rootMergedStyles = { ...rootCssStyles, ...assignInlineVars(rootVars) };\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const textareaWrapperClass = textareaWrapperRecipe({ state, disabled });\n const styledTextareaClass = styledTextareaRecipe({\n variant,\n state,\n cursor,\n resize,\n endAdornment: hasEndAdornment,\n });\n\n return (\n <div style={rootMergedStyles}>\n {label && (\n <LabelVanilla variant={labelVariant} htmlFor={id} css={{ display: 'block' }}>\n {label}\n </LabelVanilla>\n )}\n <div className={textareaWrapperClass}>\n <textarea\n id={id}\n ref={forwardedRef}\n className={`${styledTextareaClass} ${className || ''}`.trim()}\n style={mergedStyles}\n disabled={disabled}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n {hasEndAdornment && <div className={adornmentWrapperEnd}>{endAdornment}</div>}\n </div>\n </div>\n );\n },\n);\n\nTextareaVanilla.displayName = 'TextareaVanilla';\n"],"mappings":";;;;;;;;;;AA4BA,IAAa,kBAAkB,MAAA,QAAM,YAEjC,EACE,OACA,UACA,SACA,QACA,OACA,IACA,SACA,KACA,cACA,SACA,QACA,QACA,WACA,OACA,GAAG,SAEL,iBACG;CACH,MAAM,CAAC,UAAU,eAAe,MAAA,QAAM,SAAS,KAAK;CACpD,MAAM,EAAE,WAAW,qBAAA,uBAAuB;CAE1C,MAAM,UAAU,MAAA,QAAM,cAAc,UAAU,WAAW,CAAC,KAAK,CAAC;CAChE,MAAM,kBAAkB,MAAA,QAAM,cAAc,QAAQ,YAAY,GAAG,CAAC,YAAY,CAAC;CAEjF,MAAM,eAAe,MAAA,QAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,UACF,OAAO;EAET,OAAO;CACT,GAAG;EAAC;EAAS;EAAU;CAAQ,CAAC;CAEhC,MAAM,cAAc,MAAA,QAAM,aACvB,MAA6C;EAC5C,IAAI,SACF,QAAQ,CAAC;EAEX,YAAY,IAAI;CAClB,GACA,CAAC,SAAS,WAAW,CACvB;CAEA,MAAM,aAAa,MAAA,QAAM,aACtB,MAA6C;EAC5C,IAAI,QACF,OAAO,CAAC;EAEV,YAAY,KAAK;CACnB,GACA,CAAC,QAAQ,WAAW,CACtB;CAEA,MAAM,EAAE,OAAO,eAAe,MAAM,aAAa,iBAAA,eAAe,SAAS,MAAM;CAC/E,MAAM,mBAAmB;EAAE,GAAG;EAAe,IAAA,GAAA,yBAAA,kBAAoB,QAAQ;CAAE;CAE3E,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,MAAM;CAC7D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,IAAA,GAAA,yBAAA,kBAAoB,IAAI;CAAE;CAEzE,MAAM,uBAAuB,6BAAA,sBAAsB;EAAE;EAAO;CAAS,CAAC;CACtE,MAAM,sBAAsB,6BAAA,qBAAqB;EAC/C;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,OAAO;YAAZ,CACG,SACC,iBAAA,GAAA,kBAAA,KAAC,sBAAA,cAAD;GAAc,SAAS;GAAc,SAAS;GAAI,KAAK,EAAE,SAAS,QAAQ;aACvE;EACW,CAAA,GAEhB,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAW;aAAhB,CACE,iBAAA,GAAA,kBAAA,KAAC,YAAD;IACM;IACJ,KAAK;IACL,WAAW,GAAG,oBAAoB,GAAG,aAAa,KAAK,KAAK;IAC5D,OAAO;IACG;IACV,SAAS;IACT,QAAQ;IACR,GAAI;GACL,CAAA,GACA,mBAAmB,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAA;cAAiC;GAAkB,CAAA,CACzE;IACF;;AAET,CACF;AAEA,gBAAgB,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.vanilla.js","names":[],"sources":["../../../components/Textarea/Textarea.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { LabelVanilla } from '../Label';\nimport {\n adornmentWrapperEnd,\n styledTextareaRecipe,\n textareaWrapperRecipe,\n} from './Textarea.vanilla.css';\n\ntype StyledTextareaRecipeVariants = NonNullable<RecipeVariants<typeof styledTextareaRecipe>>;\n\nexport interface TextareaVanillaOwnProps extends CSSProps {\n variant?: StyledTextareaRecipeVariants['variant'];\n state?: StyledTextareaRecipeVariants['state'];\n cursor?: StyledTextareaRecipeVariants['cursor'];\n resize?: StyledTextareaRecipeVariants['resize'];\n label?: string;\n endAdornment?: React.ReactNode;\n rootCss?: CSSProps['css'];\n}\n\nexport type TextareaVanillaProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> &\n TextareaVanillaOwnProps;\n\nexport const TextareaVanilla = React.forwardRef<HTMLTextAreaElement, TextareaVanillaProps>(\n (\n {\n state,\n disabled,\n onFocus,\n onBlur,\n label,\n id,\n rootCss,\n css,\n endAdornment,\n variant,\n cursor,\n resize,\n className,\n style,\n ...props\n },\n forwardedRef,\n ) => {\n const [hasFocus, setHasFocus] = React.useState(false);\n const { colors } = useVanillaExtractTheme();\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (hasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, hasFocus]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setHasFocus(true);\n },\n [onFocus, setHasFocus],\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setHasFocus(false);\n },\n [onBlur, setHasFocus],\n );\n\n const { style: rootCssStyles, vars: rootVars } = processCSSProp(rootCss, colors);\n const rootMergedStyles = { ...rootCssStyles, ...assignInlineVars(rootVars) };\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const textareaWrapperClass = textareaWrapperRecipe({ state, disabled });\n const styledTextareaClass = styledTextareaRecipe({\n variant,\n state,\n cursor,\n resize,\n endAdornment: hasEndAdornment,\n });\n\n return (\n <div style={rootMergedStyles}>\n {label && (\n <LabelVanilla variant={labelVariant} htmlFor={id} css={{ display: 'block' }}>\n {label}\n </LabelVanilla>\n )}\n <div className={textareaWrapperClass}>\n <textarea\n id={id}\n ref={forwardedRef}\n className={`${styledTextareaClass} ${className || ''}`.trim()}\n style={mergedStyles}\n disabled={disabled}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n {hasEndAdornment && <div className={adornmentWrapperEnd}>{endAdornment}</div>}\n </div>\n </div>\n );\n },\n);\n\nTextareaVanilla.displayName = 'TextareaVanilla';\n"],"mappings":";;;;;;;;AA4BA,IAAa,kBAAkB,MAAM,YAEjC,EACE,OACA,UACA,SACA,QACA,OACA,IACA,SACA,KACA,cACA,SACA,QACA,QACA,WACA,OACA,GAAG,SAEL,iBACG;CACH,MAAM,CAAC,UAAU,eAAe,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"Textarea.vanilla.js","names":[],"sources":["../../../components/Textarea/Textarea.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport React from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { LabelVanilla } from '../Label';\nimport {\n adornmentWrapperEnd,\n styledTextareaRecipe,\n textareaWrapperRecipe,\n} from './Textarea.vanilla.css';\n\ntype StyledTextareaRecipeVariants = NonNullable<RecipeVariants<typeof styledTextareaRecipe>>;\n\nexport interface TextareaVanillaOwnProps extends CSSProps {\n variant?: StyledTextareaRecipeVariants['variant'];\n state?: StyledTextareaRecipeVariants['state'];\n cursor?: StyledTextareaRecipeVariants['cursor'];\n resize?: StyledTextareaRecipeVariants['resize'];\n label?: string;\n endAdornment?: React.ReactNode;\n rootCss?: CSSProps['css'];\n}\n\nexport type TextareaVanillaProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> &\n TextareaVanillaOwnProps;\n\nexport const TextareaVanilla = React.forwardRef<HTMLTextAreaElement, TextareaVanillaProps>(\n (\n {\n state,\n disabled,\n onFocus,\n onBlur,\n label,\n id,\n rootCss,\n css,\n endAdornment,\n variant,\n cursor,\n resize,\n className,\n style,\n ...props\n },\n forwardedRef,\n ) => {\n const [hasFocus, setHasFocus] = React.useState(false);\n const { colors } = useVanillaExtractTheme();\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (hasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, hasFocus]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setHasFocus(true);\n },\n [onFocus, setHasFocus],\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setHasFocus(false);\n },\n [onBlur, setHasFocus],\n );\n\n const { style: rootCssStyles, vars: rootVars } = processCSSProp(rootCss, colors);\n const rootMergedStyles = { ...rootCssStyles, ...assignInlineVars(rootVars) };\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n\n const textareaWrapperClass = textareaWrapperRecipe({ state, disabled });\n const styledTextareaClass = styledTextareaRecipe({\n variant,\n state,\n cursor,\n resize,\n endAdornment: hasEndAdornment,\n });\n\n return (\n <div style={rootMergedStyles}>\n {label && (\n <LabelVanilla variant={labelVariant} htmlFor={id} css={{ display: 'block' }}>\n {label}\n </LabelVanilla>\n )}\n <div className={textareaWrapperClass}>\n <textarea\n id={id}\n ref={forwardedRef}\n className={`${styledTextareaClass} ${className || ''}`.trim()}\n style={mergedStyles}\n disabled={disabled}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n {hasEndAdornment && <div className={adornmentWrapperEnd}>{endAdornment}</div>}\n </div>\n </div>\n );\n },\n);\n\nTextareaVanilla.displayName = 'TextareaVanilla';\n"],"mappings":";;;;;;;;AA4BA,IAAa,kBAAkB,MAAM,YAEjC,EACE,OACA,UACA,SACA,QACA,OACA,IACA,SACA,KACA,cACA,SACA,QACA,QACA,WACA,OACA,GAAG,SAEL,iBACG;CACH,MAAM,CAAC,UAAU,eAAe,MAAM,SAAS,KAAK;CACpD,MAAM,EAAE,WAAW,uBAAuB;CAE1C,MAAM,UAAU,MAAM,cAAc,UAAU,WAAW,CAAC,KAAK,CAAC;CAChE,MAAM,kBAAkB,MAAM,cAAc,QAAQ,YAAY,GAAG,CAAC,YAAY,CAAC;CAEjF,MAAM,eAAe,MAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,UACF,OAAO;EAET,OAAO;CACT,GAAG;EAAC;EAAS;EAAU;CAAQ,CAAC;CAEhC,MAAM,cAAc,MAAM,aACvB,MAA6C;EAC5C,IAAI,SACF,QAAQ,CAAC;EAEX,YAAY,IAAI;CAClB,GACA,CAAC,SAAS,WAAW,CACvB;CAEA,MAAM,aAAa,MAAM,aACtB,MAA6C;EAC5C,IAAI,QACF,OAAO,CAAC;EAEV,YAAY,KAAK;CACnB,GACA,CAAC,QAAQ,WAAW,CACtB;CAEA,MAAM,EAAE,OAAO,eAAe,MAAM,aAAa,eAAe,SAAS,MAAM;CAC/E,MAAM,mBAAmB;EAAE,GAAG;EAAe,GAAG,iBAAiB,QAAQ;CAAE;CAE3E,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,MAAM;CAC7D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,GAAG,iBAAiB,IAAI;CAAE;CAEzE,MAAM,uBAAuB,sBAAsB;EAAE;EAAO;CAAS,CAAC;CACtE,MAAM,sBAAsB,qBAAqB;EAC/C;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,OACE,qBAAC,OAAD;EAAK,OAAO;YAAZ,CACG,SACC,oBAAC,cAAD;GAAc,SAAS;GAAc,SAAS;GAAI,KAAK,EAAE,SAAS,QAAQ;aACvE;EACW,CAAA,GAEhB,qBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,oBAAC,YAAD;IACM;IACJ,KAAK;IACL,WAAW,GAAG,oBAAoB,GAAG,aAAa,KAAK,KAAK;IAC5D,OAAO;IACG;IACV,SAAS;IACT,QAAQ;IACR,GAAI;GACL,CAAA,GACA,mBAAmB,oBAAC,OAAD;IAAK,WAAA;cAAiC;GAAkB,CAAA,CACzE;IACF;;AAET,CACF;AAEA,gBAAgB,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.cjs","names":[],"sources":["../../../components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Text } from '../Text';\n\nexport type TooltipProps = React.ComponentProps<typeof TooltipPrimitive.Root> &\n Omit<React.ComponentProps<typeof TooltipPrimitive.Content>, 'content'> & {\n children: React.ReactElement | React.ReactNode;\n content: React.ReactElement | React.ReactNode;\n multiline?: boolean;\n css?: CSS;\n };\n\nconst Content = styled(TooltipPrimitive.Content, {\n color: '$tooltipText',\n backgroundColor: '$tooltipContentBg',\n borderRadius: '$3',\n padding: '$2',\n\n variants: {\n multiline: {\n true: {\n maxWidth: 250,\n pb: 7,\n },\n },\n },\n});\n\nconst ArrowBox = styled(Box, {\n color: '$tooltipContentBg',\n});\n\nexport const TooltipContent = React.forwardRef<\n React.ElementRef<typeof Content>,\n Partial<TooltipProps>\n>(({ css, multiline, children, ...props }, forwardedRef) => {\n const isContentString = React.useMemo(() => typeof children === 'string', [children]);\n return (\n <Content\n css={css}\n side=\"top\"\n align=\"center\"\n sideOffset={5}\n {...(props as React.ComponentProps<typeof TooltipPrimitive.Content>)}\n multiline={multiline}\n ref={forwardedRef}\n >\n {isContentString ? (\n <Text\n size=\"1\"\n as=\"p\"\n css={{\n color: 'currentColor',\n lineHeight: multiline ? '20px' : undefined,\n }}\n >\n {children}\n </Text>\n ) : (\n children\n )}\n <ArrowBox>\n <TooltipPrimitive.Arrow\n offset={5}\n width={11}\n height={5}\n style={{\n fill: 'currentColor',\n }}\n />\n </ArrowBox>\n </Content>\n );\n});\n\nexport const Tooltip = React.forwardRef<React.ElementRef<typeof Content>, TooltipProps>(\n (\n { children, content, open, defaultOpen, onOpenChange, multiline, css, ...props },\n forwardedRef,\n ) => (\n <TooltipPrimitive.Root\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n delayDuration={400}\n >\n <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipContent css={css} multiline={multiline} ref={forwardedRef} {...props}>\n {content}\n </TooltipContent>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n ),\n);\n\nexport const TooltipRoot = TooltipPrimitive.Root;\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\nexport const TooltipPortal = TooltipPrimitive.Portal;\n\nexport type TooltipVariants = VariantProps<typeof Tooltip>;\n"],"mappings":";;;;;;;;;;AAeA,IAAM,UAAU,wBAAA,OAAO,wBAAiB,SAAS;CAC/C,OAAO;CACP,iBAAiB;CACjB,cAAc;CACd,SAAS;CAET,UAAU,EACR,WAAW,EACT,MAAM;EACJ,UAAU;EACV,IAAI;
|
|
1
|
+
{"version":3,"file":"Tooltip.cjs","names":[],"sources":["../../../components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Text } from '../Text';\n\nexport type TooltipProps = React.ComponentProps<typeof TooltipPrimitive.Root> &\n Omit<React.ComponentProps<typeof TooltipPrimitive.Content>, 'content'> & {\n children: React.ReactElement | React.ReactNode;\n content: React.ReactElement | React.ReactNode;\n multiline?: boolean;\n css?: CSS;\n };\n\nconst Content = styled(TooltipPrimitive.Content, {\n color: '$tooltipText',\n backgroundColor: '$tooltipContentBg',\n borderRadius: '$3',\n padding: '$2',\n\n variants: {\n multiline: {\n true: {\n maxWidth: 250,\n pb: 7,\n },\n },\n },\n});\n\nconst ArrowBox = styled(Box, {\n color: '$tooltipContentBg',\n});\n\nexport const TooltipContent = React.forwardRef<\n React.ElementRef<typeof Content>,\n Partial<TooltipProps>\n>(({ css, multiline, children, ...props }, forwardedRef) => {\n const isContentString = React.useMemo(() => typeof children === 'string', [children]);\n return (\n <Content\n css={css}\n side=\"top\"\n align=\"center\"\n sideOffset={5}\n {...(props as React.ComponentProps<typeof TooltipPrimitive.Content>)}\n multiline={multiline}\n ref={forwardedRef}\n >\n {isContentString ? (\n <Text\n size=\"1\"\n as=\"p\"\n css={{\n color: 'currentColor',\n lineHeight: multiline ? '20px' : undefined,\n }}\n >\n {children}\n </Text>\n ) : (\n children\n )}\n <ArrowBox>\n <TooltipPrimitive.Arrow\n offset={5}\n width={11}\n height={5}\n style={{\n fill: 'currentColor',\n }}\n />\n </ArrowBox>\n </Content>\n );\n});\n\nexport const Tooltip = React.forwardRef<React.ElementRef<typeof Content>, TooltipProps>(\n (\n { children, content, open, defaultOpen, onOpenChange, multiline, css, ...props },\n forwardedRef,\n ) => (\n <TooltipPrimitive.Root\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n delayDuration={400}\n >\n <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipContent css={css} multiline={multiline} ref={forwardedRef} {...props}>\n {content}\n </TooltipContent>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n ),\n);\n\nexport const TooltipRoot = TooltipPrimitive.Root;\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\nexport const TooltipPortal = TooltipPrimitive.Portal;\n\nexport type TooltipVariants = VariantProps<typeof Tooltip>;\n"],"mappings":";;;;;;;;;;AAeA,IAAM,UAAU,wBAAA,OAAO,wBAAiB,SAAS;CAC/C,OAAO;CACP,iBAAiB;CACjB,cAAc;CACd,SAAS;CAET,UAAU,EACR,WAAW,EACT,MAAM;EACJ,UAAU;EACV,IAAI;CACN,EACF,EACF;AACF,CAAC;AAED,IAAM,WAAW,wBAAA,OAAO,YAAA,KAAK,EAC3B,OAAO,oBACT,CAAC;AAED,IAAa,iBAAiB,MAAA,QAAM,YAGjC,EAAE,KAAK,WAAW,UAAU,GAAG,SAAS,iBAAiB;CAC1D,MAAM,kBAAkB,MAAA,QAAM,cAAc,OAAO,aAAa,UAAU,CAAC,QAAQ,CAAC;CACpF,OACE,iBAAA,GAAA,kBAAA,MAAC,SAAD;EACO;EACL,MAAK;EACL,OAAM;EACN,YAAY;EACZ,GAAK;EACM;EACX,KAAK;YAPP,CASG,kBACC,iBAAA,GAAA,kBAAA,KAAC,aAAA,MAAD;GACE,MAAK;GACL,IAAG;GACH,KAAK;IACH,OAAO;IACP,YAAY,YAAY,SAAS,KAAA;GACnC;GAEC;EACG,CAAA,IAEN,UAEF,iBAAA,GAAA,kBAAA,KAAC,UAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,wBAAiB,OAAlB;GACE,QAAQ;GACR,OAAO;GACP,QAAQ;GACR,OAAO,EACL,MAAM,eACR;EACD,CAAA,EACO,CAAA,CACH;;AAEb,CAAC;AAED,IAAa,UAAU,MAAA,QAAM,YAEzB,EAAE,UAAU,SAAS,MAAM,aAAa,cAAc,WAAW,KAAK,GAAG,SACzE,iBAEA,iBAAA,GAAA,kBAAA,MAAC,wBAAiB,MAAlB;CACQ;CACO;CACC;CACd,eAAe;WAJjB,CAME,iBAAA,GAAA,kBAAA,KAAC,wBAAiB,SAAlB;EAA0B,SAAA;EAAS;CAAmC,CAAA,GACtE,iBAAA,GAAA,kBAAA,KAAC,wBAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;EAAqB;EAAgB;EAAW,KAAK;EAAc,GAAI;YACpE;CACa,CAAA,EACO,CAAA,CACJ;EAE3B;AAEA,IAAa,cAAc,wBAAiB;AAC5C,IAAa,iBAAiB,wBAAiB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Text } from '../Text';\n\nexport type TooltipProps = React.ComponentProps<typeof TooltipPrimitive.Root> &\n Omit<React.ComponentProps<typeof TooltipPrimitive.Content>, 'content'> & {\n children: React.ReactElement | React.ReactNode;\n content: React.ReactElement | React.ReactNode;\n multiline?: boolean;\n css?: CSS;\n };\n\nconst Content = styled(TooltipPrimitive.Content, {\n color: '$tooltipText',\n backgroundColor: '$tooltipContentBg',\n borderRadius: '$3',\n padding: '$2',\n\n variants: {\n multiline: {\n true: {\n maxWidth: 250,\n pb: 7,\n },\n },\n },\n});\n\nconst ArrowBox = styled(Box, {\n color: '$tooltipContentBg',\n});\n\nexport const TooltipContent = React.forwardRef<\n React.ElementRef<typeof Content>,\n Partial<TooltipProps>\n>(({ css, multiline, children, ...props }, forwardedRef) => {\n const isContentString = React.useMemo(() => typeof children === 'string', [children]);\n return (\n <Content\n css={css}\n side=\"top\"\n align=\"center\"\n sideOffset={5}\n {...(props as React.ComponentProps<typeof TooltipPrimitive.Content>)}\n multiline={multiline}\n ref={forwardedRef}\n >\n {isContentString ? (\n <Text\n size=\"1\"\n as=\"p\"\n css={{\n color: 'currentColor',\n lineHeight: multiline ? '20px' : undefined,\n }}\n >\n {children}\n </Text>\n ) : (\n children\n )}\n <ArrowBox>\n <TooltipPrimitive.Arrow\n offset={5}\n width={11}\n height={5}\n style={{\n fill: 'currentColor',\n }}\n />\n </ArrowBox>\n </Content>\n );\n});\n\nexport const Tooltip = React.forwardRef<React.ElementRef<typeof Content>, TooltipProps>(\n (\n { children, content, open, defaultOpen, onOpenChange, multiline, css, ...props },\n forwardedRef,\n ) => (\n <TooltipPrimitive.Root\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n delayDuration={400}\n >\n <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipContent css={css} multiline={multiline} ref={forwardedRef} {...props}>\n {content}\n </TooltipContent>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n ),\n);\n\nexport const TooltipRoot = TooltipPrimitive.Root;\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\nexport const TooltipPortal = TooltipPrimitive.Portal;\n\nexport type TooltipVariants = VariantProps<typeof Tooltip>;\n"],"mappings":";;;;;;;AAeA,IAAM,UAAU,OAAO,iBAAiB,SAAS;CAC/C,OAAO;CACP,iBAAiB;CACjB,cAAc;CACd,SAAS;CAET,UAAU,EACR,WAAW,EACT,MAAM;EACJ,UAAU;EACV,IAAI;
|
|
1
|
+
{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Text } from '../Text';\n\nexport type TooltipProps = React.ComponentProps<typeof TooltipPrimitive.Root> &\n Omit<React.ComponentProps<typeof TooltipPrimitive.Content>, 'content'> & {\n children: React.ReactElement | React.ReactNode;\n content: React.ReactElement | React.ReactNode;\n multiline?: boolean;\n css?: CSS;\n };\n\nconst Content = styled(TooltipPrimitive.Content, {\n color: '$tooltipText',\n backgroundColor: '$tooltipContentBg',\n borderRadius: '$3',\n padding: '$2',\n\n variants: {\n multiline: {\n true: {\n maxWidth: 250,\n pb: 7,\n },\n },\n },\n});\n\nconst ArrowBox = styled(Box, {\n color: '$tooltipContentBg',\n});\n\nexport const TooltipContent = React.forwardRef<\n React.ElementRef<typeof Content>,\n Partial<TooltipProps>\n>(({ css, multiline, children, ...props }, forwardedRef) => {\n const isContentString = React.useMemo(() => typeof children === 'string', [children]);\n return (\n <Content\n css={css}\n side=\"top\"\n align=\"center\"\n sideOffset={5}\n {...(props as React.ComponentProps<typeof TooltipPrimitive.Content>)}\n multiline={multiline}\n ref={forwardedRef}\n >\n {isContentString ? (\n <Text\n size=\"1\"\n as=\"p\"\n css={{\n color: 'currentColor',\n lineHeight: multiline ? '20px' : undefined,\n }}\n >\n {children}\n </Text>\n ) : (\n children\n )}\n <ArrowBox>\n <TooltipPrimitive.Arrow\n offset={5}\n width={11}\n height={5}\n style={{\n fill: 'currentColor',\n }}\n />\n </ArrowBox>\n </Content>\n );\n});\n\nexport const Tooltip = React.forwardRef<React.ElementRef<typeof Content>, TooltipProps>(\n (\n { children, content, open, defaultOpen, onOpenChange, multiline, css, ...props },\n forwardedRef,\n ) => (\n <TooltipPrimitive.Root\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n delayDuration={400}\n >\n <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal>\n <TooltipContent css={css} multiline={multiline} ref={forwardedRef} {...props}>\n {content}\n </TooltipContent>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n ),\n);\n\nexport const TooltipRoot = TooltipPrimitive.Root;\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\nexport const TooltipPortal = TooltipPrimitive.Portal;\n\nexport type TooltipVariants = VariantProps<typeof Tooltip>;\n"],"mappings":";;;;;;;AAeA,IAAM,UAAU,OAAO,iBAAiB,SAAS;CAC/C,OAAO;CACP,iBAAiB;CACjB,cAAc;CACd,SAAS;CAET,UAAU,EACR,WAAW,EACT,MAAM;EACJ,UAAU;EACV,IAAI;CACN,EACF,EACF;AACF,CAAC;AAED,IAAM,WAAW,OAAO,KAAK,EAC3B,OAAO,oBACT,CAAC;AAED,IAAa,iBAAiB,MAAM,YAGjC,EAAE,KAAK,WAAW,UAAU,GAAG,SAAS,iBAAiB;CAC1D,MAAM,kBAAkB,MAAM,cAAc,OAAO,aAAa,UAAU,CAAC,QAAQ,CAAC;CACpF,OACE,qBAAC,SAAD;EACO;EACL,MAAK;EACL,OAAM;EACN,YAAY;EACZ,GAAK;EACM;EACX,KAAK;YAPP,CASG,kBACC,oBAAC,MAAD;GACE,MAAK;GACL,IAAG;GACH,KAAK;IACH,OAAO;IACP,YAAY,YAAY,SAAS,KAAA;GACnC;GAEC;EACG,CAAA,IAEN,UAEF,oBAAC,UAAD,EAAA,UACE,oBAAC,iBAAiB,OAAlB;GACE,QAAQ;GACR,OAAO;GACP,QAAQ;GACR,OAAO,EACL,MAAM,eACR;EACD,CAAA,EACO,CAAA,CACH;;AAEb,CAAC;AAED,IAAa,UAAU,MAAM,YAEzB,EAAE,UAAU,SAAS,MAAM,aAAa,cAAc,WAAW,KAAK,GAAG,SACzE,iBAEA,qBAAC,iBAAiB,MAAlB;CACQ;CACO;CACC;CACd,eAAe;WAJjB,CAME,oBAAC,iBAAiB,SAAlB;EAA0B,SAAA;EAAS;CAAmC,CAAA,GACtE,oBAAC,iBAAiB,QAAlB,EAAA,UACE,oBAAC,gBAAD;EAAqB;EAAgB;EAAW,KAAK;EAAc,GAAI;YACpE;CACa,CAAA,EACO,CAAA,CACJ;EAE3B;AAEA,IAAa,cAAc,iBAAiB;AAC5C,IAAa,iBAAiB,iBAAiB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.themes.cjs","names":[],"sources":["../../../components/Tooltip/Tooltip.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tooltipContentBg: Property.Color;\n tooltipText: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: 'white',\n });\n\n export const getDark: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;
|
|
1
|
+
{"version":3,"file":"Tooltip.themes.cjs","names":[],"sources":["../../../components/Tooltip/Tooltip.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tooltipContentBg: Property.Color;\n tooltipText: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: 'white',\n });\n\n export const getDark: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;CAQQ,OAAA,kBAA2B;EACtC,kBAAkB;EAClB,aAAa;CACf;CAEa,OAAA,iBAA0B;EACrC,kBAAkB;EAClB,aAAa;CACf;wBACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.themes.js","names":[],"sources":["../../../components/Tooltip/Tooltip.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tooltipContentBg: Property.Color;\n tooltipText: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: 'white',\n });\n\n export const getDark: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;
|
|
1
|
+
{"version":3,"file":"Tooltip.themes.js","names":[],"sources":["../../../components/Tooltip/Tooltip.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tooltipContentBg: Property.Color;\n tooltipText: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: 'white',\n });\n\n export const getDark: Factory = () => ({\n tooltipContentBg: '$primary',\n tooltipText: '$deepBlue2',\n });\n}\n"],"mappings":";AAIO,IAAA;;CAQQ,OAAA,kBAA2B;EACtC,kBAAkB;EAClB,aAAa;CACf;CAEa,OAAA,iBAA0B;EACrC,kBAAkB;EAClB,aAAa;CACf;wBACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"colorSchemeContext.cjs","names":[],"sources":["../../components/colorSchemeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState } from 'react';\n\nexport type ColorScheme = 'light' | 'dark';\n\nfunction readDocumentTheme(): ColorScheme | null {\n const el = document.documentElement;\n if (el.classList.contains('dark')) return 'dark';\n if (el.classList.contains('light')) return 'light';\n const attr = el.dataset.theme;\n if (attr === 'dark' || attr === 'light') return attr;\n return null;\n}\n\nconst ColorSchemeContext = createContext<ColorScheme>('light');\n\nexport function ColorSchemeProvider({ children }: { children: React.ReactNode }) {\n const [scheme, setScheme] = useState<ColorScheme>(() => {\n if (typeof window === 'undefined') return 'light';\n return (\n readDocumentTheme() ??\n (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')\n );\n });\n\n useEffect(() => {\n const observer = new MutationObserver(() => {\n const docTheme = readDocumentTheme();\n if (docTheme) setScheme(docTheme);\n });\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class', 'data-theme'],\n });\n\n const mq = window.matchMedia('(prefers-color-scheme: dark)');\n const mqHandler = (e: MediaQueryListEvent) => {\n if (!readDocumentTheme()) setScheme(e.matches ? 'dark' : 'light');\n };\n mq.addEventListener('change', mqHandler);\n\n return () => {\n observer.disconnect();\n mq.removeEventListener('change', mqHandler);\n };\n }, []);\n\n return <ColorSchemeContext.Provider value={scheme}>{children}</ColorSchemeContext.Provider>;\n}\n\nexport function useColorScheme(): ColorScheme {\n return useContext(ColorSchemeContext);\n}\n"],"mappings":";;;;;AAIA,SAAS,oBAAwC;CAC/C,MAAM,KAAK,SAAS;
|
|
1
|
+
{"version":3,"file":"colorSchemeContext.cjs","names":[],"sources":["../../components/colorSchemeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState } from 'react';\n\nexport type ColorScheme = 'light' | 'dark';\n\nfunction readDocumentTheme(): ColorScheme | null {\n const el = document.documentElement;\n if (el.classList.contains('dark')) return 'dark';\n if (el.classList.contains('light')) return 'light';\n const attr = el.dataset.theme;\n if (attr === 'dark' || attr === 'light') return attr;\n return null;\n}\n\nconst ColorSchemeContext = createContext<ColorScheme>('light');\n\nexport function ColorSchemeProvider({ children }: { children: React.ReactNode }) {\n const [scheme, setScheme] = useState<ColorScheme>(() => {\n if (typeof window === 'undefined') return 'light';\n return (\n readDocumentTheme() ??\n (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')\n );\n });\n\n useEffect(() => {\n const observer = new MutationObserver(() => {\n const docTheme = readDocumentTheme();\n if (docTheme) setScheme(docTheme);\n });\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class', 'data-theme'],\n });\n\n const mq = window.matchMedia('(prefers-color-scheme: dark)');\n const mqHandler = (e: MediaQueryListEvent) => {\n if (!readDocumentTheme()) setScheme(e.matches ? 'dark' : 'light');\n };\n mq.addEventListener('change', mqHandler);\n\n return () => {\n observer.disconnect();\n mq.removeEventListener('change', mqHandler);\n };\n }, []);\n\n return <ColorSchemeContext.Provider value={scheme}>{children}</ColorSchemeContext.Provider>;\n}\n\nexport function useColorScheme(): ColorScheme {\n return useContext(ColorSchemeContext);\n}\n"],"mappings":";;;;;AAIA,SAAS,oBAAwC;CAC/C,MAAM,KAAK,SAAS;CACpB,IAAI,GAAG,UAAU,SAAS,MAAM,GAAG,OAAO;CAC1C,IAAI,GAAG,UAAU,SAAS,OAAO,GAAG,OAAO;CAC3C,MAAM,OAAO,GAAG,QAAQ;CACxB,IAAI,SAAS,UAAU,SAAS,SAAS,OAAO;CAChD,OAAO;AACT;AAEA,IAAM,sBAAA,GAAA,MAAA,eAAgD,OAAO;AAE7D,SAAgB,oBAAoB,EAAE,YAA2C;CAC/E,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,gBAAyC;EACtD,IAAI,OAAO,WAAW,aAAa,OAAO;EAC1C,OACE,kBAAkB,MACjB,OAAO,WAAW,8BAA8B,EAAE,UAAU,SAAS;CAE1E,CAAC;CAED,CAAA,GAAA,MAAA,iBAAgB;EACd,MAAM,WAAW,IAAI,uBAAuB;GAC1C,MAAM,WAAW,kBAAkB;GACnC,IAAI,UAAU,UAAU,QAAQ;EAClC,CAAC;EACD,SAAS,QAAQ,SAAS,iBAAiB;GACzC,YAAY;GACZ,iBAAiB,CAAC,SAAS,YAAY;EACzC,CAAC;EAED,MAAM,KAAK,OAAO,WAAW,8BAA8B;EAC3D,MAAM,aAAa,MAA2B;GAC5C,IAAI,CAAC,kBAAkB,GAAG,UAAU,EAAE,UAAU,SAAS,OAAO;EAClE;EACA,GAAG,iBAAiB,UAAU,SAAS;EAEvC,aAAa;GACX,SAAS,WAAW;GACpB,GAAG,oBAAoB,UAAU,SAAS;EAC5C;CACF,GAAG,CAAC,CAAC;CAEL,OAAO,iBAAA,GAAA,kBAAA,KAAC,mBAAmB,UAApB;EAA6B,OAAO;EAAS;CAAsC,CAAA;AAC5F;AAEA,SAAgB,iBAA8B;CAC5C,QAAA,GAAA,MAAA,YAAkB,kBAAkB;AACtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"colorSchemeContext.js","names":[],"sources":["../../components/colorSchemeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState } from 'react';\n\nexport type ColorScheme = 'light' | 'dark';\n\nfunction readDocumentTheme(): ColorScheme | null {\n const el = document.documentElement;\n if (el.classList.contains('dark')) return 'dark';\n if (el.classList.contains('light')) return 'light';\n const attr = el.dataset.theme;\n if (attr === 'dark' || attr === 'light') return attr;\n return null;\n}\n\nconst ColorSchemeContext = createContext<ColorScheme>('light');\n\nexport function ColorSchemeProvider({ children }: { children: React.ReactNode }) {\n const [scheme, setScheme] = useState<ColorScheme>(() => {\n if (typeof window === 'undefined') return 'light';\n return (\n readDocumentTheme() ??\n (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')\n );\n });\n\n useEffect(() => {\n const observer = new MutationObserver(() => {\n const docTheme = readDocumentTheme();\n if (docTheme) setScheme(docTheme);\n });\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class', 'data-theme'],\n });\n\n const mq = window.matchMedia('(prefers-color-scheme: dark)');\n const mqHandler = (e: MediaQueryListEvent) => {\n if (!readDocumentTheme()) setScheme(e.matches ? 'dark' : 'light');\n };\n mq.addEventListener('change', mqHandler);\n\n return () => {\n observer.disconnect();\n mq.removeEventListener('change', mqHandler);\n };\n }, []);\n\n return <ColorSchemeContext.Provider value={scheme}>{children}</ColorSchemeContext.Provider>;\n}\n\nexport function useColorScheme(): ColorScheme {\n return useContext(ColorSchemeContext);\n}\n"],"mappings":";;;AAIA,SAAS,oBAAwC;CAC/C,MAAM,KAAK,SAAS;
|
|
1
|
+
{"version":3,"file":"colorSchemeContext.js","names":[],"sources":["../../components/colorSchemeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useState } from 'react';\n\nexport type ColorScheme = 'light' | 'dark';\n\nfunction readDocumentTheme(): ColorScheme | null {\n const el = document.documentElement;\n if (el.classList.contains('dark')) return 'dark';\n if (el.classList.contains('light')) return 'light';\n const attr = el.dataset.theme;\n if (attr === 'dark' || attr === 'light') return attr;\n return null;\n}\n\nconst ColorSchemeContext = createContext<ColorScheme>('light');\n\nexport function ColorSchemeProvider({ children }: { children: React.ReactNode }) {\n const [scheme, setScheme] = useState<ColorScheme>(() => {\n if (typeof window === 'undefined') return 'light';\n return (\n readDocumentTheme() ??\n (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')\n );\n });\n\n useEffect(() => {\n const observer = new MutationObserver(() => {\n const docTheme = readDocumentTheme();\n if (docTheme) setScheme(docTheme);\n });\n observer.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class', 'data-theme'],\n });\n\n const mq = window.matchMedia('(prefers-color-scheme: dark)');\n const mqHandler = (e: MediaQueryListEvent) => {\n if (!readDocumentTheme()) setScheme(e.matches ? 'dark' : 'light');\n };\n mq.addEventListener('change', mqHandler);\n\n return () => {\n observer.disconnect();\n mq.removeEventListener('change', mqHandler);\n };\n }, []);\n\n return <ColorSchemeContext.Provider value={scheme}>{children}</ColorSchemeContext.Provider>;\n}\n\nexport function useColorScheme(): ColorScheme {\n return useContext(ColorSchemeContext);\n}\n"],"mappings":";;;AAIA,SAAS,oBAAwC;CAC/C,MAAM,KAAK,SAAS;CACpB,IAAI,GAAG,UAAU,SAAS,MAAM,GAAG,OAAO;CAC1C,IAAI,GAAG,UAAU,SAAS,OAAO,GAAG,OAAO;CAC3C,MAAM,OAAO,GAAG,QAAQ;CACxB,IAAI,SAAS,UAAU,SAAS,SAAS,OAAO;CAChD,OAAO;AACT;AAEA,IAAM,qBAAqB,cAA2B,OAAO;AAE7D,SAAgB,oBAAoB,EAAE,YAA2C;CAC/E,MAAM,CAAC,QAAQ,aAAa,eAA4B;EACtD,IAAI,OAAO,WAAW,aAAa,OAAO;EAC1C,OACE,kBAAkB,MACjB,OAAO,WAAW,8BAA8B,EAAE,UAAU,SAAS;CAE1E,CAAC;CAED,gBAAgB;EACd,MAAM,WAAW,IAAI,uBAAuB;GAC1C,MAAM,WAAW,kBAAkB;GACnC,IAAI,UAAU,UAAU,QAAQ;EAClC,CAAC;EACD,SAAS,QAAQ,SAAS,iBAAiB;GACzC,YAAY;GACZ,iBAAiB,CAAC,SAAS,YAAY;EACzC,CAAC;EAED,MAAM,KAAK,OAAO,WAAW,8BAA8B;EAC3D,MAAM,aAAa,MAA2B;GAC5C,IAAI,CAAC,kBAAkB,GAAG,UAAU,EAAE,UAAU,SAAS,OAAO;EAClE;EACA,GAAG,iBAAiB,UAAU,SAAS;EAEvC,aAAa;GACX,SAAS,WAAW;GACpB,GAAG,oBAAoB,UAAU,SAAS;EAC5C;CACF,GAAG,CAAC,CAAC;CAEL,OAAO,oBAAC,mBAAmB,UAApB;EAA6B,OAAO;EAAS;CAAsC,CAAA;AAC5F;AAEA,SAAgB,iBAA8B;CAC5C,OAAO,WAAW,kBAAkB;AACtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stitches.config.cjs","names":[],"sources":["../stitches.config.ts"],"sourcesContent":["// @ts-nocheck\nimport type * as Stitches from '@stitches/react';\nimport { createStitches, CSS as StitchesCSS } from '@stitches/react';\nimport { Property } from '@stitches/react/types/css';\n\nimport { darkColors, lightColors } from './colors';\nimport { Theme as AccordionTheme } from './components/Accordion/Accordion.themes';\nimport { Theme as BadgeTheme } from './components/Badge/Badge.themes';\nimport { Theme as ButtonTheme } from './components/Button/Button.themes';\nimport { Theme as ButtonSwitchTheme } from './components/ButtonSwitch/ButtonSwitch.themes';\nimport { Theme as CardTheme } from './components/Card/Card.themes';\nimport { Theme as CheckboxTheme } from './components/Checkbox/Checkbox.themes';\nimport { Theme as CodeBlockTheme } from './components/CodeBlock/CodeBlock.themes';\nimport { Theme as DialogTheme } from './components/Dialog/Dialog.themes';\nimport { Theme as HeadingTheme } from './components/Heading/Heading.themes';\nimport { Theme as IconButtonTheme } from './components/IconButton/IconButton.themes';\nimport { Theme as InputTheme } from './components/Input/Input.themes';\nimport { Theme as LinkTheme } from './components/Link/Link.themes';\nimport { Theme as ListTheme } from './components/List/List.themes';\nimport { Theme as NavigationTheme } from './components/Navigation/Navigation.themes';\nimport { Theme as RadioTheme } from './components/Radio/Radio.themes';\nimport { Theme as SelectTheme } from './components/Select/Select.themes';\nimport { Theme as SidePanelTheme } from './components/SidePanel/SidePanel.themes';\nimport { Theme as SkeletonTheme } from './components/Skeleton/Skeleton.themes';\nimport { Theme as SwitchTheme } from './components/Switch/Switch.themes';\nimport { Theme as TableTheme } from './components/Table/Table.themes';\nimport { Theme as TextTheme } from './components/Text/Text.themes';\nimport { Theme as TextareaTheme } from './components/Textarea/Textarea.themes';\nimport { Theme as TooltipTheme } from './components/Tooltip/Tooltip.themes';\nimport getPrimaryColorInfo from './utils/getPrimaryColorInfo';\n\nexport type { VariantProps } from '@stitches/react';\n\n// Only colors having color variations and corresponding alpha\nexport type PrimaryColor = 'neon' | 'blue' | 'orange' | 'red' | 'green' | 'deepBlue' | 'grayBlue';\n\nconst defaultPrimary: PrimaryColor = 'blue';\n\nconst defaultPrimaryColor = getPrimaryColorInfo(defaultPrimary, lightColors);\n\nexport const colors: Record<string, Property.Color> = {\n ...lightColors,\n\n // Semantic colors\n primary: defaultPrimary,\n contentBg: '$00dp',\n hiContrast: '$deepBlue11',\n loContrast: 'white',\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(207, 10%, 82%)',\n};\n\nconst stitches = createStitches({\n theme: {\n colors: {\n ...colors,\n ...AccordionTheme.getLight(defaultPrimaryColor),\n ...BadgeTheme.getLight(defaultPrimaryColor),\n ...ButtonTheme.getLight(defaultPrimaryColor),\n ...ButtonSwitchTheme.getLight(defaultPrimaryColor),\n ...SwitchTheme.getLight(defaultPrimaryColor),\n ...CardTheme.getLight(defaultPrimaryColor),\n ...CheckboxTheme.getLight(defaultPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(defaultPrimaryColor),\n ...ListTheme.getLight(defaultPrimaryColor),\n ...RadioTheme.getLight(defaultPrimaryColor),\n ...InputTheme.getLight(defaultPrimaryColor),\n ...TableTheme.getLight(defaultPrimaryColor),\n ...TextTheme.getLight(defaultPrimaryColor),\n ...SelectTheme.getLight(defaultPrimaryColor),\n ...SkeletonTheme.getLight(defaultPrimaryColor),\n ...DialogTheme.getLight(defaultPrimaryColor),\n ...IconButtonTheme.getLight(defaultPrimaryColor),\n ...TooltipTheme.getLight(defaultPrimaryColor),\n ...TextareaTheme.getLight(defaultPrimaryColor),\n ...HeadingTheme.getLight(defaultPrimaryColor),\n ...SidePanelTheme.getLight(defaultPrimaryColor),\n },\n fonts: {\n rubik:\n 'Rubik, -apple-system, system-ui, \"Segoe UI\", \"Helvetica Neue\", helvetica, arial, sans-serif',\n },\n space: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '48px',\n 8: '64px',\n 9: '80px',\n },\n sizes: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '40px',\n 8: '48px',\n 9: '64px',\n 10: '80px',\n },\n fontSizes: {\n 0: '11px',\n 1: '12px',\n 2: '13px',\n 3: '14px',\n 4: '16px',\n 5: '18px',\n 6: '20px',\n 7: '22px',\n 8: '24px',\n 9: '26px',\n 10: '28px',\n 11: '32px',\n 12: '38px',\n },\n fontWeights: { light: 300, regular: 400, medium: 500, semiBold: 600, bold: 700 },\n radii: { 1: '4px', 2: '6px', 3: '8px', 4: '12px', round: '50%', pill: '9999px', button: '8px' },\n zIndices: { 1: '100', 2: '200', 3: '300', 4: '400', max: '999' },\n },\n media: {\n bp1: '(min-width: 520px) and (max-width: 899px)',\n bp2: '(min-width: 900px) and (max-width: 1199px)',\n bp3: '(min-width: 1200px) and (max-width: 1799px)',\n bp4: '(min-width: 1800px)',\n motion: '(prefers-reduced-motion)',\n hover: '(any-hover: hover)',\n dark: '(prefers-color-scheme: dark)',\n light: '(prefers-color-scheme: light)',\n },\n utils: {\n p: (value: Stitches.PropertyValue<'padding'>) => ({ padding: value }),\n pt: (value: Stitches.PropertyValue<'paddingTop'>) => ({ paddingTop: value }),\n pr: (value: Stitches.PropertyValue<'paddingRight'>) => ({ paddingRight: value }),\n pb: (value: Stitches.PropertyValue<'paddingBottom'>) => ({ paddingBottom: value }),\n pl: (value: Stitches.PropertyValue<'paddingLeft'>) => ({ paddingLeft: value }),\n px: (value: Stitches.PropertyValue<'paddingLeft'>) => ({\n paddingLeft: value,\n paddingRight: value,\n }),\n py: (value: Stitches.PropertyValue<'paddingTop'>) => ({\n paddingTop: value,\n paddingBottom: value,\n }),\n\n m: (value: Stitches.PropertyValue<'margin'>) => ({ margin: value }),\n mt: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value }),\n mr: (value: Stitches.PropertyValue<'marginRight'>) => ({ marginRight: value }),\n mb: (value: Stitches.PropertyValue<'marginBottom'>) => ({ marginBottom: value }),\n ml: (value: Stitches.PropertyValue<'marginLeft'>) => ({ marginLeft: value }),\n mx: (value: Stitches.PropertyValue<'marginLeft'>) => ({\n marginLeft: value,\n marginRight: value,\n }),\n my: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value, marginBottom: value }),\n\n ta: (value: Stitches.PropertyValue<'textAlign'>) => ({ textAlign: value }),\n\n fd: (value: Stitches.PropertyValue<'flexDirection'>) => ({ flexDirection: value }),\n fw: (value: Stitches.PropertyValue<'flexWrap'>) => ({ flexWrap: value }),\n\n ai: (value: Stitches.PropertyValue<'alignItems'>) => ({ alignItems: value }),\n ac: (value: Stitches.PropertyValue<'alignContent'>) => ({ alignContent: value }),\n jc: (value: Stitches.PropertyValue<'justifyContent'>) => ({ justifyContent: value }),\n as: (value: Stitches.PropertyValue<'alignSelf'>) => ({ alignSelf: value }),\n fg: (value: Stitches.PropertyValue<'flexGrow'>) => ({ flexGrow: value }),\n fs: (value: Stitches.PropertyValue<'flexShrink'>) => ({ flexShrink: value }),\n fb: (value: Stitches.PropertyValue<'flexBasis'>) => ({ flexBasis: value }),\n\n bc: (value: Stitches.PropertyValue<'backgroundColor'>) => ({ backgroundColor: value }),\n\n br: (value: Stitches.PropertyValue<'borderRadius'>) => ({ borderRadius: value }),\n btrr: (value: Stitches.PropertyValue<'borderTopRightRadius'>) => ({\n borderTopRightRadius: value,\n }),\n bbrr: (value: Stitches.PropertyValue<'borderBottomRightRadius'>) => ({\n borderBottomRightRadius: value,\n }),\n bblr: (value: Stitches.PropertyValue<'borderBottomLeftRadius'>) => ({\n borderBottomLeftRadius: value,\n }),\n btlr: (value: Stitches.PropertyValue<'borderTopLeftRadius'>) => ({\n borderTopLeftRadius: value,\n }),\n\n bs: (value: Stitches.PropertyValue<'boxShadow'>) => ({ boxShadow: value }),\n\n c: (value: Stitches.PropertyValue<'color'>) => ({ color: value }),\n\n lh: (value: Stitches.PropertyValue<'lineHeight'>) => ({ lineHeight: value }),\n\n ox: (value: Stitches.PropertyValue<'overflowX'>) => ({ overflowX: value }),\n oy: (value: Stitches.PropertyValue<'overflowY'>) => ({ overflowY: value }),\n\n pe: (value: Stitches.PropertyValue<'pointerEvents'>) => ({ pointerEvents: value }),\n us: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n userSelect: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n size: (value: Stitches.PropertyValue<'width'>) => ({ width: value, height: value }),\n\n appearance: (value: Stitches.PropertyValue<'appearance'>) => ({\n WebkitAppearance: value,\n appearance: value,\n }),\n backgroundClip: (value: Stitches.PropertyValue<'backgroundClip'>) => ({\n WebkitBackgroundClip: value,\n backgroundClip: value,\n }),\n },\n});\n\nexport type CSS<T = typeof stitches.config> = StitchesCSS<T>;\n\nexport const { styled, css, createTheme, getCssText, globalCss, keyframes, config } = stitches;\n\n// @ts-expect-error\nexport const utils = config.utils;\n\nexport const darkTheme = (primary: PrimaryColor, name = 'dark') => {\n const darkPrimaryColor = getPrimaryColorInfo(primary, darkColors);\n\n return createTheme(name, {\n colors: {\n ...darkColors,\n\n // Semantic colors\n primary: darkPrimaryColor.token,\n contentBg: '$00dp',\n hiContrast: 'white',\n loContrast: '$deepBlue2',\n divider: 'hsl(209, 29%, 19%)',\n ...AccordionTheme.getDark(darkPrimaryColor),\n ...BadgeTheme.getDark(darkPrimaryColor),\n ...ButtonTheme.getDark(darkPrimaryColor),\n ...ButtonSwitchTheme.getDark(darkPrimaryColor),\n ...IconButtonTheme.getDark(darkPrimaryColor),\n ...SwitchTheme.getDark(darkPrimaryColor),\n ...CardTheme.getDark(darkPrimaryColor),\n ...CheckboxTheme.getDark(darkPrimaryColor),\n ...CodeBlockTheme.getDark(),\n ...LinkTheme.getDark(darkPrimaryColor),\n ...ListTheme.getDark(darkPrimaryColor),\n ...RadioTheme.getDark(darkPrimaryColor),\n ...InputTheme.getDark(darkPrimaryColor),\n ...TableTheme.getDark(darkPrimaryColor),\n ...TextTheme.getDark(darkPrimaryColor),\n ...SelectTheme.getDark(darkPrimaryColor),\n ...SkeletonTheme.getDark(darkPrimaryColor),\n ...DialogTheme.getDark(darkPrimaryColor),\n ...NavigationTheme.getDark(darkPrimaryColor),\n ...TooltipTheme.getDark(darkPrimaryColor),\n ...TextareaTheme.getDark(darkPrimaryColor),\n ...HeadingTheme.getDark(darkPrimaryColor),\n ...SidePanelTheme.getDark(darkPrimaryColor),\n },\n });\n};\n\nexport const lightTheme = (primary: PrimaryColor, name = 'light') => {\n const lightPrimaryColor = getPrimaryColorInfo(primary, lightColors);\n\n return createTheme(name, {\n colors: {\n primary: lightPrimaryColor.token,\n ...AccordionTheme.getLight(lightPrimaryColor),\n ...BadgeTheme.getLight(lightPrimaryColor),\n ...ButtonTheme.getLight(lightPrimaryColor),\n ...ButtonSwitchTheme.getLight(lightPrimaryColor),\n ...IconButtonTheme.getLight(lightPrimaryColor),\n ...SwitchTheme.getLight(lightPrimaryColor),\n ...CardTheme.getLight(lightPrimaryColor),\n ...CheckboxTheme.getLight(lightPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(lightPrimaryColor),\n ...ListTheme.getLight(lightPrimaryColor),\n ...RadioTheme.getLight(lightPrimaryColor),\n ...InputTheme.getLight(lightPrimaryColor),\n ...TableTheme.getLight(lightPrimaryColor),\n ...TextTheme.getLight(lightPrimaryColor),\n ...SelectTheme.getLight(lightPrimaryColor),\n ...SkeletonTheme.getLight(lightPrimaryColor),\n ...DialogTheme.getLight(lightPrimaryColor),\n ...NavigationTheme.getLight(lightPrimaryColor),\n ...TooltipTheme.getLight(lightPrimaryColor),\n ...TextareaTheme.getLight(lightPrimaryColor),\n ...HeadingTheme.getLight(lightPrimaryColor),\n ...SidePanelTheme.getLight(lightPrimaryColor),\n },\n });\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"stitches.config.cjs","names":[],"sources":["../stitches.config.ts"],"sourcesContent":["// @ts-nocheck\nimport type * as Stitches from '@stitches/react';\nimport { createStitches, CSS as StitchesCSS } from '@stitches/react';\nimport { Property } from '@stitches/react/types/css';\n\nimport { darkColors, lightColors } from './colors';\nimport { Theme as AccordionTheme } from './components/Accordion/Accordion.themes';\nimport { Theme as BadgeTheme } from './components/Badge/Badge.themes';\nimport { Theme as ButtonTheme } from './components/Button/Button.themes';\nimport { Theme as ButtonSwitchTheme } from './components/ButtonSwitch/ButtonSwitch.themes';\nimport { Theme as CardTheme } from './components/Card/Card.themes';\nimport { Theme as CheckboxTheme } from './components/Checkbox/Checkbox.themes';\nimport { Theme as CodeBlockTheme } from './components/CodeBlock/CodeBlock.themes';\nimport { Theme as DialogTheme } from './components/Dialog/Dialog.themes';\nimport { Theme as HeadingTheme } from './components/Heading/Heading.themes';\nimport { Theme as IconButtonTheme } from './components/IconButton/IconButton.themes';\nimport { Theme as InputTheme } from './components/Input/Input.themes';\nimport { Theme as LinkTheme } from './components/Link/Link.themes';\nimport { Theme as ListTheme } from './components/List/List.themes';\nimport { Theme as NavigationTheme } from './components/Navigation/Navigation.themes';\nimport { Theme as RadioTheme } from './components/Radio/Radio.themes';\nimport { Theme as SelectTheme } from './components/Select/Select.themes';\nimport { Theme as SidePanelTheme } from './components/SidePanel/SidePanel.themes';\nimport { Theme as SkeletonTheme } from './components/Skeleton/Skeleton.themes';\nimport { Theme as SwitchTheme } from './components/Switch/Switch.themes';\nimport { Theme as TableTheme } from './components/Table/Table.themes';\nimport { Theme as TextTheme } from './components/Text/Text.themes';\nimport { Theme as TextareaTheme } from './components/Textarea/Textarea.themes';\nimport { Theme as TooltipTheme } from './components/Tooltip/Tooltip.themes';\nimport getPrimaryColorInfo from './utils/getPrimaryColorInfo';\n\nexport type { VariantProps } from '@stitches/react';\n\n// Only colors having color variations and corresponding alpha\nexport type PrimaryColor = 'neon' | 'blue' | 'orange' | 'red' | 'green' | 'deepBlue' | 'grayBlue';\n\nconst defaultPrimary: PrimaryColor = 'blue';\n\nconst defaultPrimaryColor = getPrimaryColorInfo(defaultPrimary, lightColors);\n\nexport const colors: Record<string, Property.Color> = {\n ...lightColors,\n\n // Semantic colors\n primary: defaultPrimary,\n contentBg: '$00dp',\n hiContrast: '$deepBlue11',\n loContrast: 'white',\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(207, 10%, 82%)',\n};\n\nconst stitches = createStitches({\n theme: {\n colors: {\n ...colors,\n ...AccordionTheme.getLight(defaultPrimaryColor),\n ...BadgeTheme.getLight(defaultPrimaryColor),\n ...ButtonTheme.getLight(defaultPrimaryColor),\n ...ButtonSwitchTheme.getLight(defaultPrimaryColor),\n ...SwitchTheme.getLight(defaultPrimaryColor),\n ...CardTheme.getLight(defaultPrimaryColor),\n ...CheckboxTheme.getLight(defaultPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(defaultPrimaryColor),\n ...ListTheme.getLight(defaultPrimaryColor),\n ...RadioTheme.getLight(defaultPrimaryColor),\n ...InputTheme.getLight(defaultPrimaryColor),\n ...TableTheme.getLight(defaultPrimaryColor),\n ...TextTheme.getLight(defaultPrimaryColor),\n ...SelectTheme.getLight(defaultPrimaryColor),\n ...SkeletonTheme.getLight(defaultPrimaryColor),\n ...DialogTheme.getLight(defaultPrimaryColor),\n ...IconButtonTheme.getLight(defaultPrimaryColor),\n ...TooltipTheme.getLight(defaultPrimaryColor),\n ...TextareaTheme.getLight(defaultPrimaryColor),\n ...HeadingTheme.getLight(defaultPrimaryColor),\n ...SidePanelTheme.getLight(defaultPrimaryColor),\n },\n fonts: {\n rubik:\n 'Rubik, -apple-system, system-ui, \"Segoe UI\", \"Helvetica Neue\", helvetica, arial, sans-serif',\n },\n space: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '48px',\n 8: '64px',\n 9: '80px',\n },\n sizes: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '40px',\n 8: '48px',\n 9: '64px',\n 10: '80px',\n },\n fontSizes: {\n 0: '11px',\n 1: '12px',\n 2: '13px',\n 3: '14px',\n 4: '16px',\n 5: '18px',\n 6: '20px',\n 7: '22px',\n 8: '24px',\n 9: '26px',\n 10: '28px',\n 11: '32px',\n 12: '38px',\n },\n fontWeights: { light: 300, regular: 400, medium: 500, semiBold: 600, bold: 700 },\n radii: { 1: '4px', 2: '6px', 3: '8px', 4: '12px', round: '50%', pill: '9999px', button: '8px' },\n zIndices: { 1: '100', 2: '200', 3: '300', 4: '400', max: '999' },\n },\n media: {\n bp1: '(min-width: 520px) and (max-width: 899px)',\n bp2: '(min-width: 900px) and (max-width: 1199px)',\n bp3: '(min-width: 1200px) and (max-width: 1799px)',\n bp4: '(min-width: 1800px)',\n motion: '(prefers-reduced-motion)',\n hover: '(any-hover: hover)',\n dark: '(prefers-color-scheme: dark)',\n light: '(prefers-color-scheme: light)',\n },\n utils: {\n p: (value: Stitches.PropertyValue<'padding'>) => ({ padding: value }),\n pt: (value: Stitches.PropertyValue<'paddingTop'>) => ({ paddingTop: value }),\n pr: (value: Stitches.PropertyValue<'paddingRight'>) => ({ paddingRight: value }),\n pb: (value: Stitches.PropertyValue<'paddingBottom'>) => ({ paddingBottom: value }),\n pl: (value: Stitches.PropertyValue<'paddingLeft'>) => ({ paddingLeft: value }),\n px: (value: Stitches.PropertyValue<'paddingLeft'>) => ({\n paddingLeft: value,\n paddingRight: value,\n }),\n py: (value: Stitches.PropertyValue<'paddingTop'>) => ({\n paddingTop: value,\n paddingBottom: value,\n }),\n\n m: (value: Stitches.PropertyValue<'margin'>) => ({ margin: value }),\n mt: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value }),\n mr: (value: Stitches.PropertyValue<'marginRight'>) => ({ marginRight: value }),\n mb: (value: Stitches.PropertyValue<'marginBottom'>) => ({ marginBottom: value }),\n ml: (value: Stitches.PropertyValue<'marginLeft'>) => ({ marginLeft: value }),\n mx: (value: Stitches.PropertyValue<'marginLeft'>) => ({\n marginLeft: value,\n marginRight: value,\n }),\n my: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value, marginBottom: value }),\n\n ta: (value: Stitches.PropertyValue<'textAlign'>) => ({ textAlign: value }),\n\n fd: (value: Stitches.PropertyValue<'flexDirection'>) => ({ flexDirection: value }),\n fw: (value: Stitches.PropertyValue<'flexWrap'>) => ({ flexWrap: value }),\n\n ai: (value: Stitches.PropertyValue<'alignItems'>) => ({ alignItems: value }),\n ac: (value: Stitches.PropertyValue<'alignContent'>) => ({ alignContent: value }),\n jc: (value: Stitches.PropertyValue<'justifyContent'>) => ({ justifyContent: value }),\n as: (value: Stitches.PropertyValue<'alignSelf'>) => ({ alignSelf: value }),\n fg: (value: Stitches.PropertyValue<'flexGrow'>) => ({ flexGrow: value }),\n fs: (value: Stitches.PropertyValue<'flexShrink'>) => ({ flexShrink: value }),\n fb: (value: Stitches.PropertyValue<'flexBasis'>) => ({ flexBasis: value }),\n\n bc: (value: Stitches.PropertyValue<'backgroundColor'>) => ({ backgroundColor: value }),\n\n br: (value: Stitches.PropertyValue<'borderRadius'>) => ({ borderRadius: value }),\n btrr: (value: Stitches.PropertyValue<'borderTopRightRadius'>) => ({\n borderTopRightRadius: value,\n }),\n bbrr: (value: Stitches.PropertyValue<'borderBottomRightRadius'>) => ({\n borderBottomRightRadius: value,\n }),\n bblr: (value: Stitches.PropertyValue<'borderBottomLeftRadius'>) => ({\n borderBottomLeftRadius: value,\n }),\n btlr: (value: Stitches.PropertyValue<'borderTopLeftRadius'>) => ({\n borderTopLeftRadius: value,\n }),\n\n bs: (value: Stitches.PropertyValue<'boxShadow'>) => ({ boxShadow: value }),\n\n c: (value: Stitches.PropertyValue<'color'>) => ({ color: value }),\n\n lh: (value: Stitches.PropertyValue<'lineHeight'>) => ({ lineHeight: value }),\n\n ox: (value: Stitches.PropertyValue<'overflowX'>) => ({ overflowX: value }),\n oy: (value: Stitches.PropertyValue<'overflowY'>) => ({ overflowY: value }),\n\n pe: (value: Stitches.PropertyValue<'pointerEvents'>) => ({ pointerEvents: value }),\n us: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n userSelect: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n size: (value: Stitches.PropertyValue<'width'>) => ({ width: value, height: value }),\n\n appearance: (value: Stitches.PropertyValue<'appearance'>) => ({\n WebkitAppearance: value,\n appearance: value,\n }),\n backgroundClip: (value: Stitches.PropertyValue<'backgroundClip'>) => ({\n WebkitBackgroundClip: value,\n backgroundClip: value,\n }),\n },\n});\n\nexport type CSS<T = typeof stitches.config> = StitchesCSS<T>;\n\nexport const { styled, css, createTheme, getCssText, globalCss, keyframes, config } = stitches;\n\n// @ts-expect-error\nexport const utils = config.utils;\n\nexport const darkTheme = (primary: PrimaryColor, name = 'dark') => {\n const darkPrimaryColor = getPrimaryColorInfo(primary, darkColors);\n\n return createTheme(name, {\n colors: {\n ...darkColors,\n\n // Semantic colors\n primary: darkPrimaryColor.token,\n contentBg: '$00dp',\n hiContrast: 'white',\n loContrast: '$deepBlue2',\n divider: 'hsl(209, 29%, 19%)',\n ...AccordionTheme.getDark(darkPrimaryColor),\n ...BadgeTheme.getDark(darkPrimaryColor),\n ...ButtonTheme.getDark(darkPrimaryColor),\n ...ButtonSwitchTheme.getDark(darkPrimaryColor),\n ...IconButtonTheme.getDark(darkPrimaryColor),\n ...SwitchTheme.getDark(darkPrimaryColor),\n ...CardTheme.getDark(darkPrimaryColor),\n ...CheckboxTheme.getDark(darkPrimaryColor),\n ...CodeBlockTheme.getDark(),\n ...LinkTheme.getDark(darkPrimaryColor),\n ...ListTheme.getDark(darkPrimaryColor),\n ...RadioTheme.getDark(darkPrimaryColor),\n ...InputTheme.getDark(darkPrimaryColor),\n ...TableTheme.getDark(darkPrimaryColor),\n ...TextTheme.getDark(darkPrimaryColor),\n ...SelectTheme.getDark(darkPrimaryColor),\n ...SkeletonTheme.getDark(darkPrimaryColor),\n ...DialogTheme.getDark(darkPrimaryColor),\n ...NavigationTheme.getDark(darkPrimaryColor),\n ...TooltipTheme.getDark(darkPrimaryColor),\n ...TextareaTheme.getDark(darkPrimaryColor),\n ...HeadingTheme.getDark(darkPrimaryColor),\n ...SidePanelTheme.getDark(darkPrimaryColor),\n },\n });\n};\n\nexport const lightTheme = (primary: PrimaryColor, name = 'light') => {\n const lightPrimaryColor = getPrimaryColorInfo(primary, lightColors);\n\n return createTheme(name, {\n colors: {\n primary: lightPrimaryColor.token,\n ...AccordionTheme.getLight(lightPrimaryColor),\n ...BadgeTheme.getLight(lightPrimaryColor),\n ...ButtonTheme.getLight(lightPrimaryColor),\n ...ButtonSwitchTheme.getLight(lightPrimaryColor),\n ...IconButtonTheme.getLight(lightPrimaryColor),\n ...SwitchTheme.getLight(lightPrimaryColor),\n ...CardTheme.getLight(lightPrimaryColor),\n ...CheckboxTheme.getLight(lightPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(lightPrimaryColor),\n ...ListTheme.getLight(lightPrimaryColor),\n ...RadioTheme.getLight(lightPrimaryColor),\n ...InputTheme.getLight(lightPrimaryColor),\n ...TableTheme.getLight(lightPrimaryColor),\n ...TextTheme.getLight(lightPrimaryColor),\n ...SelectTheme.getLight(lightPrimaryColor),\n ...SkeletonTheme.getLight(lightPrimaryColor),\n ...DialogTheme.getLight(lightPrimaryColor),\n ...NavigationTheme.getLight(lightPrimaryColor),\n ...TooltipTheme.getLight(lightPrimaryColor),\n ...TextareaTheme.getLight(lightPrimaryColor),\n ...HeadingTheme.getLight(lightPrimaryColor),\n ...SidePanelTheme.getLight(lightPrimaryColor),\n },\n });\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stitches.config.js","names":[],"sources":["../stitches.config.ts"],"sourcesContent":["// @ts-nocheck\nimport type * as Stitches from '@stitches/react';\nimport { createStitches, CSS as StitchesCSS } from '@stitches/react';\nimport { Property } from '@stitches/react/types/css';\n\nimport { darkColors, lightColors } from './colors';\nimport { Theme as AccordionTheme } from './components/Accordion/Accordion.themes';\nimport { Theme as BadgeTheme } from './components/Badge/Badge.themes';\nimport { Theme as ButtonTheme } from './components/Button/Button.themes';\nimport { Theme as ButtonSwitchTheme } from './components/ButtonSwitch/ButtonSwitch.themes';\nimport { Theme as CardTheme } from './components/Card/Card.themes';\nimport { Theme as CheckboxTheme } from './components/Checkbox/Checkbox.themes';\nimport { Theme as CodeBlockTheme } from './components/CodeBlock/CodeBlock.themes';\nimport { Theme as DialogTheme } from './components/Dialog/Dialog.themes';\nimport { Theme as HeadingTheme } from './components/Heading/Heading.themes';\nimport { Theme as IconButtonTheme } from './components/IconButton/IconButton.themes';\nimport { Theme as InputTheme } from './components/Input/Input.themes';\nimport { Theme as LinkTheme } from './components/Link/Link.themes';\nimport { Theme as ListTheme } from './components/List/List.themes';\nimport { Theme as NavigationTheme } from './components/Navigation/Navigation.themes';\nimport { Theme as RadioTheme } from './components/Radio/Radio.themes';\nimport { Theme as SelectTheme } from './components/Select/Select.themes';\nimport { Theme as SidePanelTheme } from './components/SidePanel/SidePanel.themes';\nimport { Theme as SkeletonTheme } from './components/Skeleton/Skeleton.themes';\nimport { Theme as SwitchTheme } from './components/Switch/Switch.themes';\nimport { Theme as TableTheme } from './components/Table/Table.themes';\nimport { Theme as TextTheme } from './components/Text/Text.themes';\nimport { Theme as TextareaTheme } from './components/Textarea/Textarea.themes';\nimport { Theme as TooltipTheme } from './components/Tooltip/Tooltip.themes';\nimport getPrimaryColorInfo from './utils/getPrimaryColorInfo';\n\nexport type { VariantProps } from '@stitches/react';\n\n// Only colors having color variations and corresponding alpha\nexport type PrimaryColor = 'neon' | 'blue' | 'orange' | 'red' | 'green' | 'deepBlue' | 'grayBlue';\n\nconst defaultPrimary: PrimaryColor = 'blue';\n\nconst defaultPrimaryColor = getPrimaryColorInfo(defaultPrimary, lightColors);\n\nexport const colors: Record<string, Property.Color> = {\n ...lightColors,\n\n // Semantic colors\n primary: defaultPrimary,\n contentBg: '$00dp',\n hiContrast: '$deepBlue11',\n loContrast: 'white',\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(207, 10%, 82%)',\n};\n\nconst stitches = createStitches({\n theme: {\n colors: {\n ...colors,\n ...AccordionTheme.getLight(defaultPrimaryColor),\n ...BadgeTheme.getLight(defaultPrimaryColor),\n ...ButtonTheme.getLight(defaultPrimaryColor),\n ...ButtonSwitchTheme.getLight(defaultPrimaryColor),\n ...SwitchTheme.getLight(defaultPrimaryColor),\n ...CardTheme.getLight(defaultPrimaryColor),\n ...CheckboxTheme.getLight(defaultPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(defaultPrimaryColor),\n ...ListTheme.getLight(defaultPrimaryColor),\n ...RadioTheme.getLight(defaultPrimaryColor),\n ...InputTheme.getLight(defaultPrimaryColor),\n ...TableTheme.getLight(defaultPrimaryColor),\n ...TextTheme.getLight(defaultPrimaryColor),\n ...SelectTheme.getLight(defaultPrimaryColor),\n ...SkeletonTheme.getLight(defaultPrimaryColor),\n ...DialogTheme.getLight(defaultPrimaryColor),\n ...IconButtonTheme.getLight(defaultPrimaryColor),\n ...TooltipTheme.getLight(defaultPrimaryColor),\n ...TextareaTheme.getLight(defaultPrimaryColor),\n ...HeadingTheme.getLight(defaultPrimaryColor),\n ...SidePanelTheme.getLight(defaultPrimaryColor),\n },\n fonts: {\n rubik:\n 'Rubik, -apple-system, system-ui, \"Segoe UI\", \"Helvetica Neue\", helvetica, arial, sans-serif',\n },\n space: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '48px',\n 8: '64px',\n 9: '80px',\n },\n sizes: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '40px',\n 8: '48px',\n 9: '64px',\n 10: '80px',\n },\n fontSizes: {\n 0: '11px',\n 1: '12px',\n 2: '13px',\n 3: '14px',\n 4: '16px',\n 5: '18px',\n 6: '20px',\n 7: '22px',\n 8: '24px',\n 9: '26px',\n 10: '28px',\n 11: '32px',\n 12: '38px',\n },\n fontWeights: { light: 300, regular: 400, medium: 500, semiBold: 600, bold: 700 },\n radii: { 1: '4px', 2: '6px', 3: '8px', 4: '12px', round: '50%', pill: '9999px', button: '8px' },\n zIndices: { 1: '100', 2: '200', 3: '300', 4: '400', max: '999' },\n },\n media: {\n bp1: '(min-width: 520px) and (max-width: 899px)',\n bp2: '(min-width: 900px) and (max-width: 1199px)',\n bp3: '(min-width: 1200px) and (max-width: 1799px)',\n bp4: '(min-width: 1800px)',\n motion: '(prefers-reduced-motion)',\n hover: '(any-hover: hover)',\n dark: '(prefers-color-scheme: dark)',\n light: '(prefers-color-scheme: light)',\n },\n utils: {\n p: (value: Stitches.PropertyValue<'padding'>) => ({ padding: value }),\n pt: (value: Stitches.PropertyValue<'paddingTop'>) => ({ paddingTop: value }),\n pr: (value: Stitches.PropertyValue<'paddingRight'>) => ({ paddingRight: value }),\n pb: (value: Stitches.PropertyValue<'paddingBottom'>) => ({ paddingBottom: value }),\n pl: (value: Stitches.PropertyValue<'paddingLeft'>) => ({ paddingLeft: value }),\n px: (value: Stitches.PropertyValue<'paddingLeft'>) => ({\n paddingLeft: value,\n paddingRight: value,\n }),\n py: (value: Stitches.PropertyValue<'paddingTop'>) => ({\n paddingTop: value,\n paddingBottom: value,\n }),\n\n m: (value: Stitches.PropertyValue<'margin'>) => ({ margin: value }),\n mt: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value }),\n mr: (value: Stitches.PropertyValue<'marginRight'>) => ({ marginRight: value }),\n mb: (value: Stitches.PropertyValue<'marginBottom'>) => ({ marginBottom: value }),\n ml: (value: Stitches.PropertyValue<'marginLeft'>) => ({ marginLeft: value }),\n mx: (value: Stitches.PropertyValue<'marginLeft'>) => ({\n marginLeft: value,\n marginRight: value,\n }),\n my: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value, marginBottom: value }),\n\n ta: (value: Stitches.PropertyValue<'textAlign'>) => ({ textAlign: value }),\n\n fd: (value: Stitches.PropertyValue<'flexDirection'>) => ({ flexDirection: value }),\n fw: (value: Stitches.PropertyValue<'flexWrap'>) => ({ flexWrap: value }),\n\n ai: (value: Stitches.PropertyValue<'alignItems'>) => ({ alignItems: value }),\n ac: (value: Stitches.PropertyValue<'alignContent'>) => ({ alignContent: value }),\n jc: (value: Stitches.PropertyValue<'justifyContent'>) => ({ justifyContent: value }),\n as: (value: Stitches.PropertyValue<'alignSelf'>) => ({ alignSelf: value }),\n fg: (value: Stitches.PropertyValue<'flexGrow'>) => ({ flexGrow: value }),\n fs: (value: Stitches.PropertyValue<'flexShrink'>) => ({ flexShrink: value }),\n fb: (value: Stitches.PropertyValue<'flexBasis'>) => ({ flexBasis: value }),\n\n bc: (value: Stitches.PropertyValue<'backgroundColor'>) => ({ backgroundColor: value }),\n\n br: (value: Stitches.PropertyValue<'borderRadius'>) => ({ borderRadius: value }),\n btrr: (value: Stitches.PropertyValue<'borderTopRightRadius'>) => ({\n borderTopRightRadius: value,\n }),\n bbrr: (value: Stitches.PropertyValue<'borderBottomRightRadius'>) => ({\n borderBottomRightRadius: value,\n }),\n bblr: (value: Stitches.PropertyValue<'borderBottomLeftRadius'>) => ({\n borderBottomLeftRadius: value,\n }),\n btlr: (value: Stitches.PropertyValue<'borderTopLeftRadius'>) => ({\n borderTopLeftRadius: value,\n }),\n\n bs: (value: Stitches.PropertyValue<'boxShadow'>) => ({ boxShadow: value }),\n\n c: (value: Stitches.PropertyValue<'color'>) => ({ color: value }),\n\n lh: (value: Stitches.PropertyValue<'lineHeight'>) => ({ lineHeight: value }),\n\n ox: (value: Stitches.PropertyValue<'overflowX'>) => ({ overflowX: value }),\n oy: (value: Stitches.PropertyValue<'overflowY'>) => ({ overflowY: value }),\n\n pe: (value: Stitches.PropertyValue<'pointerEvents'>) => ({ pointerEvents: value }),\n us: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n userSelect: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n size: (value: Stitches.PropertyValue<'width'>) => ({ width: value, height: value }),\n\n appearance: (value: Stitches.PropertyValue<'appearance'>) => ({\n WebkitAppearance: value,\n appearance: value,\n }),\n backgroundClip: (value: Stitches.PropertyValue<'backgroundClip'>) => ({\n WebkitBackgroundClip: value,\n backgroundClip: value,\n }),\n },\n});\n\nexport type CSS<T = typeof stitches.config> = StitchesCSS<T>;\n\nexport const { styled, css, createTheme, getCssText, globalCss, keyframes, config } = stitches;\n\n// @ts-expect-error\nexport const utils = config.utils;\n\nexport const darkTheme = (primary: PrimaryColor, name = 'dark') => {\n const darkPrimaryColor = getPrimaryColorInfo(primary, darkColors);\n\n return createTheme(name, {\n colors: {\n ...darkColors,\n\n // Semantic colors\n primary: darkPrimaryColor.token,\n contentBg: '$00dp',\n hiContrast: 'white',\n loContrast: '$deepBlue2',\n divider: 'hsl(209, 29%, 19%)',\n ...AccordionTheme.getDark(darkPrimaryColor),\n ...BadgeTheme.getDark(darkPrimaryColor),\n ...ButtonTheme.getDark(darkPrimaryColor),\n ...ButtonSwitchTheme.getDark(darkPrimaryColor),\n ...IconButtonTheme.getDark(darkPrimaryColor),\n ...SwitchTheme.getDark(darkPrimaryColor),\n ...CardTheme.getDark(darkPrimaryColor),\n ...CheckboxTheme.getDark(darkPrimaryColor),\n ...CodeBlockTheme.getDark(),\n ...LinkTheme.getDark(darkPrimaryColor),\n ...ListTheme.getDark(darkPrimaryColor),\n ...RadioTheme.getDark(darkPrimaryColor),\n ...InputTheme.getDark(darkPrimaryColor),\n ...TableTheme.getDark(darkPrimaryColor),\n ...TextTheme.getDark(darkPrimaryColor),\n ...SelectTheme.getDark(darkPrimaryColor),\n ...SkeletonTheme.getDark(darkPrimaryColor),\n ...DialogTheme.getDark(darkPrimaryColor),\n ...NavigationTheme.getDark(darkPrimaryColor),\n ...TooltipTheme.getDark(darkPrimaryColor),\n ...TextareaTheme.getDark(darkPrimaryColor),\n ...HeadingTheme.getDark(darkPrimaryColor),\n ...SidePanelTheme.getDark(darkPrimaryColor),\n },\n });\n};\n\nexport const lightTheme = (primary: PrimaryColor, name = 'light') => {\n const lightPrimaryColor = getPrimaryColorInfo(primary, lightColors);\n\n return createTheme(name, {\n colors: {\n primary: lightPrimaryColor.token,\n ...AccordionTheme.getLight(lightPrimaryColor),\n ...BadgeTheme.getLight(lightPrimaryColor),\n ...ButtonTheme.getLight(lightPrimaryColor),\n ...ButtonSwitchTheme.getLight(lightPrimaryColor),\n ...IconButtonTheme.getLight(lightPrimaryColor),\n ...SwitchTheme.getLight(lightPrimaryColor),\n ...CardTheme.getLight(lightPrimaryColor),\n ...CheckboxTheme.getLight(lightPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(lightPrimaryColor),\n ...ListTheme.getLight(lightPrimaryColor),\n ...RadioTheme.getLight(lightPrimaryColor),\n ...InputTheme.getLight(lightPrimaryColor),\n ...TableTheme.getLight(lightPrimaryColor),\n ...TextTheme.getLight(lightPrimaryColor),\n ...SelectTheme.getLight(lightPrimaryColor),\n ...SkeletonTheme.getLight(lightPrimaryColor),\n ...DialogTheme.getLight(lightPrimaryColor),\n ...NavigationTheme.getLight(lightPrimaryColor),\n ...TooltipTheme.getLight(lightPrimaryColor),\n ...TextareaTheme.getLight(lightPrimaryColor),\n ...HeadingTheme.getLight(lightPrimaryColor),\n ...SidePanelTheme.getLight(lightPrimaryColor),\n },\n });\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"stitches.config.js","names":[],"sources":["../stitches.config.ts"],"sourcesContent":["// @ts-nocheck\nimport type * as Stitches from '@stitches/react';\nimport { createStitches, CSS as StitchesCSS } from '@stitches/react';\nimport { Property } from '@stitches/react/types/css';\n\nimport { darkColors, lightColors } from './colors';\nimport { Theme as AccordionTheme } from './components/Accordion/Accordion.themes';\nimport { Theme as BadgeTheme } from './components/Badge/Badge.themes';\nimport { Theme as ButtonTheme } from './components/Button/Button.themes';\nimport { Theme as ButtonSwitchTheme } from './components/ButtonSwitch/ButtonSwitch.themes';\nimport { Theme as CardTheme } from './components/Card/Card.themes';\nimport { Theme as CheckboxTheme } from './components/Checkbox/Checkbox.themes';\nimport { Theme as CodeBlockTheme } from './components/CodeBlock/CodeBlock.themes';\nimport { Theme as DialogTheme } from './components/Dialog/Dialog.themes';\nimport { Theme as HeadingTheme } from './components/Heading/Heading.themes';\nimport { Theme as IconButtonTheme } from './components/IconButton/IconButton.themes';\nimport { Theme as InputTheme } from './components/Input/Input.themes';\nimport { Theme as LinkTheme } from './components/Link/Link.themes';\nimport { Theme as ListTheme } from './components/List/List.themes';\nimport { Theme as NavigationTheme } from './components/Navigation/Navigation.themes';\nimport { Theme as RadioTheme } from './components/Radio/Radio.themes';\nimport { Theme as SelectTheme } from './components/Select/Select.themes';\nimport { Theme as SidePanelTheme } from './components/SidePanel/SidePanel.themes';\nimport { Theme as SkeletonTheme } from './components/Skeleton/Skeleton.themes';\nimport { Theme as SwitchTheme } from './components/Switch/Switch.themes';\nimport { Theme as TableTheme } from './components/Table/Table.themes';\nimport { Theme as TextTheme } from './components/Text/Text.themes';\nimport { Theme as TextareaTheme } from './components/Textarea/Textarea.themes';\nimport { Theme as TooltipTheme } from './components/Tooltip/Tooltip.themes';\nimport getPrimaryColorInfo from './utils/getPrimaryColorInfo';\n\nexport type { VariantProps } from '@stitches/react';\n\n// Only colors having color variations and corresponding alpha\nexport type PrimaryColor = 'neon' | 'blue' | 'orange' | 'red' | 'green' | 'deepBlue' | 'grayBlue';\n\nconst defaultPrimary: PrimaryColor = 'blue';\n\nconst defaultPrimaryColor = getPrimaryColorInfo(defaultPrimary, lightColors);\n\nexport const colors: Record<string, Property.Color> = {\n ...lightColors,\n\n // Semantic colors\n primary: defaultPrimary,\n contentBg: '$00dp',\n hiContrast: '$deepBlue11',\n loContrast: 'white',\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(207, 10%, 82%)',\n};\n\nconst stitches = createStitches({\n theme: {\n colors: {\n ...colors,\n ...AccordionTheme.getLight(defaultPrimaryColor),\n ...BadgeTheme.getLight(defaultPrimaryColor),\n ...ButtonTheme.getLight(defaultPrimaryColor),\n ...ButtonSwitchTheme.getLight(defaultPrimaryColor),\n ...SwitchTheme.getLight(defaultPrimaryColor),\n ...CardTheme.getLight(defaultPrimaryColor),\n ...CheckboxTheme.getLight(defaultPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(defaultPrimaryColor),\n ...ListTheme.getLight(defaultPrimaryColor),\n ...RadioTheme.getLight(defaultPrimaryColor),\n ...InputTheme.getLight(defaultPrimaryColor),\n ...TableTheme.getLight(defaultPrimaryColor),\n ...TextTheme.getLight(defaultPrimaryColor),\n ...SelectTheme.getLight(defaultPrimaryColor),\n ...SkeletonTheme.getLight(defaultPrimaryColor),\n ...DialogTheme.getLight(defaultPrimaryColor),\n ...IconButtonTheme.getLight(defaultPrimaryColor),\n ...TooltipTheme.getLight(defaultPrimaryColor),\n ...TextareaTheme.getLight(defaultPrimaryColor),\n ...HeadingTheme.getLight(defaultPrimaryColor),\n ...SidePanelTheme.getLight(defaultPrimaryColor),\n },\n fonts: {\n rubik:\n 'Rubik, -apple-system, system-ui, \"Segoe UI\", \"Helvetica Neue\", helvetica, arial, sans-serif',\n },\n space: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '48px',\n 8: '64px',\n 9: '80px',\n },\n sizes: {\n 1: '4px',\n 2: '8px',\n 3: '16px',\n 4: '20px',\n 5: '24px',\n 6: '32px',\n 7: '40px',\n 8: '48px',\n 9: '64px',\n 10: '80px',\n },\n fontSizes: {\n 0: '11px',\n 1: '12px',\n 2: '13px',\n 3: '14px',\n 4: '16px',\n 5: '18px',\n 6: '20px',\n 7: '22px',\n 8: '24px',\n 9: '26px',\n 10: '28px',\n 11: '32px',\n 12: '38px',\n },\n fontWeights: { light: 300, regular: 400, medium: 500, semiBold: 600, bold: 700 },\n radii: { 1: '4px', 2: '6px', 3: '8px', 4: '12px', round: '50%', pill: '9999px', button: '8px' },\n zIndices: { 1: '100', 2: '200', 3: '300', 4: '400', max: '999' },\n },\n media: {\n bp1: '(min-width: 520px) and (max-width: 899px)',\n bp2: '(min-width: 900px) and (max-width: 1199px)',\n bp3: '(min-width: 1200px) and (max-width: 1799px)',\n bp4: '(min-width: 1800px)',\n motion: '(prefers-reduced-motion)',\n hover: '(any-hover: hover)',\n dark: '(prefers-color-scheme: dark)',\n light: '(prefers-color-scheme: light)',\n },\n utils: {\n p: (value: Stitches.PropertyValue<'padding'>) => ({ padding: value }),\n pt: (value: Stitches.PropertyValue<'paddingTop'>) => ({ paddingTop: value }),\n pr: (value: Stitches.PropertyValue<'paddingRight'>) => ({ paddingRight: value }),\n pb: (value: Stitches.PropertyValue<'paddingBottom'>) => ({ paddingBottom: value }),\n pl: (value: Stitches.PropertyValue<'paddingLeft'>) => ({ paddingLeft: value }),\n px: (value: Stitches.PropertyValue<'paddingLeft'>) => ({\n paddingLeft: value,\n paddingRight: value,\n }),\n py: (value: Stitches.PropertyValue<'paddingTop'>) => ({\n paddingTop: value,\n paddingBottom: value,\n }),\n\n m: (value: Stitches.PropertyValue<'margin'>) => ({ margin: value }),\n mt: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value }),\n mr: (value: Stitches.PropertyValue<'marginRight'>) => ({ marginRight: value }),\n mb: (value: Stitches.PropertyValue<'marginBottom'>) => ({ marginBottom: value }),\n ml: (value: Stitches.PropertyValue<'marginLeft'>) => ({ marginLeft: value }),\n mx: (value: Stitches.PropertyValue<'marginLeft'>) => ({\n marginLeft: value,\n marginRight: value,\n }),\n my: (value: Stitches.PropertyValue<'marginTop'>) => ({ marginTop: value, marginBottom: value }),\n\n ta: (value: Stitches.PropertyValue<'textAlign'>) => ({ textAlign: value }),\n\n fd: (value: Stitches.PropertyValue<'flexDirection'>) => ({ flexDirection: value }),\n fw: (value: Stitches.PropertyValue<'flexWrap'>) => ({ flexWrap: value }),\n\n ai: (value: Stitches.PropertyValue<'alignItems'>) => ({ alignItems: value }),\n ac: (value: Stitches.PropertyValue<'alignContent'>) => ({ alignContent: value }),\n jc: (value: Stitches.PropertyValue<'justifyContent'>) => ({ justifyContent: value }),\n as: (value: Stitches.PropertyValue<'alignSelf'>) => ({ alignSelf: value }),\n fg: (value: Stitches.PropertyValue<'flexGrow'>) => ({ flexGrow: value }),\n fs: (value: Stitches.PropertyValue<'flexShrink'>) => ({ flexShrink: value }),\n fb: (value: Stitches.PropertyValue<'flexBasis'>) => ({ flexBasis: value }),\n\n bc: (value: Stitches.PropertyValue<'backgroundColor'>) => ({ backgroundColor: value }),\n\n br: (value: Stitches.PropertyValue<'borderRadius'>) => ({ borderRadius: value }),\n btrr: (value: Stitches.PropertyValue<'borderTopRightRadius'>) => ({\n borderTopRightRadius: value,\n }),\n bbrr: (value: Stitches.PropertyValue<'borderBottomRightRadius'>) => ({\n borderBottomRightRadius: value,\n }),\n bblr: (value: Stitches.PropertyValue<'borderBottomLeftRadius'>) => ({\n borderBottomLeftRadius: value,\n }),\n btlr: (value: Stitches.PropertyValue<'borderTopLeftRadius'>) => ({\n borderTopLeftRadius: value,\n }),\n\n bs: (value: Stitches.PropertyValue<'boxShadow'>) => ({ boxShadow: value }),\n\n c: (value: Stitches.PropertyValue<'color'>) => ({ color: value }),\n\n lh: (value: Stitches.PropertyValue<'lineHeight'>) => ({ lineHeight: value }),\n\n ox: (value: Stitches.PropertyValue<'overflowX'>) => ({ overflowX: value }),\n oy: (value: Stitches.PropertyValue<'overflowY'>) => ({ overflowY: value }),\n\n pe: (value: Stitches.PropertyValue<'pointerEvents'>) => ({ pointerEvents: value }),\n us: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n userSelect: (value: Stitches.PropertyValue<'userSelect'>) => ({\n WebkitUserSelect: value,\n userSelect: value,\n }),\n\n size: (value: Stitches.PropertyValue<'width'>) => ({ width: value, height: value }),\n\n appearance: (value: Stitches.PropertyValue<'appearance'>) => ({\n WebkitAppearance: value,\n appearance: value,\n }),\n backgroundClip: (value: Stitches.PropertyValue<'backgroundClip'>) => ({\n WebkitBackgroundClip: value,\n backgroundClip: value,\n }),\n },\n});\n\nexport type CSS<T = typeof stitches.config> = StitchesCSS<T>;\n\nexport const { styled, css, createTheme, getCssText, globalCss, keyframes, config } = stitches;\n\n// @ts-expect-error\nexport const utils = config.utils;\n\nexport const darkTheme = (primary: PrimaryColor, name = 'dark') => {\n const darkPrimaryColor = getPrimaryColorInfo(primary, darkColors);\n\n return createTheme(name, {\n colors: {\n ...darkColors,\n\n // Semantic colors\n primary: darkPrimaryColor.token,\n contentBg: '$00dp',\n hiContrast: 'white',\n loContrast: '$deepBlue2',\n divider: 'hsl(209, 29%, 19%)',\n ...AccordionTheme.getDark(darkPrimaryColor),\n ...BadgeTheme.getDark(darkPrimaryColor),\n ...ButtonTheme.getDark(darkPrimaryColor),\n ...ButtonSwitchTheme.getDark(darkPrimaryColor),\n ...IconButtonTheme.getDark(darkPrimaryColor),\n ...SwitchTheme.getDark(darkPrimaryColor),\n ...CardTheme.getDark(darkPrimaryColor),\n ...CheckboxTheme.getDark(darkPrimaryColor),\n ...CodeBlockTheme.getDark(),\n ...LinkTheme.getDark(darkPrimaryColor),\n ...ListTheme.getDark(darkPrimaryColor),\n ...RadioTheme.getDark(darkPrimaryColor),\n ...InputTheme.getDark(darkPrimaryColor),\n ...TableTheme.getDark(darkPrimaryColor),\n ...TextTheme.getDark(darkPrimaryColor),\n ...SelectTheme.getDark(darkPrimaryColor),\n ...SkeletonTheme.getDark(darkPrimaryColor),\n ...DialogTheme.getDark(darkPrimaryColor),\n ...NavigationTheme.getDark(darkPrimaryColor),\n ...TooltipTheme.getDark(darkPrimaryColor),\n ...TextareaTheme.getDark(darkPrimaryColor),\n ...HeadingTheme.getDark(darkPrimaryColor),\n ...SidePanelTheme.getDark(darkPrimaryColor),\n },\n });\n};\n\nexport const lightTheme = (primary: PrimaryColor, name = 'light') => {\n const lightPrimaryColor = getPrimaryColorInfo(primary, lightColors);\n\n return createTheme(name, {\n colors: {\n primary: lightPrimaryColor.token,\n ...AccordionTheme.getLight(lightPrimaryColor),\n ...BadgeTheme.getLight(lightPrimaryColor),\n ...ButtonTheme.getLight(lightPrimaryColor),\n ...ButtonSwitchTheme.getLight(lightPrimaryColor),\n ...IconButtonTheme.getLight(lightPrimaryColor),\n ...SwitchTheme.getLight(lightPrimaryColor),\n ...CardTheme.getLight(lightPrimaryColor),\n ...CheckboxTheme.getLight(lightPrimaryColor),\n ...CodeBlockTheme.getLight(),\n ...LinkTheme.getLight(lightPrimaryColor),\n ...ListTheme.getLight(lightPrimaryColor),\n ...RadioTheme.getLight(lightPrimaryColor),\n ...InputTheme.getLight(lightPrimaryColor),\n ...TableTheme.getLight(lightPrimaryColor),\n ...TextTheme.getLight(lightPrimaryColor),\n ...SelectTheme.getLight(lightPrimaryColor),\n ...SkeletonTheme.getLight(lightPrimaryColor),\n ...DialogTheme.getLight(lightPrimaryColor),\n ...NavigationTheme.getLight(lightPrimaryColor),\n ...TooltipTheme.getLight(lightPrimaryColor),\n ...TextareaTheme.getLight(lightPrimaryColor),\n ...HeadingTheme.getLight(lightPrimaryColor),\n ...SidePanelTheme.getLight(lightPrimaryColor),\n },\n });\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cssProps.cjs","names":[],"sources":["../../styles/cssProps.ts"],"sourcesContent":["import { FlexAlign, FlexJustify, SizeToken, SpacingToken } from './types';\n\nexport interface CSSProps {\n css?: {\n p?: SpacingToken;\n pt?: SpacingToken;\n pr?: SpacingToken;\n pb?: SpacingToken;\n pl?: SpacingToken;\n px?: SpacingToken;\n py?: SpacingToken;\n\n m?: SpacingToken;\n mt?: SpacingToken;\n mr?: SpacingToken;\n mb?: SpacingToken;\n ml?: SpacingToken;\n mx?: SpacingToken;\n my?: SpacingToken;\n\n ta?: 'left' | 'center' | 'right' | 'justify';\n fd?: 'row' | 'column' | 'row-reverse' | 'column-reverse';\n fw?: 'wrap' | 'nowrap' | 'wrap-reverse';\n ai?: FlexAlign;\n ac?: FlexAlign | 'space-between' | 'space-around' | 'space-evenly';\n jc?: FlexJustify;\n as?: 'auto' | FlexAlign;\n fg?: 0 | 1;\n fs?: 0 | 1;\n fb?: SizeToken;\n\n bc?: string;\n br?: string;\n btrr?: string;\n bbrr?: string;\n bblr?: string;\n btlr?: string;\n bs?: string;\n c?: string;\n\n width?: SizeToken;\n height?: SizeToken;\n size?: SizeToken;\n\n ox?: 'visible' | 'hidden' | 'scroll' | 'auto';\n oy?: 'visible' | 'hidden' | 'scroll' | 'auto';\n\n pe?: 'auto' | 'none' | 'all';\n us?: 'none' | 'auto' | 'text' | 'contain' | 'all';\n\n fontSize?: string;\n fontWeight?: string;\n lh?: string | number;\n\n [key: string]: any;\n };\n}\n\n// HELPERS\nfunction processToken(value: string): string {\n return value.startsWith('$') ? value.slice(1) : value;\n}\n\nfunction getSpaceValue(key: string): string {\n const spaceMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '48px',\n '8': '64px',\n '9': '80px',\n };\n return spaceMap[key] || '0px';\n}\n\nfunction getSizeValue(key: string): string {\n const sizeMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '40px',\n '8': '48px',\n '9': '64px',\n '10': '80px',\n };\n return sizeMap[key] || key;\n}\n\nfunction getRadiiValue(key: string): string {\n const radiiMap: Record<string, string> = {\n '1': '4px',\n '2': '6px',\n '3': '8px',\n '4': '12px',\n round: '50%',\n pill: '9999px',\n button: '8px',\n };\n return radiiMap[key] || '0px';\n}\n\nfunction getFontSizeValue(key: string): string {\n const fontSizeMap: Record<string, string> = {\n '0': '11px',\n '1': '12px',\n '2': '13px',\n '3': '14px',\n '4': '16px',\n '5': '18px',\n '6': '20px',\n '7': '22px',\n '8': '24px',\n '9': '26px',\n '10': '28px',\n '11': '32px',\n '12': '38px',\n };\n return fontSizeMap[key] || '16px';\n}\n\nfunction getFontWeightValue(key: string): string {\n const fontWeightMap: Record<string, string> = {\n light: '300',\n regular: '400',\n medium: '500',\n semiBold: '600',\n bold: '700',\n };\n return fontWeightMap[key] || '400';\n}\n\nfunction applySpacing(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[property] = spaceValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyRadii(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[property] = radiiValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyColor(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n colors?: Record<string, any>,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const colorToken = value.slice(1);\n if (colors && colorToken in colors) {\n (style as any)[property] = colors[colorToken];\n } else {\n (style as any)[property] = value;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applySize(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const sizeValue = getSizeValue(tokenValue);\n (style as any)[property] = sizeValue;\n } else {\n (style as any)[property] = value;\n }\n}\n\n// CSS PROCESSOR\nexport function processCSSProp(\n css: CSSProps['css'] = {},\n colors?: Record<string, any>,\n): {\n style: React.CSSProperties;\n vars: Record<string, string>;\n} {\n const style: React.CSSProperties = {};\n const vars: Record<string, string> = {};\n\n Object.entries(css).forEach(([key, value]) => {\n switch (key) {\n case 'p':\n case 'padding':\n applySpacing(style, 'padding', value);\n break;\n case 'pt':\n case 'paddingTop':\n applySpacing(style, 'paddingTop', value);\n break;\n case 'pr':\n case 'paddingRight':\n applySpacing(style, 'paddingRight', value);\n break;\n case 'pb':\n case 'paddingBottom':\n applySpacing(style, 'paddingBottom', value);\n break;\n case 'pl':\n case 'paddingLeft':\n applySpacing(style, 'paddingLeft', value);\n break;\n case 'px':\n applySpacing(style, 'paddingLeft', value);\n applySpacing(style, 'paddingRight', value);\n break;\n case 'py':\n applySpacing(style, 'paddingTop', value);\n applySpacing(style, 'paddingBottom', value);\n break;\n\n case 'm':\n case 'margin':\n applySpacing(style, 'margin', value);\n break;\n case 'mt':\n case 'marginTop':\n applySpacing(style, 'marginTop', value);\n break;\n case 'mr':\n case 'marginRight':\n applySpacing(style, 'marginRight', value);\n break;\n case 'mb':\n case 'marginBottom':\n applySpacing(style, 'marginBottom', value);\n break;\n case 'ml':\n case 'marginLeft':\n applySpacing(style, 'marginLeft', value);\n break;\n case 'mx':\n applySpacing(style, 'marginLeft', value);\n applySpacing(style, 'marginRight', value);\n break;\n case 'my':\n applySpacing(style, 'marginTop', value);\n applySpacing(style, 'marginBottom', value);\n break;\n\n case 'ta':\n style.textAlign = value as React.CSSProperties['textAlign'];\n break;\n case 'fd':\n style.flexDirection = value as React.CSSProperties['flexDirection'];\n break;\n case 'fw':\n style.flexWrap = value as React.CSSProperties['flexWrap'];\n break;\n case 'ai':\n style.alignItems = value as React.CSSProperties['alignItems'];\n break;\n case 'ac':\n style.alignContent = value as React.CSSProperties['alignContent'];\n break;\n case 'jc':\n style.justifyContent = value as React.CSSProperties['justifyContent'];\n break;\n case 'as':\n style.alignSelf = value as React.CSSProperties['alignSelf'];\n break;\n case 'fg':\n style.flexGrow = value;\n break;\n case 'fs':\n style.flexShrink = value;\n break;\n case 'fb':\n applySize(style, 'flexBasis', value);\n break;\n\n case 'bc':\n case 'backgroundColor':\n applyColor(style, 'backgroundColor', value, colors);\n break;\n case 'br':\n case 'borderRadius':\n applyRadii(style, 'borderRadius', value);\n break;\n case 'btrr':\n case 'borderTopRightRadius':\n applyRadii(style, 'borderTopRightRadius', value);\n break;\n case 'bbrr':\n case 'borderBottomRightRadius':\n applyRadii(style, 'borderBottomRightRadius', value);\n break;\n case 'bblr':\n case 'borderBottomLeftRadius':\n applyRadii(style, 'borderBottomLeftRadius', value);\n break;\n case 'btlr':\n case 'borderTopLeftRadius':\n applyRadii(style, 'borderTopLeftRadius', value);\n break;\n case 'bs':\n case 'boxShadow':\n style.boxShadow = value;\n break;\n case 'c':\n case 'color':\n applyColor(style, 'color', value, colors);\n break;\n\n case 'fontSize':\n if (typeof value === 'string') {\n const fontSizeValue = getFontSizeValue(value);\n if (fontSizeValue !== '16px') {\n style.fontSize = fontSizeValue;\n }\n }\n break;\n case 'fontWeight':\n if (typeof value === 'string') {\n const fontWeightValue = getFontWeightValue(value);\n if (fontWeightValue !== '400') {\n style.fontWeight = fontWeightValue;\n }\n }\n break;\n case 'lh':\n style.lineHeight = value;\n break;\n\n case 'width':\n case 'w':\n applySize(style, 'width', value);\n break;\n case 'height':\n case 'h':\n applySize(style, 'height', value);\n break;\n\n case 'size':\n applySize(style, 'width', value);\n applySize(style, 'height', value);\n break;\n\n case 'ox':\n style.overflowX = value as React.CSSProperties['overflowX'];\n break;\n case 'oy':\n style.overflowY = value as React.CSSProperties['overflowY'];\n break;\n\n case 'pe':\n style.pointerEvents = value as React.CSSProperties['pointerEvents'];\n break;\n case 'us':\n style.userSelect = value as React.CSSProperties['userSelect'];\n break;\n\n default:\n // Handle token syntax for any property that falls through to default\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n\n // Try spacing tokens first (most common for gap, etc)\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[key] = spaceValue;\n break;\n }\n\n // Try size tokens\n const sizeValue = getSizeValue(tokenValue);\n if (sizeValue !== tokenValue) {\n (style as any)[key] = sizeValue;\n break;\n }\n\n // Try radii tokens\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[key] = radiiValue;\n break;\n }\n\n // Try color tokens\n if (colors && tokenValue in colors) {\n (style as any)[key] = colors[tokenValue];\n break;\n }\n\n // If no token matches, pass through as-is\n (style as any)[key] = value;\n } else {\n (style as any)[key] = value;\n }\n break;\n }\n });\n\n return { style, vars };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"cssProps.cjs","names":[],"sources":["../../styles/cssProps.ts"],"sourcesContent":["import { FlexAlign, FlexJustify, SizeToken, SpacingToken } from './types';\n\nexport interface CSSProps {\n css?: {\n p?: SpacingToken;\n pt?: SpacingToken;\n pr?: SpacingToken;\n pb?: SpacingToken;\n pl?: SpacingToken;\n px?: SpacingToken;\n py?: SpacingToken;\n\n m?: SpacingToken;\n mt?: SpacingToken;\n mr?: SpacingToken;\n mb?: SpacingToken;\n ml?: SpacingToken;\n mx?: SpacingToken;\n my?: SpacingToken;\n\n ta?: 'left' | 'center' | 'right' | 'justify';\n fd?: 'row' | 'column' | 'row-reverse' | 'column-reverse';\n fw?: 'wrap' | 'nowrap' | 'wrap-reverse';\n ai?: FlexAlign;\n ac?: FlexAlign | 'space-between' | 'space-around' | 'space-evenly';\n jc?: FlexJustify;\n as?: 'auto' | FlexAlign;\n fg?: 0 | 1;\n fs?: 0 | 1;\n fb?: SizeToken;\n\n bc?: string;\n br?: string;\n btrr?: string;\n bbrr?: string;\n bblr?: string;\n btlr?: string;\n bs?: string;\n c?: string;\n\n width?: SizeToken;\n height?: SizeToken;\n size?: SizeToken;\n\n ox?: 'visible' | 'hidden' | 'scroll' | 'auto';\n oy?: 'visible' | 'hidden' | 'scroll' | 'auto';\n\n pe?: 'auto' | 'none' | 'all';\n us?: 'none' | 'auto' | 'text' | 'contain' | 'all';\n\n fontSize?: string;\n fontWeight?: string;\n lh?: string | number;\n\n [key: string]: any;\n };\n}\n\n// HELPERS\nfunction processToken(value: string): string {\n return value.startsWith('$') ? value.slice(1) : value;\n}\n\nfunction getSpaceValue(key: string): string {\n const spaceMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '48px',\n '8': '64px',\n '9': '80px',\n };\n return spaceMap[key] || '0px';\n}\n\nfunction getSizeValue(key: string): string {\n const sizeMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '40px',\n '8': '48px',\n '9': '64px',\n '10': '80px',\n };\n return sizeMap[key] || key;\n}\n\nfunction getRadiiValue(key: string): string {\n const radiiMap: Record<string, string> = {\n '1': '4px',\n '2': '6px',\n '3': '8px',\n '4': '12px',\n round: '50%',\n pill: '9999px',\n button: '8px',\n };\n return radiiMap[key] || '0px';\n}\n\nfunction getFontSizeValue(key: string): string {\n const fontSizeMap: Record<string, string> = {\n '0': '11px',\n '1': '12px',\n '2': '13px',\n '3': '14px',\n '4': '16px',\n '5': '18px',\n '6': '20px',\n '7': '22px',\n '8': '24px',\n '9': '26px',\n '10': '28px',\n '11': '32px',\n '12': '38px',\n };\n return fontSizeMap[key] || '16px';\n}\n\nfunction getFontWeightValue(key: string): string {\n const fontWeightMap: Record<string, string> = {\n light: '300',\n regular: '400',\n medium: '500',\n semiBold: '600',\n bold: '700',\n };\n return fontWeightMap[key] || '400';\n}\n\nfunction applySpacing(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[property] = spaceValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyRadii(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[property] = radiiValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyColor(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n colors?: Record<string, any>,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const colorToken = value.slice(1);\n if (colors && colorToken in colors) {\n (style as any)[property] = colors[colorToken];\n } else {\n (style as any)[property] = value;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applySize(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const sizeValue = getSizeValue(tokenValue);\n (style as any)[property] = sizeValue;\n } else {\n (style as any)[property] = value;\n }\n}\n\n// CSS PROCESSOR\nexport function processCSSProp(\n css: CSSProps['css'] = {},\n colors?: Record<string, any>,\n): {\n style: React.CSSProperties;\n vars: Record<string, string>;\n} {\n const style: React.CSSProperties = {};\n const vars: Record<string, string> = {};\n\n Object.entries(css).forEach(([key, value]) => {\n switch (key) {\n case 'p':\n case 'padding':\n applySpacing(style, 'padding', value);\n break;\n case 'pt':\n case 'paddingTop':\n applySpacing(style, 'paddingTop', value);\n break;\n case 'pr':\n case 'paddingRight':\n applySpacing(style, 'paddingRight', value);\n break;\n case 'pb':\n case 'paddingBottom':\n applySpacing(style, 'paddingBottom', value);\n break;\n case 'pl':\n case 'paddingLeft':\n applySpacing(style, 'paddingLeft', value);\n break;\n case 'px':\n applySpacing(style, 'paddingLeft', value);\n applySpacing(style, 'paddingRight', value);\n break;\n case 'py':\n applySpacing(style, 'paddingTop', value);\n applySpacing(style, 'paddingBottom', value);\n break;\n\n case 'm':\n case 'margin':\n applySpacing(style, 'margin', value);\n break;\n case 'mt':\n case 'marginTop':\n applySpacing(style, 'marginTop', value);\n break;\n case 'mr':\n case 'marginRight':\n applySpacing(style, 'marginRight', value);\n break;\n case 'mb':\n case 'marginBottom':\n applySpacing(style, 'marginBottom', value);\n break;\n case 'ml':\n case 'marginLeft':\n applySpacing(style, 'marginLeft', value);\n break;\n case 'mx':\n applySpacing(style, 'marginLeft', value);\n applySpacing(style, 'marginRight', value);\n break;\n case 'my':\n applySpacing(style, 'marginTop', value);\n applySpacing(style, 'marginBottom', value);\n break;\n\n case 'ta':\n style.textAlign = value as React.CSSProperties['textAlign'];\n break;\n case 'fd':\n style.flexDirection = value as React.CSSProperties['flexDirection'];\n break;\n case 'fw':\n style.flexWrap = value as React.CSSProperties['flexWrap'];\n break;\n case 'ai':\n style.alignItems = value as React.CSSProperties['alignItems'];\n break;\n case 'ac':\n style.alignContent = value as React.CSSProperties['alignContent'];\n break;\n case 'jc':\n style.justifyContent = value as React.CSSProperties['justifyContent'];\n break;\n case 'as':\n style.alignSelf = value as React.CSSProperties['alignSelf'];\n break;\n case 'fg':\n style.flexGrow = value;\n break;\n case 'fs':\n style.flexShrink = value;\n break;\n case 'fb':\n applySize(style, 'flexBasis', value);\n break;\n\n case 'bc':\n case 'backgroundColor':\n applyColor(style, 'backgroundColor', value, colors);\n break;\n case 'br':\n case 'borderRadius':\n applyRadii(style, 'borderRadius', value);\n break;\n case 'btrr':\n case 'borderTopRightRadius':\n applyRadii(style, 'borderTopRightRadius', value);\n break;\n case 'bbrr':\n case 'borderBottomRightRadius':\n applyRadii(style, 'borderBottomRightRadius', value);\n break;\n case 'bblr':\n case 'borderBottomLeftRadius':\n applyRadii(style, 'borderBottomLeftRadius', value);\n break;\n case 'btlr':\n case 'borderTopLeftRadius':\n applyRadii(style, 'borderTopLeftRadius', value);\n break;\n case 'bs':\n case 'boxShadow':\n style.boxShadow = value;\n break;\n case 'c':\n case 'color':\n applyColor(style, 'color', value, colors);\n break;\n\n case 'fontSize':\n if (typeof value === 'string') {\n const fontSizeValue = getFontSizeValue(value);\n if (fontSizeValue !== '16px') {\n style.fontSize = fontSizeValue;\n }\n }\n break;\n case 'fontWeight':\n if (typeof value === 'string') {\n const fontWeightValue = getFontWeightValue(value);\n if (fontWeightValue !== '400') {\n style.fontWeight = fontWeightValue;\n }\n }\n break;\n case 'lh':\n style.lineHeight = value;\n break;\n\n case 'width':\n case 'w':\n applySize(style, 'width', value);\n break;\n case 'height':\n case 'h':\n applySize(style, 'height', value);\n break;\n\n case 'size':\n applySize(style, 'width', value);\n applySize(style, 'height', value);\n break;\n\n case 'ox':\n style.overflowX = value as React.CSSProperties['overflowX'];\n break;\n case 'oy':\n style.overflowY = value as React.CSSProperties['overflowY'];\n break;\n\n case 'pe':\n style.pointerEvents = value as React.CSSProperties['pointerEvents'];\n break;\n case 'us':\n style.userSelect = value as React.CSSProperties['userSelect'];\n break;\n\n default:\n // Handle token syntax for any property that falls through to default\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n\n // Try spacing tokens first (most common for gap, etc)\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[key] = spaceValue;\n break;\n }\n\n // Try size tokens\n const sizeValue = getSizeValue(tokenValue);\n if (sizeValue !== tokenValue) {\n (style as any)[key] = sizeValue;\n break;\n }\n\n // Try radii tokens\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[key] = radiiValue;\n break;\n }\n\n // Try color tokens\n if (colors && tokenValue in colors) {\n (style as any)[key] = colors[tokenValue];\n break;\n }\n\n // If no token matches, pass through as-is\n (style as any)[key] = value;\n } else {\n (style as any)[key] = value;\n }\n break;\n }\n });\n\n return { style, vars };\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cssProps.js","names":[],"sources":["../../styles/cssProps.ts"],"sourcesContent":["import { FlexAlign, FlexJustify, SizeToken, SpacingToken } from './types';\n\nexport interface CSSProps {\n css?: {\n p?: SpacingToken;\n pt?: SpacingToken;\n pr?: SpacingToken;\n pb?: SpacingToken;\n pl?: SpacingToken;\n px?: SpacingToken;\n py?: SpacingToken;\n\n m?: SpacingToken;\n mt?: SpacingToken;\n mr?: SpacingToken;\n mb?: SpacingToken;\n ml?: SpacingToken;\n mx?: SpacingToken;\n my?: SpacingToken;\n\n ta?: 'left' | 'center' | 'right' | 'justify';\n fd?: 'row' | 'column' | 'row-reverse' | 'column-reverse';\n fw?: 'wrap' | 'nowrap' | 'wrap-reverse';\n ai?: FlexAlign;\n ac?: FlexAlign | 'space-between' | 'space-around' | 'space-evenly';\n jc?: FlexJustify;\n as?: 'auto' | FlexAlign;\n fg?: 0 | 1;\n fs?: 0 | 1;\n fb?: SizeToken;\n\n bc?: string;\n br?: string;\n btrr?: string;\n bbrr?: string;\n bblr?: string;\n btlr?: string;\n bs?: string;\n c?: string;\n\n width?: SizeToken;\n height?: SizeToken;\n size?: SizeToken;\n\n ox?: 'visible' | 'hidden' | 'scroll' | 'auto';\n oy?: 'visible' | 'hidden' | 'scroll' | 'auto';\n\n pe?: 'auto' | 'none' | 'all';\n us?: 'none' | 'auto' | 'text' | 'contain' | 'all';\n\n fontSize?: string;\n fontWeight?: string;\n lh?: string | number;\n\n [key: string]: any;\n };\n}\n\n// HELPERS\nfunction processToken(value: string): string {\n return value.startsWith('$') ? value.slice(1) : value;\n}\n\nfunction getSpaceValue(key: string): string {\n const spaceMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '48px',\n '8': '64px',\n '9': '80px',\n };\n return spaceMap[key] || '0px';\n}\n\nfunction getSizeValue(key: string): string {\n const sizeMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '40px',\n '8': '48px',\n '9': '64px',\n '10': '80px',\n };\n return sizeMap[key] || key;\n}\n\nfunction getRadiiValue(key: string): string {\n const radiiMap: Record<string, string> = {\n '1': '4px',\n '2': '6px',\n '3': '8px',\n '4': '12px',\n round: '50%',\n pill: '9999px',\n button: '8px',\n };\n return radiiMap[key] || '0px';\n}\n\nfunction getFontSizeValue(key: string): string {\n const fontSizeMap: Record<string, string> = {\n '0': '11px',\n '1': '12px',\n '2': '13px',\n '3': '14px',\n '4': '16px',\n '5': '18px',\n '6': '20px',\n '7': '22px',\n '8': '24px',\n '9': '26px',\n '10': '28px',\n '11': '32px',\n '12': '38px',\n };\n return fontSizeMap[key] || '16px';\n}\n\nfunction getFontWeightValue(key: string): string {\n const fontWeightMap: Record<string, string> = {\n light: '300',\n regular: '400',\n medium: '500',\n semiBold: '600',\n bold: '700',\n };\n return fontWeightMap[key] || '400';\n}\n\nfunction applySpacing(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[property] = spaceValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyRadii(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[property] = radiiValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyColor(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n colors?: Record<string, any>,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const colorToken = value.slice(1);\n if (colors && colorToken in colors) {\n (style as any)[property] = colors[colorToken];\n } else {\n (style as any)[property] = value;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applySize(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const sizeValue = getSizeValue(tokenValue);\n (style as any)[property] = sizeValue;\n } else {\n (style as any)[property] = value;\n }\n}\n\n// CSS PROCESSOR\nexport function processCSSProp(\n css: CSSProps['css'] = {},\n colors?: Record<string, any>,\n): {\n style: React.CSSProperties;\n vars: Record<string, string>;\n} {\n const style: React.CSSProperties = {};\n const vars: Record<string, string> = {};\n\n Object.entries(css).forEach(([key, value]) => {\n switch (key) {\n case 'p':\n case 'padding':\n applySpacing(style, 'padding', value);\n break;\n case 'pt':\n case 'paddingTop':\n applySpacing(style, 'paddingTop', value);\n break;\n case 'pr':\n case 'paddingRight':\n applySpacing(style, 'paddingRight', value);\n break;\n case 'pb':\n case 'paddingBottom':\n applySpacing(style, 'paddingBottom', value);\n break;\n case 'pl':\n case 'paddingLeft':\n applySpacing(style, 'paddingLeft', value);\n break;\n case 'px':\n applySpacing(style, 'paddingLeft', value);\n applySpacing(style, 'paddingRight', value);\n break;\n case 'py':\n applySpacing(style, 'paddingTop', value);\n applySpacing(style, 'paddingBottom', value);\n break;\n\n case 'm':\n case 'margin':\n applySpacing(style, 'margin', value);\n break;\n case 'mt':\n case 'marginTop':\n applySpacing(style, 'marginTop', value);\n break;\n case 'mr':\n case 'marginRight':\n applySpacing(style, 'marginRight', value);\n break;\n case 'mb':\n case 'marginBottom':\n applySpacing(style, 'marginBottom', value);\n break;\n case 'ml':\n case 'marginLeft':\n applySpacing(style, 'marginLeft', value);\n break;\n case 'mx':\n applySpacing(style, 'marginLeft', value);\n applySpacing(style, 'marginRight', value);\n break;\n case 'my':\n applySpacing(style, 'marginTop', value);\n applySpacing(style, 'marginBottom', value);\n break;\n\n case 'ta':\n style.textAlign = value as React.CSSProperties['textAlign'];\n break;\n case 'fd':\n style.flexDirection = value as React.CSSProperties['flexDirection'];\n break;\n case 'fw':\n style.flexWrap = value as React.CSSProperties['flexWrap'];\n break;\n case 'ai':\n style.alignItems = value as React.CSSProperties['alignItems'];\n break;\n case 'ac':\n style.alignContent = value as React.CSSProperties['alignContent'];\n break;\n case 'jc':\n style.justifyContent = value as React.CSSProperties['justifyContent'];\n break;\n case 'as':\n style.alignSelf = value as React.CSSProperties['alignSelf'];\n break;\n case 'fg':\n style.flexGrow = value;\n break;\n case 'fs':\n style.flexShrink = value;\n break;\n case 'fb':\n applySize(style, 'flexBasis', value);\n break;\n\n case 'bc':\n case 'backgroundColor':\n applyColor(style, 'backgroundColor', value, colors);\n break;\n case 'br':\n case 'borderRadius':\n applyRadii(style, 'borderRadius', value);\n break;\n case 'btrr':\n case 'borderTopRightRadius':\n applyRadii(style, 'borderTopRightRadius', value);\n break;\n case 'bbrr':\n case 'borderBottomRightRadius':\n applyRadii(style, 'borderBottomRightRadius', value);\n break;\n case 'bblr':\n case 'borderBottomLeftRadius':\n applyRadii(style, 'borderBottomLeftRadius', value);\n break;\n case 'btlr':\n case 'borderTopLeftRadius':\n applyRadii(style, 'borderTopLeftRadius', value);\n break;\n case 'bs':\n case 'boxShadow':\n style.boxShadow = value;\n break;\n case 'c':\n case 'color':\n applyColor(style, 'color', value, colors);\n break;\n\n case 'fontSize':\n if (typeof value === 'string') {\n const fontSizeValue = getFontSizeValue(value);\n if (fontSizeValue !== '16px') {\n style.fontSize = fontSizeValue;\n }\n }\n break;\n case 'fontWeight':\n if (typeof value === 'string') {\n const fontWeightValue = getFontWeightValue(value);\n if (fontWeightValue !== '400') {\n style.fontWeight = fontWeightValue;\n }\n }\n break;\n case 'lh':\n style.lineHeight = value;\n break;\n\n case 'width':\n case 'w':\n applySize(style, 'width', value);\n break;\n case 'height':\n case 'h':\n applySize(style, 'height', value);\n break;\n\n case 'size':\n applySize(style, 'width', value);\n applySize(style, 'height', value);\n break;\n\n case 'ox':\n style.overflowX = value as React.CSSProperties['overflowX'];\n break;\n case 'oy':\n style.overflowY = value as React.CSSProperties['overflowY'];\n break;\n\n case 'pe':\n style.pointerEvents = value as React.CSSProperties['pointerEvents'];\n break;\n case 'us':\n style.userSelect = value as React.CSSProperties['userSelect'];\n break;\n\n default:\n // Handle token syntax for any property that falls through to default\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n\n // Try spacing tokens first (most common for gap, etc)\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[key] = spaceValue;\n break;\n }\n\n // Try size tokens\n const sizeValue = getSizeValue(tokenValue);\n if (sizeValue !== tokenValue) {\n (style as any)[key] = sizeValue;\n break;\n }\n\n // Try radii tokens\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[key] = radiiValue;\n break;\n }\n\n // Try color tokens\n if (colors && tokenValue in colors) {\n (style as any)[key] = colors[tokenValue];\n break;\n }\n\n // If no token matches, pass through as-is\n (style as any)[key] = value;\n } else {\n (style as any)[key] = value;\n }\n break;\n }\n });\n\n return { style, vars };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"cssProps.js","names":[],"sources":["../../styles/cssProps.ts"],"sourcesContent":["import { FlexAlign, FlexJustify, SizeToken, SpacingToken } from './types';\n\nexport interface CSSProps {\n css?: {\n p?: SpacingToken;\n pt?: SpacingToken;\n pr?: SpacingToken;\n pb?: SpacingToken;\n pl?: SpacingToken;\n px?: SpacingToken;\n py?: SpacingToken;\n\n m?: SpacingToken;\n mt?: SpacingToken;\n mr?: SpacingToken;\n mb?: SpacingToken;\n ml?: SpacingToken;\n mx?: SpacingToken;\n my?: SpacingToken;\n\n ta?: 'left' | 'center' | 'right' | 'justify';\n fd?: 'row' | 'column' | 'row-reverse' | 'column-reverse';\n fw?: 'wrap' | 'nowrap' | 'wrap-reverse';\n ai?: FlexAlign;\n ac?: FlexAlign | 'space-between' | 'space-around' | 'space-evenly';\n jc?: FlexJustify;\n as?: 'auto' | FlexAlign;\n fg?: 0 | 1;\n fs?: 0 | 1;\n fb?: SizeToken;\n\n bc?: string;\n br?: string;\n btrr?: string;\n bbrr?: string;\n bblr?: string;\n btlr?: string;\n bs?: string;\n c?: string;\n\n width?: SizeToken;\n height?: SizeToken;\n size?: SizeToken;\n\n ox?: 'visible' | 'hidden' | 'scroll' | 'auto';\n oy?: 'visible' | 'hidden' | 'scroll' | 'auto';\n\n pe?: 'auto' | 'none' | 'all';\n us?: 'none' | 'auto' | 'text' | 'contain' | 'all';\n\n fontSize?: string;\n fontWeight?: string;\n lh?: string | number;\n\n [key: string]: any;\n };\n}\n\n// HELPERS\nfunction processToken(value: string): string {\n return value.startsWith('$') ? value.slice(1) : value;\n}\n\nfunction getSpaceValue(key: string): string {\n const spaceMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '48px',\n '8': '64px',\n '9': '80px',\n };\n return spaceMap[key] || '0px';\n}\n\nfunction getSizeValue(key: string): string {\n const sizeMap: Record<string, string> = {\n '1': '4px',\n '2': '8px',\n '3': '16px',\n '4': '20px',\n '5': '24px',\n '6': '32px',\n '7': '40px',\n '8': '48px',\n '9': '64px',\n '10': '80px',\n };\n return sizeMap[key] || key;\n}\n\nfunction getRadiiValue(key: string): string {\n const radiiMap: Record<string, string> = {\n '1': '4px',\n '2': '6px',\n '3': '8px',\n '4': '12px',\n round: '50%',\n pill: '9999px',\n button: '8px',\n };\n return radiiMap[key] || '0px';\n}\n\nfunction getFontSizeValue(key: string): string {\n const fontSizeMap: Record<string, string> = {\n '0': '11px',\n '1': '12px',\n '2': '13px',\n '3': '14px',\n '4': '16px',\n '5': '18px',\n '6': '20px',\n '7': '22px',\n '8': '24px',\n '9': '26px',\n '10': '28px',\n '11': '32px',\n '12': '38px',\n };\n return fontSizeMap[key] || '16px';\n}\n\nfunction getFontWeightValue(key: string): string {\n const fontWeightMap: Record<string, string> = {\n light: '300',\n regular: '400',\n medium: '500',\n semiBold: '600',\n bold: '700',\n };\n return fontWeightMap[key] || '400';\n}\n\nfunction applySpacing(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[property] = spaceValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyRadii(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[property] = radiiValue;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applyColor(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n colors?: Record<string, any>,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const colorToken = value.slice(1);\n if (colors && colorToken in colors) {\n (style as any)[property] = colors[colorToken];\n } else {\n (style as any)[property] = value;\n }\n } else {\n (style as any)[property] = value;\n }\n}\n\nfunction applySize(\n style: React.CSSProperties,\n property: keyof React.CSSProperties,\n value: string,\n): void {\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n const sizeValue = getSizeValue(tokenValue);\n (style as any)[property] = sizeValue;\n } else {\n (style as any)[property] = value;\n }\n}\n\n// CSS PROCESSOR\nexport function processCSSProp(\n css: CSSProps['css'] = {},\n colors?: Record<string, any>,\n): {\n style: React.CSSProperties;\n vars: Record<string, string>;\n} {\n const style: React.CSSProperties = {};\n const vars: Record<string, string> = {};\n\n Object.entries(css).forEach(([key, value]) => {\n switch (key) {\n case 'p':\n case 'padding':\n applySpacing(style, 'padding', value);\n break;\n case 'pt':\n case 'paddingTop':\n applySpacing(style, 'paddingTop', value);\n break;\n case 'pr':\n case 'paddingRight':\n applySpacing(style, 'paddingRight', value);\n break;\n case 'pb':\n case 'paddingBottom':\n applySpacing(style, 'paddingBottom', value);\n break;\n case 'pl':\n case 'paddingLeft':\n applySpacing(style, 'paddingLeft', value);\n break;\n case 'px':\n applySpacing(style, 'paddingLeft', value);\n applySpacing(style, 'paddingRight', value);\n break;\n case 'py':\n applySpacing(style, 'paddingTop', value);\n applySpacing(style, 'paddingBottom', value);\n break;\n\n case 'm':\n case 'margin':\n applySpacing(style, 'margin', value);\n break;\n case 'mt':\n case 'marginTop':\n applySpacing(style, 'marginTop', value);\n break;\n case 'mr':\n case 'marginRight':\n applySpacing(style, 'marginRight', value);\n break;\n case 'mb':\n case 'marginBottom':\n applySpacing(style, 'marginBottom', value);\n break;\n case 'ml':\n case 'marginLeft':\n applySpacing(style, 'marginLeft', value);\n break;\n case 'mx':\n applySpacing(style, 'marginLeft', value);\n applySpacing(style, 'marginRight', value);\n break;\n case 'my':\n applySpacing(style, 'marginTop', value);\n applySpacing(style, 'marginBottom', value);\n break;\n\n case 'ta':\n style.textAlign = value as React.CSSProperties['textAlign'];\n break;\n case 'fd':\n style.flexDirection = value as React.CSSProperties['flexDirection'];\n break;\n case 'fw':\n style.flexWrap = value as React.CSSProperties['flexWrap'];\n break;\n case 'ai':\n style.alignItems = value as React.CSSProperties['alignItems'];\n break;\n case 'ac':\n style.alignContent = value as React.CSSProperties['alignContent'];\n break;\n case 'jc':\n style.justifyContent = value as React.CSSProperties['justifyContent'];\n break;\n case 'as':\n style.alignSelf = value as React.CSSProperties['alignSelf'];\n break;\n case 'fg':\n style.flexGrow = value;\n break;\n case 'fs':\n style.flexShrink = value;\n break;\n case 'fb':\n applySize(style, 'flexBasis', value);\n break;\n\n case 'bc':\n case 'backgroundColor':\n applyColor(style, 'backgroundColor', value, colors);\n break;\n case 'br':\n case 'borderRadius':\n applyRadii(style, 'borderRadius', value);\n break;\n case 'btrr':\n case 'borderTopRightRadius':\n applyRadii(style, 'borderTopRightRadius', value);\n break;\n case 'bbrr':\n case 'borderBottomRightRadius':\n applyRadii(style, 'borderBottomRightRadius', value);\n break;\n case 'bblr':\n case 'borderBottomLeftRadius':\n applyRadii(style, 'borderBottomLeftRadius', value);\n break;\n case 'btlr':\n case 'borderTopLeftRadius':\n applyRadii(style, 'borderTopLeftRadius', value);\n break;\n case 'bs':\n case 'boxShadow':\n style.boxShadow = value;\n break;\n case 'c':\n case 'color':\n applyColor(style, 'color', value, colors);\n break;\n\n case 'fontSize':\n if (typeof value === 'string') {\n const fontSizeValue = getFontSizeValue(value);\n if (fontSizeValue !== '16px') {\n style.fontSize = fontSizeValue;\n }\n }\n break;\n case 'fontWeight':\n if (typeof value === 'string') {\n const fontWeightValue = getFontWeightValue(value);\n if (fontWeightValue !== '400') {\n style.fontWeight = fontWeightValue;\n }\n }\n break;\n case 'lh':\n style.lineHeight = value;\n break;\n\n case 'width':\n case 'w':\n applySize(style, 'width', value);\n break;\n case 'height':\n case 'h':\n applySize(style, 'height', value);\n break;\n\n case 'size':\n applySize(style, 'width', value);\n applySize(style, 'height', value);\n break;\n\n case 'ox':\n style.overflowX = value as React.CSSProperties['overflowX'];\n break;\n case 'oy':\n style.overflowY = value as React.CSSProperties['overflowY'];\n break;\n\n case 'pe':\n style.pointerEvents = value as React.CSSProperties['pointerEvents'];\n break;\n case 'us':\n style.userSelect = value as React.CSSProperties['userSelect'];\n break;\n\n default:\n // Handle token syntax for any property that falls through to default\n if (typeof value === 'string' && value.startsWith('$')) {\n const tokenValue = processToken(value);\n\n // Try spacing tokens first (most common for gap, etc)\n const spaceValue = getSpaceValue(tokenValue);\n if (spaceValue !== '0px') {\n (style as any)[key] = spaceValue;\n break;\n }\n\n // Try size tokens\n const sizeValue = getSizeValue(tokenValue);\n if (sizeValue !== tokenValue) {\n (style as any)[key] = sizeValue;\n break;\n }\n\n // Try radii tokens\n const radiiValue = getRadiiValue(tokenValue);\n if (radiiValue !== '0px') {\n (style as any)[key] = radiiValue;\n break;\n }\n\n // Try color tokens\n if (colors && tokenValue in colors) {\n (style as any)[key] = colors[tokenValue];\n break;\n }\n\n // If no token matches, pass through as-is\n (style as any)[key] = value;\n } else {\n (style as any)[key] = value;\n }\n break;\n }\n });\n\n return { style, vars };\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeContext.cjs","names":[],"sources":["../../styles/themeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useLayoutEffect, useState } from 'react';\n\nimport { darkColors, lightColors } from '../colors';\nimport { PrimaryColor, themes } from './themes.css';\n\nexport type ThemeMode = 'light' | 'dark' | 'system';\nexport type { PrimaryColor };\n\ninterface ThemeContextValue {\n mode: ThemeMode;\n resolvedTheme: 'light' | 'dark';\n primaryColor: PrimaryColor;\n colors: typeof lightColors | typeof darkColors;\n setMode: (mode: ThemeMode) => void;\n setPrimaryColor: (color: PrimaryColor) => void;\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\ninterface VanillaExtractThemeProviderProps {\n children: React.ReactNode;\n defaultTheme?: ThemeMode;\n primaryColor?: PrimaryColor;\n forcedTheme?: 'light' | 'dark';\n}\n\nexport function VanillaExtractThemeProvider({\n children,\n defaultTheme = 'system',\n primaryColor = 'blue',\n forcedTheme,\n}: VanillaExtractThemeProviderProps) {\n const [mode, setMode] = useState<ThemeMode>(defaultTheme);\n const [appliedPrimaryColor, setPrimaryColor] = useState<PrimaryColor>(primaryColor);\n const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>(() => {\n if (forcedTheme) {\n return forcedTheme;\n }\n if (typeof window !== 'undefined') {\n return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n }\n return 'light';\n });\n\n useEffect(() => {\n setPrimaryColor(primaryColor);\n }, [primaryColor]);\n\n useEffect(() => {\n if (forcedTheme) {\n setSystemTheme(forcedTheme);\n return;\n }\n\n const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n setSystemTheme(mediaQuery.matches ? 'dark' : 'light');\n\n const handler = (e: MediaQueryListEvent) => {\n setSystemTheme(e.matches ? 'dark' : 'light');\n };\n\n mediaQuery.addEventListener('change', handler);\n return () => mediaQuery.removeEventListener('change', handler);\n }, [forcedTheme]);\n\n const resolvedTheme: 'light' | 'dark' = forcedTheme || (mode === 'system' ? systemTheme : mode);\n\n const baseColors = resolvedTheme === 'dark' ? darkColors : lightColors;\n\n const semanticColors =\n resolvedTheme === 'dark'\n ? {\n primary: darkColors[`${appliedPrimaryColor}9`],\n contentBg: darkColors['00dp'],\n hiContrast: 'white',\n loContrast: darkColors.deepBlue2,\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(209, 29%, 19%)',\n background: '#0a0a0a',\n foreground: '#ffffff',\n muted: '#1a1a1a',\n mutedForeground: '#b4b4b4',\n card: '#1a1a1a',\n cardForeground: '#ffffff',\n popover: '#1a1a1a',\n popoverForeground: '#ffffff',\n border: '#3a3a3a',\n input: '#3a3a3a',\n accent: '#3b82f6',\n accentForeground: '#ffffff',\n destructive: '#dc2626',\n destructiveForeground: '#ffffff',\n ring: '#60a5fa',\n }\n : {\n primary: lightColors[`${appliedPrimaryColor}9`],\n contentBg: lightColors['00dp'],\n hiContrast: lightColors.deepBlue11,\n loContrast: 'white',\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(207, 10%, 82%)',\n background: '#fcfcfc',\n foreground: '#1a1a1a',\n muted: '#f4f4f4',\n mutedForeground: '#646464',\n card: '#ffffff',\n cardForeground: '#1a1a1a',\n popover: '#ffffff',\n popoverForeground: '#1a1a1a',\n border: '#e3e3e3',\n input: '#e3e3e3',\n accent: '#60a5fa',\n accentForeground: '#ffffff',\n destructive: '#dc2626',\n destructiveForeground: '#ffffff',\n ring: '#3b82f6',\n };\n\n const colors = {\n ...baseColors,\n ...semanticColors,\n };\n\n // Use useLayoutEffect to apply theme class synchronously before paint\n useLayoutEffect(() => {\n const themeClass = themes[resolvedTheme][appliedPrimaryColor];\n\n Object.values(themes.light).forEach((cls) => document.body.classList.remove(cls));\n Object.values(themes.dark).forEach((cls) => document.body.classList.remove(cls));\n\n document.body.classList.add(themeClass);\n\n return () => {\n document.body.classList.remove(themeClass);\n };\n }, [resolvedTheme, appliedPrimaryColor]);\n\n const contextValue: ThemeContextValue = {\n mode,\n resolvedTheme,\n primaryColor: appliedPrimaryColor,\n colors,\n setMode,\n setPrimaryColor,\n };\n\n return <ThemeContext.Provider value={contextValue}>{children}</ThemeContext.Provider>;\n}\n\nexport function useVanillaExtractTheme() {\n const context = useContext(ThemeContext);\n if (context === undefined) {\n throw new Error('useVanillaExtractTheme must be used within a VanillaExtractThemeProvider');\n }\n return context;\n}\n"],"mappings":";;;;;;;AAiBA,IAAM,gBAAA,GAAA,MAAA,eAA4D,KAAA,
|
|
1
|
+
{"version":3,"file":"themeContext.cjs","names":[],"sources":["../../styles/themeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useLayoutEffect, useState } from 'react';\n\nimport { darkColors, lightColors } from '../colors';\nimport { PrimaryColor, themes } from './themes.css';\n\nexport type ThemeMode = 'light' | 'dark' | 'system';\nexport type { PrimaryColor };\n\ninterface ThemeContextValue {\n mode: ThemeMode;\n resolvedTheme: 'light' | 'dark';\n primaryColor: PrimaryColor;\n colors: typeof lightColors | typeof darkColors;\n setMode: (mode: ThemeMode) => void;\n setPrimaryColor: (color: PrimaryColor) => void;\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\ninterface VanillaExtractThemeProviderProps {\n children: React.ReactNode;\n defaultTheme?: ThemeMode;\n primaryColor?: PrimaryColor;\n forcedTheme?: 'light' | 'dark';\n}\n\nexport function VanillaExtractThemeProvider({\n children,\n defaultTheme = 'system',\n primaryColor = 'blue',\n forcedTheme,\n}: VanillaExtractThemeProviderProps) {\n const [mode, setMode] = useState<ThemeMode>(defaultTheme);\n const [appliedPrimaryColor, setPrimaryColor] = useState<PrimaryColor>(primaryColor);\n const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>(() => {\n if (forcedTheme) {\n return forcedTheme;\n }\n if (typeof window !== 'undefined') {\n return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n }\n return 'light';\n });\n\n useEffect(() => {\n setPrimaryColor(primaryColor);\n }, [primaryColor]);\n\n useEffect(() => {\n if (forcedTheme) {\n setSystemTheme(forcedTheme);\n return;\n }\n\n const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n setSystemTheme(mediaQuery.matches ? 'dark' : 'light');\n\n const handler = (e: MediaQueryListEvent) => {\n setSystemTheme(e.matches ? 'dark' : 'light');\n };\n\n mediaQuery.addEventListener('change', handler);\n return () => mediaQuery.removeEventListener('change', handler);\n }, [forcedTheme]);\n\n const resolvedTheme: 'light' | 'dark' = forcedTheme || (mode === 'system' ? systemTheme : mode);\n\n const baseColors = resolvedTheme === 'dark' ? darkColors : lightColors;\n\n const semanticColors =\n resolvedTheme === 'dark'\n ? {\n primary: darkColors[`${appliedPrimaryColor}9`],\n contentBg: darkColors['00dp'],\n hiContrast: 'white',\n loContrast: darkColors.deepBlue2,\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(209, 29%, 19%)',\n background: '#0a0a0a',\n foreground: '#ffffff',\n muted: '#1a1a1a',\n mutedForeground: '#b4b4b4',\n card: '#1a1a1a',\n cardForeground: '#ffffff',\n popover: '#1a1a1a',\n popoverForeground: '#ffffff',\n border: '#3a3a3a',\n input: '#3a3a3a',\n accent: '#3b82f6',\n accentForeground: '#ffffff',\n destructive: '#dc2626',\n destructiveForeground: '#ffffff',\n ring: '#60a5fa',\n }\n : {\n primary: lightColors[`${appliedPrimaryColor}9`],\n contentBg: lightColors['00dp'],\n hiContrast: lightColors.deepBlue11,\n loContrast: 'white',\n focusOutline: 'hsl(216, 100%, 64%)',\n divider: 'hsl(207, 10%, 82%)',\n background: '#fcfcfc',\n foreground: '#1a1a1a',\n muted: '#f4f4f4',\n mutedForeground: '#646464',\n card: '#ffffff',\n cardForeground: '#1a1a1a',\n popover: '#ffffff',\n popoverForeground: '#1a1a1a',\n border: '#e3e3e3',\n input: '#e3e3e3',\n accent: '#60a5fa',\n accentForeground: '#ffffff',\n destructive: '#dc2626',\n destructiveForeground: '#ffffff',\n ring: '#3b82f6',\n };\n\n const colors = {\n ...baseColors,\n ...semanticColors,\n };\n\n // Use useLayoutEffect to apply theme class synchronously before paint\n useLayoutEffect(() => {\n const themeClass = themes[resolvedTheme][appliedPrimaryColor];\n\n Object.values(themes.light).forEach((cls) => document.body.classList.remove(cls));\n Object.values(themes.dark).forEach((cls) => document.body.classList.remove(cls));\n\n document.body.classList.add(themeClass);\n\n return () => {\n document.body.classList.remove(themeClass);\n };\n }, [resolvedTheme, appliedPrimaryColor]);\n\n const contextValue: ThemeContextValue = {\n mode,\n resolvedTheme,\n primaryColor: appliedPrimaryColor,\n colors,\n setMode,\n setPrimaryColor,\n };\n\n return <ThemeContext.Provider value={contextValue}>{children}</ThemeContext.Provider>;\n}\n\nexport function useVanillaExtractTheme() {\n const context = useContext(ThemeContext);\n if (context === undefined) {\n throw new Error('useVanillaExtractTheme must be used within a VanillaExtractThemeProvider');\n }\n return context;\n}\n"],"mappings":";;;;;;;AAiBA,IAAM,gBAAA,GAAA,MAAA,eAA4D,KAAA,CAAS;AAS3E,SAAgB,4BAA4B,EAC1C,UACA,eAAe,UACf,eAAe,QACf,eACmC;CACnC,MAAM,CAAC,MAAM,YAAA,GAAA,MAAA,UAA+B,YAAY;CACxD,MAAM,CAAC,qBAAqB,oBAAA,GAAA,MAAA,UAA0C,YAAY;CAClF,MAAM,CAAC,aAAa,mBAAA,GAAA,MAAA,gBAAmD;EACrE,IAAI,aACF,OAAO;EAET,IAAI,OAAO,WAAW,aACpB,OAAO,OAAO,WAAW,8BAA8B,EAAE,UAAU,SAAS;EAE9E,OAAO;CACT,CAAC;CAED,CAAA,GAAA,MAAA,iBAAgB;EACd,gBAAgB,YAAY;CAC9B,GAAG,CAAC,YAAY,CAAC;CAEjB,CAAA,GAAA,MAAA,iBAAgB;EACd,IAAI,aAAa;GACf,eAAe,WAAW;GAC1B;EACF;EAEA,MAAM,aAAa,OAAO,WAAW,8BAA8B;EACnE,eAAe,WAAW,UAAU,SAAS,OAAO;EAEpD,MAAM,WAAW,MAA2B;GAC1C,eAAe,EAAE,UAAU,SAAS,OAAO;EAC7C;EAEA,WAAW,iBAAiB,UAAU,OAAO;EAC7C,aAAa,WAAW,oBAAoB,UAAU,OAAO;CAC/D,GAAG,CAAC,WAAW,CAAC;CAEhB,MAAM,gBAAkC,gBAAgB,SAAS,WAAW,cAAc;CAE1F,MAAM,aAAa,kBAAkB,SAAS,cAAA,aAAa,cAAA;CAE3D,MAAM,iBACJ,kBAAkB,SACd;EACE,SAAS,cAAA,WAAW,GAAG,oBAAoB;EAC3C,WAAW,cAAA,WAAW;EACtB,YAAY;EACZ,YAAY,cAAA,WAAW;EACvB,cAAc;EACd,SAAS;EACT,YAAY;EACZ,YAAY;EACZ,OAAO;EACP,iBAAiB;EACjB,MAAM;EACN,gBAAgB;EAChB,SAAS;EACT,mBAAmB;EACnB,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,kBAAkB;EAClB,aAAa;EACb,uBAAuB;EACvB,MAAM;CACR,IACA;EACE,SAAS,cAAA,YAAY,GAAG,oBAAoB;EAC5C,WAAW,cAAA,YAAY;EACvB,YAAY,cAAA,YAAY;EACxB,YAAY;EACZ,cAAc;EACd,SAAS;EACT,YAAY;EACZ,YAAY;EACZ,OAAO;EACP,iBAAiB;EACjB,MAAM;EACN,gBAAgB;EAChB,SAAS;EACT,mBAAmB;EACnB,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,kBAAkB;EAClB,aAAa;EACb,uBAAuB;EACvB,MAAM;CACR;CAEN,MAAM,SAAS;EACb,GAAG;EACH,GAAG;CACL;CAGA,CAAA,GAAA,MAAA,uBAAsB;EACpB,MAAM,aAAa,mBAAA,OAAO,eAAe;EAEzC,OAAO,OAAO,mBAAA,OAAO,KAAK,EAAE,SAAS,QAAQ,SAAS,KAAK,UAAU,OAAO,GAAG,CAAC;EAChF,OAAO,OAAO,mBAAA,OAAO,IAAI,EAAE,SAAS,QAAQ,SAAS,KAAK,UAAU,OAAO,GAAG,CAAC;EAE/E,SAAS,KAAK,UAAU,IAAI,UAAU;EAEtC,aAAa;GACX,SAAS,KAAK,UAAU,OAAO,UAAU;EAC3C;CACF,GAAG,CAAC,eAAe,mBAAmB,CAAC;CAEvC,MAAM,eAAkC;EACtC;EACA;EACA,cAAc;EACd;EACA;EACA;CACF;CAEA,OAAO,iBAAA,GAAA,kBAAA,KAAC,aAAa,UAAd;EAAuB,OAAO;EAAe;CAAgC,CAAA;AACtF;AAEA,SAAgB,yBAAyB;CACvC,MAAM,WAAA,GAAA,MAAA,YAAqB,YAAY;CACvC,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MAAM,0EAA0E;CAE5F,OAAO;AACT"}
|