@traefik-labs/faency 12.3.3 → 12.3.5
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/components/Accordion/Accordion.themes.cjs.map +1 -1
- package/dist/components/Accordion/Accordion.themes.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.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.vanilla.cjs.map +1 -1
- package/dist/components/Blockquote/Blockquote.vanilla.css.cjs +1 -0
- package/dist/components/Blockquote/Blockquote.vanilla.css.js +1 -0
- package/dist/components/Blockquote/Blockquote.vanilla.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.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.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.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.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.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.map +1 -1
- package/dist/components/CodeBlock/CodeBlock.vanilla.js.map +1 -1
- package/dist/components/CodeBlock/prism-extend.cjs.map +1 -1
- package/dist/components/CodeBlock/prism-extend.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/Elevation/Elevation.vanilla.cjs.map +1 -1
- package/dist/components/Elevation/Elevation.vanilla.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.vanilla.cjs.map +1 -1
- package/dist/components/Grid/Grid.vanilla.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.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.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.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.js.map +1 -1
- package/dist/components/Label/Label.vanilla.cjs.map +1 -1
- package/dist/components/Label/Label.vanilla.css.cjs +0 -1
- package/dist/components/Label/Label.vanilla.css.js +0 -1
- package/dist/components/Label/Label.vanilla.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/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/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.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.themes.cjs.map +1 -1
- package/dist/components/SidePanel/SidePanel.themes.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.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/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.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/package.json +22 -22
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.js","names":[],"sources":["../../../components/Textarea/Textarea.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Label } from '../Label';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\n// COMPONENTS\nconst StyledTextarea = styled('textarea', {\n // Reset\n appearance: 'none',\n overflow: 'auto', // force overflow auto behaviour cross-browser\n borderWidth: '0',\n boxSizing: 'border-box',\n fontFamily: '$rubik',\n margin: '0',\n outline: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n // Custom\n p: '$3',\n position: 'relative',\n flexGrow: 1, // make sure to grow fully inside TextareaWrapper\n backgroundColor: 'transparent',\n borderRadius: 'inherit', // inherit border radius from TextareaWrapper\n boxShadow: 'inset 0 0 0 1px $colors$textareaBorder',\n color: '$textareaText',\n fontVariantNumeric: 'tabular-nums',\n transition: 'box-shadow .1s ease-in-out',\n\n '&:-webkit-autofill,&:autofill': {\n boxShadow: 'inset 0 0 0 1px $colors$textareaBorder, inset 0 0 0 100px $colors$textareaBg',\n },\n\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontFamily: '$rubik',\n color: '$hiContrast',\n },\n\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$textareaFocusBorder, ${FOCUS_SHADOW}`,\n },\n\n '&::placeholder': {\n color: '$textareaPlaceholder',\n },\n\n '&:read-only:not(:disabled)': {\n boxShadow: 'none',\n },\n\n '&:disabled': {\n pointerEvents: 'none',\n opacity: 0.7,\n color: '$textareaDisabledText',\n },\n variants: {\n variant: {\n ghost: {\n boxShadow: 'none',\n '&:disabled': {\n boxShadow: 'none',\n },\n backgroundColor: 'transparent',\n '&:focus-visible': {\n backgroundColor: '$loContrast',\n },\n },\n },\n state: {\n invalid: {\n boxShadow: 'inset 0 0 0 1px $colors$textareaInvalidBorder',\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$textareaInvalidBorder, ${FOCUS_SHADOW}`,\n },\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$textareaInvalidBorder',\n },\n },\n },\n },\n },\n cursor: {\n default: {\n cursor: 'default',\n '@hover': {\n '&:hover:not(:read-only)': {\n cursor: 'text',\n },\n },\n '&:focus-visible:not(:read-only)': {\n cursor: 'text',\n },\n },\n text: {\n cursor: 'text',\n },\n },\n resize: {\n none: {\n resize: 'none',\n },\n both: {\n resize: 'both',\n },\n vertical: {\n resize: 'vertical',\n },\n horizontal: {\n resize: 'horizontal',\n },\n },\n endAdornment: {\n true: {\n paddingBottom: '$5',\n paddingRight: '$5',\n },\n },\n },\n defaultVariants: {\n cursor: 'default',\n resize: 'both',\n },\n compoundVariants: [\n {\n variant: 'ghost',\n state: 'invalid',\n css: {\n boxShadow: 'inset 0 0 0 1px $colors$textareaInvalidBorder',\n },\n },\n ],\n});\n\nconst TextareaWrapper = styled('div', {\n // Reset\n outline: 'none',\n lineHeight: 0,\n\n position: 'relative',\n display: 'inline-flex', // helps matching resizable content size\n backgroundColor: '$textareaBg',\n color: '$textareaPlaceholder',\n borderRadius: '$3',\n\n '&::before': {\n boxSizing: 'border-box',\n borderRadius: 'inherit',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n borderRadius: 'inherit',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$textareaFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: '$textareaHoverBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.05,\n },\n },\n },\n\n variants: {\n disabled: {\n true: {\n opacity: 0.7,\n color: '$textareaDisabledText',\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: 'inherit',\n },\n '&::after': {\n backgroundColor: 'inherit',\n },\n },\n },\n },\n },\n state: {\n invalid: {\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$textareaInvalidBorder',\n },\n },\n },\n },\n },\n },\n defaultVariants: {\n disabled: false,\n },\n});\n\nconst AdornmentWrapperEnd = styled('div', {\n position: 'absolute',\n bottom: '$2',\n right: '$3',\n minWidth: '$5',\n minHeight: '$5',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n});\n\nexport interface TextareaVariants\n extends Omit<VariantProps<typeof StyledTextarea>, 'endAdornment'> {}\n\nexport interface TextareaProps\n extends TextareaVariants,\n Omit<React.ComponentProps<typeof StyledTextarea>, 'endAdornment'> {\n label?: string;\n endAdornment?: React.ReactNode;\n rootCss?: CSS;\n}\n\nexport const Textarea = React.forwardRef<React.ElementRef<typeof StyledTextarea>, TextareaProps>(\n (\n { state, disabled, onFocus, onBlur, label, id, rootCss, css, endAdornment, ...props },\n forwardedRef\n ) => {\n const [hasFocus, setHasFocus] = React.useState(false);\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n\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 return (\n <Box css={rootCss}>\n {label && (\n <Label variant={labelVariant} htmlFor={id} css={{ display: 'block' }}>\n {label}\n </Label>\n )}\n <TextareaWrapper state={state} disabled={disabled}>\n <StyledTextarea\n id={id}\n ref={forwardedRef}\n css={css}\n disabled={disabled}\n state={state}\n onFocus={handleFocus}\n onBlur={handleBlur}\n endAdornment={hasEndAdornment}\n {...props}\n />\n {hasEndAdornment && <AdornmentWrapperEnd>{endAdornment}</AdornmentWrapperEnd>}\n </TextareaWrapper>\n </Box>\n );\n }\n);\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Textarea.js","names":[],"sources":["../../../components/Textarea/Textarea.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Label } from '../Label';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\n// COMPONENTS\nconst StyledTextarea = styled('textarea', {\n // Reset\n appearance: 'none',\n overflow: 'auto', // force overflow auto behaviour cross-browser\n borderWidth: '0',\n boxSizing: 'border-box',\n fontFamily: '$rubik',\n margin: '0',\n outline: 'none',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n // Custom\n p: '$3',\n position: 'relative',\n flexGrow: 1, // make sure to grow fully inside TextareaWrapper\n backgroundColor: 'transparent',\n borderRadius: 'inherit', // inherit border radius from TextareaWrapper\n boxShadow: 'inset 0 0 0 1px $colors$textareaBorder',\n color: '$textareaText',\n fontVariantNumeric: 'tabular-nums',\n transition: 'box-shadow .1s ease-in-out',\n\n '&:-webkit-autofill,&:autofill': {\n boxShadow: 'inset 0 0 0 1px $colors$textareaBorder, inset 0 0 0 100px $colors$textareaBg',\n },\n\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontFamily: '$rubik',\n color: '$hiContrast',\n },\n\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$textareaFocusBorder, ${FOCUS_SHADOW}`,\n },\n\n '&::placeholder': {\n color: '$textareaPlaceholder',\n },\n\n '&:read-only:not(:disabled)': {\n boxShadow: 'none',\n },\n\n '&:disabled': {\n pointerEvents: 'none',\n opacity: 0.7,\n color: '$textareaDisabledText',\n },\n variants: {\n variant: {\n ghost: {\n boxShadow: 'none',\n '&:disabled': {\n boxShadow: 'none',\n },\n backgroundColor: 'transparent',\n '&:focus-visible': {\n backgroundColor: '$loContrast',\n },\n },\n },\n state: {\n invalid: {\n boxShadow: 'inset 0 0 0 1px $colors$textareaInvalidBorder',\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$textareaInvalidBorder, ${FOCUS_SHADOW}`,\n },\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$textareaInvalidBorder',\n },\n },\n },\n },\n },\n cursor: {\n default: {\n cursor: 'default',\n '@hover': {\n '&:hover:not(:read-only)': {\n cursor: 'text',\n },\n },\n '&:focus-visible:not(:read-only)': {\n cursor: 'text',\n },\n },\n text: {\n cursor: 'text',\n },\n },\n resize: {\n none: {\n resize: 'none',\n },\n both: {\n resize: 'both',\n },\n vertical: {\n resize: 'vertical',\n },\n horizontal: {\n resize: 'horizontal',\n },\n },\n endAdornment: {\n true: {\n paddingBottom: '$5',\n paddingRight: '$5',\n },\n },\n },\n defaultVariants: {\n cursor: 'default',\n resize: 'both',\n },\n compoundVariants: [\n {\n variant: 'ghost',\n state: 'invalid',\n css: {\n boxShadow: 'inset 0 0 0 1px $colors$textareaInvalidBorder',\n },\n },\n ],\n});\n\nconst TextareaWrapper = styled('div', {\n // Reset\n outline: 'none',\n lineHeight: 0,\n\n position: 'relative',\n display: 'inline-flex', // helps matching resizable content size\n backgroundColor: '$textareaBg',\n color: '$textareaPlaceholder',\n borderRadius: '$3',\n\n '&::before': {\n boxSizing: 'border-box',\n borderRadius: 'inherit',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n borderRadius: 'inherit',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$textareaFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: '$textareaHoverBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.05,\n },\n },\n },\n\n variants: {\n disabled: {\n true: {\n opacity: 0.7,\n color: '$textareaDisabledText',\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: 'inherit',\n },\n '&::after': {\n backgroundColor: 'inherit',\n },\n },\n },\n },\n },\n state: {\n invalid: {\n '@hover': {\n '&:hover': {\n '&::after': {\n backgroundColor: '$textareaInvalidBorder',\n },\n },\n },\n },\n },\n },\n defaultVariants: {\n disabled: false,\n },\n});\n\nconst AdornmentWrapperEnd = styled('div', {\n position: 'absolute',\n bottom: '$2',\n right: '$3',\n minWidth: '$5',\n minHeight: '$5',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n});\n\nexport interface TextareaVariants\n extends Omit<VariantProps<typeof StyledTextarea>, 'endAdornment'> {}\n\nexport interface TextareaProps\n extends TextareaVariants,\n Omit<React.ComponentProps<typeof StyledTextarea>, 'endAdornment'> {\n label?: string;\n endAdornment?: React.ReactNode;\n rootCss?: CSS;\n}\n\nexport const Textarea = React.forwardRef<React.ElementRef<typeof StyledTextarea>, TextareaProps>(\n (\n { state, disabled, onFocus, onBlur, label, id, rootCss, css, endAdornment, ...props },\n forwardedRef\n ) => {\n const [hasFocus, setHasFocus] = React.useState(false);\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n\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 return (\n <Box css={rootCss}>\n {label && (\n <Label variant={labelVariant} htmlFor={id} css={{ display: 'block' }}>\n {label}\n </Label>\n )}\n <TextareaWrapper state={state} disabled={disabled}>\n <StyledTextarea\n id={id}\n ref={forwardedRef}\n css={css}\n disabled={disabled}\n state={state}\n onFocus={handleFocus}\n onBlur={handleBlur}\n endAdornment={hasEndAdornment}\n {...props}\n />\n {hasEndAdornment && <AdornmentWrapperEnd>{endAdornment}</AdornmentWrapperEnd>}\n </TextareaWrapper>\n </Box>\n );\n }\n);\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.themes.cjs","names":[],"sources":["../../../components/Textarea/Textarea.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n export type Colors = {\n textareaBg: Property.Color;\n textareaBorder: Property.Color;\n textareaFocusBg: Property.Color;\n textareaFocusBorder: Property.Color;\n textareaHoverBg: Property.Color;\n textareaText: Property.Color;\n textareaPlaceholder: Property.Color;\n textareaDisabledText: Property.Color;\n textareaInvalidBorder: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n textareaBg: '$deepBlue1',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(8),\n textareaHoverBg: '$whiteA9',\n textareaText: tinycolor('black').setAlpha(0.74).toHslString(),\n textareaPlaceholder: '$blackA10',\n textareaDisabledText: tinycolor('black').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n textareaBg: '$grayBlue7',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(11),\n textareaHoverBg: '$whiteA4',\n textareaText: tinycolor('white').setAlpha(0.8).toHslString(),\n textareaPlaceholder: '$whiteA10',\n textareaDisabledText: tinycolor('white').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;
|
|
1
|
+
{"version":3,"file":"Textarea.themes.cjs","names":[],"sources":["../../../components/Textarea/Textarea.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n export type Colors = {\n textareaBg: Property.Color;\n textareaBorder: Property.Color;\n textareaFocusBg: Property.Color;\n textareaFocusBorder: Property.Color;\n textareaHoverBg: Property.Color;\n textareaText: Property.Color;\n textareaPlaceholder: Property.Color;\n textareaDisabledText: Property.Color;\n textareaInvalidBorder: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n textareaBg: '$deepBlue1',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(8),\n textareaHoverBg: '$whiteA9',\n textareaText: tinycolor('black').setAlpha(0.74).toHslString(),\n textareaPlaceholder: '$blackA10',\n textareaDisabledText: tinycolor('black').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n textareaBg: '$grayBlue7',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(11),\n textareaHoverBg: '$whiteA4',\n textareaText: tinycolor('white').setAlpha(0.8).toHslString(),\n textareaPlaceholder: '$whiteA10',\n textareaDisabledText: tinycolor('white').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n}\n"],"mappings":";;;;AAKO,IAAA;;CAeQ,OAAA,YAAqB,kBAAkB;EAClD,YAAY;EACZ,gBAAgB;EAChB,kBAAA,GAAA,WAAA,SAA2B,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EAChE,qBAAqB,aAAa,QAAQ,UAAU,EAAE;EACtD,iBAAiB;EACjB,eAAA,GAAA,WAAA,SAAwB,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EAC7D,qBAAqB;EACrB,uBAAA,GAAA,WAAA,SAAgC,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EACrE,uBAAuB;EACxB;CAEY,OAAA,WAAoB,kBAAkB;EACjD,YAAY;EACZ,gBAAgB;EAChB,kBAAA,GAAA,WAAA,SAA2B,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EAChE,qBAAqB,aAAa,QAAQ,UAAU,GAAG;EACvD,iBAAiB;EACjB,eAAA,GAAA,WAAA,SAAwB,QAAQ,CAAC,SAAS,GAAI,CAAC,aAAa;EAC5D,qBAAqB;EACrB,uBAAA,GAAA,WAAA,SAAgC,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EACrE,uBAAuB;EACxB;yBACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.themes.js","names":[],"sources":["../../../components/Textarea/Textarea.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n export type Colors = {\n textareaBg: Property.Color;\n textareaBorder: Property.Color;\n textareaFocusBg: Property.Color;\n textareaFocusBorder: Property.Color;\n textareaHoverBg: Property.Color;\n textareaText: Property.Color;\n textareaPlaceholder: Property.Color;\n textareaDisabledText: Property.Color;\n textareaInvalidBorder: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n textareaBg: '$deepBlue1',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(8),\n textareaHoverBg: '$whiteA9',\n textareaText: tinycolor('black').setAlpha(0.74).toHslString(),\n textareaPlaceholder: '$blackA10',\n textareaDisabledText: tinycolor('black').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n textareaBg: '$grayBlue7',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(11),\n textareaHoverBg: '$whiteA4',\n textareaText: tinycolor('white').setAlpha(0.8).toHslString(),\n textareaPlaceholder: '$whiteA10',\n textareaDisabledText: tinycolor('white').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n}\n"],"mappings":";;AAKO,IAAA;;
|
|
1
|
+
{"version":3,"file":"Textarea.themes.js","names":[],"sources":["../../../components/Textarea/Textarea.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n export type Colors = {\n textareaBg: Property.Color;\n textareaBorder: Property.Color;\n textareaFocusBg: Property.Color;\n textareaFocusBorder: Property.Color;\n textareaHoverBg: Property.Color;\n textareaText: Property.Color;\n textareaPlaceholder: Property.Color;\n textareaDisabledText: Property.Color;\n textareaInvalidBorder: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n textareaBg: '$deepBlue1',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(8),\n textareaHoverBg: '$whiteA9',\n textareaText: tinycolor('black').setAlpha(0.74).toHslString(),\n textareaPlaceholder: '$blackA10',\n textareaDisabledText: tinycolor('black').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n textareaBg: '$grayBlue7',\n textareaBorder: '$grayBlue9',\n textareaFocusBg: tinycolor('black').setAlpha(0.15).toHslString(),\n textareaFocusBorder: primaryColor.helpers.pickScale(11),\n textareaHoverBg: '$whiteA4',\n textareaText: tinycolor('white').setAlpha(0.8).toHslString(),\n textareaPlaceholder: '$whiteA10',\n textareaDisabledText: tinycolor('white').setAlpha(0.35).toHslString(),\n textareaInvalidBorder: '$red9',\n });\n}\n"],"mappings":";;AAKO,IAAA;;CAeQ,OAAA,YAAqB,kBAAkB;EAClD,YAAY;EACZ,gBAAgB;EAChB,iBAAiB,UAAU,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EAChE,qBAAqB,aAAa,QAAQ,UAAU,EAAE;EACtD,iBAAiB;EACjB,cAAc,UAAU,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EAC7D,qBAAqB;EACrB,sBAAsB,UAAU,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EACrE,uBAAuB;EACxB;CAEY,OAAA,WAAoB,kBAAkB;EACjD,YAAY;EACZ,gBAAgB;EAChB,iBAAiB,UAAU,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EAChE,qBAAqB,aAAa,QAAQ,UAAU,GAAG;EACvD,iBAAiB;EACjB,cAAc,UAAU,QAAQ,CAAC,SAAS,GAAI,CAAC,aAAa;EAC5D,qBAAqB;EACrB,sBAAsB,UAAU,QAAQ,CAAC,SAAS,IAAK,CAAC,aAAa;EACrE,uBAAuB;EACxB;yBACF"}
|
|
@@ -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,MAAM;CACrD,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,UAAU,MAAA,QAAM,cAAc,UAAU,WAAW,CAAC,MAAM,CAAC;CACjE,MAAM,kBAAkB,MAAA,QAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;CAElF,MAAM,eAAe,MAAA,QAAM,cAAc;
|
|
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,MAAM;CACrD,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,UAAU,MAAA,QAAM,cAAc,UAAU,WAAW,CAAC,MAAM,CAAC;CACjE,MAAM,kBAAkB,MAAA,QAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;CAElF,MAAM,eAAe,MAAA,QAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,UACF,OAAO;EAET,OAAO;IACN;EAAC;EAAS;EAAU;EAAS,CAAC;CAEjC,MAAM,cAAc,MAAA,QAAM,aACvB,MAA6C;EAC5C,IAAI,SACF,QAAQ,EAAE;EAEZ,YAAY,KAAK;IAEnB,CAAC,SAAS,YAAY,CACvB;CAED,MAAM,aAAa,MAAA,QAAM,aACtB,MAA6C;EAC5C,IAAI,QACF,OAAO,EAAE;EAEX,YAAY,MAAM;IAEpB,CAAC,QAAQ,YAAY,CACtB;CAED,MAAM,EAAE,OAAO,eAAe,MAAM,aAAa,iBAAA,eAAe,SAAS,OAAO;CAChF,MAAM,mBAAmB;EAAE,GAAG;EAAe,IAAA,GAAA,yBAAA,kBAAoB,SAAS;EAAE;CAE5E,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAC9D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAAE;CAE1E,MAAM,uBAAuB,6BAAA,sBAAsB;EAAE;EAAO;EAAU,CAAC;CACvE,MAAM,sBAAsB,6BAAA,qBAAqB;EAC/C;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;CAEF,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,SAAS;aACxE;GACY,CAAA,EAEjB,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAW;aAAhB,CACE,iBAAA,GAAA,kBAAA,KAAC,YAAD;IACM;IACJ,KAAK;IACL,WAAW,GAAG,oBAAoB,GAAG,aAAa,KAAK,MAAM;IAC7D,OAAO;IACG;IACV,SAAS;IACT,QAAQ;IACR,GAAI;IACJ,CAAA,EACD,mBAAmB,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAA;cAAiC;IAAmB,CAAA,CACzE;KACF;;EAGX;AAED,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,MAAM;CACrD,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,UAAU,MAAM,cAAc,UAAU,WAAW,CAAC,MAAM,CAAC;CACjE,MAAM,kBAAkB,MAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;CAElF,MAAM,eAAe,MAAM,cAAc;
|
|
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,MAAM;CACrD,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,UAAU,MAAM,cAAc,UAAU,WAAW,CAAC,MAAM,CAAC;CACjE,MAAM,kBAAkB,MAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;CAElF,MAAM,eAAe,MAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,UACF,OAAO;EAET,OAAO;IACN;EAAC;EAAS;EAAU;EAAS,CAAC;CAEjC,MAAM,cAAc,MAAM,aACvB,MAA6C;EAC5C,IAAI,SACF,QAAQ,EAAE;EAEZ,YAAY,KAAK;IAEnB,CAAC,SAAS,YAAY,CACvB;CAED,MAAM,aAAa,MAAM,aACtB,MAA6C;EAC5C,IAAI,QACF,OAAO,EAAE;EAEX,YAAY,MAAM;IAEpB,CAAC,QAAQ,YAAY,CACtB;CAED,MAAM,EAAE,OAAO,eAAe,MAAM,aAAa,eAAe,SAAS,OAAO;CAChF,MAAM,mBAAmB;EAAE,GAAG;EAAe,GAAG,iBAAiB,SAAS;EAAE;CAE5E,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAC9D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,GAAG,iBAAiB,KAAK;EAAE;CAE1E,MAAM,uBAAuB,sBAAsB;EAAE;EAAO;EAAU,CAAC;CACvE,MAAM,sBAAsB,qBAAqB;EAC/C;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;CAEF,OACE,qBAAC,OAAD;EAAK,OAAO;YAAZ,CACG,SACC,oBAAC,cAAD;GAAc,SAAS;GAAc,SAAS;GAAI,KAAK,EAAE,SAAS,SAAS;aACxE;GACY,CAAA,EAEjB,qBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,oBAAC,YAAD;IACM;IACJ,KAAK;IACL,WAAW,GAAG,oBAAoB,GAAG,aAAa,KAAK,MAAM;IAC7D,OAAO;IACG;IACV,SAAS;IACT,QAAQ;IACR,GAAI;IACJ,CAAA,EACD,mBAAmB,oBAAC,OAAD;IAAK,WAAA;cAAiC;IAAmB,CAAA,CACzE;KACF;;EAGX;AAED,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;EACL,EACF,EACF;CACF,CAAC;AAEF,IAAM,WAAW,wBAAA,OAAO,YAAA,KAAK,EAC3B,OAAO,qBACR,CAAC;AAEF,IAAa,iBAAiB,MAAA,QAAM,YAGjC,EAAE,KAAK,WAAW,UAAU,GAAG,SAAS,iBAAiB;CAC1D,MAAM,kBAAkB,MAAA,QAAM,cAAc,OAAO,aAAa,UAAU,CAAC,SAAS,CAAC;
|
|
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;EACL,EACF,EACF;CACF,CAAC;AAEF,IAAM,WAAW,wBAAA,OAAO,YAAA,KAAK,EAC3B,OAAO,qBACR,CAAC;AAEF,IAAa,iBAAiB,MAAA,QAAM,YAGjC,EAAE,KAAK,WAAW,UAAU,GAAG,SAAS,iBAAiB;CAC1D,MAAM,kBAAkB,MAAA,QAAM,cAAc,OAAO,aAAa,UAAU,CAAC,SAAS,CAAC;CACrF,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;IAClC;GAEA;GACI,CAAA,GAEP,UAEF,iBAAA,GAAA,kBAAA,KAAC,UAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,wBAAiB,OAAlB;GACE,QAAQ;GACR,OAAO;GACP,QAAQ;GACR,OAAO,EACL,MAAM,gBACP;GACD,CAAA,EACO,CAAA,CACH;;EAEZ;AAEF,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;EAAoC,CAAA,EACvE,iBAAA,GAAA,kBAAA,KAAC,wBAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;EAAqB;EAAgB;EAAW,KAAK;EAAc,GAAI;YACpE;EACc,CAAA,EACO,CAAA,CACJ;GAE3B;AAED,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;EACL,EACF,EACF;CACF,CAAC;AAEF,IAAM,WAAW,OAAO,KAAK,EAC3B,OAAO,qBACR,CAAC;AAEF,IAAa,iBAAiB,MAAM,YAGjC,EAAE,KAAK,WAAW,UAAU,GAAG,SAAS,iBAAiB;CAC1D,MAAM,kBAAkB,MAAM,cAAc,OAAO,aAAa,UAAU,CAAC,SAAS,CAAC;
|
|
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;EACL,EACF,EACF;CACF,CAAC;AAEF,IAAM,WAAW,OAAO,KAAK,EAC3B,OAAO,qBACR,CAAC;AAEF,IAAa,iBAAiB,MAAM,YAGjC,EAAE,KAAK,WAAW,UAAU,GAAG,SAAS,iBAAiB;CAC1D,MAAM,kBAAkB,MAAM,cAAc,OAAO,aAAa,UAAU,CAAC,SAAS,CAAC;CACrF,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;IAClC;GAEA;GACI,CAAA,GAEP,UAEF,oBAAC,UAAD,EAAA,UACE,oBAAC,iBAAiB,OAAlB;GACE,QAAQ;GACR,OAAO;GACP,QAAQ;GACR,OAAO,EACL,MAAM,gBACP;GACD,CAAA,EACO,CAAA,CACH;;EAEZ;AAEF,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;EAAoC,CAAA,EACvE,oBAAC,iBAAiB,QAAlB,EAAA,UACE,oBAAC,gBAAD;EAAqB;EAAgB;EAAW,KAAK;EAAc,GAAI;YACpE;EACc,CAAA,EACO,CAAA,CACJ;GAE3B;AAED,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;EACd;CAEY,OAAA,iBAA0B;EACrC,kBAAkB;EAClB,aAAa;EACd;yBACF"}
|
|
@@ -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;EACd;CAEY,OAAA,iBAA0B;EACrC,kBAAkB;EAClB,aAAa;EACd;yBACF"}
|
|
@@ -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,OAAO,EAAE,OAAO;CAC1C,IAAI,GAAG,UAAU,SAAS,QAAQ,EAAE,OAAO;CAC3C,MAAM,OAAO,GAAG,QAAQ;CACxB,IAAI,SAAS,UAAU,SAAS,SAAS,OAAO;CAChD,OAAO;;AAGT,IAAM,sBAAA,GAAA,MAAA,eAAgD,QAAQ;AAE9D,SAAgB,oBAAoB,EAAE,YAA2C;CAC/E,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,gBAAyC;EACtD,IAAI,OAAO,WAAW,aAAa,OAAO;EAC1C,OACE,mBAAmB,KAClB,OAAO,WAAW,+BAA+B,CAAC,UAAU,SAAS;GAExE;CAEF,CAAA,GAAA,MAAA,iBAAgB;EACd,MAAM,WAAW,IAAI,uBAAuB;GAC1C,MAAM,WAAW,mBAAmB;GACpC,IAAI,UAAU,UAAU,SAAS;IACjC;EACF,SAAS,QAAQ,SAAS,iBAAiB;GACzC,YAAY;GACZ,iBAAiB,CAAC,SAAS,aAAa;GACzC,CAAC;EAEF,MAAM,KAAK,OAAO,WAAW,+BAA+B;EAC5D,MAAM,aAAa,MAA2B;GAC5C,IAAI,CAAC,mBAAmB,EAAE,UAAU,EAAE,UAAU,SAAS,QAAQ;;EAEnE,GAAG,iBAAiB,UAAU,UAAU;EAExC,aAAa;GACX,SAAS,YAAY;GACrB,GAAG,oBAAoB,UAAU,UAAU;;IAE5C,EAAE,CAAC;CAEN,OAAO,iBAAA,GAAA,kBAAA,KAAC,mBAAmB,UAApB;EAA6B,OAAO;EAAS;EAAuC,CAAA;;AAG7F,SAAgB,iBAA8B;CAC5C,QAAA,GAAA,MAAA,YAAkB,mBAAmB"}
|
|
@@ -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,OAAO,EAAE,OAAO;CAC1C,IAAI,GAAG,UAAU,SAAS,QAAQ,EAAE,OAAO;CAC3C,MAAM,OAAO,GAAG,QAAQ;CACxB,IAAI,SAAS,UAAU,SAAS,SAAS,OAAO;CAChD,OAAO;;AAGT,IAAM,qBAAqB,cAA2B,QAAQ;AAE9D,SAAgB,oBAAoB,EAAE,YAA2C;CAC/E,MAAM,CAAC,QAAQ,aAAa,eAA4B;EACtD,IAAI,OAAO,WAAW,aAAa,OAAO;EAC1C,OACE,mBAAmB,KAClB,OAAO,WAAW,+BAA+B,CAAC,UAAU,SAAS;GAExE;CAEF,gBAAgB;EACd,MAAM,WAAW,IAAI,uBAAuB;GAC1C,MAAM,WAAW,mBAAmB;GACpC,IAAI,UAAU,UAAU,SAAS;IACjC;EACF,SAAS,QAAQ,SAAS,iBAAiB;GACzC,YAAY;GACZ,iBAAiB,CAAC,SAAS,aAAa;GACzC,CAAC;EAEF,MAAM,KAAK,OAAO,WAAW,+BAA+B;EAC5D,MAAM,aAAa,MAA2B;GAC5C,IAAI,CAAC,mBAAmB,EAAE,UAAU,EAAE,UAAU,SAAS,QAAQ;;EAEnE,GAAG,iBAAiB,UAAU,UAAU;EAExC,aAAa;GACX,SAAS,YAAY;GACrB,GAAG,oBAAoB,UAAU,UAAU;;IAE5C,EAAE,CAAC;CAEN,OAAO,oBAAC,mBAAmB,UAApB;EAA6B,OAAO;EAAS;EAAuC,CAAA;;AAG7F,SAAgB,iBAA8B;CAC5C,OAAO,WAAW,mBAAmB"}
|
|
@@ -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":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,IAAM,iBAA+B;AAErC,IAAM,sBAAsB,oBAAoB,gBAAgB,YAAY;AA2L5E,IAAa,EAAE,QAAQ,KAAK,aAAa,YAAY,WAAW,WAAW,WA7K1D,eAAe;CAC9B,OAAO;EACL,QAAQ;GAbV,GAAG;GAGH,SAAS;GACT,WAAW;GACX,YAAY;GACZ,YAAY;GACZ,cAAc;GACd,SAAS;GAOL,GAAG,MAAe,SAAS,oBAAoB;GAC/C,GAAG,QAAW,SAAS,oBAAoB;GAC3C,GAAG,QAAY,SAAS,oBAAoB;GAC5C,GAAG,QAAkB,SAAS,oBAAoB;GAClD,GAAG,SAAY,SAAS,oBAAoB;GAC5C,GAAG,QAAU,SAAS,oBAAoB;GAC1C,GAAG,QAAc,SAAS,oBAAoB;GAC9C,GAAG,QAAe,UAAU;GAC5B,GAAG,SAAU,SAAS,oBAAoB;GAC1C,GAAG,SAAU,SAAS,oBAAoB;GAC1C,GAAG,SAAW,SAAS,oBAAoB;GAC3C,GAAG,SAAW,SAAS,oBAAoB;GAC3C,GAAG,SAAW,SAAS,oBAAoB;GAC3C,GAAG,SAAU,SAAS,oBAAoB;GAC1C,GAAG,SAAY,SAAS,oBAAoB;GAC5C,GAAG,SAAc,SAAS,oBAAoB;GAC9C,GAAG,QAAY,SAAS,oBAAoB;GAC5C,GAAG,QAAgB,SAAS,oBAAoB;GAChD,GAAG,SAAa,SAAS,oBAAoB;GAC7C,GAAG,SAAc,SAAS,oBAAoB;GAC9C,GAAG,QAAa,SAAS,oBAAoB;GAC7C,GAAG,SAAe,SAAS,oBAAoB;GAChD;EACD,OAAO,EACL,OACE,mGACH;EACD,OAAO;GACL,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACJ;EACD,OAAO;GACL,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,IAAI;GACL;EACD,WAAW;GACT,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,IAAI;GACJ,IAAI;GACJ,IAAI;GACL;EACD,aAAa;GAAE,OAAO;GAAK,SAAS;GAAK,QAAQ;GAAK,UAAU;GAAK,MAAM;GAAK;EAChF,OAAO;GAAE,GAAG;GAAO,GAAG;GAAO,GAAG;GAAO,GAAG;GAAQ,OAAO;GAAO,MAAM;GAAU,QAAQ;GAAO;EAC/F,UAAU;GAAE,GAAG;GAAO,GAAG;GAAO,GAAG;GAAO,GAAG;GAAO,KAAK;GAAO;EACjE;CACD,OAAO;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,QAAQ;EACR,OAAO;EACP,MAAM;EACN,OAAO;EACR;CACD,OAAO;EACL,IAAI,WAA8C,EAAE,SAAS,OAAO;EACpE,KAAK,WAAiD,EAAE,YAAY,OAAO;EAC3E,KAAK,WAAmD,EAAE,cAAc,OAAO;EAC/E,KAAK,WAAoD,EAAE,eAAe,OAAO;EACjF,KAAK,WAAkD,EAAE,aAAa,OAAO;EAC7E,KAAK,WAAkD;GACrD,aAAa;GACb,cAAc;GACf;EACD,KAAK,WAAiD;GACpD,YAAY;GACZ,eAAe;GAChB;EAED,IAAI,WAA6C,EAAE,QAAQ,OAAO;EAClE,KAAK,WAAgD,EAAE,WAAW,OAAO;EACzE,KAAK,WAAkD,EAAE,aAAa,OAAO;EAC7E,KAAK,WAAmD,EAAE,cAAc,OAAO;EAC/E,KAAK,WAAiD,EAAE,YAAY,OAAO;EAC3E,KAAK,WAAiD;GACpD,YAAY;GACZ,aAAa;GACd;EACD,KAAK,WAAgD;GAAE,WAAW;GAAO,cAAc;GAAO;EAE9F,KAAK,WAAgD,EAAE,WAAW,OAAO;EAEzE,KAAK,WAAoD,EAAE,eAAe,OAAO;EACjF,KAAK,WAA+C,EAAE,UAAU,OAAO;EAEvE,KAAK,WAAiD,EAAE,YAAY,OAAO;EAC3E,KAAK,WAAmD,EAAE,cAAc,OAAO;EAC/E,KAAK,WAAqD,EAAE,gBAAgB,OAAO;EACnF,KAAK,WAAgD,EAAE,WAAW,OAAO;EACzE,KAAK,WAA+C,EAAE,UAAU,OAAO;EACvE,KAAK,WAAiD,EAAE,YAAY,OAAO;EAC3E,KAAK,WAAgD,EAAE,WAAW,OAAO;EAEzE,KAAK,WAAsD,EAAE,iBAAiB,OAAO;EAErF,KAAK,WAAmD,EAAE,cAAc,OAAO;EAC/E,OAAO,WAA2D,EAChE,sBAAsB,OACvB;EACD,OAAO,WAA8D,EACnE,yBAAyB,OAC1B;EACD,OAAO,WAA6D,EAClE,wBAAwB,OACzB;EACD,OAAO,WAA0D,EAC/D,qBAAqB,OACtB;EAED,KAAK,WAAgD,EAAE,WAAW,OAAO;EAEzE,IAAI,WAA4C,EAAE,OAAO,OAAO;EAEhE,KAAK,WAAiD,EAAE,YAAY,OAAO;EAE3E,KAAK,WAAgD,EAAE,WAAW,OAAO;EACzE,KAAK,WAAgD,EAAE,WAAW,OAAO;EAEzE,KAAK,WAAoD,EAAE,eAAe,OAAO;EACjF,KAAK,WAAiD;GACpD,kBAAkB;GAClB,YAAY;GACb;EAED,aAAa,WAAiD;GAC5D,kBAAkB;GAClB,YAAY;GACb;EAED,OAAO,WAA4C;GAAE,OAAO;GAAO,QAAQ;GAAO;EAElF,aAAa,WAAiD;GAC5D,kBAAkB;GAClB,YAAY;GACb;EACD,iBAAiB,WAAqD;GACpE,sBAAsB;GACtB,gBAAgB;GACjB;EACF;CACF,CAIqF;AAGjE,OAAO;AAE5B,IAAa,aAAa,SAAuB,OAAO,WAAW;CACjE,MAAM,mBAAmB,oBAAoB,SAAS,WAAW;AAEjE,QAAO,YAAY,MAAM,EACvB,QAAQ;EACN,GAAG;EAGH,SAAS,iBAAiB;EAC1B,WAAW;EACX,YAAY;EACZ,YAAY;EACZ,SAAS;EACT,GAAG,MAAe,QAAQ,iBAAiB;EAC3C,GAAG,QAAW,QAAQ,iBAAiB;EACvC,GAAG,QAAY,QAAQ,iBAAiB;EACxC,GAAG,QAAkB,QAAQ,iBAAiB;EAC9C,GAAG,QAAgB,QAAQ,iBAAiB;EAC5C,GAAG,SAAY,QAAQ,iBAAiB;EACxC,GAAG,QAAU,QAAQ,iBAAiB;EACtC,GAAG,QAAc,QAAQ,iBAAiB;EAC1C,GAAG,QAAe,SAAS;EAC3B,GAAG,SAAU,QAAQ,iBAAiB;EACtC,GAAG,SAAU,QAAQ,iBAAiB;EACtC,GAAG,SAAW,QAAQ,iBAAiB;EACvC,GAAG,SAAW,QAAQ,iBAAiB;EACvC,GAAG,SAAW,QAAQ,iBAAiB;EACvC,GAAG,SAAU,QAAQ,iBAAiB;EACtC,GAAG,SAAY,QAAQ,iBAAiB;EACxC,GAAG,SAAc,QAAQ,iBAAiB;EAC1C,GAAG,QAAY,QAAQ,iBAAiB;EACxC,GAAG,SAAgB,QAAQ,iBAAiB;EAC5C,GAAG,SAAa,QAAQ,iBAAiB;EACzC,GAAG,SAAc,QAAQ,iBAAiB;EAC1C,GAAG,QAAa,QAAQ,iBAAiB;EACzC,GAAG,SAAe,QAAQ,iBAAiB;EAC5C,EACF,CAAC;;AAGJ,IAAa,cAAc,SAAuB,OAAO,YAAY;CACnE,MAAM,oBAAoB,oBAAoB,SAAS,YAAY;AAEnE,QAAO,YAAY,MAAM,EACvB,QAAQ;EACN,SAAS,kBAAkB;EAC3B,GAAG,MAAe,SAAS,kBAAkB;EAC7C,GAAG,QAAW,SAAS,kBAAkB;EACzC,GAAG,QAAY,SAAS,kBAAkB;EAC1C,GAAG,QAAkB,SAAS,kBAAkB;EAChD,GAAG,QAAgB,SAAS,kBAAkB;EAC9C,GAAG,SAAY,SAAS,kBAAkB;EAC1C,GAAG,QAAU,SAAS,kBAAkB;EACxC,GAAG,QAAc,SAAS,kBAAkB;EAC5C,GAAG,QAAe,UAAU;EAC5B,GAAG,SAAU,SAAS,kBAAkB;EACxC,GAAG,SAAU,SAAS,kBAAkB;EACxC,GAAG,SAAW,SAAS,kBAAkB;EACzC,GAAG,SAAW,SAAS,kBAAkB;EACzC,GAAG,SAAW,SAAS,kBAAkB;EACzC,GAAG,SAAU,SAAS,kBAAkB;EACxC,GAAG,SAAY,SAAS,kBAAkB;EAC1C,GAAG,SAAc,SAAS,kBAAkB;EAC5C,GAAG,QAAY,SAAS,kBAAkB;EAC1C,GAAG,SAAgB,SAAS,kBAAkB;EAC9C,GAAG,SAAa,SAAS,kBAAkB;EAC3C,GAAG,SAAc,SAAS,kBAAkB;EAC5C,GAAG,QAAa,SAAS,kBAAkB;EAC3C,GAAG,SAAe,SAAS,kBAAkB;EAC9C,EACF,CAAC"}
|
|
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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"}
|