@mintlify/components 0.4.17 → 1.0.1

package/dist/components/code-group/code-select-dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-select-dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/code-group/code-select-dropdown.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AASjE,KAAK,uBAAuB,GAAG;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,kBAAkB,GAAI,iEAKzB,uBAAuB,4CAwDzB,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/components/code-group/code-snippet.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { CodeStyling } from '../../utils/shiki/code-styling';
+type CodeSnippetProps = {
+    language?: string;
+    /**
+     * If `children` is a `string`, `Shiki` will be emitted
+     */
+    children?: ReactNode;
+    codeBlockThemeObject?: CodeStyling;
+};
+declare const CodeSnippet: import('react').MemoExoticComponent<({ language, children, codeBlockThemeObject }: CodeSnippetProps) => import("react/jsx-runtime").JSX.Element>;
+export { CodeSnippet, type CodeSnippetProps };
+//# sourceMappingURL=code-snippet.d.ts.map

package/dist/components/code-group/code-snippet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-snippet.d.ts","sourceRoot":"","sources":["../../../src/components/code-group/code-snippet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAG9D,KAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oBAAoB,CAAC,EAAE,WAAW,CAAC;CACpC,CAAC;AAEF,QAAA,MAAM,WAAW,qFACgC,gBAAgB,6CA4BhE,CAAC;AAEF,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAC"}

package/dist/components/code-group/dropdown.d.ts

@@ -0,0 +1,34 @@
+import { Menu } from '@base-ui/react/menu';
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+type DropdownMenuProps = {
+    children: ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+};
+declare const DropdownMenu: {
+    ({ children, open, onOpenChange }: DropdownMenuProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type DropdownMenuTriggerProps = ComponentPropsWithoutRef<typeof Menu.Trigger>;
+declare const DropdownMenuTrigger: {
+    ({ className, children, ...props }: DropdownMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type DropdownMenuContentProps = ComponentPropsWithoutRef<typeof Menu.Popup> & {
+    sideOffset?: number;
+    align?: "start" | "center" | "end";
+};
+declare const DropdownMenuContent: {
+    ({ className, sideOffset, align, ...props }: DropdownMenuContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type DropdownMenuItemProps = ComponentPropsWithoutRef<typeof Menu.Item> & {
+    isSelected?: boolean;
+    onSelect?: () => void;
+};
+declare const DropdownMenuItem: {
+    ({ className, isSelected, children, onSelect, onClick, ...props }: DropdownMenuItemProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, };
+//# sourceMappingURL=dropdown.d.ts.map

package/dist/components/code-group/dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/code-group/dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAE3C,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjE,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF,QAAA,MAAM,YAAY;uCAAsC,iBAAiB;;CAIxE,CAAC;AAGF,KAAK,wBAAwB,GAAG,wBAAwB,CAAC,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC;AAE9E,QAAA,MAAM,mBAAmB;wCAItB,wBAAwB;;CAW1B,CAAC;AAGF,KAAK,wBAAwB,GAAG,wBAAwB,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG;IAC5E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;CACpC,CAAC;AAEF,QAAA,MAAM,mBAAmB;iDAKtB,wBAAwB;;CAmB1B,CAAC;AAGF,KAAK,qBAAqB,GAAG,wBAAwB,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG;IACxE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,QAAA,MAAM,gBAAgB;uEAOnB,qBAAqB;;CAwBvB,CAAC;AAGF,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,gBAAgB,EAChB,mBAAmB,GACpB,CAAC"}

package/dist/components/code-group/dropdown.js

@@ -0,0 +1,96 @@
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
+import { cn as a } from "../../utils/cn.js";
+import p from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/check.js";
+import { MenuRoot as u } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@18.3.27_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/esm/menu/root/MenuRoot.js";
+import { MenuTrigger as l } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@18.3.27_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/esm/menu/trigger/MenuTrigger.js";
+import { MenuPortal as h } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@18.3.27_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/esm/menu/portal/MenuPortal.js";
+import { MenuPositioner as g } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@18.3.27_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/esm/menu/positioner/MenuPositioner.js";
+import { MenuPopup as x } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@18.3.27_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/esm/menu/popup/MenuPopup.js";
+import { MenuItem as w } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@18.3.27_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/esm/menu/item/MenuItem.js";
+const f = ({ children: t, open: e, onOpenChange: o }) => /* @__PURE__ */ r(u, { onOpenChange: o, open: e, children: t });
+f.displayName = "DropdownMenu";
+const c = ({
+  className: t,
+  children: e,
+  ...o
+}) => /* @__PURE__ */ r(
+  l,
+  {
+    className: a(
+      "group group overflow-hidden rounded-lg disabled:pointer-events-none [&>span]:line-clamp-1",
+      "flex items-center gap-1 py-0.5 text-sm text-stone-950/50 group-hover:text-stone-950/70 dark:text-white/50 dark:group-hover:text-white/70",
+      t
+    ),
+    ...o,
+    children: e
+  }
+);
+c.displayName = "DropdownMenuTrigger";
+const y = ({
+  className: t,
+  sideOffset: e = 4,
+  align: o = "start",
+  ...n
+}) => /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r(
+  g,
+  {
+    align: o,
+    className: "z-50",
+    collisionPadding: 16,
+    sideOffset: e,
+    children: /* @__PURE__ */ r(
+      x,
+      {
+        className: a(
+          "relative max-h-96 min-w-[var(--anchor-width)] overflow-y-auto rounded-2xl border-standard bg-white p-1 text-stone-950/70 shadow-stone-500/5 shadow-xl dark:bg-stone-950 dark:text-white/70 dark:shadow-none dark:shadow-stone-500/5",
+          "data-[ending-style]:fade-out-0 data-[starting-style]:fade-in-0 data-[ending-style]:zoom-out-95 data-[starting-style]:zoom-in-95",
+          t
+        ),
+        style: { textRendering: "geometricPrecision" },
+        ...n
+      }
+    )
+  }
+) });
+y.displayName = "DropdownMenuContent";
+const M = ({
+  className: t,
+  isSelected: e,
+  children: o,
+  onSelect: n,
+  onClick: d,
+  ...s
+}) => /* @__PURE__ */ m(
+  w,
+  {
+    className: a(
+      "group relative flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-2 py-1 text-sm outline-0 hover:bg-stone-950/[0.03] focus:bg-stone-950/5 data-[disabled]:pointer-events-none data-[disabled]:cursor-default data-[disabled]:opacity-50 dark:focus:bg-white/5 dark:hover:bg-white/[0.03]",
+      e ? "font-medium text-primary dark:text-primary-light" : "text-stone-950/50 hover:text-stone-950/75 focus:text-stone-950/75 dark:text-white/50 dark:focus:text-white/75 dark:hover:text-white/75",
+      t
+    ),
+    onClick: (i) => {
+      d == null || d(i), n == null || n();
+    },
+    ...s,
+    children: [
+      o,
+      /* @__PURE__ */ r(
+        p,
+        {
+          className: a(
+            "size-3.5 shrink-0 text-primary dark:text-primary-light",
+            !e && "opacity-0"
+          ),
+          strokeWidth: 2.5
+        }
+      )
+    ]
+  }
+);
+M.displayName = "DropdownMenuItem";
+export {
+  f as DropdownMenu,
+  y as DropdownMenuContent,
+  M as DropdownMenuItem,
+  c as DropdownMenuTrigger
+};

package/dist/components/code-group/index.d.ts

@@ -0,0 +1,3 @@
+export type { CodeGroupProps } from './code-group';
+export { CodeGroup } from './code-group';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/code-group/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/code-group/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/code-group/language-dropdown.d.ts

@@ -0,0 +1,10 @@
+import { CodeBlockTheme } from '../../utils/shiki/code-styling';
+type LanguageDropdownProps = {
+    selectedLanguage: string;
+    setSelectedLanguage: (language: string, index: number) => void;
+    languages: string[];
+    codeBlockTheme?: CodeBlockTheme;
+};
+declare const LanguageDropdown: ({ selectedLanguage, setSelectedLanguage, languages, codeBlockTheme, }: LanguageDropdownProps) => import("react/jsx-runtime").JSX.Element;
+export { LanguageDropdown };
+//# sourceMappingURL=language-dropdown.d.ts.map

package/dist/components/code-group/language-dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/code-group/language-dropdown.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAWjE,KAAK,qBAAqB,GAAG;IAC3B,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/D,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,gBAAgB,GAAI,uEAKvB,qBAAqB,4CAiFvB,CAAC;AAEF,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/components/code-group/language-dropdown.js

@@ -0,0 +1,83 @@
+import { jsxs as o, jsx as i } from "react/jsx-runtime";
+import { useState as b } from "react";
+import { cn as p } from "../../utils/cn.js";
+import { getDisplayName as d } from "../../utils/shiki/snippet-presets.js";
+import { DropdownMenu as l, DropdownMenuTrigger as v, DropdownMenuContent as w, DropdownMenuItem as g } from "./dropdown.js";
+import { LanguageIcon as x } from "./language-icon.js";
+import k from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevrons-up-down.js";
+const S = ({
+  selectedLanguage: e,
+  setSelectedLanguage: h,
+  languages: m,
+  codeBlockTheme: r = "system"
+}) => {
+  const s = m.length > 1, [n, y] = b(!1);
+  return /* @__PURE__ */ o(l, { onOpenChange: y, open: n, children: [
+    /* @__PURE__ */ i(
+      v,
+      {
+        className: "cursor-default select-none bg-transparent pb-1 font-medium text-xs dark:bg-transparent",
+        disabled: !s,
+        children: /* @__PURE__ */ o(
+          "div",
+          {
+            className: p(
+              "flex items-center gap-1 rounded-[10px] border py-[5px] pr-1.5 pl-2.5 text-stone-500 dark:text-stone-400",
+              s ? "cursor-pointer" : "cursor-default",
+              s && r === "system" && "hover:bg-stone-200/50 hover:text-primary dark:hover:bg-stone-700/70 dark:hover:text-primary-light",
+              s && r === "dark" && "hover:bg-stone-700/70 hover:text-primary-light",
+              n && "border-stone-600/50 ring-1 dark:border-stone-400/50 dark:ring-stone-800/50",
+              n && r === "system" && "ring-stone-200/70",
+              n && r === "dark" && "ring-stone-800/50",
+              !n && "border-transparent"
+            ),
+            children: [
+              /* @__PURE__ */ i(x, { language: e }),
+              /* @__PURE__ */ i("p", { className: "truncate font-medium", children: d(e) }),
+              s && /* @__PURE__ */ i(k, { className: "size-3.5 shrink-0" })
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ i(
+      w,
+      {
+        align: "end",
+        className: p(
+          "min-w-[170px] overflow-y-auto border p-1",
+          r === "system" && "border-stone-200/70 bg-white dark:border-white/10 dark:bg-[#0F1117]",
+          r === "dark" && "border-white/10 bg-[#0F1117]"
+        ),
+        sideOffset: 0,
+        children: m.map((t, a) => {
+          const f = t === e;
+          return /* @__PURE__ */ o(
+            g,
+            {
+              className: p(
+                "flex items-center gap-1.5 py-1.5 text-xs",
+                r === "system" && "hover:bg-primary/10 hover:text-primary dark:hover:bg-primary-light/10 dark:hover:text-primary-light",
+                r === "dark" && "text-primary-light hover:bg-primary-light/10 hover:text-primary-light dark:text-primary-light",
+                t === e && r === "system" && "font-medium text-primary dark:text-primary-light",
+                t === e && r === "dark" && "font-medium text-primary-light dark:text-primary-light",
+                t !== e && r === "system" && "text-stone-500 dark:text-white/50",
+                t !== e && r === "dark" && "text-white/50"
+              ),
+              isSelected: f,
+              onSelect: () => h(t, a),
+              children: [
+                /* @__PURE__ */ i(x, { language: t }),
+                /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center font-medium", children: d(t) })
+              ]
+            },
+            `Language${a}${t}`
+          );
+        })
+      }
+    )
+  ] });
+};
+export {
+  S as LanguageDropdown
+};

package/dist/components/code-group/language-icon.d.ts

@@ -0,0 +1,7 @@
+type LanguageIconProps = {
+    language: string;
+    className?: string;
+};
+declare const LanguageIcon: ({ language, className }: LanguageIconProps) => import("react/jsx-runtime").JSX.Element | null;
+export { LanguageIcon };
+//# sourceMappingURL=language-icon.d.ts.map

package/dist/components/code-group/language-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-icon.d.ts","sourceRoot":"","sources":["../../../src/components/code-group/language-icon.tsx"],"names":[],"mappings":"AAGA,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,mDAsB/D,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/code-group/language-icon.js

@@ -0,0 +1,25 @@
+import { jsx as t } from "react/jsx-runtime";
+import { cn as a } from "../../utils/cn.js";
+import { getLanguageIconUrl as n } from "../../utils/icon-utils.js";
+const k = ({ language: r, className: o }) => {
+  const e = n(r);
+  return e ? /* @__PURE__ */ t(
+    "svg",
+    {
+      className: a("size-3.5 shrink-0", o),
+      style: {
+        WebkitMaskImage: `url(${e})`,
+        WebkitMaskRepeat: "no-repeat",
+        WebkitMaskPosition: "center",
+        maskImage: `url(${e})`,
+        maskRepeat: "no-repeat",
+        maskPosition: "center",
+        maskSize: "100%",
+        backgroundColor: "currentColor"
+      }
+    }
+  ) : null;
+};
+export {
+  k as LanguageIcon
+};

package/dist/components/color/color.d.ts

@@ -0,0 +1,28 @@
+import { default as React } from 'react';
+import { ColorVariant } from './constants';
+type ColorProps = {
+    children: React.ReactNode;
+    variant: ColorVariant;
+    className?: string;
+};
+declare const Color: {
+    ({ children, variant, className }: ColorProps): import("react/jsx-runtime").JSX.Element;
+    Row: ({ children, title }: ColorRowProps) => import("react/jsx-runtime").JSX.Element;
+    Item: ({ name, value }: ColorItemProps) => import("react/jsx-runtime").JSX.Element;
+};
+type ColorRowProps = {
+    children: React.ReactNode;
+    title?: string;
+};
+/** @deprecated Use a single string value instead */
+type ColorItemValueLegacy = {
+    light: string;
+    dark: string;
+};
+type ColorItemProps = {
+    value: string | ColorItemValueLegacy;
+    name?: string;
+};
+export { Color };
+export type { ColorItemProps, ColorProps, ColorRowProps };
+//# sourceMappingURL=color.d.ts.map

package/dist/components/color/color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../../src/components/color/color.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,KAAK,UAAU,GAAG;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAIF,QAAA,MAAM,KAAK;uCAAsC,UAAU;+BAwBpB,aAAa;4BAwChB,cAAc;CA/CjD,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAkCF,oDAAoD;AACpD,KAAK,oBAAoB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAE5D,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,GAAG,oBAAoB,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AA8GF,OAAO,EAAE,KAAK,EAAE,CAAC;AACjB,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/color/color.js

@@ -0,0 +1,129 @@
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+import { createContext as C, useState as w, useRef as g, useContext as b, useEffect as k } from "react";
+import { Classes as i } from "../../constants/selectors.js";
+import { useIsDarkTheme as y } from "../../hooks/use-is-dark-theme.js";
+import { CheckIcon as N } from "../../icons/index.js";
+import { cn as l } from "../../utils/cn.js";
+import { copyToClipboard as _ } from "../../utils/copy-to-clipboard.js";
+import { Tooltip as v } from "../tooltip/tooltip.js";
+const d = C("compact"), u = ({ children: o, variant: t, className: c }) => /* @__PURE__ */ e(d.Provider, { value: t, children: /* @__PURE__ */ e(
+  "div",
+  {
+    className: l(
+      i.Color,
+      "group flex py-6",
+      t === "table" && "flex-col gap-6",
+      t === "compact" && "flex-row flex-wrap gap-x-2 gap-y-4",
+      c
+    ),
+    "data-variant": t,
+    children: o
+  }
+) }), T = ({ children: o, title: t }) => /* @__PURE__ */ s(
+  "div",
+  {
+    className: l(
+      i.ColorRow,
+      "flex flex-col gap-2 md:flex-row md:items-center"
+    ),
+    children: [
+      !!t && /* @__PURE__ */ e(
+        "div",
+        {
+          className: "w-full shrink-0 md:w-[120px]",
+          "data-component-part": "color-row-title-container",
+          children: /* @__PURE__ */ e(
+            "p",
+            {
+              className: "m-0 truncate font-medium text-sm text-stone-900 tracking-[-0.1px] dark:text-stone-200",
+              "data-component-part": "color-row-title",
+              title: t,
+              children: t
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e(
+        "div",
+        {
+          className: "flex w-full gap-1 md:gap-2",
+          "data-component-part": "color-row-items-container",
+          children: o
+        }
+      )
+    ]
+  }
+), I = ({ name: o, value: t }) => {
+  const [c, m] = w("idle"), n = g(null), { isDarkTheme: x } = y(), r = b(d);
+  k(() => () => {
+    n.current && clearTimeout(n.current);
+  }, []);
+  const a = typeof t == "string" ? t : t[x ? "dark" : "light"], f = async () => {
+    await _(a) !== "error" && (m("copied"), n.current && clearTimeout(n.current), n.current = setTimeout(() => m("idle"), 2e3));
+  }, p = /* @__PURE__ */ e(
+    "button",
+    {
+      "aria-label": o || `Color ${a}`,
+      "aria-pressed": c === "copied",
+      "aria-roledescription": c === "copied" ? "Copied" : "Copy",
+      className: l(
+        "relative flex cursor-copy items-center justify-center rounded-lg border border-stone-200 dark:border-stone-800",
+        r === "compact" && "aspect-square max-h-[104px]",
+        r === "table" && "aspect-square w-full md:h-10"
+      ),
+      "data-component-part": "color-item-button",
+      onClick: f,
+      style: { backgroundColor: a },
+      type: "button",
+      children: /* @__PURE__ */ e(
+        N,
+        {
+          "aria-hidden": !0,
+          className: l(
+            "pointer-events-none absolute inset-0 m-auto opacity-0 transition-opacity duration-100",
+            "filter-[drop-shadow(0_0_2px_rgb(0_0_0/0.1))_drop-shadow(0_0_4px_rgb(0_0_0/0.1))] text-white dark:text-white",
+            c === "copied" && "opacity-100"
+          )
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: l(
+        i.ColorItem,
+        r === "compact" && "flex shrink-0 flex-col gap-2",
+        r === "table" && "w-full max-w-[50px] md:max-w-[60px]"
+      ),
+      children: [
+        r === "table" ? /* @__PURE__ */ e(v, { title: a, children: p }) : p,
+        r === "compact" && /* @__PURE__ */ s("div", { className: "flex w-[104px] min-w-0 flex-col gap-0.5", children: [
+          o && /* @__PURE__ */ e(
+            "p",
+            {
+              className: "m-0 truncate text-center font-medium text-sm text-stone-900 dark:text-stone-200",
+              "data-component-part": "color-item-name",
+              title: o,
+              children: o
+            }
+          ),
+          /* @__PURE__ */ e(
+            "p",
+            {
+              className: "m-0 truncate text-center font-mono text-stone-600 text-xs dark:text-stone-400",
+              "data-component-part": "color-item-value",
+              title: a,
+              children: a
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+u.Row = T;
+u.Item = I;
+export {
+  u as Color
+};

package/dist/components/color/constants.d.ts

@@ -0,0 +1,5 @@
+declare const COLOR_VARIANTS: readonly ["compact", "table"];
+type ColorVariant = (typeof COLOR_VARIANTS)[number];
+export { COLOR_VARIANTS };
+export type { ColorVariant };
+//# sourceMappingURL=constants.d.ts.map

package/dist/components/color/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/color/constants.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,cAAc,+BAAgC,CAAC;AACrD,KAAK,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAEpD,OAAO,EAAE,cAAc,EAAE,CAAC;AAC1B,YAAY,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/color/index.d.ts

@@ -0,0 +1,4 @@
+export type { ColorItemProps, ColorProps, ColorRowProps } from './color';
+export { Color } from './color';
+export type { ColorVariant } from './constants';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/color/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/color/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/columns/columns.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+import { ColCount } from './constants';
+type ColumnsProps = {
+    children: React.ReactNode;
+    cols?: ColCount | `${ColCount}`;
+    className?: string;
+};
+declare const Columns: ({ children, className, cols }: ColumnsProps) => import("react/jsx-runtime").JSX.Element;
+export { Columns };
+export type { ColumnsProps };
+//# sourceMappingURL=columns.d.ts.map

package/dist/components/columns/columns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"columns.d.ts","sourceRoot":"","sources":["../../../src/components/columns/columns.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C,KAAK,YAAY,GAAG;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,GAAG,QAAQ,EAAE,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,OAAO,GAAI,+BAAmC,YAAY,4CAgB/D,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,CAAC;AACnB,YAAY,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/columns/columns.js

@@ -0,0 +1,21 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Classes as e } from "../../constants/selectors.js";
+import { cn as i } from "../../utils/cn.js";
+const u = ({ children: m, className: s, cols: r = 2 }) => /* @__PURE__ */ o(
+  "div",
+  {
+    className: i(
+      e.Columns,
+      "prose dark:prose-invert grid gap-4",
+      Number(r) === 1 && "sm:grid-cols-1",
+      Number(r) === 2 && "sm:grid-cols-2",
+      Number(r) === 3 && "sm:grid-cols-3",
+      Number(r) === 4 && "sm:grid-cols-4",
+      s
+    ),
+    children: m
+  }
+);
+export {
+  u as Columns
+};

package/dist/components/columns/constants.d.ts

@@ -0,0 +1,5 @@
+declare const COL_OPTIONS: readonly [1, 2, 3, 4];
+type ColCount = (typeof COL_OPTIONS)[number];
+export { COL_OPTIONS };
+export type { ColCount };
+//# sourceMappingURL=constants.d.ts.map

package/dist/components/columns/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/columns/constants.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,WAAW,uBAAwB,CAAC;AAC1C,KAAK,QAAQ,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,CAAC;AACvB,YAAY,EAAE,QAAQ,EAAE,CAAC"}

package/dist/components/columns/index.d.ts

@@ -0,0 +1,3 @@
+export type { ColumnsProps } from './columns';
+export { Columns } from './columns';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/columns/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/columns/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}

package/dist/components/expandable/expandable.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode, RefObject } from 'react';
+type ExpandableProps = {
+    title?: string;
+    defaultOpen?: boolean;
+    onChange?: (open: boolean) => void;
+    lazy?: boolean;
+    className?: string;
+    children?: ReactNode;
+    uniqueParamId?: string;
+    onMount?: () => void;
+    onOpen?: () => void;
+    onClose?: () => void;
+    openedText?: string;
+    closedText?: string;
+    hasScrolledToAnchorRef?: RefObject<boolean>;
+    anchor?: string;
+};
+declare const Expandable: ({ title, defaultOpen, onChange: onChangeProp, lazy, className, children, uniqueParamId, onMount, onOpen, onClose, openedText, closedText, hasScrolledToAnchorRef, anchor, }: ExpandableProps) => import("react/jsx-runtime").JSX.Element;
+export { Expandable };
+export type { ExpandableProps };
+//# sourceMappingURL=expandable.d.ts.map

package/dist/components/expandable/expandable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"expandable.d.ts","sourceRoot":"","sources":["../../../src/components/expandable/expandable.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAWf,KAAK,eAAe,GAAG;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sBAAsB,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,QAAA,MAAM,UAAU,GAAI,6KAejB,eAAe,4CA8HjB,CAAC;AAEF,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,YAAY,EAAE,eAAe,EAAE,CAAC"}