@traefik-labs/faency 12.3.2 → 12.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/dist/components/AriaTable/AriaTable.cjs.map +1 -1
  2. package/dist/components/AriaTable/AriaTable.js.map +1 -1
  3. package/dist/components/Avatar/Avatar.vanilla.cjs.map +1 -1
  4. package/dist/components/Avatar/Avatar.vanilla.js.map +1 -1
  5. package/dist/components/Badge/Badge.cjs.map +1 -1
  6. package/dist/components/Badge/Badge.js.map +1 -1
  7. package/dist/components/Badge/Badge.vanilla.cjs.map +1 -1
  8. package/dist/components/Badge/Badge.vanilla.js.map +1 -1
  9. package/dist/components/Blockquote/Blockquote.vanilla.cjs.map +1 -1
  10. package/dist/components/Blockquote/Blockquote.vanilla.css.cjs +0 -1
  11. package/dist/components/Blockquote/Blockquote.vanilla.css.js +0 -1
  12. package/dist/components/Blockquote/Blockquote.vanilla.js.map +1 -1
  13. package/dist/components/Box/Box.cjs.map +1 -1
  14. package/dist/components/Bubble/Bubble.js.map +1 -1
  15. package/dist/components/Bubble/Bubble.vanilla.cjs.map +1 -1
  16. package/dist/components/Bubble/Bubble.vanilla.js.map +1 -1
  17. package/dist/components/Button/Button.cjs.map +1 -1
  18. package/dist/components/Button/Button.js.map +1 -1
  19. package/dist/components/Button/Button.vanilla.cjs.map +1 -1
  20. package/dist/components/Button/Button.vanilla.js.map +1 -1
  21. package/dist/components/CodeBlock/CodeBlock.cjs +1 -0
  22. package/dist/components/CodeBlock/CodeBlock.cjs.map +1 -1
  23. package/dist/components/CodeBlock/CodeBlock.vanilla.cjs +1 -0
  24. package/dist/components/CodeBlock/CodeBlock.vanilla.cjs.map +1 -1
  25. package/dist/components/CodeBlock/prism-extend.cjs +25 -0
  26. package/dist/components/CodeBlock/prism-extend.cjs.map +1 -0
  27. package/dist/components/Container/Container.cjs.map +1 -1
  28. package/dist/components/Container/Container.vanilla.cjs.map +1 -1
  29. package/dist/components/Container/Container.vanilla.js.map +1 -1
  30. package/dist/components/DateTimePickerInput/DateTimePickerInput.cjs.map +1 -1
  31. package/dist/components/DateTimePickerInput/DateTimePickerInput.js.map +1 -1
  32. package/dist/components/Elevation/Elevation.vanilla.cjs.map +1 -1
  33. package/dist/components/Elevation/Elevation.vanilla.js.map +1 -1
  34. package/dist/components/Flex/Flex.cjs.map +1 -1
  35. package/dist/components/Flex/Flex.vanilla.cjs.map +1 -1
  36. package/dist/components/Flex/Flex.vanilla.js.map +1 -1
  37. package/dist/components/Grid/Grid.cjs.map +1 -1
  38. package/dist/components/Grid/Grid.vanilla.cjs.map +1 -1
  39. package/dist/components/Grid/Grid.vanilla.js.map +1 -1
  40. package/dist/components/IconButton/IconButton.vanilla.cjs.map +1 -1
  41. package/dist/components/IconButton/IconButton.vanilla.js.map +1 -1
  42. package/dist/components/Image/Image.cjs.map +1 -1
  43. package/dist/components/Input/Input.cjs.map +1 -1
  44. package/dist/components/Input/Input.js.map +1 -1
  45. package/dist/components/Label/Label.vanilla.cjs.map +1 -1
  46. package/dist/components/Label/Label.vanilla.css.cjs +1 -0
  47. package/dist/components/Label/Label.vanilla.css.js +1 -0
  48. package/dist/components/Label/Label.vanilla.js.map +1 -1
  49. package/dist/components/NavigationTree/NavigationTreeItem.cjs.map +1 -1
  50. package/dist/components/NavigationTree/NavigationTreeItem.js.map +1 -1
  51. package/dist/components/Paragraph/Paragraph.vanilla.cjs.map +1 -1
  52. package/dist/components/Paragraph/Paragraph.vanilla.js.map +1 -1
  53. package/dist/components/Popover/Popover.cjs.map +1 -1
  54. package/dist/components/Popover/Popover.js.map +1 -1
  55. package/dist/components/Skeleton/Skeleton.js.map +1 -1
  56. package/dist/components/Skeleton/Skeleton.vanilla.cjs.map +1 -1
  57. package/dist/components/Skeleton/Skeleton.vanilla.js.map +1 -1
  58. package/dist/components/Table/Table.cjs.map +1 -1
  59. package/dist/components/Table/Table.js.map +1 -1
  60. package/dist/components/Text/Text.cjs.map +1 -1
  61. package/dist/stitches.config.cjs.map +1 -1
  62. package/dist/stitches.config.js.map +1 -1
  63. package/dist/styles/cssProps.cjs.map +1 -1
  64. package/dist/styles/cssProps.js.map +1 -1
  65. package/package.json +6 -3
@@ -3,6 +3,7 @@ const require_AccessibleIcon = require("../AccessibleIcon/AccessibleIcon.cjs");
3
3
  const require_cssProps = require("../../styles/cssProps.cjs");
4
4
  const require_themeContext = require("../../styles/themeContext.cjs");
5
5
  const require_Button_vanilla = require("../Button/Button.vanilla.cjs");
6
+ require("./prism-extend.cjs");
6
7
  const require_CodeBlock_vanilla_css = require("./CodeBlock.vanilla.css.cjs");
7
8
  let _radix_ui_react_icons = require("@radix-ui/react-icons");
8
9
  let react = require("react");
@@ -1 +1 @@
1
- {"version":3,"file":"CodeBlock.vanilla.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n forwardRef,\n HTMLAttributes,\n useCallback,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n codeContent,\n codeContentBottomPadding,\n codeContentTopPadding,\n copyButtonWrapperBottomLeft,\n copyButtonWrapperBottomRight,\n copyButtonWrapperTop,\n copyButtonWrapperTopLeft,\n pre,\n preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n lang?: CodeBlockLanguage;\n code: string;\n copyable?: boolean;\n copyText?: string;\n copiedText?: string;\n copyButtonAlign?: CodeBlockCopyButtonAlign;\n onCopy?: () => void;\n noBorder?: boolean;\n wrapText?: boolean;\n colorScheme?: 'light' | 'dark';\n maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n (\n {\n lang = 'text',\n code,\n copyable = false,\n copyText,\n copiedText,\n copyButtonAlign = 'top right',\n onCopy,\n noBorder,\n wrapText = false,\n colorScheme,\n maxHeight = 424,\n css,\n style,\n className,\n ...props\n },\n ref,\n ) => {\n const { colors, resolvedTheme } = useVanillaExtractTheme();\n const effectiveScheme = colorScheme ?? resolvedTheme;\n const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n const isBottom = copyButtonAlign.includes('bottom');\n const isLeft = copyButtonAlign.includes('left');\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const containerStyles = {\n position: 'relative' as const,\n ...cssStyles,\n ...assignInlineVars(vars),\n };\n\n const [copied, setCopied] = useState(false);\n\n const preRef = useRef<HTMLPreElement | null>(\n null,\n ) as React.MutableRefObject<HTMLPreElement | null>;\n const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n const setPreRef = useCallback(\n (node: HTMLPreElement | null) => {\n preRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n },\n [ref],\n );\n\n useLayoutEffect(() => {\n if (!copyable) return;\n const pre = preRef.current;\n const wrapper = buttonWrapperRef.current;\n if (!pre || !wrapper) return;\n\n const borderH = noBorder ? 0 : 2;\n\n const update = () => {\n if (!isLeft) {\n const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n wrapper.style.right = `${16 + vScrollbar}px`;\n }\n if (isBottom) {\n const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n wrapper.style.bottom = `${8 + hScrollbar}px`;\n }\n };\n\n update();\n const observer = new ResizeObserver(update);\n observer.observe(pre);\n return () => observer.disconnect();\n }, [copyable, isBottom, isLeft, noBorder]);\n\n const handleCopy = async () => {\n try {\n await navigator.clipboard.writeText(code);\n setCopied(true);\n onCopy?.();\n setTimeout(() => setCopied(false), 1500);\n } catch {\n // clipboard write failed (e.g. permission denied) — leave UI unchanged\n }\n };\n\n const buttonPositionClass = isBottom\n ? isLeft\n ? copyButtonWrapperBottomLeft\n : copyButtonWrapperBottomRight\n : isLeft\n ? copyButtonWrapperTopLeft\n : copyButtonWrapperTop;\n\n const copyButton = copyable ? (\n <ButtonVanilla\n variant=\"secondary\"\n ghost\n size=\"small\"\n type=\"button\"\n onClick={handleCopy}\n css={{\n color: '$hiContrast',\n gap: '$1',\n backgroundColor: '$codeBlockCopyButtonBg',\n height: '32px',\n }}\n >\n <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n {copied ? <CheckIcon /> : <CopyIcon />}\n </AccessibleIcon>\n {copied ? copiedText : copyText}\n </ButtonVanilla>\n ) : null;\n\n return (\n <Highlight\n theme={prismTheme}\n code={code}\n language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n >\n {({\n className: highlightClass,\n style: highlightStyle,\n tokens,\n getLineProps,\n getTokenProps,\n }) => (\n <div style={containerStyles}>\n <pre\n ref={setPreRef}\n className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n .filter(Boolean)\n .join(' ')}\n style={{\n maxHeight,\n ...highlightStyle,\n backgroundColor: 'inherit',\n ...style,\n }}\n {...props}\n >\n <div\n className={[\n codeContent,\n copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {tokens.map((line, i) => (\n <div\n key={i}\n {...getLineProps({ line })}\n style={\n wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n }\n >\n {line.map((token, key) => (\n <span key={key} {...getTokenProps({ token })} />\n ))}\n </div>\n ))}\n </div>\n </pre>\n {copyButton && (\n <div ref={buttonWrapperRef} className={buttonPositionClass}>\n {copyButton}\n </div>\n )}\n </div>\n )}\n </Highlight>\n );\n },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}
1
+ {"version":3,"file":"CodeBlock.vanilla.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n forwardRef,\n HTMLAttributes,\n useCallback,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n codeContent,\n codeContentBottomPadding,\n codeContentTopPadding,\n copyButtonWrapperBottomLeft,\n copyButtonWrapperBottomRight,\n copyButtonWrapperTop,\n copyButtonWrapperTopLeft,\n pre,\n preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n lang?: CodeBlockLanguage;\n code: string;\n copyable?: boolean;\n copyText?: string;\n copiedText?: string;\n copyButtonAlign?: CodeBlockCopyButtonAlign;\n onCopy?: () => void;\n noBorder?: boolean;\n wrapText?: boolean;\n colorScheme?: 'light' | 'dark';\n maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n (\n {\n lang = 'text',\n code,\n copyable = false,\n copyText,\n copiedText,\n copyButtonAlign = 'top right',\n onCopy,\n noBorder,\n wrapText = false,\n colorScheme,\n maxHeight = 424,\n css,\n style,\n className,\n ...props\n },\n ref,\n ) => {\n const { colors, resolvedTheme } = useVanillaExtractTheme();\n const effectiveScheme = colorScheme ?? resolvedTheme;\n const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n const isBottom = copyButtonAlign.includes('bottom');\n const isLeft = copyButtonAlign.includes('left');\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const containerStyles = {\n position: 'relative' as const,\n ...cssStyles,\n ...assignInlineVars(vars),\n };\n\n const [copied, setCopied] = useState(false);\n\n const preRef = useRef<HTMLPreElement | null>(\n null,\n ) as React.MutableRefObject<HTMLPreElement | null>;\n const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n const setPreRef = useCallback(\n (node: HTMLPreElement | null) => {\n preRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n },\n [ref],\n );\n\n useLayoutEffect(() => {\n if (!copyable) return;\n const pre = preRef.current;\n const wrapper = buttonWrapperRef.current;\n if (!pre || !wrapper) return;\n\n const borderH = noBorder ? 0 : 2;\n\n const update = () => {\n if (!isLeft) {\n const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n wrapper.style.right = `${16 + vScrollbar}px`;\n }\n if (isBottom) {\n const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n wrapper.style.bottom = `${8 + hScrollbar}px`;\n }\n };\n\n update();\n const observer = new ResizeObserver(update);\n observer.observe(pre);\n return () => observer.disconnect();\n }, [copyable, isBottom, isLeft, noBorder]);\n\n const handleCopy = async () => {\n try {\n await navigator.clipboard.writeText(code);\n setCopied(true);\n onCopy?.();\n setTimeout(() => setCopied(false), 1500);\n } catch {\n // clipboard write failed (e.g. permission denied) — leave UI unchanged\n }\n };\n\n const buttonPositionClass = isBottom\n ? isLeft\n ? copyButtonWrapperBottomLeft\n : copyButtonWrapperBottomRight\n : isLeft\n ? copyButtonWrapperTopLeft\n : copyButtonWrapperTop;\n\n const copyButton = copyable ? (\n <ButtonVanilla\n variant=\"secondary\"\n ghost\n size=\"small\"\n type=\"button\"\n onClick={handleCopy}\n css={{\n color: '$hiContrast',\n gap: '$1',\n backgroundColor: '$codeBlockCopyButtonBg',\n height: '32px',\n }}\n >\n <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n {copied ? <CheckIcon /> : <CopyIcon />}\n </AccessibleIcon>\n {copied ? copiedText : copyText}\n </ButtonVanilla>\n ) : null;\n\n return (\n <Highlight\n theme={prismTheme}\n code={code}\n language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n >\n {({\n className: highlightClass,\n style: highlightStyle,\n tokens,\n getLineProps,\n getTokenProps,\n }) => (\n <div style={containerStyles}>\n <pre\n ref={setPreRef}\n className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n .filter(Boolean)\n .join(' ')}\n style={{\n maxHeight,\n ...highlightStyle,\n backgroundColor: 'inherit',\n ...style,\n }}\n {...props}\n >\n <div\n className={[\n codeContent,\n copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {tokens.map((line, i) => (\n <div\n key={i}\n {...getLineProps({ line })}\n style={\n wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n }\n >\n {line.map((token, key) => (\n <span key={key} {...getTokenProps({ token })} />\n ))}\n </div>\n ))}\n </div>\n </pre>\n {copyButton && (\n <div ref={buttonWrapperRef} className={buttonPositionClass}>\n {copyButton}\n </div>\n )}\n </div>\n )}\n </Highlight>\n );\n },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}
@@ -0,0 +1,25 @@
1
+ const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
2
+ let prism_react_renderer = require("prism-react-renderer");
3
+ let prismjs = require("prismjs");
4
+ prismjs = require_runtime.__toESM(prismjs, 1);
5
+ require("prismjs/components/prism-bash.js");
6
+ require("prismjs/components/prism-csharp.js");
7
+ require("prismjs/components/prism-docker.js");
8
+ require("prismjs/components/prism-hcl.js");
9
+ require("prismjs/components/prism-http.js");
10
+ require("prismjs/components/prism-ini.js");
11
+ require("prismjs/components/prism-java.js");
12
+ require("prismjs/components/prism-markup-templating.js");
13
+ require("prismjs/components/prism-php.js");
14
+ require("prismjs/components/prism-powershell.js");
15
+ require("prismjs/components/prism-protobuf.js");
16
+ require("prismjs/components/prism-ruby.js");
17
+ require("prismjs/components/prism-scala.js");
18
+ require("prismjs/components/prism-shell-session.js");
19
+ require("prismjs/components/prism-toml.js");
20
+ //#region components/CodeBlock/prism-extend.ts
21
+ for (const [key, value] of Object.entries(prismjs.default.languages)) if (typeof value !== "function" && !(key in prism_react_renderer.Prism.languages)) prism_react_renderer.Prism.languages[key] = value;
22
+ prism_react_renderer.Prism.languages.text = { text: /[\s\S]+/ };
23
+ //#endregion
24
+
25
+ //# sourceMappingURL=prism-extend.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"prism-extend.cjs","names":[],"sources":["../../../components/CodeBlock/prism-extend.ts"],"sourcesContent":["/* eslint-disable simple-import-sort/imports */\n// prismjs must be imported first: in the browser it sets window.Prism so language\n// components below can use it as their global Prism reference.\nimport { Prism } from 'prism-react-renderer';\nimport prismjs from 'prismjs';\nimport 'prismjs/components/prism-bash.js';\nimport 'prismjs/components/prism-csharp.js';\nimport 'prismjs/components/prism-docker.js';\nimport 'prismjs/components/prism-hcl.js';\nimport 'prismjs/components/prism-http.js';\nimport 'prismjs/components/prism-ini.js';\nimport 'prismjs/components/prism-java.js';\nimport 'prismjs/components/prism-markup-templating.js';\nimport 'prismjs/components/prism-php.js';\nimport 'prismjs/components/prism-powershell.js';\nimport 'prismjs/components/prism-protobuf.js';\nimport 'prismjs/components/prism-ruby.js';\nimport 'prismjs/components/prism-scala.js';\nimport 'prismjs/components/prism-shell-session.js';\nimport 'prismjs/components/prism-toml.js';\n\n// Copy newly registered grammars from prismjs into prism-react-renderer's Prism.\n// Language component IIFEs register on prismjs's window.Prism, not on PrismRR.\nfor (const [key, value] of Object.entries(prismjs.languages)) {\n if (typeof value !== 'function' && !(key in Prism.languages)) {\n (Prism.languages as Record<string, unknown>)[key] = value;\n }\n}\n\n// 'text' grammar: tokenizes everything as a plain token so prism-react-renderer\n// receives proper Token objects instead of raw strings (which lack a .type field).\nPrism.languages.text = { text: /[\\s\\S]+/ };\n\nexport { Prism };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAuBA,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,QAAA,QAAQ,UAAU,CAC1D,KAAI,OAAO,UAAU,cAAc,EAAE,OAAO,qBAAA,MAAM,WAC/C,sBAAA,MAAM,UAAsC,OAAO;AAMxD,qBAAA,MAAM,UAAU,OAAO,EAAE,MAAM,WAAW"}
@@ -1 +1 @@
1
- {"version":3,"file":"Container.cjs","names":[],"sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n // Reset\n boxSizing: 'border-box',\n flexShrink: 0,\n\n // Custom\n ml: 'auto',\n mr: 'auto',\n px: '$5',\n\n variants: {\n size: {\n '1': {\n maxWidth: '425px',\n },\n '2': {\n maxWidth: '768px',\n },\n '3': {\n maxWidth: '1440px',\n },\n '4': {\n maxWidth: 'none',\n },\n },\n noGutter: {\n true: {\n px: 0,\n },\n },\n },\n defaultVariants: {\n size: '4',\n },\n});\n"],"mappings":";AAEA,IAAa,iDAAY,OAAO,OAAO;CAErC,WAAW;CACX,YAAY;CAGZ,IAAI;CACJ,IAAI;CACJ,IAAI;CAEJ,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,UACX;GACD,KAAK,EACH,UAAU,QACX;GACF;EACD,UAAU,EACR,MAAM,EACJ,IAAI,GACL,EACF;EACF;CACD,iBAAiB,EACf,MAAM,KACP;CACF,CAAC"}
1
+ {"version":3,"file":"Container.cjs","names":[],"sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n // Reset\n boxSizing: 'border-box',\n flexShrink: 0,\n\n // Custom\n ml: 'auto',\n mr: 'auto',\n px: '$5',\n\n variants: {\n size: {\n '1': {\n maxWidth: '425px',\n },\n '2': {\n maxWidth: '768px',\n },\n '3': {\n maxWidth: '1440px',\n },\n '4': {\n maxWidth: 'none',\n },\n },\n noGutter: {\n true: {\n px: 0,\n },\n },\n },\n defaultVariants: {\n size: '4',\n },\n});\n"],"mappings":";AAEA,IAAa,gDAAY,CAAA,OAAO,OAAO;CAErC,WAAW;CACX,YAAY;CAGZ,IAAI;CACJ,IAAI;CACJ,IAAI;CAEJ,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,UACX;GACD,KAAK,EACH,UAAU,QACX;GACF;EACD,UAAU,EACR,MAAM,EACJ,IAAI,GACL,EACF;EACF;CACD,iBAAiB,EACf,MAAM,KACP;CACF,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Container.vanilla.cjs","names":[],"sources":["../../../components/Container/Container.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { containerRecipe } from './Container.vanilla.css';\n\ninterface ContainerOwnProps extends CSSProps {\n size?: '1' | '2' | '3' | '4';\n noGutter?: boolean;\n}\n\nexport type ContainerProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ContainerOwnProps\n>;\ntype ContainerComponent = PolymorphicComponent<'div', ContainerProps<ElementType>>;\n\nexport const ContainerVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, noGutter, ...props }: ContainerProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = containerRecipe({ size, noGutter });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nContainerVanillaComponent.displayName = 'ContainerVanilla';\n\nexport const ContainerVanilla = ContainerVanillaComponent as ContainerComponent;\n"],"mappings":";;;;;;;;;AAuBA,IAAa,4BAA4B,MAAA,QAAM,YAE3C,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,SAChD,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,8BAAA,gBAAgB;GAAE;GAAM;GAAU,CAAC,CAKzB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}
1
+ {"version":3,"file":"Container.vanilla.cjs","names":[],"sources":["../../../components/Container/Container.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { containerRecipe } from './Container.vanilla.css';\n\ninterface ContainerOwnProps extends CSSProps {\n size?: '1' | '2' | '3' | '4';\n noGutter?: boolean;\n}\n\nexport type ContainerProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ContainerOwnProps\n>;\ntype ContainerComponent = PolymorphicComponent<'div', ContainerProps<ElementType>>;\n\nexport const ContainerVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, noGutter, ...props }: ContainerProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = containerRecipe({ size, noGutter });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nContainerVanillaComponent.displayName = 'ContainerVanilla';\n\nexport const ContainerVanilla = ContainerVanillaComponent as ContainerComponent;\n"],"mappings":";;;;;;;;;AAuBA,IAAa,4BAA4B,MAAA,QAAM,YAE3C,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,SAChD,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,8BAAA,gBAAgB;GAAE;GAAM;GAAU,CAKpC,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Container.vanilla.js","names":[],"sources":["../../../components/Container/Container.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { containerRecipe } from './Container.vanilla.css';\n\ninterface ContainerOwnProps extends CSSProps {\n size?: '1' | '2' | '3' | '4';\n noGutter?: boolean;\n}\n\nexport type ContainerProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ContainerOwnProps\n>;\ntype ContainerComponent = PolymorphicComponent<'div', ContainerProps<ElementType>>;\n\nexport const ContainerVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, noGutter, ...props }: ContainerProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = containerRecipe({ size, noGutter });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nContainerVanillaComponent.displayName = 'ContainerVanilla';\n\nexport const ContainerVanilla = ContainerVanillaComponent as ContainerComponent;\n"],"mappings":";;;;;;;AAuBA,IAAa,4BAA4B,MAAM,YAE3C,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,SAChD,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,gBAAgB;GAAE;GAAM;GAAU,CAAC,CAKzB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}
1
+ {"version":3,"file":"Container.vanilla.js","names":[],"sources":["../../../components/Container/Container.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { containerRecipe } from './Container.vanilla.css';\n\ninterface ContainerOwnProps extends CSSProps {\n size?: '1' | '2' | '3' | '4';\n noGutter?: boolean;\n}\n\nexport type ContainerProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ContainerOwnProps\n>;\ntype ContainerComponent = PolymorphicComponent<'div', ContainerProps<ElementType>>;\n\nexport const ContainerVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, size, noGutter, ...props }: ContainerProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = containerRecipe({ size, noGutter });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nContainerVanillaComponent.displayName = 'ContainerVanilla';\n\nexport const ContainerVanilla = ContainerVanillaComponent as ContainerComponent;\n"],"mappings":";;;;;;;AAuBA,IAAa,4BAA4B,MAAM,YAE3C,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,SAChD,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,gBAAgB;GAAE;GAAM;GAAU,CAKpC,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}
@@ -1 +1 @@
1
- {"version":3,"file":"DateTimePickerInput.cjs","names":[],"sources":["../../../components/DateTimePickerInput/DateTimePickerInput.tsx"],"sourcesContent":["import {\n arrow,\n autoUpdate,\n flip,\n FloatingArrow,\n FloatingFocusManager,\n offset,\n Placement,\n shift,\n useClick,\n useDismiss,\n useFloating,\n useInteractions,\n useRole,\n} from '@floating-ui/react';\nimport { CalendarIcon } from '@radix-ui/react-icons';\nimport { DPUserConfig } from '@rehookify/datepicker';\nimport { format, parse } from 'date-fns';\nimport React, { MouseEventHandler, Ref, useMemo, useRef, useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { DateTimePicker } from '../DateTimePicker';\nimport { Input, InputHandle } from '../Input';\n\nconst StyledWrapper = styled('div', {\n display: 'flex',\n position: 'relative',\n width: '100%',\n\n '& .firefox-patch': {\n display: 'none',\n },\n\n '@supports (-moz-appearance: none)': {\n '& .firefox-patch': {\n display: 'block',\n width: '20px',\n height: '20px',\n position: 'absolute',\n right: '17px',\n top: '6px',\n background: '$inputBg',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n },\n\n '@hover': {\n '&:hover .firefox-patch': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.05,\n },\n },\n },\n },\n});\n\nexport type DateTimePickerInputProps = Omit<DPUserConfig, 'onDatesChange' | 'selectedDates'> & {\n inputCSS?: CSS;\n inputProps?: Omit<typeof Input, 'css' | 'onChange' | 'ref' | 'value'>;\n onChange?: (d: Date[]) => void;\n pickerCSS?: CSS;\n pickerPlacement?: Placement;\n showDatePresets?: boolean;\n showTimePicker?: boolean;\n};\n\nexport type DateTimePickerInputVariants = VariantProps<DateTimePickerInputProps>;\n\nexport const DateTimePickerInput = React.forwardRef<\n React.ElementRef<typeof StyledWrapper>,\n DateTimePickerInputProps\n>(\n (\n {\n inputCSS,\n inputProps,\n onChange,\n pickerCSS,\n pickerPlacement,\n showDatePresets,\n showTimePicker,\n ...pickerProps\n },\n fowardedRef,\n ) => {\n const formatStr = \"yyyy-MM-dd'T'HH:mm\";\n\n const arrowRef = useRef(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [selectedDates, onDatesChange] = useState<Date[]>([]);\n const [isPickerOpen, setIsPickerOpen] = useState(false);\n\n const middleware = useMemo(\n () => [\n offset(10),\n flip(),\n shift(),\n // arrowRef is passed to floating-ui which handles it correctly\n arrow({ element: arrowRef }),\n ],\n [],\n );\n\n const { refs, floatingStyles, context } = useFloating({\n open: isPickerOpen,\n onOpenChange: setIsPickerOpen,\n placement: pickerPlacement,\n middleware,\n whileElementsMounted: autoUpdate,\n });\n\n const click = useClick(context);\n const dismiss = useDismiss(context);\n const role = useRole(context);\n\n const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);\n const { onClick: onFirefoxPatchClick } = getReferenceProps();\n\n return (\n <StyledWrapper ref={fowardedRef}>\n <Input\n startAdornment={<CalendarIcon />}\n {...getReferenceProps()}\n {...inputProps}\n css={{ '& input::-webkit-calendar-picker-indicator': { display: 'none' }, ...inputCSS }}\n onChange={(evt) => {\n const value = evt.currentTarget.value;\n setInputValue(value);\n try {\n const newDates = (value as string)\n .split(',')\n .map((d) => parse(d.trim(), formatStr, new Date()));\n onDatesChange(newDates);\n if (onChange) onChange(newDates);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n } catch (err) {\n // empty\n }\n }}\n ref={refs.setReference as Ref<InputHandle>}\n type=\"datetime-local\"\n value={inputValue}\n />\n <div\n className=\"firefox-patch\"\n onClick={onFirefoxPatchClick as MouseEventHandler<HTMLDivElement>}\n />\n {isPickerOpen && (\n <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n {/* refs.setFloating is a stable callback ref from floating-ui */}\n <div ref={refs.setFloating} style={floatingStyles} {...getFloatingProps()}>\n <Card>\n <DateTimePicker\n {...pickerProps}\n css={pickerCSS}\n onDatesChange={(d) => {\n onDatesChange(d);\n setInputValue(d.map((date) => format(date, formatStr)).join(', '));\n if (onChange) onChange(d);\n }}\n onFastTravelClick={() => setIsPickerOpen(false)}\n onTimeButtonClick={() => setIsPickerOpen(false)}\n selectedDates={selectedDates}\n showDatePresets={showDatePresets}\n showTimePicker={showTimePicker}\n />\n </Card>\n <FloatingArrow ref={arrowRef} context={context} fill=\"var(--colors-01dp)\" />\n </div>\n </FloatingFocusManager>\n )}\n </StyledWrapper>\n );\n },\n);\n"],"mappings":"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"}
1
+ {"version":3,"file":"DateTimePickerInput.cjs","names":[],"sources":["../../../components/DateTimePickerInput/DateTimePickerInput.tsx"],"sourcesContent":["import {\n arrow,\n autoUpdate,\n flip,\n FloatingArrow,\n FloatingFocusManager,\n offset,\n Placement,\n shift,\n useClick,\n useDismiss,\n useFloating,\n useInteractions,\n useRole,\n} from '@floating-ui/react';\nimport { CalendarIcon } from '@radix-ui/react-icons';\nimport { DPUserConfig } from '@rehookify/datepicker';\nimport { format, parse } from 'date-fns';\nimport React, { MouseEventHandler, Ref, useMemo, useRef, useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { DateTimePicker } from '../DateTimePicker';\nimport { Input, InputHandle } from '../Input';\n\nconst StyledWrapper = styled('div', {\n display: 'flex',\n position: 'relative',\n width: '100%',\n\n '& .firefox-patch': {\n display: 'none',\n },\n\n '@supports (-moz-appearance: none)': {\n '& .firefox-patch': {\n display: 'block',\n width: '20px',\n height: '20px',\n position: 'absolute',\n right: '17px',\n top: '6px',\n background: '$inputBg',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n },\n\n '@hover': {\n '&:hover .firefox-patch': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.05,\n },\n },\n },\n },\n});\n\nexport type DateTimePickerInputProps = Omit<DPUserConfig, 'onDatesChange' | 'selectedDates'> & {\n inputCSS?: CSS;\n inputProps?: Omit<typeof Input, 'css' | 'onChange' | 'ref' | 'value'>;\n onChange?: (d: Date[]) => void;\n pickerCSS?: CSS;\n pickerPlacement?: Placement;\n showDatePresets?: boolean;\n showTimePicker?: boolean;\n};\n\nexport type DateTimePickerInputVariants = VariantProps<DateTimePickerInputProps>;\n\nexport const DateTimePickerInput = React.forwardRef<\n React.ElementRef<typeof StyledWrapper>,\n DateTimePickerInputProps\n>(\n (\n {\n inputCSS,\n inputProps,\n onChange,\n pickerCSS,\n pickerPlacement,\n showDatePresets,\n showTimePicker,\n ...pickerProps\n },\n fowardedRef,\n ) => {\n const formatStr = \"yyyy-MM-dd'T'HH:mm\";\n\n const arrowRef = useRef(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [selectedDates, onDatesChange] = useState<Date[]>([]);\n const [isPickerOpen, setIsPickerOpen] = useState(false);\n\n const middleware = useMemo(\n () => [\n offset(10),\n flip(),\n shift(),\n // arrowRef is passed to floating-ui which handles it correctly\n arrow({ element: arrowRef }),\n ],\n [],\n );\n\n const { refs, floatingStyles, context } = useFloating({\n open: isPickerOpen,\n onOpenChange: setIsPickerOpen,\n placement: pickerPlacement,\n middleware,\n whileElementsMounted: autoUpdate,\n });\n\n const click = useClick(context);\n const dismiss = useDismiss(context);\n const role = useRole(context);\n\n const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);\n const { onClick: onFirefoxPatchClick } = getReferenceProps();\n\n return (\n <StyledWrapper ref={fowardedRef}>\n <Input\n startAdornment={<CalendarIcon />}\n {...getReferenceProps()}\n {...inputProps}\n css={{ '& input::-webkit-calendar-picker-indicator': { display: 'none' }, ...inputCSS }}\n onChange={(evt) => {\n const value = evt.currentTarget.value;\n setInputValue(value);\n try {\n const newDates = (value as string)\n .split(',')\n .map((d) => parse(d.trim(), formatStr, new Date()));\n onDatesChange(newDates);\n if (onChange) onChange(newDates);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n } catch (err) {\n // empty\n }\n }}\n ref={refs.setReference as Ref<InputHandle>}\n type=\"datetime-local\"\n value={inputValue}\n />\n <div\n className=\"firefox-patch\"\n onClick={onFirefoxPatchClick as MouseEventHandler<HTMLDivElement>}\n />\n {isPickerOpen && (\n <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n {/* refs.setFloating is a stable callback ref from floating-ui */}\n <div ref={refs.setFloating} style={floatingStyles} {...getFloatingProps()}>\n <Card>\n <DateTimePicker\n {...pickerProps}\n css={pickerCSS}\n onDatesChange={(d) => {\n onDatesChange(d);\n setInputValue(d.map((date) => format(date, formatStr)).join(', '));\n if (onChange) onChange(d);\n }}\n onFastTravelClick={() => setIsPickerOpen(false)}\n onTimeButtonClick={() => setIsPickerOpen(false)}\n selectedDates={selectedDates}\n showDatePresets={showDatePresets}\n showTimePicker={showTimePicker}\n />\n </Card>\n <FloatingArrow ref={arrowRef} context={context} fill=\"var(--colors-01dp)\" />\n </div>\n </FloatingFocusManager>\n )}\n </StyledWrapper>\n );\n },\n);\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"DateTimePickerInput.js","names":[],"sources":["../../../components/DateTimePickerInput/DateTimePickerInput.tsx"],"sourcesContent":["import {\n arrow,\n autoUpdate,\n flip,\n FloatingArrow,\n FloatingFocusManager,\n offset,\n Placement,\n shift,\n useClick,\n useDismiss,\n useFloating,\n useInteractions,\n useRole,\n} from '@floating-ui/react';\nimport { CalendarIcon } from '@radix-ui/react-icons';\nimport { DPUserConfig } from '@rehookify/datepicker';\nimport { format, parse } from 'date-fns';\nimport React, { MouseEventHandler, Ref, useMemo, useRef, useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { DateTimePicker } from '../DateTimePicker';\nimport { Input, InputHandle } from '../Input';\n\nconst StyledWrapper = styled('div', {\n display: 'flex',\n position: 'relative',\n width: '100%',\n\n '& .firefox-patch': {\n display: 'none',\n },\n\n '@supports (-moz-appearance: none)': {\n '& .firefox-patch': {\n display: 'block',\n width: '20px',\n height: '20px',\n position: 'absolute',\n right: '17px',\n top: '6px',\n background: '$inputBg',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n },\n\n '@hover': {\n '&:hover .firefox-patch': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.05,\n },\n },\n },\n },\n});\n\nexport type DateTimePickerInputProps = Omit<DPUserConfig, 'onDatesChange' | 'selectedDates'> & {\n inputCSS?: CSS;\n inputProps?: Omit<typeof Input, 'css' | 'onChange' | 'ref' | 'value'>;\n onChange?: (d: Date[]) => void;\n pickerCSS?: CSS;\n pickerPlacement?: Placement;\n showDatePresets?: boolean;\n showTimePicker?: boolean;\n};\n\nexport type DateTimePickerInputVariants = VariantProps<DateTimePickerInputProps>;\n\nexport const DateTimePickerInput = React.forwardRef<\n React.ElementRef<typeof StyledWrapper>,\n DateTimePickerInputProps\n>(\n (\n {\n inputCSS,\n inputProps,\n onChange,\n pickerCSS,\n pickerPlacement,\n showDatePresets,\n showTimePicker,\n ...pickerProps\n },\n fowardedRef,\n ) => {\n const formatStr = \"yyyy-MM-dd'T'HH:mm\";\n\n const arrowRef = useRef(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [selectedDates, onDatesChange] = useState<Date[]>([]);\n const [isPickerOpen, setIsPickerOpen] = useState(false);\n\n const middleware = useMemo(\n () => [\n offset(10),\n flip(),\n shift(),\n // arrowRef is passed to floating-ui which handles it correctly\n arrow({ element: arrowRef }),\n ],\n [],\n );\n\n const { refs, floatingStyles, context } = useFloating({\n open: isPickerOpen,\n onOpenChange: setIsPickerOpen,\n placement: pickerPlacement,\n middleware,\n whileElementsMounted: autoUpdate,\n });\n\n const click = useClick(context);\n const dismiss = useDismiss(context);\n const role = useRole(context);\n\n const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);\n const { onClick: onFirefoxPatchClick } = getReferenceProps();\n\n return (\n <StyledWrapper ref={fowardedRef}>\n <Input\n startAdornment={<CalendarIcon />}\n {...getReferenceProps()}\n {...inputProps}\n css={{ '& input::-webkit-calendar-picker-indicator': { display: 'none' }, ...inputCSS }}\n onChange={(evt) => {\n const value = evt.currentTarget.value;\n setInputValue(value);\n try {\n const newDates = (value as string)\n .split(',')\n .map((d) => parse(d.trim(), formatStr, new Date()));\n onDatesChange(newDates);\n if (onChange) onChange(newDates);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n } catch (err) {\n // empty\n }\n }}\n ref={refs.setReference as Ref<InputHandle>}\n type=\"datetime-local\"\n value={inputValue}\n />\n <div\n className=\"firefox-patch\"\n onClick={onFirefoxPatchClick as MouseEventHandler<HTMLDivElement>}\n />\n {isPickerOpen && (\n <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n {/* refs.setFloating is a stable callback ref from floating-ui */}\n <div ref={refs.setFloating} style={floatingStyles} {...getFloatingProps()}>\n <Card>\n <DateTimePicker\n {...pickerProps}\n css={pickerCSS}\n onDatesChange={(d) => {\n onDatesChange(d);\n setInputValue(d.map((date) => format(date, formatStr)).join(', '));\n if (onChange) onChange(d);\n }}\n onFastTravelClick={() => setIsPickerOpen(false)}\n onTimeButtonClick={() => setIsPickerOpen(false)}\n selectedDates={selectedDates}\n showDatePresets={showDatePresets}\n showTimePicker={showTimePicker}\n />\n </Card>\n <FloatingArrow ref={arrowRef} context={context} fill=\"var(--colors-01dp)\" />\n </div>\n </FloatingFocusManager>\n )}\n </StyledWrapper>\n );\n },\n);\n"],"mappings":"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"}
1
+ {"version":3,"file":"DateTimePickerInput.js","names":[],"sources":["../../../components/DateTimePickerInput/DateTimePickerInput.tsx"],"sourcesContent":["import {\n arrow,\n autoUpdate,\n flip,\n FloatingArrow,\n FloatingFocusManager,\n offset,\n Placement,\n shift,\n useClick,\n useDismiss,\n useFloating,\n useInteractions,\n useRole,\n} from '@floating-ui/react';\nimport { CalendarIcon } from '@radix-ui/react-icons';\nimport { DPUserConfig } from '@rehookify/datepicker';\nimport { format, parse } from 'date-fns';\nimport React, { MouseEventHandler, Ref, useMemo, useRef, useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { DateTimePicker } from '../DateTimePicker';\nimport { Input, InputHandle } from '../Input';\n\nconst StyledWrapper = styled('div', {\n display: 'flex',\n position: 'relative',\n width: '100%',\n\n '& .firefox-patch': {\n display: 'none',\n },\n\n '@supports (-moz-appearance: none)': {\n '& .firefox-patch': {\n display: 'block',\n width: '20px',\n height: '20px',\n position: 'absolute',\n right: '17px',\n top: '6px',\n background: '$inputBg',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n },\n\n '@hover': {\n '&:hover .firefox-patch': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.05,\n },\n },\n },\n },\n});\n\nexport type DateTimePickerInputProps = Omit<DPUserConfig, 'onDatesChange' | 'selectedDates'> & {\n inputCSS?: CSS;\n inputProps?: Omit<typeof Input, 'css' | 'onChange' | 'ref' | 'value'>;\n onChange?: (d: Date[]) => void;\n pickerCSS?: CSS;\n pickerPlacement?: Placement;\n showDatePresets?: boolean;\n showTimePicker?: boolean;\n};\n\nexport type DateTimePickerInputVariants = VariantProps<DateTimePickerInputProps>;\n\nexport const DateTimePickerInput = React.forwardRef<\n React.ElementRef<typeof StyledWrapper>,\n DateTimePickerInputProps\n>(\n (\n {\n inputCSS,\n inputProps,\n onChange,\n pickerCSS,\n pickerPlacement,\n showDatePresets,\n showTimePicker,\n ...pickerProps\n },\n fowardedRef,\n ) => {\n const formatStr = \"yyyy-MM-dd'T'HH:mm\";\n\n const arrowRef = useRef(null);\n\n const [inputValue, setInputValue] = useState<string>('');\n const [selectedDates, onDatesChange] = useState<Date[]>([]);\n const [isPickerOpen, setIsPickerOpen] = useState(false);\n\n const middleware = useMemo(\n () => [\n offset(10),\n flip(),\n shift(),\n // arrowRef is passed to floating-ui which handles it correctly\n arrow({ element: arrowRef }),\n ],\n [],\n );\n\n const { refs, floatingStyles, context } = useFloating({\n open: isPickerOpen,\n onOpenChange: setIsPickerOpen,\n placement: pickerPlacement,\n middleware,\n whileElementsMounted: autoUpdate,\n });\n\n const click = useClick(context);\n const dismiss = useDismiss(context);\n const role = useRole(context);\n\n const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);\n const { onClick: onFirefoxPatchClick } = getReferenceProps();\n\n return (\n <StyledWrapper ref={fowardedRef}>\n <Input\n startAdornment={<CalendarIcon />}\n {...getReferenceProps()}\n {...inputProps}\n css={{ '& input::-webkit-calendar-picker-indicator': { display: 'none' }, ...inputCSS }}\n onChange={(evt) => {\n const value = evt.currentTarget.value;\n setInputValue(value);\n try {\n const newDates = (value as string)\n .split(',')\n .map((d) => parse(d.trim(), formatStr, new Date()));\n onDatesChange(newDates);\n if (onChange) onChange(newDates);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n } catch (err) {\n // empty\n }\n }}\n ref={refs.setReference as Ref<InputHandle>}\n type=\"datetime-local\"\n value={inputValue}\n />\n <div\n className=\"firefox-patch\"\n onClick={onFirefoxPatchClick as MouseEventHandler<HTMLDivElement>}\n />\n {isPickerOpen && (\n <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n {/* refs.setFloating is a stable callback ref from floating-ui */}\n <div ref={refs.setFloating} style={floatingStyles} {...getFloatingProps()}>\n <Card>\n <DateTimePicker\n {...pickerProps}\n css={pickerCSS}\n onDatesChange={(d) => {\n onDatesChange(d);\n setInputValue(d.map((date) => format(date, formatStr)).join(', '));\n if (onChange) onChange(d);\n }}\n onFastTravelClick={() => setIsPickerOpen(false)}\n onTimeButtonClick={() => setIsPickerOpen(false)}\n selectedDates={selectedDates}\n showDatePresets={showDatePresets}\n showTimePicker={showTimePicker}\n />\n </Card>\n <FloatingArrow ref={arrowRef} context={context} fill=\"var(--colors-01dp)\" />\n </div>\n </FloatingFocusManager>\n )}\n </StyledWrapper>\n );\n },\n);\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Elevation.vanilla.cjs","names":[],"sources":["../../../components/Elevation/Elevation.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { elevationRecipe } from './Elevation.vanilla.css';\n\ntype ElevationRecipeVariants = NonNullable<RecipeVariants<typeof elevationRecipe>>;\n\ninterface ElevationOwnProps extends CSSProps {\n variant?: ElevationRecipeVariants['variant'];\n}\n\nexport type ElevationVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ElevationOwnProps\n>;\n\ntype ElevationVanillaComponent = PolymorphicComponent<'div', ElevationVanillaProps<ElementType>>;\n\nconst ElevationVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, variant, ...props }: ElevationVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n const recipeClass = elevationRecipe({ variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nElevationVanillaComponentImpl.displayName = 'ElevationVanilla';\n\nexport const ElevationVanilla = ElevationVanillaComponentImpl as ElevationVanillaComponent;\n"],"mappings":";;;;;;;;AA0BA,IAAM,iCAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,SAAS,GAAG,SACzC,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAC3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAC9D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAAE;AAG1E,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,8BAAA,gBAAgB,EAAE,SAAS,CAAC,CAKlB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,8BAA8B,cAAc;AAE5C,IAAa,mBAAmB"}
1
+ {"version":3,"file":"Elevation.vanilla.cjs","names":[],"sources":["../../../components/Elevation/Elevation.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { elevationRecipe } from './Elevation.vanilla.css';\n\ntype ElevationRecipeVariants = NonNullable<RecipeVariants<typeof elevationRecipe>>;\n\ninterface ElevationOwnProps extends CSSProps {\n variant?: ElevationRecipeVariants['variant'];\n}\n\nexport type ElevationVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ElevationOwnProps\n>;\n\ntype ElevationVanillaComponent = PolymorphicComponent<'div', ElevationVanillaProps<ElementType>>;\n\nconst ElevationVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, variant, ...props }: ElevationVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n const recipeClass = elevationRecipe({ variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nElevationVanillaComponentImpl.displayName = 'ElevationVanilla';\n\nexport const ElevationVanilla = ElevationVanillaComponentImpl as ElevationVanillaComponent;\n"],"mappings":";;;;;;;;AA0BA,IAAM,iCAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,SAAS,GAAG,SACzC,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAC3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAC9D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAAE;AAG1E,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,8BAAA,gBAAgB,EAAE,SAAS,CAK7B,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,8BAA8B,cAAc;AAE5C,IAAa,mBAAmB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Elevation.vanilla.js","names":[],"sources":["../../../components/Elevation/Elevation.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { elevationRecipe } from './Elevation.vanilla.css';\n\ntype ElevationRecipeVariants = NonNullable<RecipeVariants<typeof elevationRecipe>>;\n\ninterface ElevationOwnProps extends CSSProps {\n variant?: ElevationRecipeVariants['variant'];\n}\n\nexport type ElevationVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ElevationOwnProps\n>;\n\ntype ElevationVanillaComponent = PolymorphicComponent<'div', ElevationVanillaProps<ElementType>>;\n\nconst ElevationVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, variant, ...props }: ElevationVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n const recipeClass = elevationRecipe({ variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nElevationVanillaComponentImpl.displayName = 'ElevationVanilla';\n\nexport const ElevationVanilla = ElevationVanillaComponentImpl as ElevationVanillaComponent;\n"],"mappings":";;;;;;;AA0BA,IAAM,gCAAgC,YAElC,EAAE,IAAI,WAAW,KAAK,OAAO,SAAS,GAAG,SACzC,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,wBAAwB;CAC3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAC9D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,GAAG,iBAAiB,KAAK;EAAE;AAG1E,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,gBAAgB,EAAE,SAAS,CAAC,CAKlB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,8BAA8B,cAAc;AAE5C,IAAa,mBAAmB"}
1
+ {"version":3,"file":"Elevation.vanilla.js","names":[],"sources":["../../../components/Elevation/Elevation.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { elevationRecipe } from './Elevation.vanilla.css';\n\ntype ElevationRecipeVariants = NonNullable<RecipeVariants<typeof elevationRecipe>>;\n\ninterface ElevationOwnProps extends CSSProps {\n variant?: ElevationRecipeVariants['variant'];\n}\n\nexport type ElevationVanillaProps<C extends ElementType = 'div'> = PolymorphicComponentProps<\n C,\n ElevationOwnProps\n>;\n\ntype ElevationVanillaComponent = PolymorphicComponent<'div', ElevationVanillaProps<ElementType>>;\n\nconst ElevationVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, variant, ...props }: ElevationVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n const { colors } = useVanillaExtractTheme();\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n const mergedStyles = { ...cssStyles, ...style, ...assignInlineVars(vars) };\n const recipeClass = elevationRecipe({ variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nElevationVanillaComponentImpl.displayName = 'ElevationVanilla';\n\nexport const ElevationVanilla = ElevationVanillaComponentImpl as ElevationVanillaComponent;\n"],"mappings":";;;;;;;AA0BA,IAAM,gCAAgC,YAElC,EAAE,IAAI,WAAW,KAAK,OAAO,SAAS,GAAG,SACzC,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,wBAAwB;CAC3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAC9D,MAAM,eAAe;EAAE,GAAG;EAAW,GAAG;EAAO,GAAG,iBAAiB,KAAK;EAAE;AAG1E,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,gBAAgB,EAAE,SAAS,CAK7B,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,8BAA8B,cAAc;AAE5C,IAAa,mBAAmB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Flex.cjs","names":[],"sources":["../../../components/Flex/Flex.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Flex = styled('div', {\n boxSizing: 'border-box',\n display: 'flex',\n\n variants: {\n direction: {\n row: {\n flexDirection: 'row',\n },\n column: {\n flexDirection: 'column',\n },\n rowReverse: {\n flexDirection: 'row-reverse',\n },\n columnReverse: {\n flexDirection: 'column-reverse',\n },\n },\n align: {\n start: {\n alignItems: 'flex-start',\n },\n center: {\n alignItems: 'center',\n },\n end: {\n alignItems: 'flex-end',\n },\n stretch: {\n alignItems: 'stretch',\n },\n baseline: {\n alignItems: 'baseline',\n },\n ['space-evenly']: {\n alignItems: 'space-evenly',\n },\n ['space-between']: {\n alignItems: 'space-between',\n },\n ['space-around']: {\n alignItems: 'space-around',\n },\n },\n justify: {\n start: {\n justifyContent: 'flex-start',\n },\n center: {\n justifyContent: 'center',\n },\n end: {\n justifyContent: 'flex-end',\n },\n between: {\n justifyContent: 'space-between',\n },\n ['space-evenly']: {\n justifyContent: 'space-evenly',\n },\n ['space-between']: {\n justifyContent: 'space-between',\n },\n ['space-around']: {\n justifyContent: 'space-around',\n },\n },\n wrap: {\n noWrap: {\n flexWrap: 'nowrap',\n },\n wrap: {\n flexWrap: 'wrap',\n },\n wrapReverse: {\n flexWrap: 'wrap-reverse',\n },\n },\n gap: {\n 1: {\n gap: '$1',\n },\n 2: {\n gap: '$2',\n },\n 3: {\n gap: '$3',\n },\n 4: {\n gap: '$4',\n },\n 5: {\n gap: '$5',\n },\n 6: {\n gap: '$6',\n },\n 7: {\n gap: '$7',\n },\n 8: {\n gap: '$8',\n },\n 9: {\n gap: '$9',\n },\n },\n },\n defaultVariants: {\n direction: 'row',\n align: 'stretch',\n justify: 'start',\n wrap: 'noWrap',\n },\n});\n"],"mappings":";AAEA,IAAa,4CAAO,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,WAAW;GACT,KAAK,EACH,eAAe,OAChB;GACD,QAAQ,EACN,eAAe,UAChB;GACD,YAAY,EACV,eAAe,eAChB;GACD,eAAe,EACb,eAAe,kBAChB;GACF;EACD,OAAO;GACL,OAAO,EACL,YAAY,cACb;GACD,QAAQ,EACN,YAAY,UACb;GACD,KAAK,EACH,YAAY,YACb;GACD,SAAS,EACP,YAAY,WACb;GACD,UAAU,EACR,YAAY,YACb;IACA,iBAAiB,EAChB,YAAY,gBACb;IACA,kBAAkB,EACjB,YAAY,iBACb;IACA,iBAAiB,EAChB,YAAY,gBACb;GACF;EACD,SAAS;GACP,OAAO,EACL,gBAAgB,cACjB;GACD,QAAQ,EACN,gBAAgB,UACjB;GACD,KAAK,EACH,gBAAgB,YACjB;GACD,SAAS,EACP,gBAAgB,iBACjB;IACA,iBAAiB,EAChB,gBAAgB,gBACjB;IACA,kBAAkB,EACjB,gBAAgB,iBACjB;IACA,iBAAiB,EAChB,gBAAgB,gBACjB;GACF;EACD,MAAM;GACJ,QAAQ,EACN,UAAU,UACX;GACD,MAAM,EACJ,UAAU,QACX;GACD,aAAa,EACX,UAAU,gBACX;GACF;EACD,KAAK;GACH,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACF;EACF;CACD,iBAAiB;EACf,WAAW;EACX,OAAO;EACP,SAAS;EACT,MAAM;EACP;CACF,CAAC"}
1
+ {"version":3,"file":"Flex.cjs","names":[],"sources":["../../../components/Flex/Flex.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Flex = styled('div', {\n boxSizing: 'border-box',\n display: 'flex',\n\n variants: {\n direction: {\n row: {\n flexDirection: 'row',\n },\n column: {\n flexDirection: 'column',\n },\n rowReverse: {\n flexDirection: 'row-reverse',\n },\n columnReverse: {\n flexDirection: 'column-reverse',\n },\n },\n align: {\n start: {\n alignItems: 'flex-start',\n },\n center: {\n alignItems: 'center',\n },\n end: {\n alignItems: 'flex-end',\n },\n stretch: {\n alignItems: 'stretch',\n },\n baseline: {\n alignItems: 'baseline',\n },\n ['space-evenly']: {\n alignItems: 'space-evenly',\n },\n ['space-between']: {\n alignItems: 'space-between',\n },\n ['space-around']: {\n alignItems: 'space-around',\n },\n },\n justify: {\n start: {\n justifyContent: 'flex-start',\n },\n center: {\n justifyContent: 'center',\n },\n end: {\n justifyContent: 'flex-end',\n },\n between: {\n justifyContent: 'space-between',\n },\n ['space-evenly']: {\n justifyContent: 'space-evenly',\n },\n ['space-between']: {\n justifyContent: 'space-between',\n },\n ['space-around']: {\n justifyContent: 'space-around',\n },\n },\n wrap: {\n noWrap: {\n flexWrap: 'nowrap',\n },\n wrap: {\n flexWrap: 'wrap',\n },\n wrapReverse: {\n flexWrap: 'wrap-reverse',\n },\n },\n gap: {\n 1: {\n gap: '$1',\n },\n 2: {\n gap: '$2',\n },\n 3: {\n gap: '$3',\n },\n 4: {\n gap: '$4',\n },\n 5: {\n gap: '$5',\n },\n 6: {\n gap: '$6',\n },\n 7: {\n gap: '$7',\n },\n 8: {\n gap: '$8',\n },\n 9: {\n gap: '$9',\n },\n },\n },\n defaultVariants: {\n direction: 'row',\n align: 'stretch',\n justify: 'start',\n wrap: 'noWrap',\n },\n});\n"],"mappings":";AAEA,IAAa,2CAAO,CAAA,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,WAAW;GACT,KAAK,EACH,eAAe,OAChB;GACD,QAAQ,EACN,eAAe,UAChB;GACD,YAAY,EACV,eAAe,eAChB;GACD,eAAe,EACb,eAAe,kBAChB;GACF;EACD,OAAO;GACL,OAAO,EACL,YAAY,cACb;GACD,QAAQ,EACN,YAAY,UACb;GACD,KAAK,EACH,YAAY,YACb;GACD,SAAS,EACP,YAAY,WACb;GACD,UAAU,EACR,YAAY,YACb;IACA,iBAAiB,EAChB,YAAY,gBACb;IACA,kBAAkB,EACjB,YAAY,iBACb;IACA,iBAAiB,EAChB,YAAY,gBACb;GACF;EACD,SAAS;GACP,OAAO,EACL,gBAAgB,cACjB;GACD,QAAQ,EACN,gBAAgB,UACjB;GACD,KAAK,EACH,gBAAgB,YACjB;GACD,SAAS,EACP,gBAAgB,iBACjB;IACA,iBAAiB,EAChB,gBAAgB,gBACjB;IACA,kBAAkB,EACjB,gBAAgB,iBACjB;IACA,iBAAiB,EAChB,gBAAgB,gBACjB;GACF;EACD,MAAM;GACJ,QAAQ,EACN,UAAU,UACX;GACD,MAAM,EACJ,UAAU,QACX;GACD,aAAa,EACX,UAAU,gBACX;GACF;EACD,KAAK;GACH,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACF;EACF;CACD,iBAAiB;EACf,WAAW;EACX,OAAO;EACP,SAAS;EACT,MAAM;EACP;CACF,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Flex.vanilla.cjs","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type {\n FlexAlignSimplified,\n FlexDirection,\n FlexJustifySimplified,\n Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n direction?: FlexDirection;\n align?: FlexAlignSimplified;\n justify?: FlexJustifySimplified;\n wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = flexRecipe({ direction, align, justify, wrap, gap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;;;AA6BA,IAAa,uBAAuB,MAAA,QAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,yBAAA,WAAW;GAAE;GAAW;GAAO;GAAS;GAAM;GAAK,CAAC,CAK1C,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
1
+ {"version":3,"file":"Flex.vanilla.cjs","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type {\n FlexAlignSimplified,\n FlexDirection,\n FlexJustifySimplified,\n Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n direction?: FlexDirection;\n align?: FlexAlignSimplified;\n justify?: FlexJustifySimplified;\n wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = flexRecipe({ direction, align, justify, wrap, gap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;;;AA6BA,IAAa,uBAAuB,MAAA,QAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,yBAAA,WAAW;GAAE;GAAW;GAAO;GAAS;GAAM;GAAK,CAKrD,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Flex.vanilla.js","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type {\n FlexAlignSimplified,\n FlexDirection,\n FlexJustifySimplified,\n Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n direction?: FlexDirection;\n align?: FlexAlignSimplified;\n justify?: FlexJustifySimplified;\n wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = flexRecipe({ direction, align, justify, wrap, gap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;AA6BA,IAAa,uBAAuB,MAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,WAAW;GAAE;GAAW;GAAO;GAAS;GAAM;GAAK,CAAC,CAK1C,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
1
+ {"version":3,"file":"Flex.vanilla.js","names":[],"sources":["../../../components/Flex/Flex.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type {\n FlexAlignSimplified,\n FlexDirection,\n FlexJustifySimplified,\n Gap,\n} from '../../styles/types';\nimport { flexRecipe } from './Flex.vanilla.css';\n\ninterface FlexOwnProps extends CSSProps {\n direction?: FlexDirection;\n align?: FlexAlignSimplified;\n justify?: FlexJustifySimplified;\n wrap?: 'wrap' | 'noWrap' | 'wrapReverse';\n gap?: Gap;\n}\n\nexport type FlexProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, FlexOwnProps>;\ntype FlexComponent = PolymorphicComponent<'div', FlexProps<ElementType>>;\n\nexport const FlexVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n { as, className, css, style, direction, align, justify, wrap, gap, ...props }: FlexProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = flexRecipe({ direction, align, justify, wrap, gap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nFlexVanillaComponent.displayName = 'FlexVanilla';\n\nexport const FlexVanilla = FlexVanillaComponent as FlexComponent;\n"],"mappings":";;;;;;;AA6BA,IAAa,uBAAuB,MAAM,YAEtC,EAAE,IAAI,WAAW,KAAK,OAAO,WAAW,OAAO,SAAS,MAAM,KAAK,GAAG,SACtE,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,WAAW;GAAE;GAAW;GAAO;GAAS;GAAM;GAAK,CAKrD,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.cjs","names":[],"sources":["../../../components/Grid/Grid.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Grid = styled('div', {\n boxSizing: 'border-box',\n display: 'grid',\n\n variants: {\n align: {\n start: {\n alignItems: 'start',\n },\n center: {\n alignItems: 'center',\n },\n end: {\n alignItems: 'end',\n },\n stretch: {\n alignItems: 'stretch',\n },\n baseline: {\n alignItems: 'baseline',\n },\n },\n justify: {\n start: {\n justifyContent: 'start',\n },\n center: {\n justifyContent: 'center',\n },\n end: {\n justifyContent: 'end',\n },\n between: {\n justifyContent: 'space-between',\n },\n },\n flow: {\n row: {\n gridAutoFlow: 'row',\n },\n column: {\n gridAutoFlow: 'column',\n },\n dense: {\n gridAutoFlow: 'dense',\n },\n rowDense: {\n gridAutoFlow: 'row dense',\n },\n columnDense: {\n gridAutoFlow: 'column dense',\n },\n },\n columns: {\n 1: {\n gridTemplateColumns: 'repeat(1, 1fr)',\n },\n 2: {\n gridTemplateColumns: 'repeat(2, 1fr)',\n },\n 3: {\n gridTemplateColumns: 'repeat(3, 1fr)',\n },\n 4: {\n gridTemplateColumns: 'repeat(4, 1fr)',\n },\n },\n gap: {\n 1: {\n gap: '$1',\n },\n 2: {\n gap: '$2',\n },\n 3: {\n gap: '$3',\n },\n 4: {\n gap: '$4',\n },\n 5: {\n gap: '$5',\n },\n 6: {\n gap: '$6',\n },\n 7: {\n gap: '$7',\n },\n 8: {\n gap: '$8',\n },\n 9: {\n gap: '$9',\n },\n },\n gapX: {\n 1: {\n columnGap: '$1',\n },\n 2: {\n columnGap: '$2',\n },\n 3: {\n columnGap: '$3',\n },\n 4: {\n columnGap: '$4',\n },\n 5: {\n columnGap: '$5',\n },\n 6: {\n columnGap: '$6',\n },\n 7: {\n columnGap: '$7',\n },\n 8: {\n columnGap: '$8',\n },\n 9: {\n columnGap: '$9',\n },\n },\n gapY: {\n 1: {\n rowGap: '$1',\n },\n 2: {\n rowGap: '$2',\n },\n 3: {\n rowGap: '$3',\n },\n 4: {\n rowGap: '$4',\n },\n 5: {\n rowGap: '$5',\n },\n 6: {\n rowGap: '$6',\n },\n 7: {\n rowGap: '$7',\n },\n 8: {\n rowGap: '$8',\n },\n 9: {\n rowGap: '$9',\n },\n },\n },\n});\n"],"mappings":";AAEA,IAAa,4CAAO,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,OAAO;GACL,OAAO,EACL,YAAY,SACb;GACD,QAAQ,EACN,YAAY,UACb;GACD,KAAK,EACH,YAAY,OACb;GACD,SAAS,EACP,YAAY,WACb;GACD,UAAU,EACR,YAAY,YACb;GACF;EACD,SAAS;GACP,OAAO,EACL,gBAAgB,SACjB;GACD,QAAQ,EACN,gBAAgB,UACjB;GACD,KAAK,EACH,gBAAgB,OACjB;GACD,SAAS,EACP,gBAAgB,iBACjB;GACF;EACD,MAAM;GACJ,KAAK,EACH,cAAc,OACf;GACD,QAAQ,EACN,cAAc,UACf;GACD,OAAO,EACL,cAAc,SACf;GACD,UAAU,EACR,cAAc,aACf;GACD,aAAa,EACX,cAAc,gBACf;GACF;EACD,SAAS;GACP,GAAG,EACD,qBAAqB,kBACtB;GACD,GAAG,EACD,qBAAqB,kBACtB;GACD,GAAG,EACD,qBAAqB,kBACtB;GACD,GAAG,EACD,qBAAqB,kBACtB;GACF;EACD,KAAK;GACH,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACF;EACD,MAAM;GACJ,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACF;EACD,MAAM;GACJ,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACF;EACF;CACF,CAAC"}
1
+ {"version":3,"file":"Grid.cjs","names":[],"sources":["../../../components/Grid/Grid.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Grid = styled('div', {\n boxSizing: 'border-box',\n display: 'grid',\n\n variants: {\n align: {\n start: {\n alignItems: 'start',\n },\n center: {\n alignItems: 'center',\n },\n end: {\n alignItems: 'end',\n },\n stretch: {\n alignItems: 'stretch',\n },\n baseline: {\n alignItems: 'baseline',\n },\n },\n justify: {\n start: {\n justifyContent: 'start',\n },\n center: {\n justifyContent: 'center',\n },\n end: {\n justifyContent: 'end',\n },\n between: {\n justifyContent: 'space-between',\n },\n },\n flow: {\n row: {\n gridAutoFlow: 'row',\n },\n column: {\n gridAutoFlow: 'column',\n },\n dense: {\n gridAutoFlow: 'dense',\n },\n rowDense: {\n gridAutoFlow: 'row dense',\n },\n columnDense: {\n gridAutoFlow: 'column dense',\n },\n },\n columns: {\n 1: {\n gridTemplateColumns: 'repeat(1, 1fr)',\n },\n 2: {\n gridTemplateColumns: 'repeat(2, 1fr)',\n },\n 3: {\n gridTemplateColumns: 'repeat(3, 1fr)',\n },\n 4: {\n gridTemplateColumns: 'repeat(4, 1fr)',\n },\n },\n gap: {\n 1: {\n gap: '$1',\n },\n 2: {\n gap: '$2',\n },\n 3: {\n gap: '$3',\n },\n 4: {\n gap: '$4',\n },\n 5: {\n gap: '$5',\n },\n 6: {\n gap: '$6',\n },\n 7: {\n gap: '$7',\n },\n 8: {\n gap: '$8',\n },\n 9: {\n gap: '$9',\n },\n },\n gapX: {\n 1: {\n columnGap: '$1',\n },\n 2: {\n columnGap: '$2',\n },\n 3: {\n columnGap: '$3',\n },\n 4: {\n columnGap: '$4',\n },\n 5: {\n columnGap: '$5',\n },\n 6: {\n columnGap: '$6',\n },\n 7: {\n columnGap: '$7',\n },\n 8: {\n columnGap: '$8',\n },\n 9: {\n columnGap: '$9',\n },\n },\n gapY: {\n 1: {\n rowGap: '$1',\n },\n 2: {\n rowGap: '$2',\n },\n 3: {\n rowGap: '$3',\n },\n 4: {\n rowGap: '$4',\n },\n 5: {\n rowGap: '$5',\n },\n 6: {\n rowGap: '$6',\n },\n 7: {\n rowGap: '$7',\n },\n 8: {\n rowGap: '$8',\n },\n 9: {\n rowGap: '$9',\n },\n },\n },\n});\n"],"mappings":";AAEA,IAAa,2CAAO,CAAA,OAAO,OAAO;CAChC,WAAW;CACX,SAAS;CAET,UAAU;EACR,OAAO;GACL,OAAO,EACL,YAAY,SACb;GACD,QAAQ,EACN,YAAY,UACb;GACD,KAAK,EACH,YAAY,OACb;GACD,SAAS,EACP,YAAY,WACb;GACD,UAAU,EACR,YAAY,YACb;GACF;EACD,SAAS;GACP,OAAO,EACL,gBAAgB,SACjB;GACD,QAAQ,EACN,gBAAgB,UACjB;GACD,KAAK,EACH,gBAAgB,OACjB;GACD,SAAS,EACP,gBAAgB,iBACjB;GACF;EACD,MAAM;GACJ,KAAK,EACH,cAAc,OACf;GACD,QAAQ,EACN,cAAc,UACf;GACD,OAAO,EACL,cAAc,SACf;GACD,UAAU,EACR,cAAc,aACf;GACD,aAAa,EACX,cAAc,gBACf;GACF;EACD,SAAS;GACP,GAAG,EACD,qBAAqB,kBACtB;GACD,GAAG,EACD,qBAAqB,kBACtB;GACD,GAAG,EACD,qBAAqB,kBACtB;GACD,GAAG,EACD,qBAAqB,kBACtB;GACF;EACD,KAAK;GACH,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACD,GAAG,EACD,KAAK,MACN;GACF;EACD,MAAM;GACJ,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACD,GAAG,EACD,WAAW,MACZ;GACF;EACD,MAAM;GACJ,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACD,GAAG,EACD,QAAQ,MACT;GACF;EACF;CACF,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.vanilla.cjs","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n align?: GridAlign;\n justify?: GridJustify;\n flow?: GridFlow;\n columns?: number;\n gap?: Gap;\n gapX?: Gap;\n gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n align,\n justify,\n flow,\n columns,\n gap,\n gapX,\n gapY,\n ...props\n }: GridProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const dynamicStyles: React.CSSProperties = {};\n\n // To support any value on the columns props\n if (columns !== undefined) {\n dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n }\n\n const mergedStyles = {\n ...cssStyles,\n ...dynamicStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;;;AA0BA,IAAa,uBAAuB,MAAA,QAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,gBAAqC,EAAE;AAG7C,KAAI,YAAY,KAAA,EACd,eAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,yBAAA,WAAW;GAAE;GAAO;GAAS;GAAM;GAAK;GAAM;GAAM,CAAC,CAK3C,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
1
+ {"version":3,"file":"Grid.vanilla.cjs","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n align?: GridAlign;\n justify?: GridJustify;\n flow?: GridFlow;\n columns?: number;\n gap?: Gap;\n gapX?: Gap;\n gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n align,\n justify,\n flow,\n columns,\n gap,\n gapX,\n gapY,\n ...props\n }: GridProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const dynamicStyles: React.CSSProperties = {};\n\n // To support any value on the columns props\n if (columns !== undefined) {\n dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n }\n\n const mergedStyles = {\n ...cssStyles,\n ...dynamicStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;;;AA0BA,IAAa,uBAAuB,MAAA,QAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,gBAAqC,EAAE;AAG7C,KAAI,YAAY,KAAA,EACd,eAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,yBAAA,WAAW;GAAE;GAAO;GAAS;GAAM;GAAK;GAAM;GAAM,CAKtD,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.vanilla.js","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n align?: GridAlign;\n justify?: GridJustify;\n flow?: GridFlow;\n columns?: number;\n gap?: Gap;\n gapX?: Gap;\n gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n align,\n justify,\n flow,\n columns,\n gap,\n gapX,\n gapY,\n ...props\n }: GridProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const dynamicStyles: React.CSSProperties = {};\n\n // To support any value on the columns props\n if (columns !== undefined) {\n dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n }\n\n const mergedStyles = {\n ...cssStyles,\n ...dynamicStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;AA0BA,IAAa,uBAAuB,MAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,gBAAqC,EAAE;AAG7C,KAAI,YAAY,KAAA,EACd,eAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,WAAW;GAAE;GAAO;GAAS;GAAM;GAAK;GAAM;GAAM,CAAC,CAK3C,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
1
+ {"version":3,"file":"Grid.vanilla.js","names":[],"sources":["../../../components/Grid/Grid.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport React, { ElementType } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport type { Gap, GridAlign, GridFlow, GridJustify } from '../../styles/types';\nimport { gridRecipe } from './Grid.vanilla.css';\n\ninterface GridOwnProps extends CSSProps {\n align?: GridAlign;\n justify?: GridJustify;\n flow?: GridFlow;\n columns?: number;\n gap?: Gap;\n gapX?: Gap;\n gapY?: Gap;\n}\n\nexport type GridProps<C extends ElementType = 'div'> = PolymorphicComponentProps<C, GridOwnProps>;\ntype GridComponent = PolymorphicComponent<'div', GridProps<ElementType>>;\n\nexport const GridVanillaComponent = React.forwardRef(\n <C extends ElementType = 'div'>(\n {\n as,\n className,\n css,\n style,\n align,\n justify,\n flow,\n columns,\n gap,\n gapX,\n gapY,\n ...props\n }: GridProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'div';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const dynamicStyles: React.CSSProperties = {};\n\n // To support any value on the columns props\n if (columns !== undefined) {\n dynamicStyles.gridTemplateColumns = `repeat(${columns}, 1fr)`;\n }\n\n const mergedStyles = {\n ...cssStyles,\n ...dynamicStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = gridRecipe({ align, justify, flow, gap, gapX, gapY });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nGridVanillaComponent.displayName = 'GridVanilla';\n\nexport const GridVanilla = GridVanillaComponent as GridComponent;\n"],"mappings":";;;;;;;AA0BA,IAAa,uBAAuB,MAAM,YAEtC,EACE,IACA,WACA,KACA,OACA,OACA,SACA,MACA,SACA,KACA,MACA,MACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,gBAAqC,EAAE;AAG7C,KAAI,YAAY,KAAA,EACd,eAAc,sBAAsB,UAAU,QAAQ;CAGxD,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,WAAW;GAAE;GAAO;GAAS;GAAM;GAAK;GAAM;GAAM,CAKtD,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.vanilla.cjs","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n C,\n IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n 'button',\n IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'button'>(\n { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'button';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = iconButtonRecipe({ size, variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;;AA2BA,IAAM,kCAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,+BAAA,iBAAiB;GAAE;GAAM;GAAS,CAAC,CAKzB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
1
+ {"version":3,"file":"IconButton.vanilla.cjs","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n C,\n IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n 'button',\n IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'button'>(\n { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'button';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = iconButtonRecipe({ size, variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;;AA2BA,IAAM,kCAAA,GAAA,MAAA,aAEF,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,+BAAA,iBAAiB;GAAE;GAAM;GAAS,CAKpC,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.vanilla.js","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n C,\n IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n 'button',\n IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'button'>(\n { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'button';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = iconButtonRecipe({ size, variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;AA2BA,IAAM,iCAAiC,YAEnC,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,iBAAiB;GAAE;GAAM;GAAS,CAAC,CAKzB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
1
+ {"version":3,"file":"IconButton.vanilla.js","names":[],"sources":["../../../components/IconButton/IconButton.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { iconButtonRecipe } from './IconButton.vanilla.css';\n\ntype IconButtonRecipeVariants = RecipeVariants<typeof iconButtonRecipe>;\n\ninterface IconButtonOwnProps extends Omit<IconButtonRecipeVariants, never>, CSSProps {}\n\nexport type IconButtonVanillaProps<C extends ElementType = 'button'> = PolymorphicComponentProps<\n C,\n IconButtonOwnProps\n>;\n\ntype IconButtonVanillaComponent = PolymorphicComponent<\n 'button',\n IconButtonVanillaProps<ElementType>\n>;\n\nconst IconButtonVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'button'>(\n { as, className, css, style, size, variant, ...props }: IconButtonVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'button';\n\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = iconButtonRecipe({ size, variant });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nIconButtonVanillaComponentImpl.displayName = 'IconButtonVanilla';\n\nexport const IconButtonVanilla = IconButtonVanillaComponentImpl as IconButtonVanillaComponent;\n"],"mappings":";;;;;;;AA2BA,IAAM,iCAAiC,YAEnC,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAG,SAC/C,QACG;CACH,MAAM,YAAY,MAAM;CAExB,MAAM,EAAE,WAAW,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;AAID,QACE,oBAAC,WAAD;EACO;EACL,WAAW,GALK,iBAAiB;GAAE;GAAM;GAAS,CAKpC,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,+BAA+B,cAAc;AAE7C,IAAa,oBAAoB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Image.cjs","names":[],"sources":["../../../components/Image/Image.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Image = styled('img', {\n // Reset\n verticalAlign: 'middle',\n maxWidth: '100%',\n});\n"],"mappings":";AAEA,IAAa,6CAAQ,OAAO,OAAO;CAEjC,eAAe;CACf,UAAU;CACX,CAAC"}
1
+ {"version":3,"file":"Image.cjs","names":[],"sources":["../../../components/Image/Image.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Image = styled('img', {\n // Reset\n verticalAlign: 'middle',\n maxWidth: '100%',\n});\n"],"mappings":";AAEA,IAAa,4CAAQ,CAAA,OAAO,OAAO;CAEjC,eAAe;CACf,UAAU;CACX,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Input.cjs","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n // Reset\n appearance: 'none',\n borderWidth: '0',\n boxSizing: 'border-box',\n fontFamily: '$rubik',\n margin: '0',\n outline: 'none',\n padding: '0',\n width: '100%',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n // Custom\n position: 'relative',\n backgroundColor: 'transparent',\n borderRadius: 'inherit', // inherit border radius from InputWrapper\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n color: '$inputText',\n fontVariantNumeric: 'tabular-nums',\n transition: 'box-shadow .1s ease-in-out',\n\n '&[type=\"number\"]': {\n pr: '0', // remove padding for number native controls\n },\n\n '&:-webkit-autofill,&:autofill': {\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\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$inputFocusBorder, ${FOCUS_SHADOW}`,\n },\n\n '&::placeholder': {\n color: '$inputPlaceholder',\n },\n\n '&:read-only:not(:disabled)': {\n boxShadow: 'none',\n },\n\n '&:disabled': {\n pointerEvents: 'none',\n color: '$inputDisabledText',\n },\n\n variants: {\n size: {\n small: {\n height: SMALL_HEIGHT,\n fontSize: '$1',\n px: '$2',\n lineHeight: '$sizes$5',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$1',\n },\n },\n medium: {\n height: MEDIUM_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$6',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n large: {\n height: LARGE_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$7',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n },\n startAdornment: {\n true: {},\n },\n endAdornment: {\n true: {},\n },\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$inputInvalidBorder',\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\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 },\n defaultVariants: {\n size: 'medium',\n cursor: 'default',\n },\n compoundVariants: [\n {\n variant: 'ghost',\n state: 'invalid',\n css: {\n boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n },\n },\n {\n startAdornment: true,\n size: 'small',\n css: {\n paddingInlineStart: 'calc($2 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'medium',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'large',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n css: {\n paddingInlineEnd: 'calc($2 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'large',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'large',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n ],\n});\n\nconst InputWrapper = styled('div', {\n // Reset\n outline: 'none',\n lineHeight: 0,\n\n position: 'relative',\n backgroundColor: '$inputBg',\n color: '$inputPlaceholder',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\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: '$inputDisabledText',\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: '$inputInvalidBorder',\n },\n },\n },\n },\n },\n size: {\n small: {\n borderRadius: '$2',\n '&::before, &::after': {\n borderRadius: '$2',\n },\n },\n medium: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n large: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n disabled: false,\n },\n});\n\nconst AdornmentWrapper = styled('div', {\n position: 'absolute',\n top: 0,\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n variants: {\n size: {\n small: {\n mx: 'calc($2 / 2)',\n },\n medium: {\n mx: 'calc($3 / 2)',\n },\n large: {\n mx: 'calc($3 / 2)',\n },\n },\n variant: {\n start: {\n left: 0,\n },\n end: {\n right: 0,\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n startAdornment?: React.ReactNode;\n endAdornment?: React.ReactNode;\n type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n const inputRef = React.useRef<InputHandle>(null);\n\n React.useImperativeHandle(\n forwardedRef,\n () => {\n const { current } = inputRef;\n if (current) {\n current.clear = () => {\n current.value = '';\n };\n }\n return current as InputHandle;\n },\n [inputRef]\n );\n\n const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n return (\n <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n {hasStartAdornment && (\n <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n )}\n\n <StyledInput\n ref={inputRef}\n startAdornment={hasStartAdornment}\n endAdornment={hasEndAdornment}\n size={size}\n {...props}\n />\n {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n </InputWrapper>\n );\n }\n);\n"],"mappings":";;;;;;;AAMA,IAAM,eAAe,kBAAA,kBAAkB,GAAG;AAM1C,IAAM,cAAc,wBAAA,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,KACL;CAED,iCAAiC,EAC/B,WAAW,0EACZ;CAED,yDAAyD;EACvD,YAAY;EACZ,OAAO;EACR;CAED,mBAAmB,EACjB,WAAW,6CAA6C,gBACzD;CAED,kBAAkB,EAChB,OAAO,qBACR;CAED,8BAA8B,EAC5B,WAAW,QACZ;CAED,cAAc;EACZ,eAAe;EACf,OAAO;EACR;CAED,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QA1Da;IA2Db,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,QAAQ;IACN,QAlEc;IAmEd,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,OAAO;IACL,QA1Ea;IA2Eb,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACF;EACD,gBAAgB,EACd,MAAM,EAAE,EACT;EACD,cAAc,EACZ,MAAM,EAAE,EACT;EACD,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,QACZ;GACD,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,eAClB;GACF,EACF;EACD,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,gBAC3D;GACF,EACF;EACD,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,QACT,EACF;IACD,mCAAmC,EACjC,QAAQ,QACT;IACF;GACD,MAAM,EACJ,QAAQ,QACT;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,QAAQ;EACT;CACD,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,8CACZ;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACF;CACF,CAAC;AAEF,IAAM,eAAe,wBAAA,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CACD,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CAED,mBAAmB;EACjB,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF;CAED,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF,EACF;CAED,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,WAClB;IACD,YAAY,EACV,iBAAiB,WAClB;IACF,EACF;GACF,EACF;EACD,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,uBAClB,EACF,EACF,EACF,EACF;EACD,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,UAAU;EACX;CACF,CAAC;AAEF,IAAM,mBAAmB,wBAAA,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,gBACL;GACD,QAAQ,EACN,IAAI,gBACL;GACD,OAAO,EACL,IAAI,gBACL;GACF;EACD,SAAS;GACP,OAAO,EACL,MAAM,GACP;GACD,KAAK,EACH,OAAO,GACR;GACF;EACF;CACD,iBAAiB,EACf,MAAM,UACP;CACF,CAAC;AAEF,IAAM,wBAAwB,wBAAA,OAAO,kBAAkB,EACrD,MAAM,GACP,CAAC;AAEF,IAAM,sBAAsB,wBAAA,OAAO,kBAAkB,EACnD,OAAO,GACR,CAAC;AAgBF,IAAa,QAAQ,MAAA,QAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAA,QAAM,OAAoB,KAAK;AAEhD,OAAA,QAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;AACpB,MAAI,QACF,SAAQ,cAAc;AACpB,WAAQ,QAAQ;;AAGpB,SAAO;IAET,CAAC,SAAS,CACX;CAED,MAAM,oBAAoB,MAAA,QAAM,cAAc,QAAQ,eAAe,EAAE,CAAC,eAAe,CAAC;CAExF,MAAM,kBAAkB,MAAA,QAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;AAElF,QACE,iBAAA,GAAA,kBAAA,MAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;YAA/D;GACG,qBACC,iBAAA,GAAA,kBAAA,KAAC,uBAAD;IAA6B;cAAO;IAAuC,CAAA;GAG7E,iBAAA,GAAA,kBAAA,KAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;IACJ,CAAA;GACD,mBAAmB,iBAAA,GAAA,kBAAA,KAAC,qBAAD;IAA2B;cAAO;IAAmC,CAAA;GAC5E;;EAGpB"}
1
+ {"version":3,"file":"Input.cjs","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n // Reset\n appearance: 'none',\n borderWidth: '0',\n boxSizing: 'border-box',\n fontFamily: '$rubik',\n margin: '0',\n outline: 'none',\n padding: '0',\n width: '100%',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n // Custom\n position: 'relative',\n backgroundColor: 'transparent',\n borderRadius: 'inherit', // inherit border radius from InputWrapper\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n color: '$inputText',\n fontVariantNumeric: 'tabular-nums',\n transition: 'box-shadow .1s ease-in-out',\n\n '&[type=\"number\"]': {\n pr: '0', // remove padding for number native controls\n },\n\n '&:-webkit-autofill,&:autofill': {\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\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$inputFocusBorder, ${FOCUS_SHADOW}`,\n },\n\n '&::placeholder': {\n color: '$inputPlaceholder',\n },\n\n '&:read-only:not(:disabled)': {\n boxShadow: 'none',\n },\n\n '&:disabled': {\n pointerEvents: 'none',\n color: '$inputDisabledText',\n },\n\n variants: {\n size: {\n small: {\n height: SMALL_HEIGHT,\n fontSize: '$1',\n px: '$2',\n lineHeight: '$sizes$5',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$1',\n },\n },\n medium: {\n height: MEDIUM_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$6',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n large: {\n height: LARGE_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$7',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n },\n startAdornment: {\n true: {},\n },\n endAdornment: {\n true: {},\n },\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$inputInvalidBorder',\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\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 },\n defaultVariants: {\n size: 'medium',\n cursor: 'default',\n },\n compoundVariants: [\n {\n variant: 'ghost',\n state: 'invalid',\n css: {\n boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n },\n },\n {\n startAdornment: true,\n size: 'small',\n css: {\n paddingInlineStart: 'calc($2 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'medium',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'large',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n css: {\n paddingInlineEnd: 'calc($2 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'large',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'large',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n ],\n});\n\nconst InputWrapper = styled('div', {\n // Reset\n outline: 'none',\n lineHeight: 0,\n\n position: 'relative',\n backgroundColor: '$inputBg',\n color: '$inputPlaceholder',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\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: '$inputDisabledText',\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: '$inputInvalidBorder',\n },\n },\n },\n },\n },\n size: {\n small: {\n borderRadius: '$2',\n '&::before, &::after': {\n borderRadius: '$2',\n },\n },\n medium: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n large: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n disabled: false,\n },\n});\n\nconst AdornmentWrapper = styled('div', {\n position: 'absolute',\n top: 0,\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n variants: {\n size: {\n small: {\n mx: 'calc($2 / 2)',\n },\n medium: {\n mx: 'calc($3 / 2)',\n },\n large: {\n mx: 'calc($3 / 2)',\n },\n },\n variant: {\n start: {\n left: 0,\n },\n end: {\n right: 0,\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n startAdornment?: React.ReactNode;\n endAdornment?: React.ReactNode;\n type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n const inputRef = React.useRef<InputHandle>(null);\n\n React.useImperativeHandle(\n forwardedRef,\n () => {\n const { current } = inputRef;\n if (current) {\n current.clear = () => {\n current.value = '';\n };\n }\n return current as InputHandle;\n },\n [inputRef]\n );\n\n const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n return (\n <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n {hasStartAdornment && (\n <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n )}\n\n <StyledInput\n ref={inputRef}\n startAdornment={hasStartAdornment}\n endAdornment={hasEndAdornment}\n size={size}\n {...props}\n />\n {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n </InputWrapper>\n );\n }\n);\n"],"mappings":";;;;;;;AAMA,IAAM,eAAe,kBAAA,kBAAkB,GAAG;AAM1C,IAAM,cAAc,wBAAA,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,KACL;CAED,iCAAiC,EAC/B,WAAW,0EACZ;CAED,yDAAyD;EACvD,YAAY;EACZ,OAAO;EACR;CAED,mBAAmB,EACjB,WAAW,6CAA6C,gBACzD;CAED,kBAAkB,EAChB,OAAO,qBACR;CAED,8BAA8B,EAC5B,WAAW,QACZ;CAED,cAAc;EACZ,eAAe;EACf,OAAO;EACR;CAED,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,QAAQ;IACN,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACF;EACD,gBAAgB,EACd,MAAM,EAAE,EACT;EACD,cAAc,EACZ,MAAM,EAAE,EACT;EACD,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,QACZ;GACD,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,eAClB;GACF,EACF;EACD,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,gBAC3D;GACF,EACF;EACD,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,QACT,EACF;IACD,mCAAmC,EACjC,QAAQ,QACT;IACF;GACD,MAAM,EACJ,QAAQ,QACT;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,QAAQ;EACT;CACD,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,8CACZ;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACF;CACF,CAAC;AAEF,IAAM,eAAe,wBAAA,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CACD,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CAED,mBAAmB;EACjB,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF;CAED,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF,EACF;CAED,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,WAClB;IACD,YAAY,EACV,iBAAiB,WAClB;IACF,EACF;GACF,EACF;EACD,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,uBAClB,EACF,EACF,EACF,EACF;EACD,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,UAAU;EACX;CACF,CAAC;AAEF,IAAM,mBAAmB,wBAAA,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,gBACL;GACD,QAAQ,EACN,IAAI,gBACL;GACD,OAAO,EACL,IAAI,gBACL;GACF;EACD,SAAS;GACP,OAAO,EACL,MAAM,GACP;GACD,KAAK,EACH,OAAO,GACR;GACF;EACF;CACD,iBAAiB,EACf,MAAM,UACP;CACF,CAAC;AAEF,IAAM,wBAAwB,wBAAA,OAAO,kBAAkB,EACrD,MAAM,GACP,CAAC;AAEF,IAAM,sBAAsB,wBAAA,OAAO,kBAAkB,EACnD,OAAO,GACR,CAAC;AAgBF,IAAa,QAAQ,MAAA,QAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAA,QAAM,OAAoB,KAAK;AAEhD,OAAA,QAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;AACpB,MAAI,QACF,SAAQ,cAAc;AACpB,WAAQ,QAAQ;;AAGpB,SAAO;IAET,CAAC,SAAS,CACX;CAED,MAAM,oBAAoB,MAAA,QAAM,cAAc,QAAQ,eAAe,EAAE,CAAC,eAAe,CAAC;CAExF,MAAM,kBAAkB,MAAA,QAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;AAElF,QACE,iBAAA,GAAA,kBAAA,MAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;YAA/D;GACG,qBACC,iBAAA,GAAA,kBAAA,KAAC,uBAAD;IAA6B;cAAO;IAAuC,CAAA;GAG7E,iBAAA,GAAA,kBAAA,KAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;IACJ,CAAA;GACD,mBAAmB,iBAAA,GAAA,kBAAA,KAAC,qBAAD;IAA2B;cAAO;IAAmC,CAAA;GAC5E;;EAGpB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Input.js","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n // Reset\n appearance: 'none',\n borderWidth: '0',\n boxSizing: 'border-box',\n fontFamily: '$rubik',\n margin: '0',\n outline: 'none',\n padding: '0',\n width: '100%',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n // Custom\n position: 'relative',\n backgroundColor: 'transparent',\n borderRadius: 'inherit', // inherit border radius from InputWrapper\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n color: '$inputText',\n fontVariantNumeric: 'tabular-nums',\n transition: 'box-shadow .1s ease-in-out',\n\n '&[type=\"number\"]': {\n pr: '0', // remove padding for number native controls\n },\n\n '&:-webkit-autofill,&:autofill': {\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\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$inputFocusBorder, ${FOCUS_SHADOW}`,\n },\n\n '&::placeholder': {\n color: '$inputPlaceholder',\n },\n\n '&:read-only:not(:disabled)': {\n boxShadow: 'none',\n },\n\n '&:disabled': {\n pointerEvents: 'none',\n color: '$inputDisabledText',\n },\n\n variants: {\n size: {\n small: {\n height: SMALL_HEIGHT,\n fontSize: '$1',\n px: '$2',\n lineHeight: '$sizes$5',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$1',\n },\n },\n medium: {\n height: MEDIUM_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$6',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n large: {\n height: LARGE_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$7',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n },\n startAdornment: {\n true: {},\n },\n endAdornment: {\n true: {},\n },\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$inputInvalidBorder',\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\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 },\n defaultVariants: {\n size: 'medium',\n cursor: 'default',\n },\n compoundVariants: [\n {\n variant: 'ghost',\n state: 'invalid',\n css: {\n boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n },\n },\n {\n startAdornment: true,\n size: 'small',\n css: {\n paddingInlineStart: 'calc($2 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'medium',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'large',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n css: {\n paddingInlineEnd: 'calc($2 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'large',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'large',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n ],\n});\n\nconst InputWrapper = styled('div', {\n // Reset\n outline: 'none',\n lineHeight: 0,\n\n position: 'relative',\n backgroundColor: '$inputBg',\n color: '$inputPlaceholder',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\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: '$inputDisabledText',\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: '$inputInvalidBorder',\n },\n },\n },\n },\n },\n size: {\n small: {\n borderRadius: '$2',\n '&::before, &::after': {\n borderRadius: '$2',\n },\n },\n medium: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n large: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n disabled: false,\n },\n});\n\nconst AdornmentWrapper = styled('div', {\n position: 'absolute',\n top: 0,\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n variants: {\n size: {\n small: {\n mx: 'calc($2 / 2)',\n },\n medium: {\n mx: 'calc($3 / 2)',\n },\n large: {\n mx: 'calc($3 / 2)',\n },\n },\n variant: {\n start: {\n left: 0,\n },\n end: {\n right: 0,\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n startAdornment?: React.ReactNode;\n endAdornment?: React.ReactNode;\n type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n const inputRef = React.useRef<InputHandle>(null);\n\n React.useImperativeHandle(\n forwardedRef,\n () => {\n const { current } = inputRef;\n if (current) {\n current.clear = () => {\n current.value = '';\n };\n }\n return current as InputHandle;\n },\n [inputRef]\n );\n\n const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n return (\n <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n {hasStartAdornment && (\n <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n )}\n\n <StyledInput\n ref={inputRef}\n startAdornment={hasStartAdornment}\n endAdornment={hasEndAdornment}\n size={size}\n {...props}\n />\n {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n </InputWrapper>\n );\n }\n);\n"],"mappings":";;;;;AAMA,IAAM,eAAe,kBAAkB,GAAG;AAM1C,IAAM,cAAc,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,KACL;CAED,iCAAiC,EAC/B,WAAW,0EACZ;CAED,yDAAyD;EACvD,YAAY;EACZ,OAAO;EACR;CAED,mBAAmB,EACjB,WAAW,6CAA6C,gBACzD;CAED,kBAAkB,EAChB,OAAO,qBACR;CAED,8BAA8B,EAC5B,WAAW,QACZ;CAED,cAAc;EACZ,eAAe;EACf,OAAO;EACR;CAED,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QA1Da;IA2Db,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,QAAQ;IACN,QAlEc;IAmEd,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,OAAO;IACL,QA1Ea;IA2Eb,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACF;EACD,gBAAgB,EACd,MAAM,EAAE,EACT;EACD,cAAc,EACZ,MAAM,EAAE,EACT;EACD,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,QACZ;GACD,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,eAClB;GACF,EACF;EACD,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,gBAC3D;GACF,EACF;EACD,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,QACT,EACF;IACD,mCAAmC,EACjC,QAAQ,QACT;IACF;GACD,MAAM,EACJ,QAAQ,QACT;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,QAAQ;EACT;CACD,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,8CACZ;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACF;CACF,CAAC;AAEF,IAAM,eAAe,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CACD,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CAED,mBAAmB;EACjB,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF;CAED,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF,EACF;CAED,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,WAClB;IACD,YAAY,EACV,iBAAiB,WAClB;IACF,EACF;GACF,EACF;EACD,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,uBAClB,EACF,EACF,EACF,EACF;EACD,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,UAAU;EACX;CACF,CAAC;AAEF,IAAM,mBAAmB,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,gBACL;GACD,QAAQ,EACN,IAAI,gBACL;GACD,OAAO,EACL,IAAI,gBACL;GACF;EACD,SAAS;GACP,OAAO,EACL,MAAM,GACP;GACD,KAAK,EACH,OAAO,GACR;GACF;EACF;CACD,iBAAiB,EACf,MAAM,UACP;CACF,CAAC;AAEF,IAAM,wBAAwB,OAAO,kBAAkB,EACrD,MAAM,GACP,CAAC;AAEF,IAAM,sBAAsB,OAAO,kBAAkB,EACnD,OAAO,GACR,CAAC;AAgBF,IAAa,QAAQ,MAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAM,OAAoB,KAAK;AAEhD,OAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;AACpB,MAAI,QACF,SAAQ,cAAc;AACpB,WAAQ,QAAQ;;AAGpB,SAAO;IAET,CAAC,SAAS,CACX;CAED,MAAM,oBAAoB,MAAM,cAAc,QAAQ,eAAe,EAAE,CAAC,eAAe,CAAC;CAExF,MAAM,kBAAkB,MAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;AAElF,QACE,qBAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;YAA/D;GACG,qBACC,oBAAC,uBAAD;IAA6B;cAAO;IAAuC,CAAA;GAG7E,oBAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;IACJ,CAAA;GACD,mBAAmB,oBAAC,qBAAD;IAA2B;cAAO;IAAmC,CAAA;GAC5E;;EAGpB"}
1
+ {"version":3,"file":"Input.js","names":[],"sources":["../../../components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\n\nconst SMALL_HEIGHT = '$5';\nconst MEDIUM_HEIGHT = '$6';\nconst LARGE_HEIGHT = '$7';\n\nconst StyledInput = styled('input', {\n // Reset\n appearance: 'none',\n borderWidth: '0',\n boxSizing: 'border-box',\n fontFamily: '$rubik',\n margin: '0',\n outline: 'none',\n padding: '0',\n width: '100%',\n WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n\n // Custom\n position: 'relative',\n backgroundColor: 'transparent',\n borderRadius: 'inherit', // inherit border radius from InputWrapper\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder',\n color: '$inputText',\n fontVariantNumeric: 'tabular-nums',\n transition: 'box-shadow .1s ease-in-out',\n\n '&[type=\"number\"]': {\n pr: '0', // remove padding for number native controls\n },\n\n '&:-webkit-autofill,&:autofill': {\n boxShadow: 'inset 0 0 0 1px $colors$inputBorder, inset 0 0 0 100px $colors$inputBg',\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$inputFocusBorder, ${FOCUS_SHADOW}`,\n },\n\n '&::placeholder': {\n color: '$inputPlaceholder',\n },\n\n '&:read-only:not(:disabled)': {\n boxShadow: 'none',\n },\n\n '&:disabled': {\n pointerEvents: 'none',\n color: '$inputDisabledText',\n },\n\n variants: {\n size: {\n small: {\n height: SMALL_HEIGHT,\n fontSize: '$1',\n px: '$2',\n lineHeight: '$sizes$5',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$1',\n },\n },\n medium: {\n height: MEDIUM_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$6',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n large: {\n height: LARGE_HEIGHT,\n fontSize: '$3',\n px: '$3',\n lineHeight: '$sizes$7',\n '&:-webkit-autofill::first-line,&:autofill::first-line': {\n fontSize: '$3',\n },\n },\n },\n startAdornment: {\n true: {},\n },\n endAdornment: {\n true: {},\n },\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$inputInvalidBorder',\n '&:focus-visible': {\n boxShadow: `inset 0 0 0 2px $colors$inputInvalidBorder, ${FOCUS_SHADOW}`,\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 },\n defaultVariants: {\n size: 'medium',\n cursor: 'default',\n },\n compoundVariants: [\n {\n variant: 'ghost',\n state: 'invalid',\n css: {\n boxShadow: 'inset 0 0 0 1px $colors$inputInvalidBorder',\n },\n },\n {\n startAdornment: true,\n size: 'small',\n css: {\n paddingInlineStart: 'calc($2 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'medium',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n startAdornment: true,\n size: 'large',\n css: {\n paddingInlineStart: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n css: {\n paddingInlineEnd: 'calc($2 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'large',\n css: {\n paddingInlineEnd: 'calc($3 + 15px)',\n },\n },\n {\n endAdornment: true,\n size: 'small',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($4 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'medium',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n {\n endAdornment: true,\n size: 'large',\n state: 'invalid',\n css: {\n paddingInlineEnd: 'calc($6 + 30px)', // size padding + adornment margins + icon size + icon size\n },\n },\n ],\n});\n\nconst InputWrapper = styled('div', {\n // Reset\n outline: 'none',\n lineHeight: 0,\n\n position: 'relative',\n backgroundColor: '$inputBg',\n color: '$inputPlaceholder',\n\n '&::before': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n '&::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n pointerEvents: 'none',\n },\n\n '&:focus-visible': {\n '&::before': {\n backgroundColor: '$inputFocusBg',\n },\n '&::after': {\n backgroundColor: '$primary',\n opacity: 0.15,\n },\n },\n\n '@hover': {\n '&:hover': {\n '&::before': {\n backgroundColor: '$inputHoverBg',\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: '$inputDisabledText',\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: '$inputInvalidBorder',\n },\n },\n },\n },\n },\n size: {\n small: {\n borderRadius: '$2',\n '&::before, &::after': {\n borderRadius: '$2',\n },\n },\n medium: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n large: {\n borderRadius: '$3',\n '&::before, &::after': {\n borderRadius: '$3',\n },\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n disabled: false,\n },\n});\n\nconst AdornmentWrapper = styled('div', {\n position: 'absolute',\n top: 0,\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n variants: {\n size: {\n small: {\n mx: 'calc($2 / 2)',\n },\n medium: {\n mx: 'calc($3 / 2)',\n },\n large: {\n mx: 'calc($3 / 2)',\n },\n },\n variant: {\n start: {\n left: 0,\n },\n end: {\n right: 0,\n },\n },\n },\n defaultVariants: {\n size: 'medium',\n },\n});\n\nconst AdornmentWrapperStart = styled(AdornmentWrapper, {\n left: 0,\n});\n\nconst AdornmentWrapperEnd = styled(AdornmentWrapper, {\n right: 0,\n});\n\ntype DefaultInputVariants = VariantProps<typeof StyledInput>;\nexport type InputVariants = Omit<DefaultInputVariants, 'startAdornment' | 'endAdornment'>;\nexport interface HTMLInputProps extends React.InputHTMLAttributes<any> {\n startAdornment?: React.ReactNode;\n endAdornment?: React.ReactNode;\n type?: string;\n}\n\nexport type InputProps = Omit<HTMLInputProps, 'size'> & InputVariants & { css?: CSS };\n\nexport interface InputHandle extends HTMLInputElement {\n clear: () => void;\n}\n\nexport const Input = React.forwardRef<InputHandle, InputProps>(\n ({ size, startAdornment, endAdornment, css, ...props }, forwardedRef) => {\n const inputRef = React.useRef<InputHandle>(null);\n\n React.useImperativeHandle(\n forwardedRef,\n () => {\n const { current } = inputRef;\n if (current) {\n current.clear = () => {\n current.value = '';\n };\n }\n return current as InputHandle;\n },\n [inputRef]\n );\n\n const hasStartAdornment = React.useMemo(() => Boolean(startAdornment), [startAdornment]);\n\n const hasEndAdornment = React.useMemo(() => Boolean(endAdornment), [endAdornment]);\n\n return (\n <InputWrapper css={css} disabled={props.disabled} state={props.state}>\n {hasStartAdornment && (\n <AdornmentWrapperStart size={size}>{startAdornment}</AdornmentWrapperStart>\n )}\n\n <StyledInput\n ref={inputRef}\n startAdornment={hasStartAdornment}\n endAdornment={hasEndAdornment}\n size={size}\n {...props}\n />\n {hasEndAdornment && <AdornmentWrapperEnd size={size}>{endAdornment}</AdornmentWrapperEnd>}\n </InputWrapper>\n );\n }\n);\n"],"mappings":";;;;;AAMA,IAAM,eAAe,kBAAkB,GAAG;AAM1C,IAAM,cAAc,OAAO,SAAS;CAElC,YAAY;CACZ,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ;CACR,SAAS;CACT,SAAS;CACT,OAAO;CACP,yBAAyB;CAGzB,UAAU;CACV,iBAAiB;CACjB,cAAc;CACd,WAAW;CACX,OAAO;CACP,oBAAoB;CACpB,YAAY;CAEZ,sBAAoB,EAClB,IAAI,KACL;CAED,iCAAiC,EAC/B,WAAW,0EACZ;CAED,yDAAyD;EACvD,YAAY;EACZ,OAAO;EACR;CAED,mBAAmB,EACjB,WAAW,6CAA6C,gBACzD;CAED,kBAAkB,EAChB,OAAO,qBACR;CAED,8BAA8B,EAC5B,WAAW,QACZ;CAED,cAAc;EACZ,eAAe;EACf,OAAO;EACR;CAED,UAAU;EACR,MAAM;GACJ,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,QAAQ;IACN,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,IAAI;IACJ,YAAY;IACZ,yDAAyD,EACvD,UAAU,MACX;IACF;GACF;EACD,gBAAgB,EACd,MAAM,EAAE,EACT;EACD,cAAc,EACZ,MAAM,EAAE,EACT;EACD,SAAS,EACP,OAAO;GACL,WAAW;GACX,cAAc,EACZ,WAAW,QACZ;GACD,iBAAiB;GACjB,mBAAmB,EACjB,iBAAiB,eAClB;GACF,EACF;EACD,OAAO,EACL,SAAS;GACP,WAAW;GACX,mBAAmB,EACjB,WAAW,+CAA+C,gBAC3D;GACF,EACF;EACD,QAAQ;GACN,SAAS;IACP,QAAQ;IACR,UAAU,EACR,2BAA2B,EACzB,QAAQ,QACT,EACF;IACD,mCAAmC,EACjC,QAAQ,QACT;IACF;GACD,MAAM,EACJ,QAAQ,QACT;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,QAAQ;EACT;CACD,kBAAkB;EAChB;GACE,SAAS;GACT,OAAO;GACP,KAAK,EACH,WAAW,8CACZ;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,gBAAgB;GAChB,MAAM;GACN,KAAK,EACH,oBAAoB,mBACrB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACD;GACE,cAAc;GACd,MAAM;GACN,OAAO;GACP,KAAK,EACH,kBAAkB,mBACnB;GACF;EACF;CACF,CAAC;AAEF,IAAM,eAAe,OAAO,OAAO;CAEjC,SAAS;CACT,YAAY;CAEZ,UAAU;CACV,iBAAiB;CACjB,OAAO;CAEP,aAAa;EACX,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CACD,YAAY;EACV,WAAW;EACX,SAAS;EACT,UAAU;EACV,OAAO;EACP,eAAe;EAChB;CAED,mBAAmB;EACjB,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF;CAED,UAAU,EACR,WAAW;EACT,aAAa,EACX,iBAAiB,iBAClB;EACD,YAAY;GACV,iBAAiB;GACjB,SAAS;GACV;EACF,EACF;CAED,UAAU;EACR,UAAU,EACR,MAAM;GACJ,SAAS;GACT,OAAO;GACP,UAAU,EACR,WAAW;IACT,aAAa,EACX,iBAAiB,WAClB;IACD,YAAY,EACV,iBAAiB,WAClB;IACF,EACF;GACF,EACF;EACD,OAAO,EACL,SAAS,EACP,UAAU,EACR,WAAW,EACT,YAAY,EACV,iBAAiB,uBAClB,EACF,EACF,EACF,EACF;EACD,MAAM;GACJ,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,QAAQ;IACN,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACD,OAAO;IACL,cAAc;IACd,uBAAuB,EACrB,cAAc,MACf;IACF;GACF;EACF;CACD,iBAAiB;EACf,MAAM;EACN,UAAU;EACX;CACF,CAAC;AAEF,IAAM,mBAAmB,OAAO,OAAO;CACrC,UAAU;CACV,KAAK;CACL,QAAQ;CACR,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,UAAU;EACR,MAAM;GACJ,OAAO,EACL,IAAI,gBACL;GACD,QAAQ,EACN,IAAI,gBACL;GACD,OAAO,EACL,IAAI,gBACL;GACF;EACD,SAAS;GACP,OAAO,EACL,MAAM,GACP;GACD,KAAK,EACH,OAAO,GACR;GACF;EACF;CACD,iBAAiB,EACf,MAAM,UACP;CACF,CAAC;AAEF,IAAM,wBAAwB,OAAO,kBAAkB,EACrD,MAAM,GACP,CAAC;AAEF,IAAM,sBAAsB,OAAO,kBAAkB,EACnD,OAAO,GACR,CAAC;AAgBF,IAAa,QAAQ,MAAM,YACxB,EAAE,MAAM,gBAAgB,cAAc,KAAK,GAAG,SAAS,iBAAiB;CACvE,MAAM,WAAW,MAAM,OAAoB,KAAK;AAEhD,OAAM,oBACJ,oBACM;EACJ,MAAM,EAAE,YAAY;AACpB,MAAI,QACF,SAAQ,cAAc;AACpB,WAAQ,QAAQ;;AAGpB,SAAO;IAET,CAAC,SAAS,CACX;CAED,MAAM,oBAAoB,MAAM,cAAc,QAAQ,eAAe,EAAE,CAAC,eAAe,CAAC;CAExF,MAAM,kBAAkB,MAAM,cAAc,QAAQ,aAAa,EAAE,CAAC,aAAa,CAAC;AAElF,QACE,qBAAC,cAAD;EAAmB;EAAK,UAAU,MAAM;EAAU,OAAO,MAAM;YAA/D;GACG,qBACC,oBAAC,uBAAD;IAA6B;cAAO;IAAuC,CAAA;GAG7E,oBAAC,aAAD;IACE,KAAK;IACL,gBAAgB;IAChB,cAAc;IACR;IACN,GAAI;IACJ,CAAA;GACD,mBAAmB,oBAAC,qBAAD;IAA2B;cAAO;IAAmC,CAAA;GAC5E;;EAGpB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Label.vanilla.cjs","names":[],"sources":["../../../components/Label/Label.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { labelRecipe } from './Label.vanilla.css';\n\ntype LabelRecipeVariants = NonNullable<RecipeVariants<typeof labelRecipe>>;\n\ninterface LabelOwnProps extends LabelRecipeVariants, CSSProps {}\n\nexport type LabelVanillaProps<C extends ElementType = 'label'> = PolymorphicComponentProps<\n C,\n LabelOwnProps\n>;\n\ntype LabelVanillaComponent = PolymorphicComponent<'label', LabelVanillaProps<ElementType>>;\n\nconst LabelVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'label'>(\n {\n as,\n className,\n css,\n style,\n size,\n weight,\n variant,\n gradient,\n transform,\n noWrap,\n ...props\n }: LabelVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'label';\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = labelRecipe({ size, weight, variant, gradient, transform, noWrap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nLabelVanillaComponentImpl.displayName = 'LabelVanilla';\n\nexport const LabelVanilla = LabelVanillaComponentImpl as LabelVanillaComponent;\n"],"mappings":";;;;;;;;AAwBA,IAAM,6BAAA,GAAA,MAAA,aAEF,EACE,IACA,WACA,KACA,OACA,MACA,QACA,SACA,UACA,WACA,QACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,0BAAA,YAAY;GAAE;GAAM;GAAQ;GAAS;GAAU;GAAW;GAAQ,CAAC,CAKzD,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,eAAe"}
1
+ {"version":3,"file":"Label.vanilla.cjs","names":[],"sources":["../../../components/Label/Label.vanilla.tsx"],"sourcesContent":["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { RecipeVariants } from '@vanilla-extract/recipes';\nimport { ElementType, forwardRef } from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport {\n PolymorphicComponent,\n PolymorphicComponentProps,\n PolymorphicRef,\n} from '../../styles/polymorphic';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { labelRecipe } from './Label.vanilla.css';\n\ntype LabelRecipeVariants = NonNullable<RecipeVariants<typeof labelRecipe>>;\n\ninterface LabelOwnProps extends LabelRecipeVariants, CSSProps {}\n\nexport type LabelVanillaProps<C extends ElementType = 'label'> = PolymorphicComponentProps<\n C,\n LabelOwnProps\n>;\n\ntype LabelVanillaComponent = PolymorphicComponent<'label', LabelVanillaProps<ElementType>>;\n\nconst LabelVanillaComponentImpl = forwardRef(\n <C extends ElementType = 'label'>(\n {\n as,\n className,\n css,\n style,\n size,\n weight,\n variant,\n gradient,\n transform,\n noWrap,\n ...props\n }: LabelVanillaProps<C>,\n ref?: PolymorphicRef<C>,\n ) => {\n const Component = as || 'label';\n const { colors } = useVanillaExtractTheme();\n\n const { style: cssStyles, vars } = processCSSProp(css, colors);\n\n const mergedStyles = {\n ...cssStyles,\n ...style,\n ...assignInlineVars(vars),\n };\n\n const recipeClass = labelRecipe({ size, weight, variant, gradient, transform, noWrap });\n\n return (\n <Component\n ref={ref}\n className={`${recipeClass} ${className || ''}`.trim()}\n style={mergedStyles}\n {...props}\n />\n );\n },\n);\n\nLabelVanillaComponentImpl.displayName = 'LabelVanilla';\n\nexport const LabelVanilla = LabelVanillaComponentImpl as LabelVanillaComponent;\n"],"mappings":";;;;;;;;AAwBA,IAAM,6BAAA,GAAA,MAAA,aAEF,EACE,IACA,WACA,KACA,OACA,MACA,QACA,SACA,UACA,WACA,QACA,GAAG,SAEL,QACG;CACH,MAAM,YAAY,MAAM;CACxB,MAAM,EAAE,WAAW,qBAAA,wBAAwB;CAE3C,MAAM,EAAE,OAAO,WAAW,SAAS,iBAAA,eAAe,KAAK,OAAO;CAE9D,MAAM,eAAe;EACnB,GAAG;EACH,GAAG;EACH,IAAA,GAAA,yBAAA,kBAAoB,KAAK;EAC1B;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,0BAAA,YAAY;GAAE;GAAM;GAAQ;GAAS;GAAU;GAAW;GAAQ,CAKpE,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,eAAe"}