@traefik-labs/faency 12.3.3 → 12.3.5

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

@@ -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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"}
+{"version":3,"file":"CodeBlock.vanilla.cjs","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.vanilla.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":"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"}
+{"version":3,"file":"CodeBlock.vanilla.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, themes } from 'prism-react-renderer';\nimport React, {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { CSSProps, processCSSProp } from '../../styles/cssProps';\nimport { useVanillaExtractTheme } from '../../styles/themeContext';\nimport { AccessibleIcon } from '../AccessibleIcon';\nimport { ButtonVanilla } from '../Button';\nimport {\n  codeContent,\n  codeContentBottomPadding,\n  codeContentTopPadding,\n  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\nimport { Prism } from './prism-extend';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>, CSSProps {\n  lang?: CodeBlockLanguage;\n  code: string;\n  copyable?: boolean;\n  copyText?: string;\n  copiedText?: string;\n  copyButtonAlign?: CodeBlockCopyButtonAlign;\n  onCopy?: () => void;\n  noBorder?: boolean;\n  wrapText?: boolean;\n  colorScheme?: 'light' | 'dark';\n  maxHeight?: number | string;\n}\n\nexport const CodeBlockVanilla = forwardRef<HTMLPreElement, CodeBlockVanillaProps>(\n  (\n    {\n      lang = 'text',\n      code,\n      copyable = false,\n      copyText,\n      copiedText,\n      copyButtonAlign = 'top right',\n      onCopy,\n      noBorder,\n      wrapText = false,\n      colorScheme,\n      maxHeight = 424,\n      css,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { colors, resolvedTheme } = useVanillaExtractTheme();\n    const effectiveScheme = colorScheme ?? resolvedTheme;\n    const prismTheme = effectiveScheme === 'dark' ? themes.nightOwl : themes.nightOwlLight;\n\n    const isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\n\n    const { style: cssStyles, vars } = processCSSProp(css, colors);\n    const containerStyles = {\n      position: 'relative' as const,\n      ...cssStyles,\n      ...assignInlineVars(vars),\n    };\n\n    const [copied, setCopied] = useState(false);\n\n    const preRef = useRef<HTMLPreElement | null>(\n      null,\n    ) as React.MutableRefObject<HTMLPreElement | null>;\n    const buttonWrapperRef = useRef<HTMLDivElement>(null);\n\n    const setPreRef = useCallback(\n      (node: HTMLPreElement | null) => {\n        preRef.current = node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref) (ref as React.MutableRefObject<HTMLPreElement | null>).current = node;\n      },\n      [ref],\n    );\n\n    useLayoutEffect(() => {\n      if (!copyable) return;\n      const pre = preRef.current;\n      const wrapper = buttonWrapperRef.current;\n      if (!pre || !wrapper) return;\n\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeft) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottom) {\n          const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);\n          wrapper.style.bottom = `${8 + hScrollbar}px`;\n        }\n      };\n\n      update();\n      const observer = new ResizeObserver(update);\n      observer.observe(pre);\n      return () => observer.disconnect();\n    }, [copyable, isBottom, isLeft, noBorder]);\n\n    const handleCopy = async () => {\n      try {\n        await navigator.clipboard.writeText(code);\n        setCopied(true);\n        onCopy?.();\n        setTimeout(() => setCopied(false), 1500);\n      } catch {\n        // clipboard write failed (e.g. permission denied) — leave UI unchanged\n      }\n    };\n\n    const buttonPositionClass = isBottom\n      ? isLeft\n        ? copyButtonWrapperBottomLeft\n        : copyButtonWrapperBottomRight\n      : isLeft\n        ? copyButtonWrapperTopLeft\n        : copyButtonWrapperTop;\n\n    const copyButton = copyable ? (\n      <ButtonVanilla\n        variant=\"secondary\"\n        ghost\n        size=\"small\"\n        type=\"button\"\n        onClick={handleCopy}\n        css={{\n          color: '$hiContrast',\n          gap: '$1',\n          backgroundColor: '$codeBlockCopyButtonBg',\n          height: '32px',\n        }}\n      >\n        <AccessibleIcon label={copied ? 'Copied' : 'Copy'}>\n          {copied ? <CheckIcon /> : <CopyIcon />}\n        </AccessibleIcon>\n        {copied ? copiedText : copyText}\n      </ButtonVanilla>\n    ) : null;\n\n    return (\n      <Highlight\n        theme={prismTheme}\n        code={code}\n        language={(Prism.languages[lang] != null ? lang : 'text') as Language}\n      >\n        {({\n          className: highlightClass,\n          style: highlightStyle,\n          tokens,\n          getLineProps,\n          getTokenProps,\n        }) => (\n          <div style={containerStyles}>\n            <pre\n              ref={setPreRef}\n              className={[pre, noBorder ? preNoBorder : '', highlightClass, className]\n                .filter(Boolean)\n                .join(' ')}\n              style={{\n                maxHeight,\n                ...highlightStyle,\n                backgroundColor: 'inherit',\n                ...style,\n              }}\n              {...props}\n            >\n              <div\n                className={[\n                  codeContent,\n                  copyable && isLeft && isBottom ? codeContentBottomPadding : '',\n                  copyable && isLeft && !isBottom ? codeContentTopPadding : '',\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {tokens.map((line, i) => (\n                  <div\n                    key={i}\n                    {...getLineProps({ line })}\n                    style={\n                      wrapText ? { whiteSpace: 'pre-wrap', wordBreak: 'break-all' } : undefined\n                    }\n                  >\n                    {line.map((token, key) => (\n                      <span key={key} {...getTokenProps({ token })} />\n                    ))}\n                  </div>\n                ))}\n              </div>\n            </pre>\n            {copyButton && (\n              <div ref={buttonWrapperRef} className={buttonPositionClass}>\n                {copyButton}\n              </div>\n            )}\n          </div>\n        )}\n      </Highlight>\n    );\n  },\n);\n\nCodeBlockVanilla.displayName = 'CodeBlockVanilla';\n"],"mappings":";;;;;;;;;;;;AA6CA,IAAa,mBAAmB,YAE5B,EACE,OAAO,QACP,MACA,WAAW,OACX,UACA,YACA,kBAAkB,aAClB,QACA,UACA,WAAW,OACX,aACA,YAAY,KACZ,KACA,OACA,WACA,GAAG,SAEL,QACG;CACH,MAAM,EAAE,QAAQ,kBAAkB,wBAAwB;CAE1D,MAAM,cADkB,eAAe,mBACA,SAAS,OAAO,WAAW,OAAO;CAEzE,MAAM,WAAW,gBAAgB,SAAS,SAAS;CACnD,MAAM,SAAS,gBAAgB,SAAS,OAAO;CAE/C,MAAM,EAAE,OAAO,WAAW,SAAS,eAAe,KAAK,OAAO;CAC9D,MAAM,kBAAkB;EACtB,UAAU;EACV,GAAG;EACH,GAAG,iBAAiB,KAAK;EAC1B;CAED,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;CAE3C,MAAM,SAAS,OACb,KACD;CACD,MAAM,mBAAmB,OAAuB,KAAK;CAErD,MAAM,YAAY,aACf,SAAgC;EAC/B,OAAO,UAAU;EACjB,IAAI,OAAO,QAAQ,YAAY,IAAI,KAAK;OACnC,IAAI,KAAK,IAAuD,UAAU;IAEjF,CAAC,IAAI,CACN;CAED,sBAAsB;EACpB,IAAI,CAAC,UAAU;EACf,MAAM,MAAM,OAAO;EACnB,MAAM,UAAU,iBAAiB;EACjC,IAAI,CAAC,OAAO,CAAC,SAAS;EAEtB,MAAM,UAAU,WAAW,IAAI;EAE/B,MAAM,eAAe;GACnB,IAAI,CAAC,QAAQ;IACX,MAAM,aAAa,KAAK,IAAI,GAAG,IAAI,cAAc,IAAI,cAAc,QAAQ;IAC3E,QAAQ,MAAM,QAAQ,GAAG,KAAK,WAAW;;GAE3C,IAAI,UAAU;IACZ,MAAM,aAAa,KAAK,IAAI,GAAG,IAAI,eAAe,IAAI,eAAe,QAAQ;IAC7E,QAAQ,MAAM,SAAS,GAAG,IAAI,WAAW;;;EAI7C,QAAQ;EACR,MAAM,WAAW,IAAI,eAAe,OAAO;EAC3C,SAAS,QAAQ,IAAI;EACrB,aAAa,SAAS,YAAY;IACjC;EAAC;EAAU;EAAU;EAAQ;EAAS,CAAC;CAE1C,MAAM,aAAa,YAAY;EAC7B,IAAI;GACF,MAAM,UAAU,UAAU,UAAU,KAAK;GACzC,UAAU,KAAK;GACf,UAAU;GACV,iBAAiB,UAAU,MAAM,EAAE,KAAK;UAClC;;CAKV,MAAM,sBAAsB,WACxB,SACE,8BACA,+BACF,SACE,2BACA;CAEN,MAAM,aAAa,WACjB,qBAAC,eAAD;EACE,SAAQ;EACR,OAAA;EACA,MAAK;EACL,MAAK;EACL,SAAS;EACT,KAAK;GACH,OAAO;GACP,KAAK;GACL,iBAAiB;GACjB,QAAQ;GACT;YAXH,CAaE,oBAAC,gBAAD;GAAgB,OAAO,SAAS,WAAW;aACxC,SAAS,oBAAC,WAAD,EAAa,CAAA,GAAG,oBAAC,UAAD,EAAY,CAAA;GACvB,CAAA,EAChB,SAAS,aAAa,SACT;MACd;CAEJ,OACE,oBAAC,WAAD;EACE,OAAO;EACD;EACN,UAAW,MAAM,UAAU,SAAS,OAAO,OAAO;aAEhD,EACA,WAAW,gBACX,OAAO,gBACP,QACA,cACA,oBAEA,qBAAC,OAAD;GAAK,OAAO;aAAZ,CACE,oBAAC,OAAD;IACE,KAAK;IACL,WAAW;KAAC;KAAK,WAAW,cAAc;KAAI;KAAgB;KAAU,CACrE,OAAO,QAAQ,CACf,KAAK,IAAI;IACZ,OAAO;KACL;KACA,GAAG;KACH,iBAAiB;KACjB,GAAG;KACJ;IACD,GAAI;cAEJ,oBAAC,OAAD;KACE,WAAW;MACT;MACA,YAAY,UAAU,WAAW,2BAA2B;MAC5D,YAAY,UAAU,CAAC,WAAW,wBAAwB;MAC3D,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;eAEX,OAAO,KAAK,MAAM,MACjB,oBAAC,OAAD;MAEE,GAAI,aAAa,EAAE,MAAM,CAAC;MAC1B,OACE,WAAW;OAAE,YAAY;OAAY,WAAW;OAAa,GAAG,KAAA;gBAGjE,KAAK,KAAK,OAAO,QAChB,oBAAC,QAAD,EAAgB,GAAI,cAAc,EAAE,OAAO,CAAC,EAAI,EAArC,IAAqC,CAChD;MACE,EATC,EASD,CACN;KACE,CAAA;IACF,CAAA,EACL,cACC,oBAAC,OAAD;IAAK,KAAK;IAAkB,WAAW;cACpC;IACG,CAAA,CAEJ;;EAEE,CAAA;EAGjB;AAED,iBAAiB,cAAc"}

package/dist/components/CodeBlock/prism-extend.cjs.map

@@ -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"}
+{"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,EAC1D,IAAI,OAAO,UAAU,cAAc,EAAE,OAAO,qBAAA,MAAM,YAChD,qBAAA,MAAO,UAAsC,OAAO;AAMxD,qBAAA,MAAM,UAAU,OAAO,EAAE,MAAM,WAAW"}

package/dist/components/CodeBlock/prism-extend.js.map

@@ -1 +1 @@
-{"version":3,"file":"prism-extend.js","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,QAAQ,UAAU,CAC1D,KAAI,OAAO,UAAU,cAAc,EAAE,OAAO,MAAM,WAC/C,OAAM,UAAsC,OAAO;AAMxD,MAAM,UAAU,OAAO,EAAE,MAAM,WAAW"}
+{"version":3,"file":"prism-extend.js","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,QAAQ,UAAU,EAC1D,IAAI,OAAO,UAAU,cAAc,EAAE,OAAO,MAAM,YAChD,MAAO,UAAsC,OAAO;AAMxD,MAAM,UAAU,OAAO,EAAE,MAAM,WAAW"}

package/dist/components/Container/Container.vanilla.cjs.map

@@ -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,CAKpC,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}
+{"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;CAID,OACE,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"}

package/dist/components/Container/Container.vanilla.js.map

@@ -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,CAKpC,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}
+{"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;CAID,OACE,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"}

package/dist/components/DateTimePicker/DateTimePicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.cjs","names":[],"sources":["../../../components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';\nimport { DPDatesConfig, DPPropGetter, DPUserConfig, useDatePicker } from '@rehookify/datepicker';\nimport { addMonths, addYears } from 'date-fns';\nimport React, { useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Flex } from '../Flex';\nimport { Text } from '../Text';\n\nconst CalendarGrid = styled('div', {\n  display: 'grid',\n  alignItems: 'center',\n  gap: '$1',\n  px: '$2',\n  borderLeft: '2px solid $buttonSecondaryBorder',\n  borderRight: '2px solid $buttonSecondaryBorder',\n});\n\nconst SevenColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(7, 1fr)',\n});\n\nconst ThreeColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(3, 1fr)',\n  height: '100%',\n});\n\nconst StyledDiv = styled('div');\n\ntype HeaderProps = {\n  centerButtonLabel: string;\n  centerButtonOnClick: () => void;\n  leftButtonProps: DPPropGetter;\n  rightButtonProps: DPPropGetter;\n};\n\nfunction Header({\n  centerButtonLabel,\n  centerButtonOnClick,\n  leftButtonProps,\n  rightButtonProps,\n}: HeaderProps) {\n  return (\n    <Flex align=\"center\" gap=\"2\" css={{ px: '$2' }}>\n      <Button type=\"button\" ghost variant=\"secondary\" {...leftButtonProps}>\n        <ChevronLeftIcon />\n      </Button>\n      <Button\n        type=\"button\"\n        role=\"button\"\n        tabIndex={0}\n        css={{ flexGrow: 1, textAlign: 'center' }}\n        ghost\n        onClick={centerButtonOnClick}\n        variant=\"secondary\"\n      >\n        {centerButtonLabel}\n      </Button>\n      <Button type=\"button\" ghost variant=\"secondary\" {...rightButtonProps}>\n        <ChevronRightIcon />\n      </Button>\n    </Flex>\n  );\n}\n\ntype CustomDPDatesConfig = Omit<DPDatesConfig, 'mode'>;\n\ntype CustomDPUserConfig = Omit<DPUserConfig, 'dates'> & {\n  dates?: Partial<CustomDPDatesConfig>;\n};\n\nexport type DateTimePickerProps = CustomDPUserConfig & {\n  css?: CSS;\n  onFastTravelClick?: () => void;\n  onTimeButtonClick?: () => void;\n  showDatePresets?: boolean;\n  showTimePicker?: boolean;\n};\n\nexport type DateTimePickerVariants = VariantProps<DateTimePickerProps>;\n\nexport const DateTimePicker = React.forwardRef<\n  React.ElementRef<typeof StyledDiv>,\n  DateTimePickerProps\n>(\n  (\n    { css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config },\n    fowardedRef,\n  ) => {\n    const {\n      data: { calendars, months, time, weekDays, years },\n      propGetters: {\n        addOffset,\n        dayButton,\n        monthButton,\n        nextYearsButton,\n        previousYearsButton,\n        subtractOffset,\n        timeButton,\n        yearButton,\n      },\n    } = useDatePicker(config);\n\n    const [page, setPage] = useState<number>(0);\n\n    const { days, month, year } = calendars[0];\n\n    return (\n      <StyledDiv css={css} ref={fowardedRef}>\n        <Flex direction=\"column\" gap=\"2\" css={{ display: 'inline-flex' }}>\n          <Flex>\n            <Box\n              css={{\n                flex: 1,\n                minHeight: config.calendar?.mode === 'fluid' ? '244px' : '280px',\n                minWidth: '268px',\n              }}\n            >\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 0 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={month}\n                  centerButtonOnClick={() => setPage(1)}\n                  leftButtonProps={subtractOffset({ months: 1 })}\n                  rightButtonProps={addOffset({ months: 1 })}\n                />\n                <SevenColGrid>\n                  {weekDays.map((weekDay, index) => (\n                    <Text key={index} css={{ lineHeight: '$sizes$6', textAlign: 'center' }}>\n                      {weekDay}\n                    </Text>\n                  ))}\n                  {days.map((d) => (\n                    <Button\n                      key={d.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        width: '32px',\n                        px: 0,\n                        color:\n                          !d.disabled && !d.inCurrentMonth && !d.selected\n                            ? '$textSubtle'\n                            : undefined,\n                        fontWeight: d.now && !d.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!d.selected}\n                      variant={d.now || d.selected ? 'primary' : 'secondary'}\n                      {...dayButton(d)}\n                      tabIndex={dayButton(d).disabled ? dayButton(d).tabIndex : 0}\n                    >\n                      {d.day}\n                    </Button>\n                  ))}\n                </SevenColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 1 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={year}\n                  centerButtonOnClick={() => setPage(2)}\n                  leftButtonProps={subtractOffset({ years: 1 })}\n                  rightButtonProps={addOffset({ years: 1 })}\n                />\n                <ThreeColGrid>\n                  {months.map((m) => (\n                    <Button\n                      key={m.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: m.now && !m.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!m.selected}\n                      variant={m.now || m.selected ? 'primary' : 'secondary'}\n                      {...monthButton(m)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = monthButton(m).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={monthButton(m).disabled ? monthButton(m).tabIndex : 0}\n                    >\n                      {m.month}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 2 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={`${years[0].year} - ${years[years.length - 1].year}`}\n                  centerButtonOnClick={() => setPage(0)}\n                  leftButtonProps={previousYearsButton()}\n                  rightButtonProps={nextYearsButton()}\n                />\n                <ThreeColGrid>\n                  {years.map((y) => (\n                    <Button\n                      key={y.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: y.now && !y.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!y.selected}\n                      variant={y.now || y.selected ? 'primary' : 'secondary'}\n                      {...yearButton(y)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = yearButton(y).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={yearButton(y).disabled ? yearButton(y).tabIndex : 0}\n                    >\n                      {y.year}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n            </Box>\n\n            {showTimePicker ? (\n              <Box css={{ flex: 1, width: '90px', position: 'relative', overflow: 'auto' }}>\n                <Flex\n                  direction=\"column\"\n                  gap=\"1\"\n                  css={{ position: 'absolute', top: 0, left: 0, height: '100%', width: '100%' }}\n                >\n                  <Text css={{ mt: '32px', ml: '8px', lineHeight: '$sizes$6' }}>Time</Text>\n                  <Flex direction=\"column\" gap=\"1\" css={{ overflow: 'auto', px: '$2' }}>\n                    {time.map((t) => (\n                      <Button\n                        key={t.$date.toString()}\n                        type=\"button\"\n                        css={{\n                          px: '$2',\n                          fontWeight: t.now && !t.selected ? '$bold' : undefined,\n                          textAlign: 'center',\n                        }}\n                        ghost={!t.selected}\n                        variant={t.now || t.selected ? 'primary' : 'secondary'}\n                        {...timeButton(t)}\n                        onClick={(evt) => {\n                          const fn = timeButton(t).onClick;\n                          if (typeof fn !== 'undefined') fn(evt);\n                          if (typeof onTimeButtonClick !== 'undefined') onTimeButtonClick();\n                        }}\n                        tabIndex={timeButton(t).disabled ? timeButton(t).tabIndex : 0}\n                      >\n                        {t.time}\n                      </Button>\n                    ))}\n                  </Flex>\n                </Flex>\n              </Box>\n            ) : undefined}\n          </Flex>\n\n          {showDatePresets ? (\n            <Flex gap=\"2\">\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 1)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 1 M\n              </Button>\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 3)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 3 M\n              </Button>\n              {showTimePicker ? (\n                <Button\n                  type=\"button\"\n                  css={{ flex: '1 1 0' }}\n                  variant=\"secondary\"\n                  onClick={() => {\n                    config.onDatesChange([addYears(new Date(), 1)]);\n                    if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                  }}\n                >\n                  Now + 1 Y\n                </Button>\n              ) : undefined}\n            </Flex>\n          ) : undefined}\n        </Flex>\n      </StyledDiv>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"DateTimePicker.cjs","names":[],"sources":["../../../components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';\nimport { DPDatesConfig, DPPropGetter, DPUserConfig, useDatePicker } from '@rehookify/datepicker';\nimport { addMonths, addYears } from 'date-fns';\nimport React, { useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Flex } from '../Flex';\nimport { Text } from '../Text';\n\nconst CalendarGrid = styled('div', {\n  display: 'grid',\n  alignItems: 'center',\n  gap: '$1',\n  px: '$2',\n  borderLeft: '2px solid $buttonSecondaryBorder',\n  borderRight: '2px solid $buttonSecondaryBorder',\n});\n\nconst SevenColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(7, 1fr)',\n});\n\nconst ThreeColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(3, 1fr)',\n  height: '100%',\n});\n\nconst StyledDiv = styled('div');\n\ntype HeaderProps = {\n  centerButtonLabel: string;\n  centerButtonOnClick: () => void;\n  leftButtonProps: DPPropGetter;\n  rightButtonProps: DPPropGetter;\n};\n\nfunction Header({\n  centerButtonLabel,\n  centerButtonOnClick,\n  leftButtonProps,\n  rightButtonProps,\n}: HeaderProps) {\n  return (\n    <Flex align=\"center\" gap=\"2\" css={{ px: '$2' }}>\n      <Button type=\"button\" ghost variant=\"secondary\" {...leftButtonProps}>\n        <ChevronLeftIcon />\n      </Button>\n      <Button\n        type=\"button\"\n        role=\"button\"\n        tabIndex={0}\n        css={{ flexGrow: 1, textAlign: 'center' }}\n        ghost\n        onClick={centerButtonOnClick}\n        variant=\"secondary\"\n      >\n        {centerButtonLabel}\n      </Button>\n      <Button type=\"button\" ghost variant=\"secondary\" {...rightButtonProps}>\n        <ChevronRightIcon />\n      </Button>\n    </Flex>\n  );\n}\n\ntype CustomDPDatesConfig = Omit<DPDatesConfig, 'mode'>;\n\ntype CustomDPUserConfig = Omit<DPUserConfig, 'dates'> & {\n  dates?: Partial<CustomDPDatesConfig>;\n};\n\nexport type DateTimePickerProps = CustomDPUserConfig & {\n  css?: CSS;\n  onFastTravelClick?: () => void;\n  onTimeButtonClick?: () => void;\n  showDatePresets?: boolean;\n  showTimePicker?: boolean;\n};\n\nexport type DateTimePickerVariants = VariantProps<DateTimePickerProps>;\n\nexport const DateTimePicker = React.forwardRef<\n  React.ElementRef<typeof StyledDiv>,\n  DateTimePickerProps\n>(\n  (\n    { css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config },\n    fowardedRef,\n  ) => {\n    const {\n      data: { calendars, months, time, weekDays, years },\n      propGetters: {\n        addOffset,\n        dayButton,\n        monthButton,\n        nextYearsButton,\n        previousYearsButton,\n        subtractOffset,\n        timeButton,\n        yearButton,\n      },\n    } = useDatePicker(config);\n\n    const [page, setPage] = useState<number>(0);\n\n    const { days, month, year } = calendars[0];\n\n    return (\n      <StyledDiv css={css} ref={fowardedRef}>\n        <Flex direction=\"column\" gap=\"2\" css={{ display: 'inline-flex' }}>\n          <Flex>\n            <Box\n              css={{\n                flex: 1,\n                minHeight: config.calendar?.mode === 'fluid' ? '244px' : '280px',\n                minWidth: '268px',\n              }}\n            >\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 0 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={month}\n                  centerButtonOnClick={() => setPage(1)}\n                  leftButtonProps={subtractOffset({ months: 1 })}\n                  rightButtonProps={addOffset({ months: 1 })}\n                />\n                <SevenColGrid>\n                  {weekDays.map((weekDay, index) => (\n                    <Text key={index} css={{ lineHeight: '$sizes$6', textAlign: 'center' }}>\n                      {weekDay}\n                    </Text>\n                  ))}\n                  {days.map((d) => (\n                    <Button\n                      key={d.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        width: '32px',\n                        px: 0,\n                        color:\n                          !d.disabled && !d.inCurrentMonth && !d.selected\n                            ? '$textSubtle'\n                            : undefined,\n                        fontWeight: d.now && !d.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!d.selected}\n                      variant={d.now || d.selected ? 'primary' : 'secondary'}\n                      {...dayButton(d)}\n                      tabIndex={dayButton(d).disabled ? dayButton(d).tabIndex : 0}\n                    >\n                      {d.day}\n                    </Button>\n                  ))}\n                </SevenColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 1 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={year}\n                  centerButtonOnClick={() => setPage(2)}\n                  leftButtonProps={subtractOffset({ years: 1 })}\n                  rightButtonProps={addOffset({ years: 1 })}\n                />\n                <ThreeColGrid>\n                  {months.map((m) => (\n                    <Button\n                      key={m.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: m.now && !m.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!m.selected}\n                      variant={m.now || m.selected ? 'primary' : 'secondary'}\n                      {...monthButton(m)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = monthButton(m).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={monthButton(m).disabled ? monthButton(m).tabIndex : 0}\n                    >\n                      {m.month}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 2 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={`${years[0].year} - ${years[years.length - 1].year}`}\n                  centerButtonOnClick={() => setPage(0)}\n                  leftButtonProps={previousYearsButton()}\n                  rightButtonProps={nextYearsButton()}\n                />\n                <ThreeColGrid>\n                  {years.map((y) => (\n                    <Button\n                      key={y.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: y.now && !y.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!y.selected}\n                      variant={y.now || y.selected ? 'primary' : 'secondary'}\n                      {...yearButton(y)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = yearButton(y).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={yearButton(y).disabled ? yearButton(y).tabIndex : 0}\n                    >\n                      {y.year}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n            </Box>\n\n            {showTimePicker ? (\n              <Box css={{ flex: 1, width: '90px', position: 'relative', overflow: 'auto' }}>\n                <Flex\n                  direction=\"column\"\n                  gap=\"1\"\n                  css={{ position: 'absolute', top: 0, left: 0, height: '100%', width: '100%' }}\n                >\n                  <Text css={{ mt: '32px', ml: '8px', lineHeight: '$sizes$6' }}>Time</Text>\n                  <Flex direction=\"column\" gap=\"1\" css={{ overflow: 'auto', px: '$2' }}>\n                    {time.map((t) => (\n                      <Button\n                        key={t.$date.toString()}\n                        type=\"button\"\n                        css={{\n                          px: '$2',\n                          fontWeight: t.now && !t.selected ? '$bold' : undefined,\n                          textAlign: 'center',\n                        }}\n                        ghost={!t.selected}\n                        variant={t.now || t.selected ? 'primary' : 'secondary'}\n                        {...timeButton(t)}\n                        onClick={(evt) => {\n                          const fn = timeButton(t).onClick;\n                          if (typeof fn !== 'undefined') fn(evt);\n                          if (typeof onTimeButtonClick !== 'undefined') onTimeButtonClick();\n                        }}\n                        tabIndex={timeButton(t).disabled ? timeButton(t).tabIndex : 0}\n                      >\n                        {t.time}\n                      </Button>\n                    ))}\n                  </Flex>\n                </Flex>\n              </Box>\n            ) : undefined}\n          </Flex>\n\n          {showDatePresets ? (\n            <Flex gap=\"2\">\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 1)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 1 M\n              </Button>\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 3)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 3 M\n              </Button>\n              {showTimePicker ? (\n                <Button\n                  type=\"button\"\n                  css={{ flex: '1 1 0' }}\n                  variant=\"secondary\"\n                  onClick={() => {\n                    config.onDatesChange([addYears(new Date(), 1)]);\n                    if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                  }}\n                >\n                  Now + 1 Y\n                </Button>\n              ) : undefined}\n            </Flex>\n          ) : undefined}\n        </Flex>\n      </StyledDiv>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/components/DateTimePicker/DateTimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.js","names":[],"sources":["../../../components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';\nimport { DPDatesConfig, DPPropGetter, DPUserConfig, useDatePicker } from '@rehookify/datepicker';\nimport { addMonths, addYears } from 'date-fns';\nimport React, { useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Flex } from '../Flex';\nimport { Text } from '../Text';\n\nconst CalendarGrid = styled('div', {\n  display: 'grid',\n  alignItems: 'center',\n  gap: '$1',\n  px: '$2',\n  borderLeft: '2px solid $buttonSecondaryBorder',\n  borderRight: '2px solid $buttonSecondaryBorder',\n});\n\nconst SevenColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(7, 1fr)',\n});\n\nconst ThreeColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(3, 1fr)',\n  height: '100%',\n});\n\nconst StyledDiv = styled('div');\n\ntype HeaderProps = {\n  centerButtonLabel: string;\n  centerButtonOnClick: () => void;\n  leftButtonProps: DPPropGetter;\n  rightButtonProps: DPPropGetter;\n};\n\nfunction Header({\n  centerButtonLabel,\n  centerButtonOnClick,\n  leftButtonProps,\n  rightButtonProps,\n}: HeaderProps) {\n  return (\n    <Flex align=\"center\" gap=\"2\" css={{ px: '$2' }}>\n      <Button type=\"button\" ghost variant=\"secondary\" {...leftButtonProps}>\n        <ChevronLeftIcon />\n      </Button>\n      <Button\n        type=\"button\"\n        role=\"button\"\n        tabIndex={0}\n        css={{ flexGrow: 1, textAlign: 'center' }}\n        ghost\n        onClick={centerButtonOnClick}\n        variant=\"secondary\"\n      >\n        {centerButtonLabel}\n      </Button>\n      <Button type=\"button\" ghost variant=\"secondary\" {...rightButtonProps}>\n        <ChevronRightIcon />\n      </Button>\n    </Flex>\n  );\n}\n\ntype CustomDPDatesConfig = Omit<DPDatesConfig, 'mode'>;\n\ntype CustomDPUserConfig = Omit<DPUserConfig, 'dates'> & {\n  dates?: Partial<CustomDPDatesConfig>;\n};\n\nexport type DateTimePickerProps = CustomDPUserConfig & {\n  css?: CSS;\n  onFastTravelClick?: () => void;\n  onTimeButtonClick?: () => void;\n  showDatePresets?: boolean;\n  showTimePicker?: boolean;\n};\n\nexport type DateTimePickerVariants = VariantProps<DateTimePickerProps>;\n\nexport const DateTimePicker = React.forwardRef<\n  React.ElementRef<typeof StyledDiv>,\n  DateTimePickerProps\n>(\n  (\n    { css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config },\n    fowardedRef,\n  ) => {\n    const {\n      data: { calendars, months, time, weekDays, years },\n      propGetters: {\n        addOffset,\n        dayButton,\n        monthButton,\n        nextYearsButton,\n        previousYearsButton,\n        subtractOffset,\n        timeButton,\n        yearButton,\n      },\n    } = useDatePicker(config);\n\n    const [page, setPage] = useState<number>(0);\n\n    const { days, month, year } = calendars[0];\n\n    return (\n      <StyledDiv css={css} ref={fowardedRef}>\n        <Flex direction=\"column\" gap=\"2\" css={{ display: 'inline-flex' }}>\n          <Flex>\n            <Box\n              css={{\n                flex: 1,\n                minHeight: config.calendar?.mode === 'fluid' ? '244px' : '280px',\n                minWidth: '268px',\n              }}\n            >\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 0 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={month}\n                  centerButtonOnClick={() => setPage(1)}\n                  leftButtonProps={subtractOffset({ months: 1 })}\n                  rightButtonProps={addOffset({ months: 1 })}\n                />\n                <SevenColGrid>\n                  {weekDays.map((weekDay, index) => (\n                    <Text key={index} css={{ lineHeight: '$sizes$6', textAlign: 'center' }}>\n                      {weekDay}\n                    </Text>\n                  ))}\n                  {days.map((d) => (\n                    <Button\n                      key={d.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        width: '32px',\n                        px: 0,\n                        color:\n                          !d.disabled && !d.inCurrentMonth && !d.selected\n                            ? '$textSubtle'\n                            : undefined,\n                        fontWeight: d.now && !d.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!d.selected}\n                      variant={d.now || d.selected ? 'primary' : 'secondary'}\n                      {...dayButton(d)}\n                      tabIndex={dayButton(d).disabled ? dayButton(d).tabIndex : 0}\n                    >\n                      {d.day}\n                    </Button>\n                  ))}\n                </SevenColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 1 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={year}\n                  centerButtonOnClick={() => setPage(2)}\n                  leftButtonProps={subtractOffset({ years: 1 })}\n                  rightButtonProps={addOffset({ years: 1 })}\n                />\n                <ThreeColGrid>\n                  {months.map((m) => (\n                    <Button\n                      key={m.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: m.now && !m.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!m.selected}\n                      variant={m.now || m.selected ? 'primary' : 'secondary'}\n                      {...monthButton(m)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = monthButton(m).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={monthButton(m).disabled ? monthButton(m).tabIndex : 0}\n                    >\n                      {m.month}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 2 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={`${years[0].year} - ${years[years.length - 1].year}`}\n                  centerButtonOnClick={() => setPage(0)}\n                  leftButtonProps={previousYearsButton()}\n                  rightButtonProps={nextYearsButton()}\n                />\n                <ThreeColGrid>\n                  {years.map((y) => (\n                    <Button\n                      key={y.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: y.now && !y.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!y.selected}\n                      variant={y.now || y.selected ? 'primary' : 'secondary'}\n                      {...yearButton(y)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = yearButton(y).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={yearButton(y).disabled ? yearButton(y).tabIndex : 0}\n                    >\n                      {y.year}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n            </Box>\n\n            {showTimePicker ? (\n              <Box css={{ flex: 1, width: '90px', position: 'relative', overflow: 'auto' }}>\n                <Flex\n                  direction=\"column\"\n                  gap=\"1\"\n                  css={{ position: 'absolute', top: 0, left: 0, height: '100%', width: '100%' }}\n                >\n                  <Text css={{ mt: '32px', ml: '8px', lineHeight: '$sizes$6' }}>Time</Text>\n                  <Flex direction=\"column\" gap=\"1\" css={{ overflow: 'auto', px: '$2' }}>\n                    {time.map((t) => (\n                      <Button\n                        key={t.$date.toString()}\n                        type=\"button\"\n                        css={{\n                          px: '$2',\n                          fontWeight: t.now && !t.selected ? '$bold' : undefined,\n                          textAlign: 'center',\n                        }}\n                        ghost={!t.selected}\n                        variant={t.now || t.selected ? 'primary' : 'secondary'}\n                        {...timeButton(t)}\n                        onClick={(evt) => {\n                          const fn = timeButton(t).onClick;\n                          if (typeof fn !== 'undefined') fn(evt);\n                          if (typeof onTimeButtonClick !== 'undefined') onTimeButtonClick();\n                        }}\n                        tabIndex={timeButton(t).disabled ? timeButton(t).tabIndex : 0}\n                      >\n                        {t.time}\n                      </Button>\n                    ))}\n                  </Flex>\n                </Flex>\n              </Box>\n            ) : undefined}\n          </Flex>\n\n          {showDatePresets ? (\n            <Flex gap=\"2\">\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 1)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 1 M\n              </Button>\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 3)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 3 M\n              </Button>\n              {showTimePicker ? (\n                <Button\n                  type=\"button\"\n                  css={{ flex: '1 1 0' }}\n                  variant=\"secondary\"\n                  onClick={() => {\n                    config.onDatesChange([addYears(new Date(), 1)]);\n                    if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                  }}\n                >\n                  Now + 1 Y\n                </Button>\n              ) : undefined}\n            </Flex>\n          ) : undefined}\n        </Flex>\n      </StyledDiv>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"DateTimePicker.js","names":[],"sources":["../../../components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';\nimport { DPDatesConfig, DPPropGetter, DPUserConfig, useDatePicker } from '@rehookify/datepicker';\nimport { addMonths, addYears } from 'date-fns';\nimport React, { useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Flex } from '../Flex';\nimport { Text } from '../Text';\n\nconst CalendarGrid = styled('div', {\n  display: 'grid',\n  alignItems: 'center',\n  gap: '$1',\n  px: '$2',\n  borderLeft: '2px solid $buttonSecondaryBorder',\n  borderRight: '2px solid $buttonSecondaryBorder',\n});\n\nconst SevenColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(7, 1fr)',\n});\n\nconst ThreeColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(3, 1fr)',\n  height: '100%',\n});\n\nconst StyledDiv = styled('div');\n\ntype HeaderProps = {\n  centerButtonLabel: string;\n  centerButtonOnClick: () => void;\n  leftButtonProps: DPPropGetter;\n  rightButtonProps: DPPropGetter;\n};\n\nfunction Header({\n  centerButtonLabel,\n  centerButtonOnClick,\n  leftButtonProps,\n  rightButtonProps,\n}: HeaderProps) {\n  return (\n    <Flex align=\"center\" gap=\"2\" css={{ px: '$2' }}>\n      <Button type=\"button\" ghost variant=\"secondary\" {...leftButtonProps}>\n        <ChevronLeftIcon />\n      </Button>\n      <Button\n        type=\"button\"\n        role=\"button\"\n        tabIndex={0}\n        css={{ flexGrow: 1, textAlign: 'center' }}\n        ghost\n        onClick={centerButtonOnClick}\n        variant=\"secondary\"\n      >\n        {centerButtonLabel}\n      </Button>\n      <Button type=\"button\" ghost variant=\"secondary\" {...rightButtonProps}>\n        <ChevronRightIcon />\n      </Button>\n    </Flex>\n  );\n}\n\ntype CustomDPDatesConfig = Omit<DPDatesConfig, 'mode'>;\n\ntype CustomDPUserConfig = Omit<DPUserConfig, 'dates'> & {\n  dates?: Partial<CustomDPDatesConfig>;\n};\n\nexport type DateTimePickerProps = CustomDPUserConfig & {\n  css?: CSS;\n  onFastTravelClick?: () => void;\n  onTimeButtonClick?: () => void;\n  showDatePresets?: boolean;\n  showTimePicker?: boolean;\n};\n\nexport type DateTimePickerVariants = VariantProps<DateTimePickerProps>;\n\nexport const DateTimePicker = React.forwardRef<\n  React.ElementRef<typeof StyledDiv>,\n  DateTimePickerProps\n>(\n  (\n    { css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config },\n    fowardedRef,\n  ) => {\n    const {\n      data: { calendars, months, time, weekDays, years },\n      propGetters: {\n        addOffset,\n        dayButton,\n        monthButton,\n        nextYearsButton,\n        previousYearsButton,\n        subtractOffset,\n        timeButton,\n        yearButton,\n      },\n    } = useDatePicker(config);\n\n    const [page, setPage] = useState<number>(0);\n\n    const { days, month, year } = calendars[0];\n\n    return (\n      <StyledDiv css={css} ref={fowardedRef}>\n        <Flex direction=\"column\" gap=\"2\" css={{ display: 'inline-flex' }}>\n          <Flex>\n            <Box\n              css={{\n                flex: 1,\n                minHeight: config.calendar?.mode === 'fluid' ? '244px' : '280px',\n                minWidth: '268px',\n              }}\n            >\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 0 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={month}\n                  centerButtonOnClick={() => setPage(1)}\n                  leftButtonProps={subtractOffset({ months: 1 })}\n                  rightButtonProps={addOffset({ months: 1 })}\n                />\n                <SevenColGrid>\n                  {weekDays.map((weekDay, index) => (\n                    <Text key={index} css={{ lineHeight: '$sizes$6', textAlign: 'center' }}>\n                      {weekDay}\n                    </Text>\n                  ))}\n                  {days.map((d) => (\n                    <Button\n                      key={d.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        width: '32px',\n                        px: 0,\n                        color:\n                          !d.disabled && !d.inCurrentMonth && !d.selected\n                            ? '$textSubtle'\n                            : undefined,\n                        fontWeight: d.now && !d.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!d.selected}\n                      variant={d.now || d.selected ? 'primary' : 'secondary'}\n                      {...dayButton(d)}\n                      tabIndex={dayButton(d).disabled ? dayButton(d).tabIndex : 0}\n                    >\n                      {d.day}\n                    </Button>\n                  ))}\n                </SevenColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 1 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={year}\n                  centerButtonOnClick={() => setPage(2)}\n                  leftButtonProps={subtractOffset({ years: 1 })}\n                  rightButtonProps={addOffset({ years: 1 })}\n                />\n                <ThreeColGrid>\n                  {months.map((m) => (\n                    <Button\n                      key={m.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: m.now && !m.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!m.selected}\n                      variant={m.now || m.selected ? 'primary' : 'secondary'}\n                      {...monthButton(m)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = monthButton(m).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={monthButton(m).disabled ? monthButton(m).tabIndex : 0}\n                    >\n                      {m.month}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 2 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={`${years[0].year} - ${years[years.length - 1].year}`}\n                  centerButtonOnClick={() => setPage(0)}\n                  leftButtonProps={previousYearsButton()}\n                  rightButtonProps={nextYearsButton()}\n                />\n                <ThreeColGrid>\n                  {years.map((y) => (\n                    <Button\n                      key={y.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: y.now && !y.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!y.selected}\n                      variant={y.now || y.selected ? 'primary' : 'secondary'}\n                      {...yearButton(y)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = yearButton(y).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={yearButton(y).disabled ? yearButton(y).tabIndex : 0}\n                    >\n                      {y.year}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n            </Box>\n\n            {showTimePicker ? (\n              <Box css={{ flex: 1, width: '90px', position: 'relative', overflow: 'auto' }}>\n                <Flex\n                  direction=\"column\"\n                  gap=\"1\"\n                  css={{ position: 'absolute', top: 0, left: 0, height: '100%', width: '100%' }}\n                >\n                  <Text css={{ mt: '32px', ml: '8px', lineHeight: '$sizes$6' }}>Time</Text>\n                  <Flex direction=\"column\" gap=\"1\" css={{ overflow: 'auto', px: '$2' }}>\n                    {time.map((t) => (\n                      <Button\n                        key={t.$date.toString()}\n                        type=\"button\"\n                        css={{\n                          px: '$2',\n                          fontWeight: t.now && !t.selected ? '$bold' : undefined,\n                          textAlign: 'center',\n                        }}\n                        ghost={!t.selected}\n                        variant={t.now || t.selected ? 'primary' : 'secondary'}\n                        {...timeButton(t)}\n                        onClick={(evt) => {\n                          const fn = timeButton(t).onClick;\n                          if (typeof fn !== 'undefined') fn(evt);\n                          if (typeof onTimeButtonClick !== 'undefined') onTimeButtonClick();\n                        }}\n                        tabIndex={timeButton(t).disabled ? timeButton(t).tabIndex : 0}\n                      >\n                        {t.time}\n                      </Button>\n                    ))}\n                  </Flex>\n                </Flex>\n              </Box>\n            ) : undefined}\n          </Flex>\n\n          {showDatePresets ? (\n            <Flex gap=\"2\">\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 1)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 1 M\n              </Button>\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 3)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 3 M\n              </Button>\n              {showTimePicker ? (\n                <Button\n                  type=\"button\"\n                  css={{ flex: '1 1 0' }}\n                  variant=\"secondary\"\n                  onClick={() => {\n                    config.onDatesChange([addYears(new Date(), 1)]);\n                    if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                  }}\n                >\n                  Now + 1 Y\n                </Button>\n              ) : undefined}\n            </Flex>\n          ) : undefined}\n        </Flex>\n      </StyledDiv>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/components/DateTimePickerInput/DateTimePickerInput.cjs.map

@@ -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":";;;;;;;;;;;;AAyBA,IAAM,gBAAgB,wBAAA,OAAO,OAAO;CAClC,SAAS;CACT,UAAU;CACV,OAAO;CAEP,oBAAoB,EAClB,SAAS,QACV;CAED,qCAAqC;EACnC,oBAAoB;GAClB,SAAS;GACT,OAAO;GACP,QAAQ;GACR,UAAU;GACV,OAAO;GACP,KAAK;GACL,YAAY;GAEZ,aAAa;IACX,WAAW;IACX,SAAS;IACT,UAAU;IACV,OAAO;IACP,eAAe;IAChB;GACD,YAAY;IACV,WAAW;IACX,SAAS;IACT,UAAU;IACV,OAAO;IACP,eAAe;IAChB;GAED,mBAAmB;IACjB,aAAa,EACX,iBAAiB,iBAClB;IACD,YAAY;KACV,iBAAiB;KACjB,SAAS;KACV;IACF;GACF;EAED,UAAU,EACR,0BAA0B;GACxB,aAAa,EACX,iBAAiB,iBAClB;GACD,YAAY;IACV,iBAAiB;IACjB,SAAS;IACV;GACF,EACF;EACF;CACF,CAAC;AAcF,IAAa,sBAAsB,MAAA,QAAM,YAKrC,EACE,UACA,YACA,UACA,WACA,iBACA,iBACA,gBACA,GAAG,eAEL,gBACG;CACH,MAAM,YAAY;CAElB,MAAM,YAAA,GAAA,MAAA,QAAkB,KAAK;CAE7B,MAAM,CAAC,YAAY,kBAAA,GAAA,MAAA,UAAkC,GAAG;CACxD,MAAM,CAAC,eAAe,kBAAA,GAAA,MAAA,UAAkC,EAAE,CAAC;CAC3D,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,UAA4B,MAAM;CAavD,MAAM,EAAE,MAAM,gBAAgB,aAAA,GAAA,mBAAA,aAAwB;EACpD,MAAM;EACN,cAAc;EACd,WAAW;EACX,aAAA,GAAA,MAAA,eAdM;kCACG,GAAG;iCACJ;kCACC;iCAED,EAAE,SAAS,UAAU,CAAC;GAC7B,EACD,EAAE,CAOF;EACA,sBAAsB,mBAAA;EACvB,CAAC;CAMF,MAAM,EAAE,mBAAmB,sBAAA,GAAA,mBAAA,iBAAqC;mCAJzC,QAI0C;qCAHtC,QAG6C;kCAFnD,QAE4D;EAAK,CAAC;CACvF,MAAM,EAAE,SAAS,wBAAwB,mBAAmB;AAE5D,QACE,iBAAA,GAAA,kBAAA,MAAC,eAAD;EAAe,KAAK;YAApB;GACE,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAD;IACE,gBAAgB,iBAAA,GAAA,kBAAA,KAAC,sBAAA,cAAD,EAAgB,CAAA;IAChC,GAAI,mBAAmB;IACvB,GAAI;IACJ,KAAK;KAAE,8CAA8C,EAAE,SAAS,QAAQ;KAAE,GAAG;KAAU;IACvF,WAAW,QAAQ;KACjB,MAAM,QAAQ,IAAI,cAAc;AAChC,mBAAc,MAAM;AACpB,SAAI;MACF,MAAM,WAAY,MACf,MAAM,IAAI,CACV,KAAK,OAAA,GAAA,SAAA,OAAY,EAAE,MAAM,EAAE,2BAAW,IAAI,MAAM,CAAC,CAAC;AACrD,oBAAc,SAAS;AACvB,UAAI,SAAU,UAAS,SAAS;cAEzB,KAAK;;IAIhB,KAAK,KAAK;IACV,MAAK;IACL,OAAO;IACP,CAAA;GACF,iBAAA,GAAA,kBAAA,KAAC,OAAD;IACE,WAAU;IACV,SAAS;IACT,CAAA;GACD,gBACC,iBAAA,GAAA,kBAAA,KAAC,mBAAA,sBAAD;IAA+B;IAAS,cAAc;IAAI,OAAO;cAE/D,iBAAA,GAAA,kBAAA,MAAC,OAAD;KAAK,KAAK,KAAK;KAAa,OAAO;KAAgB,GAAI,kBAAkB;eAAzE,CACE,iBAAA,GAAA,kBAAA,KAAC,aAAA,MAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,uBAAA,gBAAD;MACE,GAAI;MACJ,KAAK;MACL,gBAAgB,MAAM;AACpB,qBAAc,EAAE;AAChB,qBAAc,EAAE,KAAK,UAAA,GAAA,SAAA,QAAgB,MAAM,UAAU,CAAC,CAAC,KAAK,KAAK,CAAC;AAClE,WAAI,SAAU,UAAS,EAAE;;MAE3B,yBAAyB,gBAAgB,MAAM;MAC/C,yBAAyB,gBAAgB,MAAM;MAChC;MACE;MACD;MAChB,CAAA,EACG,CAAA,EACP,iBAAA,GAAA,kBAAA,KAAC,mBAAA,eAAD;MAAe,KAAK;MAAmB;MAAS,MAAK;MAAuB,CAAA,CACxE;;IACe,CAAA;GAEX;;EAGrB"}
+{"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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"}

package/dist/components/DateTimePickerInput/DateTimePickerInput.js.map

@@ -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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"}
+{"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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"}

package/dist/components/Dialog/Dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.cjs","names":[],"sources":["../../../components/Dialog/Dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport React, { ComponentProps } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { elevationVariants } from '../Elevation/Elevation';\nimport { IconButton } from '../IconButton';\nimport { overlayStyles } from '../Overlay';\n\ntype DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n  children: React.ReactNode;\n};\n\nexport const DialogOverlay = styled(DialogPrimitive.Overlay, overlayStyles, {\n  position: 'fixed',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n});\n\nexport function Dialog({ children, ...props }: DialogProps) {\n  return <DialogPrimitive.Root {...props}>{children}</DialogPrimitive.Root>;\n}\n\nexport const StyledContent = styled(DialogPrimitive.Content, Card, {\n  position: 'fixed',\n  top: '50%',\n  left: '50%',\n  transform: 'translate(-50%, -50%)',\n  minWidth: 200,\n  maxHeight: '85vh',\n  padding: '$4',\n  marginTop: '-5vh',\n  backgroundColor: '$dialogBackground',\n  boxShadow: 'inset 0 0 0 1px $colors$deepBlue4',\n  borderRadius: '$3',\n  // animation: `${fadeIn} 125ms linear, ${moveDown} 125ms cubic-bezier(0.22, 1, 0.36, 1)`,\n  willChange: 'transform',\n  overflow: 'auto',\n\n  '&::before': {\n    boxShadow: 'none',\n  },\n\n  '&:focus': {\n    outline: 'none',\n  },\n\n  variants: {\n    elevation: elevationVariants,\n  },\n  defaultVariants: {\n    elevation: 5,\n  },\n});\n\nconst StyledCloseButton = styled(DialogPrimitive.Close, {\n  position: 'absolute',\n  top: '$2',\n  right: '$2',\n  cursor: 'pointer',\n});\n\ninterface DialogCloseButtonProps\n  extends VariantProps<typeof IconButton>,\n    ComponentProps<typeof IconButton> {}\nexport const DialogCloseIconButton = React.forwardRef<\n  React.ElementRef<typeof IconButton>,\n  DialogCloseButtonProps\n>((props, forwardedRef) => (\n  <StyledCloseButton asChild>\n    <IconButton ref={forwardedRef} css={{ color: '$hiContrast' }} {...props}>\n      <Cross1Icon />\n    </IconButton>\n  </StyledCloseButton>\n));\n\ntype DialogContentPrimitiveProps = React.ComponentProps<typeof DialogPrimitive.Content>;\ntype DialogContentProps = DialogContentPrimitiveProps &\n  VariantProps<typeof StyledContent> & { css?: CSS };\n\nexport const DialogContent = React.forwardRef<\n  React.ElementRef<typeof StyledContent>,\n  DialogContentProps\n>(({ children, ...props }, forwardedRef) => (\n  <StyledContent {...props} ref={forwardedRef}>\n    {children}\n    <DialogCloseIconButton />\n  </StyledContent>\n));\n\nexport const DialogClosePrimitive = DialogPrimitive.Close;\nexport const DialogDescription = DialogPrimitive.Description;\nexport const DialogPortal = DialogPrimitive.Portal;\nexport const DialogTitle = DialogPrimitive.Title;\nexport const DialogTrigger = DialogPrimitive.Trigger;\n"],"mappings":";;;;;;;;;;;;;AAcA,IAAa,gBAAgB,wBAAA,OAAO,uBAAgB,SAAS,gBAAA,eAAe;CAC1E,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACR,MAAM;CACP,CAAC;AAEF,SAAgB,OAAO,EAAE,UAAU,GAAG,SAAsB;AAC1D,QAAO,iBAAA,GAAA,kBAAA,KAAC,uBAAgB,MAAjB;EAAsB,GAAI;EAAQ;EAAgC,CAAA;;AAG3E,IAAa,gBAAgB,wBAAA,OAAO,uBAAgB,SAAS,aAAA,MAAM;CACjE,UAAU;CACV,KAAK;CACL,MAAM;CACN,WAAW;CACX,UAAU;CACV,WAAW;CACX,SAAS;CACT,WAAW;CACX,iBAAiB;CACjB,WAAW;CACX,cAAc;CAEd,YAAY;CACZ,UAAU;CAEV,aAAa,EACX,WAAW,QACZ;CAED,WAAW,EACT,SAAS,QACV;CAED,UAAU,EACR,WAAW,kBAAA,mBACZ;CACD,iBAAiB,EACf,WAAW,GACZ;CACF,CAAC;AAEF,IAAM,oBAAoB,wBAAA,OAAO,uBAAgB,OAAO;CACtD,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACT,CAAC;AAKF,IAAa,wBAAwB,MAAA,QAAM,YAGxC,OAAO,iBACR,iBAAA,GAAA,kBAAA,KAAC,mBAAD;CAAmB,SAAA;WACjB,iBAAA,GAAA,kBAAA,KAAC,mBAAA,YAAD;EAAY,KAAK;EAAc,KAAK,EAAE,OAAO,eAAe;EAAE,GAAI;YAChE,iBAAA,GAAA,kBAAA,KAAC,sBAAA,YAAD,EAAc,CAAA;EACH,CAAA;CACK,CAAA,CACpB;AAMF,IAAa,gBAAgB,MAAA,QAAM,YAGhC,EAAE,UAAU,GAAG,SAAS,iBACzB,iBAAA,GAAA,kBAAA,MAAC,eAAD;CAAe,GAAI;CAAO,KAAK;WAA/B,CACG,UACD,iBAAA,GAAA,kBAAA,KAAC,uBAAD,EAAyB,CAAA,CACX;GAChB;AAEF,IAAa,uBAAuB,uBAAgB;AACpD,IAAa,oBAAoB,uBAAgB;AACjD,IAAa,eAAe,uBAAgB;AAC5C,IAAa,cAAc,uBAAgB;AAC3C,IAAa,gBAAgB,uBAAgB"}
+{"version":3,"file":"Dialog.cjs","names":[],"sources":["../../../components/Dialog/Dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport React, { ComponentProps } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { elevationVariants } from '../Elevation/Elevation';\nimport { IconButton } from '../IconButton';\nimport { overlayStyles } from '../Overlay';\n\ntype DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n  children: React.ReactNode;\n};\n\nexport const DialogOverlay = styled(DialogPrimitive.Overlay, overlayStyles, {\n  position: 'fixed',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n});\n\nexport function Dialog({ children, ...props }: DialogProps) {\n  return <DialogPrimitive.Root {...props}>{children}</DialogPrimitive.Root>;\n}\n\nexport const StyledContent = styled(DialogPrimitive.Content, Card, {\n  position: 'fixed',\n  top: '50%',\n  left: '50%',\n  transform: 'translate(-50%, -50%)',\n  minWidth: 200,\n  maxHeight: '85vh',\n  padding: '$4',\n  marginTop: '-5vh',\n  backgroundColor: '$dialogBackground',\n  boxShadow: 'inset 0 0 0 1px $colors$deepBlue4',\n  borderRadius: '$3',\n  // animation: `${fadeIn} 125ms linear, ${moveDown} 125ms cubic-bezier(0.22, 1, 0.36, 1)`,\n  willChange: 'transform',\n  overflow: 'auto',\n\n  '&::before': {\n    boxShadow: 'none',\n  },\n\n  '&:focus': {\n    outline: 'none',\n  },\n\n  variants: {\n    elevation: elevationVariants,\n  },\n  defaultVariants: {\n    elevation: 5,\n  },\n});\n\nconst StyledCloseButton = styled(DialogPrimitive.Close, {\n  position: 'absolute',\n  top: '$2',\n  right: '$2',\n  cursor: 'pointer',\n});\n\ninterface DialogCloseButtonProps\n  extends VariantProps<typeof IconButton>,\n    ComponentProps<typeof IconButton> {}\nexport const DialogCloseIconButton = React.forwardRef<\n  React.ElementRef<typeof IconButton>,\n  DialogCloseButtonProps\n>((props, forwardedRef) => (\n  <StyledCloseButton asChild>\n    <IconButton ref={forwardedRef} css={{ color: '$hiContrast' }} {...props}>\n      <Cross1Icon />\n    </IconButton>\n  </StyledCloseButton>\n));\n\ntype DialogContentPrimitiveProps = React.ComponentProps<typeof DialogPrimitive.Content>;\ntype DialogContentProps = DialogContentPrimitiveProps &\n  VariantProps<typeof StyledContent> & { css?: CSS };\n\nexport const DialogContent = React.forwardRef<\n  React.ElementRef<typeof StyledContent>,\n  DialogContentProps\n>(({ children, ...props }, forwardedRef) => (\n  <StyledContent {...props} ref={forwardedRef}>\n    {children}\n    <DialogCloseIconButton />\n  </StyledContent>\n));\n\nexport const DialogClosePrimitive = DialogPrimitive.Close;\nexport const DialogDescription = DialogPrimitive.Description;\nexport const DialogPortal = DialogPrimitive.Portal;\nexport const DialogTitle = DialogPrimitive.Title;\nexport const DialogTrigger = DialogPrimitive.Trigger;\n"],"mappings":";;;;;;;;;;;;;AAcA,IAAa,gBAAgB,wBAAA,OAAO,uBAAgB,SAAS,gBAAA,eAAe;CAC1E,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACR,MAAM;CACP,CAAC;AAEF,SAAgB,OAAO,EAAE,UAAU,GAAG,SAAsB;CAC1D,OAAO,iBAAA,GAAA,kBAAA,KAAC,uBAAgB,MAAjB;EAAsB,GAAI;EAAQ;EAAgC,CAAA;;AAG3E,IAAa,gBAAgB,wBAAA,OAAO,uBAAgB,SAAS,aAAA,MAAM;CACjE,UAAU;CACV,KAAK;CACL,MAAM;CACN,WAAW;CACX,UAAU;CACV,WAAW;CACX,SAAS;CACT,WAAW;CACX,iBAAiB;CACjB,WAAW;CACX,cAAc;CAEd,YAAY;CACZ,UAAU;CAEV,aAAa,EACX,WAAW,QACZ;CAED,WAAW,EACT,SAAS,QACV;CAED,UAAU,EACR,WAAW,kBAAA,mBACZ;CACD,iBAAiB,EACf,WAAW,GACZ;CACF,CAAC;AAEF,IAAM,oBAAoB,wBAAA,OAAO,uBAAgB,OAAO;CACtD,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACT,CAAC;AAKF,IAAa,wBAAwB,MAAA,QAAM,YAGxC,OAAO,iBACR,iBAAA,GAAA,kBAAA,KAAC,mBAAD;CAAmB,SAAA;WACjB,iBAAA,GAAA,kBAAA,KAAC,mBAAA,YAAD;EAAY,KAAK;EAAc,KAAK,EAAE,OAAO,eAAe;EAAE,GAAI;YAChE,iBAAA,GAAA,kBAAA,KAAC,sBAAA,YAAD,EAAc,CAAA;EACH,CAAA;CACK,CAAA,CACpB;AAMF,IAAa,gBAAgB,MAAA,QAAM,YAGhC,EAAE,UAAU,GAAG,SAAS,iBACzB,iBAAA,GAAA,kBAAA,MAAC,eAAD;CAAe,GAAI;CAAO,KAAK;WAA/B,CACG,UACD,iBAAA,GAAA,kBAAA,KAAC,uBAAD,EAAyB,CAAA,CACX;GAChB;AAEF,IAAa,uBAAuB,uBAAgB;AACpD,IAAa,oBAAoB,uBAAgB;AACjD,IAAa,eAAe,uBAAgB;AAC5C,IAAa,cAAc,uBAAgB;AAC3C,IAAa,gBAAgB,uBAAgB"}

package/dist/components/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","names":[],"sources":["../../../components/Dialog/Dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport React, { ComponentProps } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { elevationVariants } from '../Elevation/Elevation';\nimport { IconButton } from '../IconButton';\nimport { overlayStyles } from '../Overlay';\n\ntype DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n  children: React.ReactNode;\n};\n\nexport const DialogOverlay = styled(DialogPrimitive.Overlay, overlayStyles, {\n  position: 'fixed',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n});\n\nexport function Dialog({ children, ...props }: DialogProps) {\n  return <DialogPrimitive.Root {...props}>{children}</DialogPrimitive.Root>;\n}\n\nexport const StyledContent = styled(DialogPrimitive.Content, Card, {\n  position: 'fixed',\n  top: '50%',\n  left: '50%',\n  transform: 'translate(-50%, -50%)',\n  minWidth: 200,\n  maxHeight: '85vh',\n  padding: '$4',\n  marginTop: '-5vh',\n  backgroundColor: '$dialogBackground',\n  boxShadow: 'inset 0 0 0 1px $colors$deepBlue4',\n  borderRadius: '$3',\n  // animation: `${fadeIn} 125ms linear, ${moveDown} 125ms cubic-bezier(0.22, 1, 0.36, 1)`,\n  willChange: 'transform',\n  overflow: 'auto',\n\n  '&::before': {\n    boxShadow: 'none',\n  },\n\n  '&:focus': {\n    outline: 'none',\n  },\n\n  variants: {\n    elevation: elevationVariants,\n  },\n  defaultVariants: {\n    elevation: 5,\n  },\n});\n\nconst StyledCloseButton = styled(DialogPrimitive.Close, {\n  position: 'absolute',\n  top: '$2',\n  right: '$2',\n  cursor: 'pointer',\n});\n\ninterface DialogCloseButtonProps\n  extends VariantProps<typeof IconButton>,\n    ComponentProps<typeof IconButton> {}\nexport const DialogCloseIconButton = React.forwardRef<\n  React.ElementRef<typeof IconButton>,\n  DialogCloseButtonProps\n>((props, forwardedRef) => (\n  <StyledCloseButton asChild>\n    <IconButton ref={forwardedRef} css={{ color: '$hiContrast' }} {...props}>\n      <Cross1Icon />\n    </IconButton>\n  </StyledCloseButton>\n));\n\ntype DialogContentPrimitiveProps = React.ComponentProps<typeof DialogPrimitive.Content>;\ntype DialogContentProps = DialogContentPrimitiveProps &\n  VariantProps<typeof StyledContent> & { css?: CSS };\n\nexport const DialogContent = React.forwardRef<\n  React.ElementRef<typeof StyledContent>,\n  DialogContentProps\n>(({ children, ...props }, forwardedRef) => (\n  <StyledContent {...props} ref={forwardedRef}>\n    {children}\n    <DialogCloseIconButton />\n  </StyledContent>\n));\n\nexport const DialogClosePrimitive = DialogPrimitive.Close;\nexport const DialogDescription = DialogPrimitive.Description;\nexport const DialogPortal = DialogPrimitive.Portal;\nexport const DialogTitle = DialogPrimitive.Title;\nexport const DialogTrigger = DialogPrimitive.Trigger;\n"],"mappings":";;;;;;;;;;AAcA,IAAa,gBAAgB,OAAO,gBAAgB,SAAS,eAAe;CAC1E,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACR,MAAM;CACP,CAAC;AAEF,SAAgB,OAAO,EAAE,UAAU,GAAG,SAAsB;AAC1D,QAAO,oBAAC,gBAAgB,MAAjB;EAAsB,GAAI;EAAQ;EAAgC,CAAA;;AAG3E,IAAa,gBAAgB,OAAO,gBAAgB,SAAS,MAAM;CACjE,UAAU;CACV,KAAK;CACL,MAAM;CACN,WAAW;CACX,UAAU;CACV,WAAW;CACX,SAAS;CACT,WAAW;CACX,iBAAiB;CACjB,WAAW;CACX,cAAc;CAEd,YAAY;CACZ,UAAU;CAEV,aAAa,EACX,WAAW,QACZ;CAED,WAAW,EACT,SAAS,QACV;CAED,UAAU,EACR,WAAW,mBACZ;CACD,iBAAiB,EACf,WAAW,GACZ;CACF,CAAC;AAEF,IAAM,oBAAoB,OAAO,gBAAgB,OAAO;CACtD,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACT,CAAC;AAKF,IAAa,wBAAwB,MAAM,YAGxC,OAAO,iBACR,oBAAC,mBAAD;CAAmB,SAAA;WACjB,oBAAC,YAAD;EAAY,KAAK;EAAc,KAAK,EAAE,OAAO,eAAe;EAAE,GAAI;YAChE,oBAAC,YAAD,EAAc,CAAA;EACH,CAAA;CACK,CAAA,CACpB;AAMF,IAAa,gBAAgB,MAAM,YAGhC,EAAE,UAAU,GAAG,SAAS,iBACzB,qBAAC,eAAD;CAAe,GAAI;CAAO,KAAK;WAA/B,CACG,UACD,oBAAC,uBAAD,EAAyB,CAAA,CACX;GAChB;AAEF,IAAa,uBAAuB,gBAAgB;AACpD,IAAa,oBAAoB,gBAAgB;AACjD,IAAa,eAAe,gBAAgB;AAC5C,IAAa,cAAc,gBAAgB;AAC3C,IAAa,gBAAgB,gBAAgB"}
+{"version":3,"file":"Dialog.js","names":[],"sources":["../../../components/Dialog/Dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport React, { ComponentProps } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Card } from '../Card';\nimport { elevationVariants } from '../Elevation/Elevation';\nimport { IconButton } from '../IconButton';\nimport { overlayStyles } from '../Overlay';\n\ntype DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n  children: React.ReactNode;\n};\n\nexport const DialogOverlay = styled(DialogPrimitive.Overlay, overlayStyles, {\n  position: 'fixed',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n});\n\nexport function Dialog({ children, ...props }: DialogProps) {\n  return <DialogPrimitive.Root {...props}>{children}</DialogPrimitive.Root>;\n}\n\nexport const StyledContent = styled(DialogPrimitive.Content, Card, {\n  position: 'fixed',\n  top: '50%',\n  left: '50%',\n  transform: 'translate(-50%, -50%)',\n  minWidth: 200,\n  maxHeight: '85vh',\n  padding: '$4',\n  marginTop: '-5vh',\n  backgroundColor: '$dialogBackground',\n  boxShadow: 'inset 0 0 0 1px $colors$deepBlue4',\n  borderRadius: '$3',\n  // animation: `${fadeIn} 125ms linear, ${moveDown} 125ms cubic-bezier(0.22, 1, 0.36, 1)`,\n  willChange: 'transform',\n  overflow: 'auto',\n\n  '&::before': {\n    boxShadow: 'none',\n  },\n\n  '&:focus': {\n    outline: 'none',\n  },\n\n  variants: {\n    elevation: elevationVariants,\n  },\n  defaultVariants: {\n    elevation: 5,\n  },\n});\n\nconst StyledCloseButton = styled(DialogPrimitive.Close, {\n  position: 'absolute',\n  top: '$2',\n  right: '$2',\n  cursor: 'pointer',\n});\n\ninterface DialogCloseButtonProps\n  extends VariantProps<typeof IconButton>,\n    ComponentProps<typeof IconButton> {}\nexport const DialogCloseIconButton = React.forwardRef<\n  React.ElementRef<typeof IconButton>,\n  DialogCloseButtonProps\n>((props, forwardedRef) => (\n  <StyledCloseButton asChild>\n    <IconButton ref={forwardedRef} css={{ color: '$hiContrast' }} {...props}>\n      <Cross1Icon />\n    </IconButton>\n  </StyledCloseButton>\n));\n\ntype DialogContentPrimitiveProps = React.ComponentProps<typeof DialogPrimitive.Content>;\ntype DialogContentProps = DialogContentPrimitiveProps &\n  VariantProps<typeof StyledContent> & { css?: CSS };\n\nexport const DialogContent = React.forwardRef<\n  React.ElementRef<typeof StyledContent>,\n  DialogContentProps\n>(({ children, ...props }, forwardedRef) => (\n  <StyledContent {...props} ref={forwardedRef}>\n    {children}\n    <DialogCloseIconButton />\n  </StyledContent>\n));\n\nexport const DialogClosePrimitive = DialogPrimitive.Close;\nexport const DialogDescription = DialogPrimitive.Description;\nexport const DialogPortal = DialogPrimitive.Portal;\nexport const DialogTitle = DialogPrimitive.Title;\nexport const DialogTrigger = DialogPrimitive.Trigger;\n"],"mappings":";;;;;;;;;;AAcA,IAAa,gBAAgB,OAAO,gBAAgB,SAAS,eAAe;CAC1E,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACR,MAAM;CACP,CAAC;AAEF,SAAgB,OAAO,EAAE,UAAU,GAAG,SAAsB;CAC1D,OAAO,oBAAC,gBAAgB,MAAjB;EAAsB,GAAI;EAAQ;EAAgC,CAAA;;AAG3E,IAAa,gBAAgB,OAAO,gBAAgB,SAAS,MAAM;CACjE,UAAU;CACV,KAAK;CACL,MAAM;CACN,WAAW;CACX,UAAU;CACV,WAAW;CACX,SAAS;CACT,WAAW;CACX,iBAAiB;CACjB,WAAW;CACX,cAAc;CAEd,YAAY;CACZ,UAAU;CAEV,aAAa,EACX,WAAW,QACZ;CAED,WAAW,EACT,SAAS,QACV;CAED,UAAU,EACR,WAAW,mBACZ;CACD,iBAAiB,EACf,WAAW,GACZ;CACF,CAAC;AAEF,IAAM,oBAAoB,OAAO,gBAAgB,OAAO;CACtD,UAAU;CACV,KAAK;CACL,OAAO;CACP,QAAQ;CACT,CAAC;AAKF,IAAa,wBAAwB,MAAM,YAGxC,OAAO,iBACR,oBAAC,mBAAD;CAAmB,SAAA;WACjB,oBAAC,YAAD;EAAY,KAAK;EAAc,KAAK,EAAE,OAAO,eAAe;EAAE,GAAI;YAChE,oBAAC,YAAD,EAAc,CAAA;EACH,CAAA;CACK,CAAA,CACpB;AAMF,IAAa,gBAAgB,MAAM,YAGhC,EAAE,UAAU,GAAG,SAAS,iBACzB,qBAAC,eAAD;CAAe,GAAI;CAAO,KAAK;WAA/B,CACG,UACD,oBAAC,uBAAD,EAAyB,CAAA,CACX;GAChB;AAEF,IAAa,uBAAuB,gBAAgB;AACpD,IAAa,oBAAoB,gBAAgB;AACjD,IAAa,eAAe,gBAAgB;AAC5C,IAAa,cAAc,gBAAgB;AAC3C,IAAa,gBAAgB,gBAAgB"}

package/dist/components/Dialog/Dialog.themes.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.themes.cjs","names":[],"sources":["../../../components/Dialog/Dialog.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    dialogBackground: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    dialogBackground: '$deepBlue2',\n  });\n\n  export const getDark: Factory = () => ({\n    dialogBackground: '$deepBlue3',\n  });\n}\n"],"mappings":";AAIO,IAAA;;AAOQ,QAAA,kBAA2B,EACtC,kBAAkB,cACnB;AAEY,QAAA,iBAA0B,EACrC,kBAAkB,cACnB;yBACF"}
+{"version":3,"file":"Dialog.themes.cjs","names":[],"sources":["../../../components/Dialog/Dialog.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    dialogBackground: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    dialogBackground: '$deepBlue2',\n  });\n\n  export const getDark: Factory = () => ({\n    dialogBackground: '$deepBlue3',\n  });\n}\n"],"mappings":";AAIO,IAAA;;CAOQ,OAAA,kBAA2B,EACtC,kBAAkB,cACnB;CAEY,OAAA,iBAA0B,EACrC,kBAAkB,cACnB;yBACF"}

package/dist/components/Dialog/Dialog.themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.themes.js","names":[],"sources":["../../../components/Dialog/Dialog.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    dialogBackground: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    dialogBackground: '$deepBlue2',\n  });\n\n  export const getDark: Factory = () => ({\n    dialogBackground: '$deepBlue3',\n  });\n}\n"],"mappings":";AAIO,IAAA;;AAOQ,QAAA,kBAA2B,EACtC,kBAAkB,cACnB;AAEY,QAAA,iBAA0B,EACrC,kBAAkB,cACnB;yBACF"}
+{"version":3,"file":"Dialog.themes.js","names":[],"sources":["../../../components/Dialog/Dialog.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    dialogBackground: Property.Color;\n  };\n\n  type Factory = (primaryColor?: ColorInfo) => Colors;\n\n  export const getLight: Factory = () => ({\n    dialogBackground: '$deepBlue2',\n  });\n\n  export const getDark: Factory = () => ({\n    dialogBackground: '$deepBlue3',\n  });\n}\n"],"mappings":";AAIO,IAAA;;CAOQ,OAAA,kBAA2B,EACtC,kBAAkB,cACnB;CAEY,OAAA,iBAA0B,EACrC,kBAAkB,cACnB;yBACF"}

package/dist/components/Elevation/Elevation.vanilla.cjs.map

@@ -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,CAK7B,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,8BAA8B,cAAc;AAE5C,IAAa,mBAAmB"}
+{"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;CAG1E,OACE,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"}

package/dist/components/Elevation/Elevation.vanilla.js.map

@@ -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,CAK7B,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,8BAA8B,cAAc;AAE5C,IAAa,mBAAmB"}
+{"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;CAG1E,OACE,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"}

package/dist/components/Flex/Flex.vanilla.cjs.map

@@ -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,CAKrD,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
+{"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;CAID,OACE,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"}

package/dist/components/Flex/Flex.vanilla.js.map

@@ -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,CAKrD,CAAY,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,qBAAqB,cAAc;AAEnC,IAAa,cAAc"}
+{"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;CAID,OACE,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"}