@kimdw-rtk/ui 0.0.20 → 0.0.21

package/dist/chunk-YGZR6ZHF.mjs

@@ -1,130 +0,0 @@
-import {
-  colorVar,
-  ripple
-} from "./chunk-CTR67SPK.mjs";
-import {
-  require_jsx_runtime
-} from "./chunk-3BVACFSH.mjs";
-import {
-  require_react
-} from "./chunk-QB7MZLGH.mjs";
-import {
-  __toESM
-} from "./chunk-D57E6H3M.mjs";
-
-// src/hooks/useRipple/index.tsx
-var import_react = __toESM(require_react(), 1);
-var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
-var useRipple = (ref) => {
-  const rippleRef = (0, import_react.useRef)(null);
-  (0, import_react.useEffect)(() => {
-    let element = null;
-    if (!ref) {
-      return;
-    }
-    if (typeof ref === "function") {
-      ref(element);
-    } else {
-      element = ref.current;
-    }
-    const ripple2 = rippleRef.current;
-    let timer;
-    let isAnimationPending = false;
-    let isFadeIn = false, isMouseDown = false, isTransitionEnd = true;
-    if (!ripple2 || !element) {
-      return;
-    }
-    const clearTimer = () => {
-      clearTimeout(timer);
-      isAnimationPending = false;
-    };
-    const runAnimation = (x, y) => {
-      const width = element.clientWidth / 2 + Math.abs(element.clientWidth / 2 - x), height = element.clientHeight / 2 + Math.abs(element.clientHeight / 2 - y);
-      const size = Math.round(Math.sqrt(width ** 2 + height ** 2) * 2);
-      ripple2.style.width = `${size}px`;
-      ripple2.style.height = `${size}px`;
-      ripple2.style.left = `${x}px`;
-      ripple2.style.top = `${y}px`;
-      ripple2.style.boxShadow = `${colorVar} 0 0 ${size / 10}px ${size / 10}px`;
-      ripple2.className = ripple({ animation: false });
-      ripple2.offsetTop;
-      ripple2.className = ripple({ animation: true });
-      ripple2.style.opacity = "1";
-      isAnimationPending = false;
-      isFadeIn = true;
-      isTransitionEnd = false;
-    };
-    const handleClick = (e) => {
-      if (!isAnimationPending) {
-        return;
-      }
-      if (element instanceof HTMLButtonElement && element.disabled) {
-        return;
-      }
-      clearTimer();
-      runAnimation(e.offsetX, e.offsetY);
-    };
-    const handlePointerDown = (e) => {
-      if (e.button !== 0 || !ripple2 || !isTransitionEnd) {
-        return;
-      }
-      if (element instanceof HTMLButtonElement && element.disabled) {
-        return;
-      }
-      isMouseDown = true;
-      if (e.pointerType === "mouse") {
-        runAnimation(e.offsetX, e.offsetY);
-        return;
-      }
-      clearTimer();
-      isAnimationPending = true;
-      timer = setTimeout(() => runAnimation(e.offsetX, e.offsetY), 100);
-    };
-    const handlePointerUp = () => {
-      if (!isMouseDown) {
-        return;
-      }
-      clearTimer();
-      if (!isFadeIn) {
-        ripple2.style.opacity = "0";
-        isFadeIn = false;
-      }
-      isMouseDown = false;
-    };
-    const handleTransitionEnd = (e) => {
-      if (e.propertyName === "opacity" && isFadeIn) {
-        if (!isMouseDown) {
-          ripple2.style.opacity = "0";
-        }
-        isFadeIn = false;
-        return;
-      }
-      if (e.propertyName === "transform" && !isFadeIn) {
-        isTransitionEnd = true;
-      }
-    };
-    element.addEventListener("click", handleClick);
-    element.addEventListener("pointerdown", handlePointerDown);
-    element.addEventListener("pointerup", handlePointerUp);
-    element.addEventListener("pointerleave", handlePointerUp);
-    ripple2.addEventListener("transitionend", handleTransitionEnd);
-    return () => {
-      element.removeEventListener("click", handleClick);
-      element.removeEventListener("pointerdown", handlePointerDown);
-      element.removeEventListener("pointerup", handlePointerUp);
-      element.removeEventListener("pointerleave", handlePointerUp);
-      ripple2.removeEventListener("transitionend", handleTransitionEnd);
-    };
-  }, [ref, rippleRef]);
-  return (0, import_react.useMemo)(
-    () => ({
-      ripple: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: rippleRef, className: ripple({ animation: false }) })
-    }),
-    [rippleRef]
-  );
-};
-
-export {
-  useRipple
-};
-//# sourceMappingURL=chunk-YGZR6ZHF.mjs.map

package/dist/chunk-YGZR6ZHF.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/hooks/useRipple/index.tsx"],
-  "sourcesContent": ["'use client';\n\nimport { useEffect, useMemo, useRef } from 'react';\n\nimport * as s from './ripple.css';\n\nexport const useRipple = <T extends HTMLElement>(ref?: React.Ref<T>) => {\n  const rippleRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    let element: T | null = null;\n\n    if (!ref) {\n      return;\n    }\n\n    if (typeof ref === 'function') {\n      ref(element);\n    } else {\n      element = ref.current;\n    }\n\n    const ripple = rippleRef.current;\n\n    let timer: ReturnType<typeof setTimeout>;\n    let isAnimationPending = false;\n\n    let isFadeIn = false,\n      isMouseDown = false,\n      isTransitionEnd = true;\n\n    if (!ripple || !element) {\n      return;\n    }\n\n    const clearTimer = () => {\n      clearTimeout(timer);\n      isAnimationPending = false;\n    };\n\n    const runAnimation = (x: number, y: number) => {\n      const width =\n          element.clientWidth / 2 + Math.abs(element.clientWidth / 2 - x),\n        height =\n          element.clientHeight / 2 + Math.abs(element.clientHeight / 2 - y);\n      const size = Math.round(Math.sqrt(width ** 2 + height ** 2) * 2);\n\n      ripple.style.width = `${size}px`;\n      ripple.style.height = `${size}px`;\n      ripple.style.left = `${x}px`;\n      ripple.style.top = `${y}px`;\n\n      ripple.style.boxShadow = `${s.colorVar} 0 0 ${size / 10}px ${size / 10}px`;\n      ripple.className = s.ripple({ animation: false });\n      //eslint-disable-next-line\n      ripple.offsetTop;\n      ripple.className = s.ripple({ animation: true });\n      ripple.style.opacity = '1';\n\n      isAnimationPending = false;\n      isFadeIn = true;\n      isTransitionEnd = false;\n    };\n\n    const handleClick = (e: MouseEvent) => {\n      if (!isAnimationPending) {\n        return;\n      }\n\n      if (element instanceof HTMLButtonElement && element.disabled) {\n        return;\n      }\n\n      clearTimer();\n      runAnimation(e.offsetX, e.offsetY);\n    };\n\n    const handlePointerDown = (e: PointerEvent) => {\n      if (e.button !== 0 || !ripple || !isTransitionEnd) {\n        return;\n      }\n\n      if (element instanceof HTMLButtonElement && element.disabled) {\n        return;\n      }\n\n      isMouseDown = true;\n\n      if (e.pointerType === 'mouse') {\n        runAnimation(e.offsetX, e.offsetY);\n        return;\n      }\n\n      clearTimer();\n      isAnimationPending = true;\n      timer = setTimeout(() => runAnimation(e.offsetX, e.offsetY), 100);\n    };\n\n    const handlePointerUp = () => {\n      if (!isMouseDown) {\n        return;\n      }\n\n      clearTimer();\n\n      if (!isFadeIn) {\n        ripple.style.opacity = '0';\n        isFadeIn = false;\n      }\n\n      isMouseDown = false;\n    };\n\n    const handleTransitionEnd = (e: TransitionEvent) => {\n      if (e.propertyName === 'opacity' && isFadeIn) {\n        if (!isMouseDown) {\n          ripple.style.opacity = '0';\n        }\n\n        isFadeIn = false;\n        return;\n      }\n\n      if (e.propertyName === 'transform' && !isFadeIn) {\n        isTransitionEnd = true;\n      }\n    };\n\n    element.addEventListener('click', handleClick);\n    element.addEventListener('pointerdown', handlePointerDown);\n    element.addEventListener('pointerup', handlePointerUp);\n    element.addEventListener('pointerleave', handlePointerUp);\n    ripple.addEventListener('transitionend', handleTransitionEnd);\n\n    return () => {\n      element.removeEventListener('click', handleClick);\n      element.removeEventListener('pointerdown', handlePointerDown);\n      element.removeEventListener('pointerup', handlePointerUp);\n      element.removeEventListener('pointerleave', handlePointerUp);\n      ripple.removeEventListener('transitionend', handleTransitionEnd);\n    };\n  }, [ref, rippleRef]);\n\n  return useMemo(\n    () => ({\n      ripple: (\n        <div ref={rippleRef} className={s.ripple({ animation: false })} />\n      ),\n    }),\n    [rippleRef],\n  );\n};\n"],
-  "mappings": "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",
-  "names": ["ripple"]
-}

package/dist/chunk-YJLRG5U3.mjs

@@ -1 +0,0 @@
-//# sourceMappingURL=chunk-YJLRG5U3.mjs.map

package/dist/chunk-YJLRG5U3.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/chunk-YLHVM6FZ.mjs

@@ -1,41 +0,0 @@
-import {
-  skeleton
-} from "./chunk-MW2QFW2T.mjs";
-import {
-  clsx
-} from "./chunk-QJVDQ4DQ.mjs";
-import {
-  require_jsx_runtime
-} from "./chunk-3BVACFSH.mjs";
-import {
-  require_react
-} from "./chunk-QB7MZLGH.mjs";
-import {
-  sx
-} from "./chunk-XWN5CKME.mjs";
-import {
-  __toESM
-} from "./chunk-D57E6H3M.mjs";
-
-// src/components/Skeleton/index.tsx
-var import_react = __toESM(require_react(), 1);
-var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
-var Skeleton = (0, import_react.forwardRef)(
-  ({ className, width, height, style, sx: propSx, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "div",
-      {
-        ref,
-        className: clsx(skeleton, className, sx(propSx)),
-        style: { ...style, width, height },
-        ...props
-      }
-    );
-  }
-);
-Skeleton.displayName = "Skeleton";
-
-export {
-  Skeleton
-};
-//# sourceMappingURL=chunk-YLHVM6FZ.mjs.map

package/dist/chunk-YLHVM6FZ.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/Skeleton/index.tsx"],
-  "sourcesContent": ["import { forwardRef, type CSSProperties } from 'react';\n\nimport { clsx } from 'clsx';\n\nimport { sx } from '@/styles';\nimport type { UIComponent } from '@/types';\n\nimport * as s from './Skeleton.css';\n\ninterface SkeletonProps extends UIComponent<'div'> {\n  width?: CSSProperties['width'];\n  height?: CSSProperties['height'];\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ className, width, height, style, sx: propSx, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={clsx(s.skeleton, className, sx(propSx))}\n        style={{ ...style, width, height }}\n        {...props}\n      />\n    );\n  },\n);\nSkeleton.displayName = 'Skeleton';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA,mBAA+C;AAiBzC;AAHC,IAAM,eAAW;AAAA,EACtB,CAAC,EAAE,WAAW,OAAO,QAAQ,OAAO,IAAI,QAAQ,GAAG,MAAM,GAAG,QAAQ;AAClE,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,KAAO,UAAU,WAAW,GAAG,MAAM,CAAC;AAAA,QACjD,OAAO,EAAE,GAAG,OAAO,OAAO,OAAO;AAAA,QAChC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;",
-  "names": []
-}

package/dist/chunk-YPBKY4KY.mjs

@@ -1 +0,0 @@
-//# sourceMappingURL=chunk-YPBKY4KY.mjs.map

package/dist/chunk-YPBKY4KY.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/chunk-YSWSIZRW.mjs

@@ -1 +0,0 @@
-//# sourceMappingURL=chunk-YSWSIZRW.mjs.map

package/dist/chunk-YSWSIZRW.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/chunk-YYDUIOTW.mjs

@@ -1,131 +0,0 @@
-import {
-  recipeWithLayer,
-  styleWithLayer
-} from "./chunk-3DOILUMO.mjs";
-import {
-  theme
-} from "./chunk-MBHPGYUE.mjs";
-import {
-  semanticColor
-} from "./chunk-XOG2JHIV.mjs";
-import {
-  SCALE_COLOR
-} from "./chunk-GAJYOAMV.mjs";
-import {
-  createVar
-} from "./chunk-VSQF5NYH.mjs";
-import {
-  __export
-} from "./chunk-D57E6H3M.mjs";
-
-// src/components/Range/Range.css.ts
-var Range_css_exports = {};
-__export(Range_css_exports, {
-  bar: () => bar,
-  fill: () => fill,
-  range: () => range,
-  thumb: () => thumb
-});
-var backgroundVar = createVar();
-var semanticColors = semanticColor.reduce(
-  (prev, color) => ({
-    ...prev,
-    [color]: styleWithLayer({
-      vars: {
-        [backgroundVar]: theme.color[color]
-      }
-    })
-  }),
-  {}
-);
-var scaleColors = SCALE_COLOR.reduce(
-  (prev, value) => ({
-    ...prev,
-    [value]: styleWithLayer({
-      vars: {
-        [backgroundVar]: theme.color[value][100]
-      }
-    })
-  }),
-  {}
-);
-var range = recipeWithLayer({
-  base: {
-    position: "relative",
-    width: "100%",
-    height: "2em",
-    userSelect: "none"
-  },
-  variants: {
-    color: {
-      ...semanticColors,
-      ...scaleColors
-    },
-    size: {
-      sm: {
-        fontSize: "0.75em"
-      },
-      md: {
-        fontSize: "1em"
-      },
-      lg: {
-        fontSize: "1.25em"
-      }
-    }
-  }
-});
-var thumb = styleWithLayer({
-  display: "inline-block",
-  position: "absolute",
-  top: "50%",
-  width: "1.25em",
-  height: "1.25em",
-  borderRadius: "50%",
-  boxShadow: `0 0 0.375em 0.125em rgba(${backgroundVar}, 0.33)`,
-  backgroundColor: `rgb(${backgroundVar})`,
-  transform: "translate(-50%, -50%)",
-  cursor: "pointer",
-  "::before": {
-    position: "absolute",
-    inset: "-0.75em",
-    content: ""
-  },
-  "::after": {
-    position: "absolute",
-    inset: "0",
-    borderRadius: "50%",
-    boxShadow: `0 0 0.5em 0.125em rgba(${backgroundVar}, 0.5)`,
-    opacity: "0",
-    transition: "opacity 0.2s ease",
-    content: ""
-  },
-  selectors: {
-    "&:hover::after": {
-      opacity: "1"
-    }
-  }
-});
-var fill = styleWithLayer({
-  position: "absolute",
-  top: "0",
-  height: "100%",
-  backgroundColor: `rgb(${backgroundVar})`
-});
-var bar = styleWithLayer({
-  position: "absolute",
-  top: "50%",
-  width: "100%",
-  height: "0.5em",
-  borderRadius: theme.borderRadius,
-  backgroundColor: `rgb(${theme.color.muted})`,
-  transform: "translateY(-50%)"
-});
-
-export {
-  range,
-  thumb,
-  fill,
-  bar,
-  Range_css_exports
-};
-//# sourceMappingURL=chunk-YYDUIOTW.mjs.map

package/dist/chunk-YYDUIOTW.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/Range/Range.css.ts"],
-  "sourcesContent": ["import { createVar } from '@vanilla-extract/css';\n\nimport { recipeWithLayer, styleWithLayer } from '@/styleUtils';\nimport { theme } from '@/themes';\nimport { semanticColor } from '@/tokens';\n\nimport { SCALE_COLOR, type ScaleColor } from '../../tokens/scale/color';\n\nconst backgroundVar = createVar();\n\nconst semanticColors = semanticColor.reduce(\n  (prev, color) => ({\n    ...prev,\n    [color]: styleWithLayer({\n      vars: {\n        [backgroundVar]: theme.color[color],\n      },\n    }),\n  }),\n  {} as Record<(typeof semanticColor)[number], string>,\n);\n\nconst scaleColors = SCALE_COLOR.reduce(\n  (prev, value) => ({\n    ...prev,\n    [value]: styleWithLayer({\n      vars: {\n        [backgroundVar]: theme.color[value][100],\n      },\n    }),\n  }),\n  {} as Record<ScaleColor, string>,\n);\n\nexport const range = recipeWithLayer({\n  base: {\n    position: 'relative',\n\n    width: '100%',\n    height: '2em',\n\n    userSelect: 'none',\n  },\n\n  variants: {\n    color: {\n      ...semanticColors,\n      ...scaleColors,\n    },\n\n    size: {\n      sm: {\n        fontSize: '0.75em',\n      },\n\n      md: {\n        fontSize: '1em',\n      },\n\n      lg: {\n        fontSize: '1.25em',\n      },\n    },\n  },\n});\n\nexport const thumb = styleWithLayer({\n  display: 'inline-block',\n  position: 'absolute',\n  top: '50%',\n\n  width: '1.25em',\n  height: '1.25em',\n\n  borderRadius: '50%',\n\n  boxShadow: `0 0 0.375em 0.125em rgba(${backgroundVar}, 0.33)`,\n  backgroundColor: `rgb(${backgroundVar})`,\n\n  transform: 'translate(-50%, -50%)',\n\n  cursor: 'pointer',\n\n  '::before': {\n    position: 'absolute',\n    inset: '-0.75em',\n\n    content: '',\n  },\n\n  '::after': {\n    position: 'absolute',\n    inset: '0',\n\n    borderRadius: '50%',\n\n    boxShadow: `0 0 0.5em 0.125em rgba(${backgroundVar}, 0.5)`,\n\n    opacity: '0',\n    transition: 'opacity 0.2s ease',\n\n    content: '',\n  },\n\n  selectors: {\n    '&:hover::after': {\n      opacity: '1',\n    },\n  },\n});\n\nexport const fill = styleWithLayer({\n  position: 'absolute',\n  top: '0',\n\n  height: '100%',\n\n  backgroundColor: `rgb(${backgroundVar})`,\n});\n\nexport const bar = styleWithLayer({\n  position: 'absolute',\n  top: '50%',\n\n  width: '100%',\n  height: '0.5em',\n  borderRadius: theme.borderRadius,\n\n  backgroundColor: `rgb(${theme.color.muted})`,\n\n  transform: 'translateY(-50%)',\n});\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,IAAM,gBAAgB,UAAU;AAEhC,IAAM,iBAAiB,cAAc;AAAA,EACnC,CAAC,MAAM,WAAW;AAAA,IAChB,GAAG;AAAA,IACH,CAAC,KAAK,GAAG,eAAe;AAAA,MACtB,MAAM;AAAA,QACJ,CAAC,aAAa,GAAG,MAAM,MAAM,KAAK;AAAA,MACpC;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,CAAC;AACH;AAEA,IAAM,cAAc,YAAY;AAAA,EAC9B,CAAC,MAAM,WAAW;AAAA,IAChB,GAAG;AAAA,IACH,CAAC,KAAK,GAAG,eAAe;AAAA,MACtB,MAAM;AAAA,QACJ,CAAC,aAAa,GAAG,MAAM,MAAM,KAAK,EAAE,GAAG;AAAA,MACzC;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,CAAC;AACH;AAEO,IAAM,QAAQ,gBAAgB;AAAA,EACnC,MAAM;AAAA,IACJ,UAAU;AAAA,IAEV,OAAO;AAAA,IACP,QAAQ;AAAA,IAER,YAAY;AAAA,EACd;AAAA,EAEA,UAAU;AAAA,IACR,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IAEA,MAAM;AAAA,MACJ,IAAI;AAAA,QACF,UAAU;AAAA,MACZ;AAAA,MAEA,IAAI;AAAA,QACF,UAAU;AAAA,MACZ;AAAA,MAEA,IAAI;AAAA,QACF,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAEM,IAAM,QAAQ,eAAe;AAAA,EAClC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,KAAK;AAAA,EAEL,OAAO;AAAA,EACP,QAAQ;AAAA,EAER,cAAc;AAAA,EAEd,WAAW,4BAA4B,aAAa;AAAA,EACpD,iBAAiB,OAAO,aAAa;AAAA,EAErC,WAAW;AAAA,EAEX,QAAQ;AAAA,EAER,YAAY;AAAA,IACV,UAAU;AAAA,IACV,OAAO;AAAA,IAEP,SAAS;AAAA,EACX;AAAA,EAEA,WAAW;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IAEP,cAAc;AAAA,IAEd,WAAW,0BAA0B,aAAa;AAAA,IAElD,SAAS;AAAA,IACT,YAAY;AAAA,IAEZ,SAAS;AAAA,EACX;AAAA,EAEA,WAAW;AAAA,IACT,kBAAkB;AAAA,MAChB,SAAS;AAAA,IACX;AAAA,EACF;AACF,CAAC;AAEM,IAAM,OAAO,eAAe;AAAA,EACjC,UAAU;AAAA,EACV,KAAK;AAAA,EAEL,QAAQ;AAAA,EAER,iBAAiB,OAAO,aAAa;AACvC,CAAC;AAEM,IAAM,MAAM,eAAe;AAAA,EAChC,UAAU;AAAA,EACV,KAAK;AAAA,EAEL,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,cAAc,MAAM;AAAA,EAEpB,iBAAiB,OAAO,MAAM,MAAM,KAAK;AAAA,EAEzC,WAAW;AACb,CAAC;",
-  "names": []
-}

package/dist/chunk-ZDD3I6QG.mjs

@@ -1,13 +0,0 @@
-// ../../node_modules/.pnpm/@vanilla-extract+css@1.17.4_babel-plugin-macros@3.1.0/node_modules/@vanilla-extract/css/functionSerializer/dist/vanilla-extract-css-functionSerializer.esm.js
-function addFunctionSerializer(target, recipe) {
-  Object.defineProperty(target, "__recipe__", {
-    value: recipe,
-    writable: false
-  });
-  return target;
-}
-
-export {
-  addFunctionSerializer
-};
-//# sourceMappingURL=chunk-ZDD3I6QG.mjs.map

package/dist/chunk-ZDD3I6QG.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../node_modules/.pnpm/@vanilla-extract+css@1.17.4_babel-plugin-macros@3.1.0/node_modules/@vanilla-extract/css/functionSerializer/dist/vanilla-extract-css-functionSerializer.esm.js"],
-  "sourcesContent": ["function addFunctionSerializer(target, recipe) {\n  // TODO: Update to \"__function_serializer__\" in future.\n  // __recipe__ is the backwards compatible name\n  Object.defineProperty(target, '__recipe__', {\n    value: recipe,\n    writable: false\n  });\n  return target;\n}\n\nexport { addFunctionSerializer };\n"],
-  "mappings": ";AAAA,SAAS,sBAAsB,QAAQ,QAAQ;AAG7C,SAAO,eAAe,QAAQ,cAAc;AAAA,IAC1C,OAAO;AAAA,IACP,UAAU;AAAA,EACZ,CAAC;AACD,SAAO;AACT;",
-  "names": []
-}

package/dist/chunk-ZP5V7DTU.mjs

@@ -1,41 +0,0 @@
-import {
-  striped,
-  table
-} from "./chunk-AQ2YSKXF.mjs";
-import {
-  clsx_default
-} from "./chunk-QJVDQ4DQ.mjs";
-import {
-  require_jsx_runtime
-} from "./chunk-3BVACFSH.mjs";
-import {
-  require_react
-} from "./chunk-QB7MZLGH.mjs";
-import {
-  sx
-} from "./chunk-XWN5CKME.mjs";
-import {
-  __toESM
-} from "./chunk-D57E6H3M.mjs";
-
-// src/components/Table/Table.tsx
-var import_react = __toESM(require_react(), 1);
-var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
-var Table = (0, import_react.forwardRef)(
-  ({ isStriped, className, sx: propSx, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "table",
-      {
-        ref,
-        className: clsx_default(table, isStriped && striped, sx(propSx), className),
-        ...props
-      }
-    );
-  }
-);
-Table.displayName = "Table";
-
-export {
-  Table
-};
-//# sourceMappingURL=chunk-ZP5V7DTU.mjs.map

package/dist/chunk-ZP5V7DTU.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/Table/Table.tsx"],
-  "sourcesContent": ["import { forwardRef } from 'react';\n\nimport clsx from 'clsx';\n\nimport { sx } from '@/styles';\nimport type { UIComponent } from '@/types';\n\nimport * as s from './Table.css';\n\ninterface TableProps extends UIComponent<'table'> {\n  isStriped?: boolean;\n}\n\nexport const Table = forwardRef<HTMLTableElement, TableProps>(\n  ({ isStriped, className, sx: propSx, ...props }, ref) => {\n    return (\n      <table\n        ref={ref}\n        className={clsx(s.table, isStriped && s.striped, sx(propSx), className)}\n        {...props}\n      />\n    );\n  },\n);\nTable.displayName = 'Table';\n\nexport { s as tableCss };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA,mBAA2B;AAgBrB;AAHC,IAAM,YAAQ;AAAA,EACnB,CAAC,EAAE,WAAW,WAAW,IAAI,QAAQ,GAAG,MAAM,GAAG,QAAQ;AACvD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,aAAO,OAAO,aAAe,SAAS,GAAG,MAAM,GAAG,SAAS;AAAA,QACrE,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;",
-  "names": []
-}

package/dist/chunk-ZPQFOD2J.mjs

@@ -1,42 +0,0 @@
-import {
-  narrow
-} from "./chunk-SMSD7KQC.mjs";
-import {
-  styleWithLayer
-} from "./chunk-3DOILUMO.mjs";
-import {
-  theme
-} from "./chunk-MBHPGYUE.mjs";
-import {
-  spacing
-} from "./chunk-7NZKF7UQ.mjs";
-import {
-  __export
-} from "./chunk-D57E6H3M.mjs";
-
-// src/components/Navigation/NavigationMenu.css.ts
-var NavigationMenu_css_exports = {};
-__export(NavigationMenu_css_exports, {
-  navigationMenu: () => navigationMenu
-});
-var navigationMenu = styleWithLayer({
-  display: "flex",
-  alignItems: "center",
-  gap: "0.5em",
-  selectors: {
-    [`${narrow} &`]: {
-      flexDirection: "column",
-      alignItems: "stretch",
-      gap: "0",
-      width: "100%",
-      borderTop: `1px solid rgb(${theme.color["border.weak"]})`,
-      paddingTop: spacing["md"]
-    }
-  }
-});
-
-export {
-  navigationMenu,
-  NavigationMenu_css_exports
-};
-//# sourceMappingURL=chunk-ZPQFOD2J.mjs.map

package/dist/chunk-ZPQFOD2J.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/Navigation/NavigationMenu.css.ts"],
-  "sourcesContent": ["import { styleWithLayer } from '@/styleUtils';\nimport { theme } from '@/themes';\nimport { spacing } from '@/tokens';\n\nimport { narrow } from './NavigationDrawer.css';\n\nexport const navigationMenu = styleWithLayer({\n  display: 'flex',\n  alignItems: 'center',\n  gap: '0.5em',\n\n  selectors: {\n    [`${narrow} &`]: {\n      flexDirection: 'column',\n      alignItems: 'stretch',\n      gap: '0',\n\n      width: '100%',\n      borderTop: `1px solid rgb(${theme.color['border.weak']})`,\n      paddingTop: spacing['md'],\n    },\n  },\n});\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAMO,IAAM,iBAAiB,eAAe;AAAA,EAC3C,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAK;AAAA,EAEL,WAAW;AAAA,IACT,CAAC,GAAG,MAAM,IAAI,GAAG;AAAA,MACf,eAAe;AAAA,MACf,YAAY;AAAA,MACZ,KAAK;AAAA,MAEL,OAAO;AAAA,MACP,WAAW,iBAAiB,MAAM,MAAM,aAAa,CAAC;AAAA,MACtD,YAAY,QAAQ,IAAI;AAAA,IAC1B;AAAA,EACF;AACF,CAAC;",
-  "names": []
-}

package/dist/components/Accordion/Accordion.css.mjs

@@ -1,27 +0,0 @@
-import {
-  accordion,
-  paddingVar
-} from "../../chunk-WVWYRS4M.mjs";
-import "../../chunk-3DOILUMO.mjs";
-import "../../chunk-KBQACKDM.mjs";
-import "../../chunk-XWN5CKME.mjs";
-import "../../chunk-MRRMOBIN.mjs";
-import "../../chunk-P7O6MVCQ.mjs";
-import "../../chunk-ZDD3I6QG.mjs";
-import "../../chunk-HRD45GAF.mjs";
-import "../../chunk-BT3VUZN5.mjs";
-import "../../chunk-5KF5EDYA.mjs";
-import "../../chunk-MBHPGYUE.mjs";
-import "../../chunk-RC3PXB5N.mjs";
-import "../../chunk-AVNNHE4D.mjs";
-import "../../chunk-XOG2JHIV.mjs";
-import "../../chunk-7NZKF7UQ.mjs";
-import "../../chunk-P64V75GF.mjs";
-import "../../chunk-GAJYOAMV.mjs";
-import "../../chunk-VSQF5NYH.mjs";
-import "../../chunk-D57E6H3M.mjs";
-export {
-  accordion,
-  paddingVar
-};
-//# sourceMappingURL=Accordion.css.mjs.map

package/dist/components/Accordion/Accordion.css.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/components/Accordion/Accordion.mjs

@@ -1,31 +0,0 @@
-"use client";
-import {
-  Accordion
-} from "../../chunk-5BGMNH5Y.mjs";
-import "../../chunk-QJVDQ4DQ.mjs";
-import "../../chunk-3BVACFSH.mjs";
-import "../../chunk-4HE7QAS2.mjs";
-import "../../chunk-QB7MZLGH.mjs";
-import "../../chunk-WVWYRS4M.mjs";
-import "../../chunk-3DOILUMO.mjs";
-import "../../chunk-KBQACKDM.mjs";
-import "../../chunk-XWN5CKME.mjs";
-import "../../chunk-MRRMOBIN.mjs";
-import "../../chunk-P7O6MVCQ.mjs";
-import "../../chunk-ZDD3I6QG.mjs";
-import "../../chunk-HRD45GAF.mjs";
-import "../../chunk-BT3VUZN5.mjs";
-import "../../chunk-5KF5EDYA.mjs";
-import "../../chunk-MBHPGYUE.mjs";
-import "../../chunk-RC3PXB5N.mjs";
-import "../../chunk-AVNNHE4D.mjs";
-import "../../chunk-XOG2JHIV.mjs";
-import "../../chunk-7NZKF7UQ.mjs";
-import "../../chunk-P64V75GF.mjs";
-import "../../chunk-GAJYOAMV.mjs";
-import "../../chunk-VSQF5NYH.mjs";
-import "../../chunk-D57E6H3M.mjs";
-export {
-  Accordion
-};
-//# sourceMappingURL=Accordion.mjs.map

package/dist/components/Accordion/Accordion.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}

package/dist/components/Accordion/Accordion.spec.mjs

@@ -1,42 +0,0 @@
-import {
-  uiTest
-} from "../../chunk-XTY6JSSK.mjs";
-import "../../chunk-KFFUBVOO.mjs";
-import "../../chunk-6R4BEU23.mjs";
-import {
-  Accordion
-} from "../../chunk-5BGMNH5Y.mjs";
-import "../../chunk-QJVDQ4DQ.mjs";
-import "../../chunk-EUM3RGEU.mjs";
-import "../../chunk-BNMVSGHE.mjs";
-import "../../chunk-PCCDR4JX.mjs";
-import "../../chunk-SO4CXB6J.mjs";
-import "../../chunk-3BVACFSH.mjs";
-import "../../chunk-4HE7QAS2.mjs";
-import "../../chunk-QB7MZLGH.mjs";
-import "../../chunk-BKCR5453.mjs";
-import "../../chunk-WVWYRS4M.mjs";
-import "../../chunk-3DOILUMO.mjs";
-import "../../chunk-KBQACKDM.mjs";
-import "../../chunk-XWN5CKME.mjs";
-import "../../chunk-MRRMOBIN.mjs";
-import "../../chunk-P7O6MVCQ.mjs";
-import "../../chunk-ZDD3I6QG.mjs";
-import "../../chunk-HRD45GAF.mjs";
-import "../../chunk-BT3VUZN5.mjs";
-import "../../chunk-5KF5EDYA.mjs";
-import "../../chunk-MBHPGYUE.mjs";
-import "../../chunk-RC3PXB5N.mjs";
-import "../../chunk-AVNNHE4D.mjs";
-import "../../chunk-XOG2JHIV.mjs";
-import "../../chunk-7NZKF7UQ.mjs";
-import "../../chunk-P64V75GF.mjs";
-import "../../chunk-GAJYOAMV.mjs";
-import "../../chunk-VSQF5NYH.mjs";
-import "../../chunk-D57E6H3M.mjs";
-
-// src/components/Accordion/Accordion.spec.tsx
-describe("Accordion \uCEF4\uD3EC\uB10C\uD2B8", () => {
-  uiTest(Accordion, "Accordion");
-});
-//# sourceMappingURL=Accordion.spec.mjs.map

package/dist/components/Accordion/Accordion.spec.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/components/Accordion/Accordion.spec.tsx"],
-  "sourcesContent": ["import { Accordion } from '.';\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('Accordion \uCEF4\uD3EC\uB10C\uD2B8', () => {\n  uiTest(Accordion, 'Accordion');\n});\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,SAAS,sCAAkB,MAAM;AAC/B,SAAO,WAAW,WAAW;AAC/B,CAAC;",
-  "names": []
-}