@mintlify/components 1.0.0 → 1.0.2

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

@@ -0,0 +1,10 @@
+import { CodeBlockTheme } from '../../utils/shiki/code-styling';
+type CodeSelectDropdownProps = {
+    selectedOption?: string;
+    setSelectedOption: (option: string) => void;
+    options: string[];
+    codeBlockTheme?: CodeBlockTheme;
+};
+declare const CodeSelectDropdown: ({ selectedOption, setSelectedOption, options, codeBlockTheme, }: CodeSelectDropdownProps) => import("react/jsx-runtime").JSX.Element;
+export { CodeSelectDropdown };
+//# sourceMappingURL=code-select-dropdown.d.ts.map

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

@@ -1,83 +1,83 @@
-import { jsx as o, jsxs as m } from "react/jsx-runtime";
-import { cn as d } from "../../utils/cn.js";
+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 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/root/MenuRoot.js";
-import { MenuTrigger 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/trigger/MenuTrigger.js";
-import { MenuPortal 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/portal/MenuPortal.js";
-import { MenuPositioner 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/positioner/MenuPositioner.js";
-import { MenuPopup as y } 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 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/item/MenuItem.js";
-const w = ({ children: t, open: e, onOpenChange: r }) => /* @__PURE__ */ o(g, { onOpenChange: r, open: e, children: t });
-w.displayName = "DropdownMenu";
-const f = ({
+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,
-  ...r
-}) => /* @__PURE__ */ o(
-  u,
+  ...o
+}) => /* @__PURE__ */ r(
+  l,
   {
-    className: d(
+    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-gray-950/50 text-sm group-hover:text-gray-950/70 dark:text-white/50 dark:group-hover:text-white/70",
+      "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
     ),
-    ...r,
+    ...o,
     children: e
   }
 );
-f.displayName = "DropdownMenuTrigger";
-const c = ({
+c.displayName = "DropdownMenuTrigger";
+const y = ({
   className: t,
   sideOffset: e = 4,
-  align: r = "start",
-  ...a
-}) => /* @__PURE__ */ o(l, { children: /* @__PURE__ */ o(
-  h,
+  align: o = "start",
+  ...n
+}) => /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r(
+  g,
   {
-    align: r,
+    align: o,
     className: "z-50",
     collisionPadding: 16,
     sideOffset: e,
-    children: /* @__PURE__ */ o(
-      y,
+    children: /* @__PURE__ */ r(
+      x,
       {
-        className: d(
-          "relative max-h-96 min-w-[var(--anchor-width)] overflow-y-auto rounded-2xl border-standard bg-white p-1 text-gray-950/70 shadow-gray-500/5 shadow-xl dark:bg-gray-950 dark:text-white/70 dark:shadow-gray-500/5 dark:shadow-none",
+        className: a(
+          "relative max-h-96 min-w-(--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" },
-        ...a
+        ...n
       }
     )
   }
 ) });
-c.displayName = "DropdownMenuContent";
+y.displayName = "DropdownMenuContent";
 const M = ({
   className: t,
   isSelected: e,
-  children: r,
-  onSelect: a,
-  onClick: n,
-  ...i
+  children: o,
+  onSelect: n,
+  onClick: d,
+  ...s
 }) => /* @__PURE__ */ m(
-  x,
+  w,
   {
-    className: d(
-      "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-gray-950/[0.03] focus:bg-gray-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-gray-950/50 hover:text-gray-950/75 focus:text-gray-950/75 dark:text-white/50 dark:focus:text-white/75 dark:hover:text-white/75",
+    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/3 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/3",
+      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: (s) => {
-      n == null || n(s), a == null || a();
+    onClick: (i) => {
+      d == null || d(i), n == null || n();
     },
-    ...i,
+    ...s,
     children: [
-      r,
-      /* @__PURE__ */ o(
+      o,
+      /* @__PURE__ */ r(
         p,
         {
-          className: d(
+          className: a(
             "size-3.5 shrink-0 text-primary dark:text-primary-light",
             !e && "opacity-0"
           ),
@@ -89,8 +89,8 @@ const M = ({
 );
 M.displayName = "DropdownMenuItem";
 export {
-  w as DropdownMenu,
-  c as DropdownMenuContent,
+  f as DropdownMenu,
+  y as DropdownMenuContent,
   M as DropdownMenuItem,
-  f as DropdownMenuTrigger
+  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

@@ -1,77 +1,77 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { useState as f } from "react";
+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 b, DropdownMenuTrigger as l, DropdownMenuContent as v, DropdownMenuItem as w } from "./dropdown.js";
-import { LanguageIcon as y } from "./language-icon.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: i,
-  setSelectedLanguage: x,
+  selectedLanguage: e,
+  setSelectedLanguage: h,
   languages: m,
   codeBlockTheme: r = "system"
 }) => {
-  const a = m.length > 1, [s, h] = f(!1);
-  return /* @__PURE__ */ n(b, { onOpenChange: h, open: s, children: [
-    /* @__PURE__ */ e(
-      l,
+  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: !a,
-        children: /* @__PURE__ */ n(
+        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-gray-500 dark:text-gray-400",
-              a ? "cursor-pointer" : "cursor-default",
-              a && r === "system" && "hover:bg-gray-200/50 hover:text-primary dark:hover:bg-gray-700/70 dark:hover:text-primary-light",
-              a && r === "dark" && "hover:bg-gray-700/70 hover:text-primary-light",
-              s && "border-gray-600/50 ring-1 dark:border-gray-400/50 dark:ring-gray-800/50",
-              s && r === "system" && "ring-gray-200/70",
-              s && r === "dark" && "ring-gray-800/50",
-              !s && "border-transparent"
+              "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__ */ e(y, { language: i }),
-              /* @__PURE__ */ e("p", { className: "truncate font-medium", children: d(i) }),
-              a && /* @__PURE__ */ e(k, { className: "size-3.5 shrink-0" })
+              /* @__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__ */ e(
-      v,
+    /* @__PURE__ */ i(
+      w,
       {
         align: "end",
         className: p(
           "min-w-[170px] overflow-y-auto border p-1",
-          r === "system" && "border-gray-200/70 bg-white dark:border-white/10 dark:bg-[#0F1117]",
+          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, o) => {
-          const g = t === i;
-          return /* @__PURE__ */ n(
-            w,
+        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 === i && r === "system" && "font-medium text-primary dark:text-primary-light",
-                t === i && r === "dark" && "font-medium text-primary-light dark:text-primary-light",
-                t !== i && r === "system" && "text-gray-500 dark:text-white/50",
-                t !== i && r === "dark" && "text-white/50"
+                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: g,
-              onSelect: () => x(t, o),
+              isSelected: f,
+              onSelect: () => h(t, a),
               children: [
-                /* @__PURE__ */ e(y, { language: t }),
-                /* @__PURE__ */ e("div", { className: "flex min-w-0 flex-1 items-center font-medium", children: d(t) })
+                /* @__PURE__ */ i(x, { language: t }),
+                /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center font-medium", children: d(t) })
               ]
             },
-            `Language${o}${t}`
+            `Language${a}${t}`
           );
         })
       }

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/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

@@ -1,29 +1,29 @@
-import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import { createContext as g, useState as C, useRef as w, useContext as y, useEffect as b } from "react";
-import { Classes as s } from "../../constants/selectors.js";
-import { useIsDarkTheme as k } from "../../hooks/use-is-dark-theme.js";
+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 n } from "../../utils/cn.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 = g("compact"), u = ({ children: r, variant: t, className: c }) => /* @__PURE__ */ e(d.Provider, { value: t, children: /* @__PURE__ */ e(
+const d = C("compact"), u = ({ children: o, variant: t, className: c }) => /* @__PURE__ */ e(d.Provider, { value: t, children: /* @__PURE__ */ e(
   "div",
   {
-    className: n(
-      s.Color,
+    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: r
+    children: o
   }
-) }), T = ({ children: r, title: t }) => /* @__PURE__ */ i(
+) }), T = ({ children: o, title: t }) => /* @__PURE__ */ s(
   "div",
   {
-    className: n(
-      s.ColorRow,
+    className: l(
+      i.ColorRow,
       "flex flex-col gap-2 md:flex-row md:items-center"
     ),
     children: [
@@ -35,7 +35,7 @@ const d = g("compact"), u = ({ children: r, variant: t, className: c }) => /* @_
           children: /* @__PURE__ */ e(
             "p",
             {
-              className: "m-0 truncate font-medium text-gray-900 text-sm tracking-[-0.1px] dark:text-gray-200",
+              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
@@ -48,28 +48,28 @@ const d = g("compact"), u = ({ children: r, variant: t, className: c }) => /* @_
         {
           className: "flex w-full gap-1 md:gap-2",
           "data-component-part": "color-row-items-container",
-          children: r
+          children: o
         }
       )
     ]
   }
-), I = ({ name: r, value: t }) => {
-  const [c, m] = C("idle"), l = w(null), { isDarkTheme: x } = k(), o = y(d);
-  b(() => () => {
-    l.current && clearTimeout(l.current);
+), 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"), l.current && clearTimeout(l.current), l.current = setTimeout(() => m("idle"), 2e3));
+    await _(a) !== "error" && (m("copied"), n.current && clearTimeout(n.current), n.current = setTimeout(() => m("idle"), 2e3));
   }, p = /* @__PURE__ */ e(
     "button",
     {
-      "aria-label": r || `Color ${a}`,
+      "aria-label": o || `Color ${a}`,
       "aria-pressed": c === "copied",
       "aria-roledescription": c === "copied" ? "Copied" : "Copy",
-      className: n(
-        "relative flex cursor-copy items-center justify-center rounded-lg border border-neutral-200 dark:border-neutral-800",
-        o === "compact" && "aspect-square max-h-[104px]",
-        o === "table" && "aspect-square w-full md:h-10"
+      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,
@@ -79,7 +79,7 @@ const d = g("compact"), u = ({ children: r, variant: t, className: c }) => /* @_
         N,
         {
           "aria-hidden": !0,
-          className: n(
+          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"
@@ -88,30 +88,30 @@ const d = g("compact"), u = ({ children: r, variant: t, className: c }) => /* @_
       )
     }
   );
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ s(
     "div",
     {
-      className: n(
-        s.ColorItem,
-        o === "compact" && "flex shrink-0 flex-col gap-2",
-        o === "table" && "w-full max-w-[50px] md:max-w-[60px]"
+      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: [
-        o === "table" ? /* @__PURE__ */ e(v, { title: a, children: p }) : p,
-        o === "compact" && /* @__PURE__ */ i("div", { className: "flex w-[104px] min-w-0 flex-col gap-0.5", children: [
-          r && /* @__PURE__ */ e(
+        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-gray-900 text-sm dark:text-gray-200",
+              className: "m-0 truncate text-center font-medium text-sm text-stone-900 dark:text-stone-200",
               "data-component-part": "color-item-name",
-              title: r,
-              children: r
+              title: o,
+              children: o
             }
           ),
           /* @__PURE__ */ e(
             "p",
             {
-              className: "m-0 truncate text-center font-mono text-gray-600 text-xs dark:text-gray-400",
+              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

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/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"}