@traefik-labs/faency 12.2.0 → 12.2.2

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

@@ -1,158 +1,131 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { CheckIcon, CopyIcon } from "@radix-ui/react-icons";
-import { assignInlineVars } from "@vanilla-extract/dynamic";
-import { themes, Highlight, Prism } from "prism-react-renderer";
-import { forwardRef, useState, useRef, useCallback, useLayoutEffect } from "react";
+import { AccessibleIcon } from "../AccessibleIcon/AccessibleIcon.js";
 import { processCSSProp } from "../../styles/cssProps.js";
 import { useVanillaExtractTheme } from "../../styles/themeContext.js";
-import { pre, preNoBorder, codeContent, codeContentBottomPadding, copyButtonWrapperBottomLeft, copyButtonWrapperBottomRight, copyButtonWrapperTopLeft, copyButtonWrapperTop } from "./CodeBlock.vanilla.css.js";
 import { ButtonVanilla } from "../Button/Button.vanilla.js";
-import { AccessibleIcon } from "../AccessibleIcon/AccessibleIcon.js";
-const CodeBlockVanilla = forwardRef(
-  ({
-    lang = "text",
-    code,
-    copyable = false,
-    copyText,
-    copiedText,
-    copyButtonAlign = "top right",
-    onCopy,
-    noBorder,
-    wrapText = false,
-    colorScheme,
-    maxHeight = 424,
-    css,
-    style,
-    className,
-    ...props
-  }, ref) => {
-    const { colors, resolvedTheme } = useVanillaExtractTheme();
-    const effectiveScheme = colorScheme ?? resolvedTheme;
-    const prismTheme = effectiveScheme === "dark" ? themes.nightOwl : themes.nightOwlLight;
-    const { style: cssStyles, vars } = processCSSProp(css, colors);
-    const containerStyles = {
-      position: "relative",
-      ...cssStyles,
-      ...assignInlineVars(vars)
-    };
-    const [copied, setCopied] = useState(false);
-    const preRef = useRef(
-      null
-    );
-    const buttonWrapperRef = useRef(null);
-    const setPreRef = useCallback(
-      (node) => {
-        preRef.current = node;
-        if (typeof ref === "function") ref(node);
-        else if (ref) ref.current = node;
-      },
-      [ref]
-    );
-    useLayoutEffect(() => {
-      if (!copyable) return;
-      const pre2 = preRef.current;
-      const wrapper = buttonWrapperRef.current;
-      if (!pre2 || !wrapper) return;
-      const isLeftAlign = copyButtonAlign.includes("left");
-      const isBottomAlign = copyButtonAlign.includes("bottom");
-      const borderH = noBorder ? 0 : 2;
-      const update = () => {
-        if (!isLeftAlign) {
-          const vScrollbar = Math.max(0, pre2.offsetWidth - pre2.clientWidth - borderH);
-          wrapper.style.right = `${16 + vScrollbar}px`;
-        }
-        if (isBottomAlign) {
-          const hScrollbar = Math.max(0, pre2.offsetHeight - pre2.clientHeight - borderH);
-          wrapper.style.bottom = `${8 + hScrollbar}px`;
-        }
-      };
-      update();
-      const observer = new ResizeObserver(update);
-      observer.observe(pre2);
-      return () => observer.disconnect();
-    }, [copyable, copyButtonAlign, noBorder]);
-    const handleCopy = async () => {
-      try {
-        await navigator.clipboard.writeText(code);
-        setCopied(true);
-        onCopy?.();
-        setTimeout(() => setCopied(false), 1500);
-      } catch {
-      }
-    };
-    const isBottom = copyButtonAlign.includes("bottom");
-    const isLeft = copyButtonAlign.includes("left");
-    const buttonPositionClass = isBottom ? isLeft ? copyButtonWrapperBottomLeft : copyButtonWrapperBottomRight : isLeft ? copyButtonWrapperTopLeft : copyButtonWrapperTop;
-    const copyButton = copyable ? /* @__PURE__ */ jsxs(
-      ButtonVanilla,
-      {
-        variant: "secondary",
-        ghost: true,
-        size: "small",
-        type: "button",
-        onClick: handleCopy,
-        css: {
-          color: "$hiContrast",
-          gap: "$1",
-          backgroundColor: "$codeBlockCopyButtonBg",
-          height: "32px"
-        },
-        children: [
-          /* @__PURE__ */ jsx(AccessibleIcon, { label: copied ? "Copied" : "Copy", children: copied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {}) }),
-          copied ? copiedText : copyText
-        ]
-      }
-    ) : null;
-    return /* @__PURE__ */ jsx(
-      Highlight,
-      {
-        theme: prismTheme,
-        code,
-        language: Prism.languages[lang] != null ? lang : "text",
-        children: ({
-          className: highlightClass,
-          style: highlightStyle,
-          tokens,
-          getLineProps,
-          getTokenProps
-        }) => /* @__PURE__ */ jsxs("div", { style: containerStyles, children: [
-          /* @__PURE__ */ jsx(
-            "pre",
-            {
-              ref: setPreRef,
-              className: [pre, noBorder ? preNoBorder : "", highlightClass, className].filter(Boolean).join(" "),
-              style: {
-                maxHeight,
-                ...highlightStyle,
-                backgroundColor: "inherit",
-                ...style
-              },
-              ...props,
-              children: /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: [codeContent, copyable && isBottom ? codeContentBottomPadding : ""].filter(Boolean).join(" "),
-                  children: tokens.map((line, i) => /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      ...getLineProps({ line }),
-                      style: wrapText ? { whiteSpace: "pre-wrap", wordBreak: "break-all" } : void 0,
-                      children: line.map((token, key) => /* @__PURE__ */ jsx("span", { ...getTokenProps({ token }) }, key))
-                    },
-                    i
-                  ))
-                }
-              )
-            }
-          ),
-          copyButton && /* @__PURE__ */ jsx("div", { ref: buttonWrapperRef, className: buttonPositionClass, children: copyButton })
-        ] })
-      }
-    );
-  }
-);
+import { codeContent, codeContentBottomPadding, codeContentTopPadding, copyButtonWrapperBottomLeft, copyButtonWrapperBottomRight, copyButtonWrapperTop, copyButtonWrapperTopLeft, pre, preNoBorder } from "./CodeBlock.vanilla.css.js";
+import { CheckIcon, CopyIcon } from "@radix-ui/react-icons";
+import { forwardRef, useCallback, useLayoutEffect, useRef, useState } from "react";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Highlight, Prism, themes } from "prism-react-renderer";
+//#region components/CodeBlock/CodeBlock.vanilla.tsx
+var CodeBlockVanilla = forwardRef(({ lang = "text", code, copyable = false, copyText, copiedText, copyButtonAlign = "top right", onCopy, noBorder, wrapText = false, colorScheme, maxHeight = 424, css, style, className, ...props }, ref) => {
+	const { colors, resolvedTheme } = useVanillaExtractTheme();
+	const prismTheme = (colorScheme ?? resolvedTheme) === "dark" ? themes.nightOwl : themes.nightOwlLight;
+	const isBottom = copyButtonAlign.includes("bottom");
+	const isLeft = copyButtonAlign.includes("left");
+	const { style: cssStyles, vars } = processCSSProp(css, colors);
+	const containerStyles = {
+		position: "relative",
+		...cssStyles,
+		...assignInlineVars(vars)
+	};
+	const [copied, setCopied] = useState(false);
+	const preRef = useRef(null);
+	const buttonWrapperRef = useRef(null);
+	const setPreRef = useCallback((node) => {
+		preRef.current = node;
+		if (typeof ref === "function") ref(node);
+		else if (ref) ref.current = node;
+	}, [ref]);
+	useLayoutEffect(() => {
+		if (!copyable) return;
+		const pre = preRef.current;
+		const wrapper = buttonWrapperRef.current;
+		if (!pre || !wrapper) return;
+		const borderH = noBorder ? 0 : 2;
+		const update = () => {
+			if (!isLeft) {
+				const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);
+				wrapper.style.right = `${16 + vScrollbar}px`;
+			}
+			if (isBottom) {
+				const hScrollbar = Math.max(0, pre.offsetHeight - pre.clientHeight - borderH);
+				wrapper.style.bottom = `${8 + hScrollbar}px`;
+			}
+		};
+		update();
+		const observer = new ResizeObserver(update);
+		observer.observe(pre);
+		return () => observer.disconnect();
+	}, [
+		copyable,
+		isBottom,
+		isLeft,
+		noBorder
+	]);
+	const handleCopy = async () => {
+		try {
+			await navigator.clipboard.writeText(code);
+			setCopied(true);
+			onCopy?.();
+			setTimeout(() => setCopied(false), 1500);
+		} catch {}
+	};
+	const buttonPositionClass = isBottom ? isLeft ? copyButtonWrapperBottomLeft : copyButtonWrapperBottomRight : isLeft ? copyButtonWrapperTopLeft : copyButtonWrapperTop;
+	const copyButton = copyable ? /* @__PURE__ */ jsxs(ButtonVanilla, {
+		variant: "secondary",
+		ghost: true,
+		size: "small",
+		type: "button",
+		onClick: handleCopy,
+		css: {
+			color: "$hiContrast",
+			gap: "$1",
+			backgroundColor: "$codeBlockCopyButtonBg",
+			height: "32px"
+		},
+		children: [/* @__PURE__ */ jsx(AccessibleIcon, {
+			label: copied ? "Copied" : "Copy",
+			children: copied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {})
+		}), copied ? copiedText : copyText]
+	}) : null;
+	return /* @__PURE__ */ jsx(Highlight, {
+		theme: prismTheme,
+		code,
+		language: Prism.languages[lang] != null ? lang : "text",
+		children: ({ className: highlightClass, style: highlightStyle, tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ jsxs("div", {
+			style: containerStyles,
+			children: [/* @__PURE__ */ jsx("pre", {
+				ref: setPreRef,
+				className: [
+					pre,
+					noBorder ? preNoBorder : "",
+					highlightClass,
+					className
+				].filter(Boolean).join(" "),
+				style: {
+					maxHeight,
+					...highlightStyle,
+					backgroundColor: "inherit",
+					...style
+				},
+				...props,
+				children: /* @__PURE__ */ jsx("div", {
+					className: [
+						codeContent,
+						copyable && isLeft && isBottom ? codeContentBottomPadding : "",
+						copyable && isLeft && !isBottom ? codeContentTopPadding : ""
+					].filter(Boolean).join(" "),
+					children: tokens.map((line, i) => /* @__PURE__ */ jsx("div", {
+						...getLineProps({ line }),
+						style: wrapText ? {
+							whiteSpace: "pre-wrap",
+							wordBreak: "break-all"
+						} : void 0,
+						children: line.map((token, key) => /* @__PURE__ */ jsx("span", { ...getTokenProps({ token }) }, key))
+					}, i))
+				})
+			}), copyButton && /* @__PURE__ */ jsx("div", {
+				ref: buttonWrapperRef,
+				className: buttonPositionClass,
+				children: copyButton
+			})]
+		})
+	});
+});
 CodeBlockVanilla.displayName = "CodeBlockVanilla";
-export {
-  CodeBlockVanilla
-};
-//# sourceMappingURL=CodeBlock.vanilla.js.map
+//#endregion
+export { CodeBlockVanilla };
+
+//# sourceMappingURL=CodeBlock.vanilla.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.vanilla.js","sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import './prism-extend';\n\nimport { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, Prism, 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  copyButtonWrapperBottomLeft,\n  copyButtonWrapperBottomRight,\n  copyButtonWrapperTop,\n  copyButtonWrapperTopLeft,\n  pre,\n  preNoBorder,\n} from './CodeBlock.vanilla.css';\nimport type { CodeBlockCopyButtonAlign, CodeBlockLanguage } from './index';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>,\n    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 { 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 isLeftAlign = copyButtonAlign.includes('left');\n      const isBottomAlign = copyButtonAlign.includes('bottom');\n      const borderH = noBorder ? 0 : 2;\n\n      const update = () => {\n        if (!isLeftAlign) {\n          const vScrollbar = Math.max(0, pre.offsetWidth - pre.clientWidth - borderH);\n          wrapper.style.right = `${16 + vScrollbar}px`;\n        }\n        if (isBottomAlign) {\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, copyButtonAlign, 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 isBottom = copyButtonAlign.includes('bottom');\n    const isLeft = copyButtonAlign.includes('left');\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={[codeContent, copyable && isBottom ? codeContentBottomPadding : '']\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"],"names":["pre"],"mappings":"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"}
+{"version":3,"file":"CodeBlock.vanilla.js","names":[],"sources":["../../../components/CodeBlock/CodeBlock.vanilla.tsx"],"sourcesContent":["import './prism-extend';\n\nimport { CheckIcon, CopyIcon } from '@radix-ui/react-icons';\nimport { assignInlineVars } from '@vanilla-extract/dynamic';\nimport { Highlight, Language, Prism, 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';\n\nexport interface CodeBlockVanillaProps\n  extends Omit<HTMLAttributes<HTMLPreElement>, 'css'>,\n    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/Container/Container.cjs

@@ -1,38 +1,22 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const stitches_config = require("../../stitches.config.cjs");
-const Container = stitches_config.styled("div", {
-  // Reset
-  boxSizing: "border-box",
-  flexShrink: 0,
-  // Custom
-  ml: "auto",
-  mr: "auto",
-  px: "$5",
-  variants: {
-    size: {
-      "1": {
-        maxWidth: "425px"
-      },
-      "2": {
-        maxWidth: "768px"
-      },
-      "3": {
-        maxWidth: "1440px"
-      },
-      "4": {
-        maxWidth: "none"
-      }
-    },
-    noGutter: {
-      true: {
-        px: 0
-      }
-    }
-  },
-  defaultVariants: {
-    size: "4"
-  }
+//#region components/Container/Container.tsx
+var Container = require("../../stitches.config.cjs").styled("div", {
+	boxSizing: "border-box",
+	flexShrink: 0,
+	ml: "auto",
+	mr: "auto",
+	px: "$5",
+	variants: {
+		size: {
+			"1": { maxWidth: "425px" },
+			"2": { maxWidth: "768px" },
+			"3": { maxWidth: "1440px" },
+			"4": { maxWidth: "none" }
+		},
+		noGutter: { true: { px: 0 } }
+	},
+	defaultVariants: { size: "4" }
 });
+//#endregion
 exports.Container = Container;
-//# sourceMappingURL=Container.cjs.map
+
+//# sourceMappingURL=Container.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Container.cjs","sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n  // Reset\n  boxSizing: 'border-box',\n  flexShrink: 0,\n\n  // Custom\n  ml: 'auto',\n  mr: 'auto',\n  px: '$5',\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        px: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"names":["styled"],"mappings":";;;AAEO,MAAM,YAAYA,gBAAAA,OAAO,OAAO;AAAA;AAAA,EAErC,WAAW;AAAA,EACX,YAAY;AAAA;AAAA,EAGZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EAEJ,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,IAEF,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,EACF;AAAA,EAEF,iBAAiB;AAAA,IACf,MAAM;AAAA,EAAA;AAEV,CAAC;;"}
+{"version":3,"file":"Container.cjs","names":[],"sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n  // Reset\n  boxSizing: 'border-box',\n  flexShrink: 0,\n\n  // Custom\n  ml: 'auto',\n  mr: 'auto',\n  px: '$5',\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        px: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"mappings":";AAEA,IAAa,iDAAY,OAAO,OAAO;CAErC,WAAW;CACX,YAAY;CAGZ,IAAI;CACJ,IAAI;CACJ,IAAI;CAEJ,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,UACX;GACD,KAAK,EACH,UAAU,QACX;GACF;EACD,UAAU,EACR,MAAM,EACJ,IAAI,GACL,EACF;EACF;CACD,iBAAiB,EACf,MAAM,KACP;CACF,CAAC"}

package/dist/components/Container/Container.js

@@ -1,38 +1,23 @@
 import { styled } from "../../stitches.config.js";
-const Container = styled("div", {
-  // Reset
-  boxSizing: "border-box",
-  flexShrink: 0,
-  // Custom
-  ml: "auto",
-  mr: "auto",
-  px: "$5",
-  variants: {
-    size: {
-      "1": {
-        maxWidth: "425px"
-      },
-      "2": {
-        maxWidth: "768px"
-      },
-      "3": {
-        maxWidth: "1440px"
-      },
-      "4": {
-        maxWidth: "none"
-      }
-    },
-    noGutter: {
-      true: {
-        px: 0
-      }
-    }
-  },
-  defaultVariants: {
-    size: "4"
-  }
+//#region components/Container/Container.tsx
+var Container = styled("div", {
+	boxSizing: "border-box",
+	flexShrink: 0,
+	ml: "auto",
+	mr: "auto",
+	px: "$5",
+	variants: {
+		size: {
+			"1": { maxWidth: "425px" },
+			"2": { maxWidth: "768px" },
+			"3": { maxWidth: "1440px" },
+			"4": { maxWidth: "none" }
+		},
+		noGutter: { true: { px: 0 } }
+	},
+	defaultVariants: { size: "4" }
 });
-export {
-  Container
-};
-//# sourceMappingURL=Container.js.map
+//#endregion
+export { Container };
+
+//# sourceMappingURL=Container.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Container.js","sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n  // Reset\n  boxSizing: 'border-box',\n  flexShrink: 0,\n\n  // Custom\n  ml: 'auto',\n  mr: 'auto',\n  px: '$5',\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        px: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,YAAY,OAAO,OAAO;AAAA;AAAA,EAErC,WAAW;AAAA,EACX,YAAY;AAAA;AAAA,EAGZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EAEJ,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,IAEF,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,EACF;AAAA,EAEF,iBAAiB;AAAA,IACf,MAAM;AAAA,EAAA;AAEV,CAAC;"}
+{"version":3,"file":"Container.js","names":[],"sources":["../../../components/Container/Container.tsx"],"sourcesContent":["import { styled } from '../../stitches.config';\n\nexport const Container = styled('div', {\n  // Reset\n  boxSizing: 'border-box',\n  flexShrink: 0,\n\n  // Custom\n  ml: 'auto',\n  mr: 'auto',\n  px: '$5',\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        px: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"mappings":";;AAEA,IAAa,YAAY,OAAO,OAAO;CAErC,WAAW;CACX,YAAY;CAGZ,IAAI;CACJ,IAAI;CACJ,IAAI;CAEJ,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,SACX;GACD,KAAK,EACH,UAAU,UACX;GACD,KAAK,EACH,UAAU,QACX;GACF;EACD,UAAU,EACR,MAAM,EACJ,IAAI,GACL,EACF;EACF;CACD,iBAAiB,EACf,MAAM,KACP;CACF,CAAC"}

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

@@ -1,35 +1,34 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const dynamic = require("@vanilla-extract/dynamic");
-const React = require("react");
-const cssProps = require("../../styles/cssProps.cjs");
-const themeContext = require("../../styles/themeContext.cjs");
-const Container_vanilla_css = require("./Container.vanilla.css.cjs");
-const ContainerVanillaComponent = React.forwardRef(
-  ({ as, className, css, style, size, noGutter, ...props }, ref) => {
-    const Component = as || "div";
-    const { colors } = themeContext.useVanillaExtractTheme();
-    const { style: cssStyles, vars } = cssProps.processCSSProp(css, colors);
-    const mergedStyles = {
-      ...cssStyles,
-      ...style,
-      ...dynamic.assignInlineVars(vars)
-    };
-    const recipeClass = Container_vanilla_css.containerRecipe({ size, noGutter });
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Component,
-      {
-        ref,
-        className: `${recipeClass} ${className || ""}`.trim(),
-        style: mergedStyles,
-        ...props
-      }
-    );
-  }
-);
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_cssProps = require("../../styles/cssProps.cjs");
+const require_themeContext = require("../../styles/themeContext.cjs");
+const require_Container_vanilla_css = require("./Container.vanilla.css.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region components/Container/Container.vanilla.tsx
+var ContainerVanillaComponent = react.default.forwardRef(({ as, className, css, style, size, noGutter, ...props }, ref) => {
+	const Component = as || "div";
+	const { colors } = require_themeContext.useVanillaExtractTheme();
+	const { style: cssStyles, vars } = require_cssProps.processCSSProp(css, colors);
+	const mergedStyles = {
+		...cssStyles,
+		...style,
+		...(0, _vanilla_extract_dynamic.assignInlineVars)(vars)
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {
+		ref,
+		className: `${require_Container_vanilla_css.containerRecipe({
+			size,
+			noGutter
+		})} ${className || ""}`.trim(),
+		style: mergedStyles,
+		...props
+	});
+});
 ContainerVanillaComponent.displayName = "ContainerVanilla";
-const ContainerVanilla = ContainerVanillaComponent;
+var ContainerVanilla = ContainerVanillaComponent;
+//#endregion
 exports.ContainerVanilla = ContainerVanilla;
-exports.ContainerVanillaComponent = ContainerVanillaComponent;
-//# sourceMappingURL=Container.vanilla.cjs.map
+
+//# sourceMappingURL=Container.vanilla.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Container.vanilla.cjs","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"],"names":["useVanillaExtractTheme","processCSSProp","assignInlineVars","containerRecipe","jsx"],"mappings":";;;;;;;;AAuBO,MAAM,4BAA4B,MAAM;AAAA,EAC7C,CACE,EAAE,IAAI,WAAW,KAAK,OAAO,MAAM,UAAU,GAAG,MAAA,GAChD,QACG;AACH,UAAM,YAAY,MAAM;AAExB,UAAM,EAAE,OAAA,IAAWA,oCAAA;AAEnB,UAAM,EAAE,OAAO,WAAW,SAASC,SAAAA,eAAe,KAAK,MAAM;AAE7D,UAAM,eAAe;AAAA,MACnB,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAGC,QAAAA,iBAAiB,IAAI;AAAA,IAAA;AAG1B,UAAM,cAAcC,sBAAAA,gBAAgB,EAAE,MAAM,UAAU;AAEtD,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,WAAW,IAAI,aAAa,EAAE,GAAG,KAAA;AAAA,QAC/C,OAAO;AAAA,QACN,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,0BAA0B,cAAc;AAEjC,MAAM,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;AAID,QACE,iBAAA,GAAA,kBAAA,KAAC,WAAD;EACO;EACL,WAAW,GALK,8BAAA,gBAAgB;GAAE;GAAM;GAAU,CAAC,CAKzB,GAAG,aAAa,KAAK,MAAM;EACrD,OAAO;EACP,GAAI;EACJ,CAAA;EAGP;AAED,0BAA0B,cAAc;AAExC,IAAa,mBAAmB"}

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

@@ -1,9 +1,23 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
 ;/* empty css                                       */
 ;/* empty css                                      */
 ;/* empty css                                       */
-const createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var containerRecipe = createRuntimeFn.createRuntimeFn({ defaultClassName: "ayuv8i1 ayuv8i0", variantClassNames: { size: { "1": "ayuv8i2", "2": "ayuv8i3", "3": "ayuv8i4", "4": "ayuv8i5" }, noGutter: { true: "ayuv8i6" } }, defaultVariants: { size: "4" }, compoundVariants: [] });
+//#region components/Container/Container.vanilla.css.ts
+var containerRecipe = (0, require("@vanilla-extract/recipes/createRuntimeFn").createRuntimeFn)({
+	defaultClassName: "ayuv8i1 ayuv8i0",
+	variantClassNames: {
+		size: {
+			"1": "ayuv8i2",
+			"2": "ayuv8i3",
+			"3": "ayuv8i4",
+			"4": "ayuv8i5"
+		},
+		noGutter: { true: "ayuv8i6" }
+	},
+	defaultVariants: { size: "4" },
+	compoundVariants: []
+});
+//#endregion
 exports.containerRecipe = containerRecipe;
-//# sourceMappingURL=Container.vanilla.css.cjs.map
+
+//# sourceMappingURL=Container.vanilla.css.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Container.vanilla.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"Container.vanilla.css.cjs","names":[],"sources":["../../../components/Container/Container.vanilla.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { tokens } from '../../styles';\n\nconst container = style({\n  boxSizing: 'border-box',\n  flexShrink: 0,\n  marginLeft: 'auto',\n  marginRight: 'auto',\n  paddingLeft: tokens.space[5],\n  paddingRight: tokens.space[5],\n});\n\nexport const containerRecipe = recipe({\n  base: container,\n\n  variants: {\n    size: {\n      '1': {\n        maxWidth: '425px',\n      },\n      '2': {\n        maxWidth: '768px',\n      },\n      '3': {\n        maxWidth: '1440px',\n      },\n      '4': {\n        maxWidth: 'none',\n      },\n    },\n    noGutter: {\n      true: {\n        paddingLeft: 0,\n        paddingRight: 0,\n      },\n    },\n  },\n  defaultVariants: {\n    size: '4',\n  },\n});\n"],"mappings":""}