@mintlify/msft-sdk 1.1.14 → 1.1.16

package/dist/components/Api/colors.js.map

@@ -1 +1 @@
-{"version":3,"file":"colors.js","sources":["../../../src/components/Api/colors.tsx"],"sourcesContent":["'use client';\n\nexport const getMethodColor = (method?: string) => {\n  switch (method?.toUpperCase()) {\n    case 'GET':\n      return {\n        activeNavPillBg: 'mint:bg-[#2AB673]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-green-700 mint:dark:text-green-400',\n        inactiveNavPillBg: 'mint:bg-[#2AB673]/20',\n        paramStyle: 'mint:border-green-700 mint:dark:border-green-400 mint:text-green-700 mint:dark:text-green-400',\n      };\n    case 'POST':\n      return {\n        activeNavPillBg: 'mint:bg-[#3064E3]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-blue-700 mint:dark:text-blue-400',\n        inactiveNavPillBg: 'mint:bg-[#3064E3]/20',\n        paramStyle: 'mint:border-blue-700 mint:dark:border-blue-400 mint:text-blue-700 mint:dark:text-blue-400',\n      };\n    case 'WEBHOOK':\n      return {\n        activeNavPillBg: 'mint:bg-[#3064E3]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-blue-700 mint:dark:text-blue-400',\n        inactiveNavPillBg: 'mint:bg-[#3064E3]/20',\n        paramStyle: 'mint:border-blue-700 mint:dark:border-blue-400 mint:text-blue-700 mint:dark:text-blue-400',\n      };\n    case 'PUT':\n      return {\n        activeNavPillBg: 'mint:bg-[#C28C30]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-yellow-700 mint:dark:text-yellow-300',\n        inactiveNavPillBg: 'mint:bg-[#C28C30]/20',\n        paramStyle: 'mint:border-yellow-700 mint:dark:border-yellow-300 mint:text-yellow-700 mint:dark:text-yellow-300',\n      };\n    case 'DELETE':\n      return {\n        activeNavPillBg: 'mint:bg-[#CB3A32]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-red-700 mint:dark:text-red-400',\n        inactiveNavPillBg: 'mint:bg-[#CB3A32]/20',\n        paramStyle: 'mint:border-red-700 mint:dark:border-red-400 mint:text-red-700 mint:dark:text-red-400',\n      };\n    case 'OPTIONS':\n      return {\n        activeNavPillBg: 'mint:bg-[#9341FB]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-purple-700 mint:dark:text-purple-400',\n        inactiveNavPillBg: 'mint:bg-[#9341FB]/20',\n        paramStyle: 'mint:border-purple-700 mint:dark:border-purple-400 mint:text-purple-700 mint:dark:text-purple-400',\n      };\n    case 'HEAD':\n      return {\n        activeNavPillBg: 'mint:bg-cyan-700',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-cyan-700 mint:dark:text-cyan-400',\n        inactiveNavPillBg: 'mint:bg-cyan-700/20',\n        paramStyle: 'mint:border-cyan-700 mint:dark:border-cyan-400 mint:text-cyan-700 mint:dark:text-cyan-400',\n      };\n    case 'PATCH':\n      return {\n        activeNavPillBg: 'mint:bg-[#DA622B]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-orange-700 mint:dark:text-orange-400',\n        inactiveNavPillBg: 'mint:bg-[#DA622B]/20',\n        paramStyle: 'mint:border-orange-700 mint:dark:border-orange-400 mint:text-orange-700 mint:dark:text-orange-400',\n      };\n    case 'TRACE':\n      return {\n        activeNavPillBg: 'mint:bg-[#BD30D3]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-fuchsia-700 mint:dark:text-fuchsia-400',\n        inactiveNavPillBg: 'mint:bg-[#BD30D3]/20',\n        paramStyle: 'mint:border-fuchsia-700 mint:dark:border-fuchsia-400 mint:text-fuchsia-700 mint:dark:text-fuchsia-400',\n      };\n    case 'WEBSOCKET':\n      return {\n        activeNavPillBg: 'mint:bg-[#F54A00] mint:dark:bg-[#FF6900]',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-[#F54A00] mint:dark:text-[#FF6900]',\n        inactiveNavPillBg: 'mint:bg-[#FFEDD4] mint:dark:bg-[#FF6900]/20',\n        paramStyle: 'mint:border-[#F54A00] mint:dark:border-[#FF6900] mint:text-[#F54A00] mint:dark:text-[#FF6900]',\n      };\n    case 'DEPRECATED':\n      return {\n        activeNavPillBg: 'mint:bg-[#F7F7F8] mint:dark:bg-[#14151A]',\n        activeNavPillText: 'mint:text-[#14151A] mint:dark:text-white',\n        inactiveNavPillText: 'mint:text-[#14151A] mint:dark:text-white',\n        inactiveNavPillBg: 'mint:bg-[#F7F7F8] mint:dark:bg-[#14151A]',\n        paramStyle: 'mint:border-[#14151A] mint:dark:border-white mint:text-[#14151A] mint:dark:text-white',\n      };\n    default:\n      return {\n        activeNavPillBg: 'mint:bg-gray-600',\n        activeNavPillText: 'mint:text-white',\n        inactiveNavPillText: 'mint:text-gray-700 mint:dark:text-gray-400',\n        inactiveNavPillBg: 'mint:bg-gray-600/20',\n        paramStyle: 'mint:border-gray-700 mint:dark:border-gray-400 mint:text-gray-700 mint:dark:text-gray-400',\n      };\n  }\n};\n\nexport const getShortenedMethodName = (method?: string): string | undefined => {\n  const upperCase = method?.toUpperCase();\n  switch (upperCase) {\n    case 'DELETE':\n      return 'DEL';\n    case 'WEBHOOK':\n      return 'HOOK';\n    case 'WEBSOCKET':\n      return 'WSS';\n    default:\n      return upperCase;\n  }\n};\n"],"names":["getMethodColor","method","getShortenedMethodName","upperCase"],"mappings":"AAEO,MAAMA,IAAiB,CAACC,MAAoB;AACjD,UAAQA,KAAA,gBAAAA,EAAQ,eAAY;AAAA,IAC1B,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB;AACE,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,EACd;AAEN,GAEaC,IAAyB,CAACD,MAAwC;AAC7E,QAAME,IAAYF,KAAA,gBAAAA,EAAQ;AAC1B,UAAQE,GAAA;AAAA,IACN,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAOA;AAAA,EAAA;AAEb;"}
+{"version":3,"file":"colors.js","sources":["../../../src/components/Api/colors.tsx"],"sourcesContent":["'use client';\n\nexport const getMethodColor = (method?: string) => {\n  switch (method?.toUpperCase()) {\n    case 'GET':\n      return {\n        activeNavPillBg: 'mint:bg-[#2AB673]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-green-700 mint:dark:text-green-400',\n        inactiveNavPillBg: 'mint:bg-green-400/20 mint:dark:bg-green-400/20',\n        paramStyle: 'mint:text-[#2AB673] mint:bg-[#2AB673]/10 mint:border-[#2AB673]/30',\n      };\n    case 'POST':\n    case 'WEBHOOK':\n      return {\n        activeNavPillBg: 'mint:bg-[#3064E3]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-blue-700 mint:dark:text-blue-400',\n        inactiveNavPillBg: 'mint:bg-blue-400/20 mint:dark:bg-blue-400/20',\n        paramStyle: 'mint:text-[#3064E3] mint:bg-[#3064E3]/10 mint:border-[#3064E3]/30',\n      };\n    case 'PUT':\n      return {\n        activeNavPillBg: 'mint:bg-[#C28C30]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-yellow-700 mint:dark:text-yellow-400',\n        inactiveNavPillBg: 'mint:bg-yellow-400/20 mint:dark:bg-yellow-400/20',\n        paramStyle: 'mint:text-[#C28C30] mint:bg-[#C28C30]/10 mint:border-[#C28C30]/30',\n      };\n    case 'DELETE':\n      return {\n        activeNavPillBg: 'mint:bg-[#CB3A32]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-red-700 mint:dark:text-red-400',\n        inactiveNavPillBg: 'mint:bg-red-400/20 mint:dark:bg-red-400/20',\n        paramStyle: 'mint:text-[#CB3A32] mint:bg-[#CB3A32]/10 mint:border-[#CB3A32]/30',\n      };\n    case 'OPTIONS':\n      return {\n        activeNavPillBg: 'mint:bg-[#9341FB]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-purple-700 mint:dark:text-purple-400',\n        inactiveNavPillBg: 'mint:bg-purple-400/20 mint:dark:bg-purple-400/20',\n        paramStyle: 'mint:text-[#9341FB] mint:bg-[#9341FB]/10 mint:border-[#9341FB]/30',\n      };\n    case 'HEAD':\n      return {\n        activeNavPillBg: 'mint:bg-[#0e7490]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-cyan-700 mint:dark:text-cyan-400',\n        inactiveNavPillBg: 'mint:bg-cyan-400/20 mint:dark:bg-cyan-400/20',\n        paramStyle: 'mint:text-[#0e7490] mint:text-[#00d3f2] mint:bg-[#00d3f2]/10 mint:border-[#00d3f2]/30',\n      };\n    case 'PATCH':\n      return {\n        activeNavPillBg: 'mint:bg-[#DA622B]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-orange-700 mint:dark:text-orange-400',\n        inactiveNavPillBg: 'mint:bg-orange-400/20 mint:dark:bg-orange-400/20',\n        paramStyle: 'mint:text-[#DA622B] mint:bg-[#DA622B]/10 mint:border-[#DA622B]/30',\n      };\n    case 'TRACE':\n      return {\n        activeNavPillBg: 'mint:bg-[#BD30D3]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-fuchsia-700 mint:dark:text-fuchsia-400',\n        inactiveNavPillBg: 'mint:bg-fuchsia-400/20 mint:dark:bg-fuchsia-400/20',\n        paramStyle: 'mint:text-[#BD30D3] mint:bg-[#BD30D3]/10 mint:border-[#BD30D3]/30',\n      };\n    case 'WEBSOCKET':\n      return {\n        activeNavPillBg: 'mint:bg-[#F54A00] mint:dark:bg-[#FF6900]',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-[#F54A00] mint:dark:text-[#FF6900]',\n        inactiveNavPillBg: 'mint:bg-[#FFEDD4] mint:dark:bg-[#FF6900]/20',\n        paramStyle:\n          'mint:text-[#F54A00] mint:bg-[#FFEDD4]/10 mint:border-[#FFEDD4]/30 mint:dark:text-[#FF6900] mint:dark:bg-[#FF6900]/10 mint:dark:border-[#FF6900]/30',\n      };\n    case 'DEPRECATED':\n      return {\n        activeNavPillBg: 'mint:bg-[#F7F7F8] mint:dark:bg-[#14151A]',\n        activeNavPillText: 'mint:text-[#14151A] mint:dark:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-[#14151A] mint:dark:text-[#FFFFFF]',\n        inactiveNavPillBg: 'mint:bg-[#F7F7F8] mint:dark:bg-[#14151A]',\n      };\n    default:\n      return {\n        activeNavPillBg: 'mint:bg-gray-600',\n        activeNavPillText: 'mint:text-[#FFFFFF]',\n        inactiveNavPillText: 'mint:text-gray-700 mint:dark:text-gray-400',\n        inactiveNavPillBg: 'mint:bg-gray-400/20 mint:dark:bg-gray-400/20',\n        paramStyle: 'mint:text-gray-600 mint:bg-gray-600/10 mint:border-gray-600/30',\n      };\n  }\n};\n\nexport const getShortenedMethodName = (method?: string): string | undefined => {\n  const upperCase = method?.toUpperCase();\n  switch (upperCase) {\n    case 'DELETE':\n      return 'DEL';\n    case 'WEBHOOK':\n      return 'HOOK';\n    case 'WEBSOCKET':\n      return 'WSS';\n    default:\n      return upperCase;\n  }\n};\n"],"names":["getMethodColor","method","getShortenedMethodName","upperCase"],"mappings":"AAEO,MAAMA,IAAiB,CAACC,MAAoB;AACjD,UAAQA,KAAA,gBAAAA,EAAQ,eAAY;AAAA,IAC1B,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,IAEhB,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YACE;AAAA,MAAA;AAAA,IAEN,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,MAAA;AAAA,IAEvB;AACE,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,qBAAqB;AAAA,QACrB,mBAAmB;AAAA,QACnB,YAAY;AAAA,MAAA;AAAA,EACd;AAEN,GAEaC,IAAyB,CAACD,MAAwC;AAC7E,QAAME,IAAYF,KAAA,gBAAAA,EAAQ;AAC1B,UAAQE,GAAA;AAAA,IACN,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAOA;AAAA,EAAA;AAEb;"}

package/dist/components/Api/dropdown-menu.js

@@ -0,0 +1,127 @@
+import { jsx as m, jsxs as r } from "react/jsx-runtime";
+import { cn as d } from "@/api-playground-2/schemaGraph/utils";
+import * as t from "@radix-ui/react-dropdown-menu";
+import { ChevronRightFilled as l, CheckmarkCircleRegular as c, CircleRegular as p } from "@fluentui/react-icons";
+import * as o from "react";
+const f = o.forwardRef((n, e) => /* @__PURE__ */ m(t.Root, { modal: !1, ...n }));
+f.displayName = t.Root.displayName;
+const C = t.Trigger, u = o.forwardRef(({ className: n, inset: e, children: i, ...a }, s) => /* @__PURE__ */ r(
+  t.SubTrigger,
+  {
+    ref: s,
+    className: d(
+      "mint:flex mint:cursor-default mint:select-none mint:items-center mint:rounded-md mint:px-2 mint:py-1.5 mint:text-sm mint:outline-none mint:focus:bg-accent mint:data-[state=open]:bg-accent",
+      e && "mint:pl-8",
+      n
+    ),
+    ...a,
+    children: [
+      i,
+      /* @__PURE__ */ m(l, { className: "mint:size-4 mint:ml-auto" })
+    ]
+  }
+));
+u.displayName = t.SubTrigger.displayName;
+const b = o.forwardRef(({ className: n, ...e }, i) => /* @__PURE__ */ m(
+  t.SubContent,
+  {
+    ref: i,
+    className: d(
+      "mint:z-50 mint:min-w-[8rem] mint:overflow-hidden mint:rounded-xl mint:border mint:bg-popover mint:p-1 mint:shadow-md mint:data-[state=open]:animate-in mint:data-[state=closed]:animate-out mint:data-[state=closed]:fade-out-0 mint:data-[state=open]:fade-in-0 mint:data-[state=closed]:zoom-out-95 mint:data-[state=open]:zoom-in-95 mint:data-[side=bottom]:slide-in-from-top-2 mint:data-[side=left]:slide-in-from-right-2 mint:data-[side=right]:slide-in-from-left-2 mint:data-[side=top]:slide-in-from-bottom-2",
+      n
+    ),
+    ...e
+  }
+));
+b.displayName = t.SubContent.displayName;
+const g = o.forwardRef(({ className: n, sideOffset: e = 8, ...i }, a) => /* @__PURE__ */ m(t.Portal, { children: /* @__PURE__ */ m(
+  t.Content,
+  {
+    ref: a,
+    sideOffset: e,
+    className: d(
+      "mint:bg-white mint:dark:bg-zinc-950 mint:z-50 mint:min-w-[8rem] mint:overflow-hidden mint:rounded-xl mint:border mint:p-3 mint:text-secondary mint:data-[state=open]:animate-in mint:data-[state=closed]:animate-out mint:data-[state=closed]:fade-out-0 mint:data-[state=open]:fade-in-0 mint:data-[state=closed]:zoom-out-95 mint:data-[state=open]:zoom-in-95 mint:data-[side=bottom]:slide-in-from-top-2 mint:data-[side=left]:slide-in-from-right-2 mint:data-[side=right]:slide-in-from-left-2 mint:data-[side=top]:slide-in-from-bottom-2 mint:shadow-xl mint:shadow-zinc-400/10 mint:dark:border-white/10 mint:dark:shadow-none",
+      n
+    ),
+    ...i
+  }
+) }));
+g.displayName = t.Content.displayName;
+const w = o.forwardRef(({ className: n, inset: e, isSelected: i, ...a }, s) => /* @__PURE__ */ m(
+  t.Item,
+  {
+    ref: s,
+    className: d(
+      "mint:relative mint:flex mint:cursor-pointer mint:select-none mint:items-center mint:rounded-lg mint:px-2 mint:py-1.5 mint:text-sm mint:outline-none mint:focus:bg-accent mint:focus:text-accent-foreground mint:data-[disabled]:pointer-events-none mint:data-[disabled]:opacity-50 mint:hover:bg-zinc-950/5 mint:dark:hover:bg-white/5",
+      e && "mint:pl-8",
+      i && "mint:bg-zinc-950/5 mint:dark:bg-white/5 mint:font-medium",
+      n
+    ),
+    ...a
+  }
+));
+w.displayName = t.Item.displayName;
+const h = o.forwardRef(({ className: n, children: e, checked: i, ...a }, s) => /* @__PURE__ */ r(
+  t.CheckboxItem,
+  {
+    ref: s,
+    className: d(
+      "mint:relative mint:flex mint:cursor-default mint:select-none mint:items-center mint:rounded-sm mint:py-1.5 mint:pl-8 mint:pr-2 mint:text-sm mint:outline-none mint:transition-colors mint:focus:bg-accent mint:focus:text-accent-foreground mint:data-[disabled]:pointer-events-none mint:data-[disabled]:opacity-50",
+      n
+    ),
+    checked: i,
+    ...a,
+    children: [
+      /* @__PURE__ */ m("span", { className: "mint:absolute mint:left-2 mint:flex mint:size-3.5 mint:items-center mint:justify-center", children: /* @__PURE__ */ m(t.ItemIndicator, { children: /* @__PURE__ */ m(c, { className: "mint:size-4" }) }) }),
+      e
+    ]
+  }
+));
+h.displayName = t.CheckboxItem.displayName;
+const N = o.forwardRef(({ className: n, children: e, ...i }, a) => /* @__PURE__ */ r(
+  t.RadioItem,
+  {
+    ref: a,
+    className: d(
+      "mint:relative mint:flex mint:cursor-default mint:select-none mint:items-center mint:rounded-md mint:py-1.5 mint:pl-8 mint:pr-2 mint:text-sm mint:outline-none mint:transition-colors mint:focus:bg-accent mint:focus:text-accent-foreground mint:data-[disabled]:pointer-events-none mint:data-[disabled]:opacity-50",
+      n
+    ),
+    ...i,
+    children: [
+      /* @__PURE__ */ m("span", { className: "mint:absolute mint:left-2 mint:flex mint:size-3.5 mint:items-center mint:justify-center", children: /* @__PURE__ */ m(t.ItemIndicator, { children: /* @__PURE__ */ m(p, { className: "mint:size-2 mint:fill-current" }) }) }),
+      e
+    ]
+  }
+));
+N.displayName = t.RadioItem.displayName;
+const y = o.forwardRef(({ className: n, inset: e, ...i }, a) => /* @__PURE__ */ m(
+  t.Label,
+  {
+    ref: a,
+    className: d("mint:px-2 mint:py-1.5 mint:text-sm mint:font-semibold", e && "mint:pl-8", n),
+    ...i
+  }
+));
+y.displayName = t.Label.displayName;
+const x = o.forwardRef(({ className: n, ...e }, i) => /* @__PURE__ */ m(
+  t.Separator,
+  {
+    ref: i,
+    className: d("mint:-mx-1 mint:my-1 mint:h-px mint:bg-zinc-950/10 mint:dark:bg-white/10", n),
+    ...e
+  }
+));
+x.displayName = t.Separator.displayName;
+export {
+  f as DropdownMenu,
+  h as DropdownMenuCheckboxItem,
+  g as DropdownMenuContent,
+  w as DropdownMenuItem,
+  y as DropdownMenuLabel,
+  N as DropdownMenuRadioItem,
+  x as DropdownMenuSeparator,
+  b as DropdownMenuSubContent,
+  u as DropdownMenuSubTrigger,
+  C as DropdownMenuTrigger
+};
+//# sourceMappingURL=dropdown-menu.js.map

package/dist/components/Api/dropdown-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-menu.js","sources":["../../../src/components/Api/dropdown-menu.tsx"],"sourcesContent":["import { cn } from '@/api-playground-2/schemaGraph/utils';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { CheckmarkCircleRegular, ChevronRightFilled, CircleRegular } from '@fluentui/react-icons';\nimport * as React from 'react';\n\nconst DropdownMenu = React.forwardRef<\n  typeof DropdownMenuPrimitive.Root,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>\n>((props, _ref) => <DropdownMenuPrimitive.Root modal={false} {...props} />);\nDropdownMenu.displayName = DropdownMenuPrimitive.Root.displayName;\n\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\n\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group;\n\nconst DropdownMenuPortal = DropdownMenuPrimitive.Portal;\n\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub;\n\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n    inset?: boolean;\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <DropdownMenuPrimitive.SubTrigger\n    ref={ref}\n    className={cn(\n      'mint:flex mint:cursor-default mint:select-none mint:items-center mint:rounded-md mint:px-2 mint:py-1.5 mint:text-sm mint:outline-none mint:focus:bg-accent mint:data-[state=open]:bg-accent',\n      inset && 'mint:pl-8',\n      className\n    )}\n    {...props}\n  >\n    {children}\n    <ChevronRightFilled className=\"mint:size-4 mint:ml-auto\" />\n  </DropdownMenuPrimitive.SubTrigger>\n));\nDropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;\n\nconst DropdownMenuSubContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n  <DropdownMenuPrimitive.SubContent\n    ref={ref}\n    className={cn(\n      'mint:z-50 mint:min-w-[8rem] mint:overflow-hidden mint:rounded-xl mint:border mint:bg-popover mint:p-1 mint:shadow-md mint:data-[state=open]:animate-in mint:data-[state=closed]:animate-out mint:data-[state=closed]:fade-out-0 mint:data-[state=open]:fade-in-0 mint:data-[state=closed]:zoom-out-95 mint:data-[state=open]:zoom-in-95 mint:data-[side=bottom]:slide-in-from-top-2 mint:data-[side=left]:slide-in-from-right-2 mint:data-[side=right]:slide-in-from-left-2 mint:data-[side=top]:slide-in-from-bottom-2',\n      className\n    )}\n    {...props}\n  />\n));\nDropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;\n\nconst DropdownMenuContent = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({ className, sideOffset = 8, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuPrimitive.Content\n      ref={ref}\n      sideOffset={sideOffset}\n      className={cn(\n        'mint:bg-white mint:dark:bg-zinc-950 mint:z-50 mint:min-w-[8rem] mint:overflow-hidden mint:rounded-xl mint:border mint:p-3 mint:text-secondary mint:data-[state=open]:animate-in mint:data-[state=closed]:animate-out mint:data-[state=closed]:fade-out-0 mint:data-[state=open]:fade-in-0 mint:data-[state=closed]:zoom-out-95 mint:data-[state=open]:zoom-in-95 mint:data-[side=bottom]:slide-in-from-top-2 mint:data-[side=left]:slide-in-from-right-2 mint:data-[side=right]:slide-in-from-left-2 mint:data-[side=top]:slide-in-from-bottom-2 mint:shadow-xl mint:shadow-zinc-400/10 mint:dark:border-white/10 mint:dark:shadow-none',\n        className\n      )}\n      {...props}\n    />\n  </DropdownMenuPrimitive.Portal>\n));\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\ntype DropdownMenuItemProps = React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n  inset?: boolean;\n  isSelected?: boolean;\n};\n\nconst DropdownMenuItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n  DropdownMenuItemProps\n>(({ className, inset, isSelected, ...props }, ref) => (\n  <DropdownMenuPrimitive.Item\n    ref={ref}\n    className={cn(\n      'mint:relative mint:flex mint:cursor-pointer mint:select-none mint:items-center mint:rounded-lg mint:px-2 mint:py-1.5 mint:text-sm mint:outline-none mint:focus:bg-accent mint:focus:text-accent-foreground mint:data-[disabled]:pointer-events-none mint:data-[disabled]:opacity-50 mint:hover:bg-zinc-950/5 mint:dark:hover:bg-white/5',\n      inset && 'mint:pl-8',\n      isSelected && 'mint:bg-zinc-950/5 mint:dark:bg-white/5 mint:font-medium',\n      className\n    )}\n    {...props}\n  />\n));\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownMenuCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <DropdownMenuPrimitive.CheckboxItem\n    ref={ref}\n    className={cn(\n      'mint:relative mint:flex mint:cursor-default mint:select-none mint:items-center mint:rounded-sm mint:py-1.5 mint:pl-8 mint:pr-2 mint:text-sm mint:outline-none mint:transition-colors mint:focus:bg-accent mint:focus:text-accent-foreground mint:data-[disabled]:pointer-events-none mint:data-[disabled]:opacity-50',\n      className\n    )}\n    checked={checked}\n    {...props}\n  >\n    <span className=\"mint:absolute mint:left-2 mint:flex mint:size-3.5 mint:items-center mint:justify-center\">\n      <DropdownMenuPrimitive.ItemIndicator>\n        <CheckmarkCircleRegular className=\"mint:size-4\" />\n      </DropdownMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuRadioItem = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <DropdownMenuPrimitive.RadioItem\n    ref={ref}\n    className={cn(\n      'mint:relative mint:flex mint:cursor-default mint:select-none mint:items-center mint:rounded-md mint:py-1.5 mint:pl-8 mint:pr-2 mint:text-sm mint:outline-none mint:transition-colors mint:focus:bg-accent mint:focus:text-accent-foreground mint:data-[disabled]:pointer-events-none mint:data-[disabled]:opacity-50',\n      className\n    )}\n    {...props}\n  >\n    <span className=\"mint:absolute mint:left-2 mint:flex mint:size-3.5 mint:items-center mint:justify-center\">\n      <DropdownMenuPrimitive.ItemIndicator>\n        <CircleRegular className=\"mint:size-2 mint:fill-current\" />\n      </DropdownMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;\n\nconst DropdownMenuLabel = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <DropdownMenuPrimitive.Label\n    ref={ref}\n    className={cn('mint:px-2 mint:py-1.5 mint:text-sm mint:font-semibold', inset && 'mint:pl-8', className)}\n    {...props}\n  />\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<\n  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <DropdownMenuPrimitive.Separator\n    ref={ref}\n    className={cn('mint:-mx-1 mint:my-1 mint:h-px mint:bg-zinc-950/10 mint:dark:bg-white/10', className)}\n    {...props}\n  />\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span className={cn('mint:ml-auto mint:text-xs mint:tracking-widest mint:opacity-60', className)} {...props} />\n  );\n};\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut';\n\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n};\n"],"names":["DropdownMenu","React","props","_ref","jsx","DropdownMenuPrimitive","DropdownMenuTrigger","DropdownMenuSubTrigger","className","inset","children","ref","jsxs","cn","ChevronRightFilled","DropdownMenuSubContent","DropdownMenuContent","sideOffset","DropdownMenuItem","isSelected","DropdownMenuCheckboxItem","checked","CheckmarkCircleRegular","DropdownMenuRadioItem","CircleRegular","DropdownMenuLabel","DropdownMenuSeparator"],"mappings":"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"}

package/dist/components/content-components/CodeGroupSelect/CodeGroupCopyButton.js

@@ -0,0 +1,7 @@
+import { jsx as o } from "react/jsx-runtime";
+import { CopyToClipboardButton as r } from "../code-block.js";
+const d = ({ code: t }) => /* @__PURE__ */ o("div", { "data-testid": "code-group-select-copy-button", children: /* @__PURE__ */ o(r, { textToCopy: t }) });
+export {
+  d as CodeGroupCopyButton
+};
+//# sourceMappingURL=CodeGroupCopyButton.js.map

package/dist/components/content-components/CodeGroupSelect/CodeGroupCopyButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeGroupCopyButton.js","sources":["../../../../src/components/content-components/CodeGroupSelect/CodeGroupCopyButton.tsx"],"sourcesContent":["'use client';\n\n\nimport { CopyToClipboardButton } from '../code-block';\n\ntype CodeGroupCopyButtonProps = {\n  code: string;\n};\n\nexport const CodeGroupCopyButton = ({ code }: CodeGroupCopyButtonProps) => {\n\n  return (\n    <div data-testid=\"code-group-select-copy-button\">\n      <CopyToClipboardButton textToCopy={code} />\n    </div>\n  );\n};\n"],"names":["CodeGroupCopyButton","code","jsx","CopyToClipboardButton"],"mappings":";;AASO,MAAMA,IAAsB,CAAC,EAAE,MAAAC,QAGlC,gBAAAC,EAAC,SAAI,eAAY,iCACf,4BAACC,GAAA,EAAsB,YAAYF,GAAM,EAAA,CAC3C;"}

package/dist/components/content-components/CodeGroupSelect/CodeSelectDropdown.js

@@ -0,0 +1,52 @@
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import { ChevronDownFilled as s } from "@fluentui/react-icons";
+import { DropdownMenu as l, DropdownMenuTrigger as x, DropdownMenuContent as c, DropdownMenuItem as p } from "../../Api/dropdown-menu.js";
+import { cn as i } from "../../../utils/cn.js";
+const y = ({
+  selectedOption: m,
+  setSelectedOption: o,
+  options: e
+}) => {
+  const r = e.length > 1;
+  return /* @__PURE__ */ a(l, { children: [
+    /* @__PURE__ */ t(
+      x,
+      {
+        disabled: !r,
+        className: i(
+          "mint:select-none mint:bg-transparent mint:px-2 mint:py-[5px] mint:text-xs mint:font-medium mint:min-w-16 mint:flex-1 mint:dark:bg-transparent mint:dark:text-gray-200 mint:text-gray-600"
+        ),
+        children: /* @__PURE__ */ a("div", { className: "mint:flex mint:gap-1.5 mint:items-center mint:px-2 mint:py-1 mint:group-hover:hover:bg-primary-light/10 mint:rounded-lg mint:min-w-16", children: [
+          /* @__PURE__ */ t("p", { className: "mint:truncate", children: m }),
+          r && /* @__PURE__ */ t(s, { className: "mint:w-3 mint:h-3 mint:text-gray-500 mint:dark:text-gray-400 mint:shrink-0" })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ t(
+      c,
+      {
+        className: i(
+          "mint:overflow-y-auto",
+          "mint:bg-white mint:dark:bg-zinc-950"
+        ),
+        children: e.map((n, d) => /* @__PURE__ */ t(
+          p,
+          {
+            onSelect: () => o(n),
+            className: i(
+              "mint:py-1.5 mint:text-xs",
+              n === m && "mint:text-[#643FB2] mint:dark:text-[#C9AAF9] mint:font-medium",
+              n !== m && "mint:text-gray-500 mint:dark:text-white/50"
+            ),
+            children: n
+          },
+          d
+        ))
+      }
+    )
+  ] });
+};
+export {
+  y as CodeSelectDropdown
+};
+//# sourceMappingURL=CodeSelectDropdown.js.map

package/dist/components/content-components/CodeGroupSelect/CodeSelectDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeSelectDropdown.js","sources":["../../../../src/components/content-components/CodeGroupSelect/CodeSelectDropdown.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDownFilled } from '@fluentui/react-icons';\n\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from '../../Api/dropdown-menu';\nimport { cn } from \"../../../utils/cn\";\n\ninterface CodeSelectDropdownProps {\n  selectedOption?: string;\n  setSelectedOption: (option: string) => void;\n  options: string[];\n}\n\nexport const CodeSelectDropdown = ({\n  selectedOption,\n  setSelectedOption,\n  options,\n}: CodeSelectDropdownProps) => {\n  const hasOptions = options.length > 1;\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger\n        disabled={!hasOptions}\n        className={cn(\n          'mint:select-none mint:bg-transparent mint:px-2 mint:py-[5px] mint:text-xs mint:font-medium mint:min-w-16 mint:flex-1 mint:dark:bg-transparent mint:dark:text-gray-200 mint:text-gray-600',\n        )}\n      >\n        <div className=\"mint:flex mint:gap-1.5 mint:items-center mint:px-2 mint:py-1 mint:group-hover:hover:bg-primary-light/10 mint:rounded-lg mint:min-w-16\">\n          <p className=\"mint:truncate\">{selectedOption}</p>\n          {hasOptions && <ChevronDownFilled className=\"mint:w-3 mint:h-3 mint:text-gray-500 mint:dark:text-gray-400 mint:shrink-0\" />}\n        </div>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent\n        className={cn(\n          'mint:overflow-y-auto', 'mint:bg-white mint:dark:bg-zinc-950'\n        )}\n      >\n        {options.map((option, i) => (\n          <DropdownMenuItem\n            key={i}\n            onSelect={() => setSelectedOption(option)}\n            className={cn(\n              'mint:py-1.5 mint:text-xs',\n              option === selectedOption && 'mint:text-[#643FB2] mint:dark:text-[#C9AAF9] mint:font-medium',\n              option !== selectedOption &&\n                'mint:text-gray-500 mint:dark:text-white/50',\n            )}\n          >\n            {option}\n          </DropdownMenuItem>\n        ))}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n};\n"],"names":["CodeSelectDropdown","selectedOption","setSelectedOption","options","hasOptions","DropdownMenu","jsx","DropdownMenuTrigger","cn","jsxs","ChevronDownFilled","DropdownMenuContent","option","i","DropdownMenuItem"],"mappings":";;;;AAkBO,MAAMA,IAAqB,CAAC;AAAA,EACjC,gBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,SAAAC;AACF,MAA+B;AAC7B,QAAMC,IAAaD,EAAQ,SAAS;AAEpC,2BACGE,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAU,CAACH;AAAA,QACX,WAAWI;AAAA,UACT;AAAA,QAAA;AAAA,QAGF,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,yIACb,UAAA;AAAA,UAAA,gBAAAH,EAAC,KAAA,EAAE,WAAU,iBAAiB,UAAAL,GAAe;AAAA,UAC5CG,KAAc,gBAAAE,EAACI,GAAA,EAAkB,WAAU,6EAAA,CAA6E;AAAA,QAAA,EAAA,CAC3H;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,WAAWH;AAAA,UACT;AAAA,UAAwB;AAAA,QAAA;AAAA,QAGzB,UAAAL,EAAQ,IAAI,CAACS,GAAQC,MACpB,gBAAAP;AAAA,UAACQ;AAAA,UAAA;AAAA,YAEC,UAAU,MAAMZ,EAAkBU,CAAM;AAAA,YACxC,WAAWJ;AAAA,cACT;AAAA,cACAI,MAAWX,KAAkB;AAAA,cAC7BW,MAAWX,KACT;AAAA,YAAA;AAAA,YAGH,UAAAW;AAAA,UAAA;AAAA,UATIC;AAAA,QAAA,CAWR;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}

package/dist/components/content-components/CodeGroupSelect/index.js

@@ -0,0 +1,77 @@
+import { jsxs as a, jsx as o } from "react/jsx-runtime";
+import { useContext as y, useState as f, useEffect as C } from "react";
+import { ApiPlaygroundContext as k } from "@/api-playground/ApiPlayground/ApiPlaygroundContext";
+import { useCodeExampleLabel as j } from "@/contexts/CodeExampleLabelContext";
+import { useSelectedLocale as G } from "@/utils/locales";
+import { CodeSnippet as L } from "../code-snippet.js";
+import { CodeGroupCopyButton as N } from "./CodeGroupCopyButton.js";
+import { CodeSelectDropdown as g } from "./CodeSelectDropdown.js";
+import { cn as x } from "../../../utils/cn.js";
+const J = ({ snippets: s, maxHeight: b }) => {
+  const { setSelectedExampleIndex: l } = y(k), { selectedLabel: i, setSelectedLabel: h } = j(), v = G(), u = Object.keys(s), [m, w] = f(u[0]), d = m !== void 0 ? s[m] : void 0, e = d ? Object.keys(d) : void 0, [c, p] = f(e && e[0]), r = c && (e != null && e.includes(c)) ? c : e == null ? void 0 : e[0], t = d !== void 0 && r !== void 0 ? d[r] : void 0, S = (n) => {
+    w(n);
+  }, O = (n) => {
+    p(n), l == null || l((e == null ? void 0 : e.indexOf(n)) ?? 0), n !== i && h(n);
+  };
+  return C(() => {
+    i && i !== r && (e != null && e.includes(i)) && p(i);
+  }, [i, e, r]), /* @__PURE__ */ a(
+    "div",
+    {
+      className: x(
+        "mint:text-xs mint:p-0.5 mint:leading-6 mint:rounded-2xl not-prose mint:overflow-hidden mint:relative mint:max-w-full mint:min-w-full",
+        "mint:bg-gray-50 mint:dark:bg-white/5 mint:border mint:border-gray-950/10 mint:dark:border-white/10",
+        b
+      ),
+      "data-testid": "code-group-select",
+      children: [
+        /* @__PURE__ */ a("div", { className: "mint:flex mint:justify-between mint:text-xs mint:leading-6 mint:rounded-t-2xl mint:w-full", children: [
+          /* @__PURE__ */ o(
+            g,
+            {
+              selectedOption: m,
+              setSelectedOption: S,
+              options: u,
+              "data-testid": "code-group-select-group"
+            }
+          ),
+          /* @__PURE__ */ a("div", { className: "mint:flex mint:overflow-hidden", children: [
+            e && /* @__PURE__ */ o(
+              g,
+              {
+                selectedOption: r,
+                setSelectedOption: O,
+                options: e,
+                "data-testid": "code-group-select-option"
+              }
+            ),
+            /* @__PURE__ */ o(
+              "div",
+              {
+                className: "mint:flex mint:items-center mint:gap-1.5 mint:pr-2.5",
+                "data-testid": "code-group-select-copy-button",
+                children: /* @__PURE__ */ o(N, { code: (t == null ? void 0 : t.code) ?? "" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ o(
+          "div",
+          {
+            role: "region",
+            "aria-label": v["aria.codeSnippet"],
+            className: x(
+              "not-prose mint:rounded-xt mint:p-5 mint:min-w-full mint:max-w-0 mint:overflow-x-auto mint:max-h-[calc(100%-34px)] mint:w-full mint:scrollbar-track-transparent mint:scrollbar-thin mint:scrollbar-thumb-rounded mint:text-xs mint:leading-[1.35rem]",
+              "mint:bg-white mint:dark:bg-zinc-950"
+            ),
+            children: /* @__PURE__ */ o(L, { language: t == null ? void 0 : t.language, children: t == null ? void 0 : t.code })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  J as CodeGroupSelect
+};
+//# sourceMappingURL=index.js.map

package/dist/components/content-components/CodeGroupSelect/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/content-components/CodeGroupSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect, useContext } from 'react';\n\nimport { ApiPlaygroundContext } from '@/api-playground/ApiPlayground/ApiPlaygroundContext';\nimport { useCodeExampleLabel } from '@/contexts/CodeExampleLabelContext';\nimport { useSelectedLocale } from '@/utils/locales';\nimport { ExampleCodeSnippet } from '@/types/exampleCodeSnippet';\nimport { CodeSnippet } from '../code-snippet';\nimport { CodeGroupCopyButton } from './CodeGroupCopyButton';\nimport { CodeSelectDropdown } from './CodeSelectDropdown';\nimport { cn } from \"../../../utils/cn\";\n\ninterface CodeGroupSelectProps {\n  snippets: Record<string, Record<string, ExampleCodeSnippet>>;\n  maxHeight?: string;\n}\n\nexport const CodeGroupSelect = ({ snippets, maxHeight }: CodeGroupSelectProps) => {\n  const { setSelectedExampleIndex } = useContext(ApiPlaygroundContext);\n  const { selectedLabel: syncedLabel, setSelectedLabel } = useCodeExampleLabel();\n  const locale = useSelectedLocale();\n\n  const groups = Object.keys(snippets);\n  const [selectedGroup, setSelectedGroup] = useState(groups[0]);\n\n  const groupSnippets = selectedGroup !== undefined ? snippets[selectedGroup] : undefined;\n  const options = groupSnippets ? Object.keys(groupSnippets) : undefined;\n  const [selectedOption, setSelectedOption] = useState(options && options[0]);\n\n  const safeSelectedOption =\n    selectedOption && options?.includes(selectedOption) ? selectedOption : options?.[0];\n\n  const snippet =\n    groupSnippets !== undefined && safeSelectedOption !== undefined\n      ? groupSnippets[safeSelectedOption]\n      : undefined;\n\n  const handleGroupSelect = (grp: string) => {\n    setSelectedGroup(grp);\n  };\n\n  const handleOptionSelect = (opt: string) => {\n    setSelectedOption(opt);\n    setSelectedExampleIndex?.(options?.indexOf(opt) ?? 0);\n    if (opt !== syncedLabel) {\n      setSelectedLabel(opt);\n    }\n  };\n\n  useEffect(() => {\n    if (syncedLabel && syncedLabel !== safeSelectedOption && options?.includes(syncedLabel)) {\n      setSelectedOption(syncedLabel);\n    }\n  }, [syncedLabel, options, safeSelectedOption]);\n\n  return (\n    <div\n      className={cn(\n        'mint:text-xs mint:p-0.5 mint:leading-6 mint:rounded-2xl not-prose mint:overflow-hidden mint:relative mint:max-w-full mint:min-w-full',\n        'mint:bg-gray-50 mint:dark:bg-white/5 mint:border mint:border-gray-950/10 mint:dark:border-white/10',\n        maxHeight\n      )}\n      data-testid=\"code-group-select\"\n    >\n      <div className=\"mint:flex mint:justify-between mint:text-xs mint:leading-6 mint:rounded-t-2xl mint:w-full\">\n        <CodeSelectDropdown\n          selectedOption={selectedGroup}\n          setSelectedOption={handleGroupSelect}\n          options={groups}\n          data-testid=\"code-group-select-group\"\n        />\n        <div className=\"mint:flex mint:overflow-hidden\">\n          {options && (\n            <CodeSelectDropdown\n              selectedOption={safeSelectedOption}\n              setSelectedOption={handleOptionSelect}\n              options={options}\n              data-testid=\"code-group-select-option\"\n            />\n          )}\n          <div\n            className=\"mint:flex mint:items-center mint:gap-1.5 mint:pr-2.5\"\n            data-testid=\"code-group-select-copy-button\"\n          >\n            <CodeGroupCopyButton code={snippet?.code ?? ''} />\n          </div>\n        </div>\n      </div>\n\n      <div\n        role=\"region\"\n        aria-label={locale['aria.codeSnippet']}\n        className={cn(\n          'not-prose mint:rounded-xt mint:p-5 mint:min-w-full mint:max-w-0 mint:overflow-x-auto mint:max-h-[calc(100%-34px)] mint:w-full mint:scrollbar-track-transparent mint:scrollbar-thin mint:scrollbar-thumb-rounded mint:text-xs mint:leading-[1.35rem]',\n          'mint:bg-white mint:dark:bg-zinc-950'\n        )}\n      >\n        <CodeSnippet language={snippet?.language}>{snippet?.code}</CodeSnippet>\n      </div>\n    </div>\n  );\n};\n"],"names":["CodeGroupSelect","snippets","maxHeight","setSelectedExampleIndex","useContext","ApiPlaygroundContext","syncedLabel","setSelectedLabel","useCodeExampleLabel","locale","useSelectedLocale","groups","selectedGroup","setSelectedGroup","useState","groupSnippets","options","selectedOption","setSelectedOption","safeSelectedOption","snippet","handleGroupSelect","grp","handleOptionSelect","opt","useEffect","jsxs","cn","jsx","CodeSelectDropdown","CodeGroupCopyButton","CodeSnippet"],"mappings":";;;;;;;;;AAkBO,MAAMA,IAAkB,CAAC,EAAE,UAAAC,GAAU,WAAAC,QAAsC;AAChF,QAAM,EAAE,yBAAAC,EAAA,IAA4BC,EAAWC,CAAoB,GAC7D,EAAE,eAAeC,GAAa,kBAAAC,EAAA,IAAqBC,EAAA,GACnDC,IAASC,EAAA,GAETC,IAAS,OAAO,KAAKV,CAAQ,GAC7B,CAACW,GAAeC,CAAgB,IAAIC,EAASH,EAAO,CAAC,CAAC,GAEtDI,IAAgBH,MAAkB,SAAYX,EAASW,CAAa,IAAI,QACxEI,IAAUD,IAAgB,OAAO,KAAKA,CAAa,IAAI,QACvD,CAACE,GAAgBC,CAAiB,IAAIJ,EAASE,KAAWA,EAAQ,CAAC,CAAC,GAEpEG,IACJF,MAAkBD,KAAA,QAAAA,EAAS,SAASC,MAAkBA,IAAiBD,KAAA,gBAAAA,EAAU,IAE7EI,IACJL,MAAkB,UAAaI,MAAuB,SAClDJ,EAAcI,CAAkB,IAChC,QAEAE,IAAoB,CAACC,MAAgB;AACzC,IAAAT,EAAiBS,CAAG;AAAA,EACtB,GAEMC,IAAqB,CAACC,MAAgB;AAC1C,IAAAN,EAAkBM,CAAG,GACrBrB,KAAA,QAAAA,GAA0Ba,KAAA,gBAAAA,EAAS,QAAQQ,OAAQ,IAC/CA,MAAQlB,KACVC,EAAiBiB,CAAG;AAAA,EAExB;AAEA,SAAAC,EAAU,MAAM;AACd,IAAInB,KAAeA,MAAgBa,MAAsBH,KAAA,QAAAA,EAAS,SAASV,OACzEY,EAAkBZ,CAAW;AAAA,EAEjC,GAAG,CAACA,GAAaU,GAASG,CAAkB,CAAC,GAG3C,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,QACAzB;AAAA,MAAA;AAAA,MAEF,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAwB,EAAC,OAAA,EAAI,WAAU,6FACb,UAAA;AAAA,UAAA,gBAAAE;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,gBAAgBjB;AAAA,cAChB,mBAAmBS;AAAA,cACnB,SAASV;AAAA,cACT,eAAY;AAAA,YAAA;AAAA,UAAA;AAAA,UAEd,gBAAAe,EAAC,OAAA,EAAI,WAAU,kCACZ,UAAA;AAAA,YAAAV,KACC,gBAAAY;AAAA,cAACC;AAAA,cAAA;AAAA,gBACC,gBAAgBV;AAAA,gBAChB,mBAAmBI;AAAA,gBACnB,SAAAP;AAAA,gBACA,eAAY;AAAA,cAAA;AAAA,YAAA;AAAA,YAGhB,gBAAAY;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,eAAY;AAAA,gBAEZ,UAAA,gBAAAA,EAACE,GAAA,EAAoB,OAAMV,KAAA,gBAAAA,EAAS,SAAQ,GAAA,CAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UAClD,EAAA,CACF;AAAA,QAAA,GACF;AAAA,QAEA,gBAAAQ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAYnB,EAAO,kBAAkB;AAAA,YACrC,WAAWkB;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAGF,4BAACI,GAAA,EAAY,UAAUX,KAAA,gBAAAA,EAAS,UAAW,iCAAS,KAAA,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MAC3D;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/content-components/code-block.js

@@ -1,6 +1,6 @@
-import { jsxs as x, jsx as r } from "react/jsx-runtime";
-import T, { useState as _, useEffect as I } from "react";
-import h from "prismjs";
+import { jsx as r, jsxs as k } from "react/jsx-runtime";
+import v, { useState as y, useEffect as N } from "react";
+import b from "prismjs";
 import "prismjs/components/prism-javascript.js";
 import "prismjs/components/prism-typescript.js";
 import "prismjs/components/prism-python.js";
@@ -9,136 +9,131 @@ import "prismjs/components/prism-json.js";
 import "prismjs/components/prism-markdown.js";
 import "prismjs/components/prism-csharp.js";
 import "prismjs/components/prism-powershell.js";
-import { getNodeText as j } from "../../utils/get-node-text.js";
-import { capitalize as A } from "../../utils/string.js";
-import { cn as g } from "../../utils/cn.js";
-import { ClipboardCheckmarkRegular as R, Copy20Regular as S } from "@fluentui/react-icons";
-const E = ["image/png", "text/plain"];
-function P() {
-  const [t, e] = _(!1), i = async (n) => {
+import { getNodeText as T } from "../../utils/get-node-text.js";
+import { cn as h } from "../../utils/cn.js";
+import { ClipboardCheckmarkRegular as B, Copy20Regular as I } from "@fluentui/react-icons";
+const A = ["image/png", "text/plain"];
+function w() {
+  const [t, e] = y(!1), o = async (m) => {
     try {
-      await navigator.clipboard.writeText(n), e(!0), setTimeout(() => e(!1), 2e3);
-    } catch (a) {
-      console.error("Failed to copy to clipboard:", a);
+      await navigator.clipboard.writeText(m), e(!0), setTimeout(() => e(!1), 2e3);
+    } catch (c) {
+      console.error("Failed to copy to clipboard:", c);
     }
   };
-  return { isCopied: t, copy: i, copyBlob: async (n, a) => {
+  return { isCopied: t, copy: o, copyBlob: async (m, c) => {
     try {
-      if (E.includes(a)) {
-        const o = await n.arrayBuffer(), m = new Blob([o], { type: a }), u = new ClipboardItem({
-          [a]: m
+      if (A.includes(c)) {
+        const n = await m.arrayBuffer(), a = new Blob([n], { type: c }), i = new ClipboardItem({
+          [c]: a
         });
-        await navigator.clipboard.write([u]), e(!0), setTimeout(() => e(!1), 2e3);
+        await navigator.clipboard.write([i]), e(!0), setTimeout(() => e(!1), 2e3);
       } else {
-        const o = await n.text();
-        await i(o);
+        const n = await m.text();
+        await o(n);
       }
-    } catch (o) {
-      console.error("Failed to copy blob to clipboard:", o);
+    } catch (n) {
+      console.error("Failed to copy blob to clipboard:", n);
       try {
-        const m = await n.text();
-        await i(m);
-      } catch (m) {
-        console.error("Failed to copy as text fallback:", m);
+        const a = await m.text();
+        await o(a);
+      } catch (a) {
+        console.error("Failed to copy as text fallback:", a);
       }
     }
   } };
 }
-function F({ onClick: t, isCopied: e, showTooltip: i = !0 }) {
-  return /* @__PURE__ */ x("div", { className: "mint:relative", children: [
-    i && e && /* @__PURE__ */ r("div", { className: "mint:absolute mint:bottom-[calc(100%+0.5rem)] mint:left-1/2 mint:-translate-x-1/2 mint:bg-white mint:dark:bg-[#1a1a1a] mint:text-[#171717] mint:dark:text-[#fafafa] mint:px-2.5 mint:py-1.5 mint:rounded-md mint:text-xs mint:font-medium mint:whitespace-nowrap mint:shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-1px_rgba(0,0,0,0.06)] mint:dark:shadow-[0_4px_6px_-1px_rgba(0,0,0,0.3),0_2px_4px_-1px_rgba(0,0,0,0.2)] mint:z-10 mint:animate-[fadeIn_0.15s_ease-out] mint:after:content-[''] mint:after:absolute mint:after:top-full mint:after:left-1/2 mint:after:-translate-x-1/2 mint:after:w-0 mint:after:h-0 mint:after:border-l-[6px] mint:after:border-l-transparent mint:after:border-r-[6px] mint:after:border-r-transparent mint:after:border-t-[6px] mint:after:border-t-white mint:dark:after:border-t-[#1a1a1a]", children: "Copied!" }),
+function R({ onClick: t, isCopied: e, showTooltip: o = !0 }) {
+  return /* @__PURE__ */ k("div", { className: "mint:relative", children: [
+    o && e && /* @__PURE__ */ r("div", { className: "mint:absolute mint:bottom-[calc(100%+0.5rem)] mint:left-1/2 mint:-translate-x-1/2 mint:bg-white mint:dark:bg-[#1a1a1a] mint:text-[#171717] mint:dark:text-[#fafafa] mint:px-2.5 mint:py-1.5 mint:rounded-md mint:text-xs mint:font-medium mint:whitespace-nowrap mint:shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-1px_rgba(0,0,0,0.06)] mint:dark:shadow-[0_4px_6px_-1px_rgba(0,0,0,0.3),0_2px_4px_-1px_rgba(0,0,0,0.2)] mint:z-10 mint:animate-[fadeIn_0.15s_ease-out] mint:after:content-[''] mint:after:absolute mint:after:top-full mint:after:left-1/2 mint:after:-translate-x-1/2 mint:after:w-0 mint:after:h-0 mint:after:border-l-[6px] mint:after:border-l-transparent mint:after:border-r-[6px] mint:after:border-r-transparent mint:after:border-t-[6px] mint:after:border-t-white mint:dark:after:border-t-[#1a1a1a]", children: "Copied!" }),
     /* @__PURE__ */ r(
       "button",
       {
         onClick: t,
         className: "mint:flex mint:items-center mint:gap-1.5 mint:px-2 mint:py-1 mint:text-xs mint:text-[#737373] mint:dark:text-[#a3a3a3] mint:rounded mint:transition-colors mint:duration-150 mint:border-none mint:bg-transparent mint:cursor-pointer mint:hover:text-[#9263f1] mint:dark:hover:text-[#c9aaf9]",
         "aria-label": e ? "Copied" : "Copy code",
-        children: e ? /* @__PURE__ */ r(R, { className: "mint:w-5 mint:h-5 mint:text-[#737373] mint:dark:text-[#a3a3a3]" }) : /* @__PURE__ */ r(S, { className: "mint:w-5 mint:h-5" })
+        children: e ? /* @__PURE__ */ r(B, { className: "mint:w-5 mint:h-5 mint:text-[#737373] mint:dark:text-[#a3a3a3]" }) : /* @__PURE__ */ r(I, { className: "mint:w-5 mint:h-5" })
       }
     )
   ] });
 }
-function W({
+function q({ textToCopy: t, showTooltip: e = !0 }) {
+  const { isCopied: o, copy: p } = w();
+  return /* @__PURE__ */ r(R, { onClick: () => {
+    p(t);
+  }, isCopied: o, showTooltip: e });
+}
+function G({
   children: t,
   className: e,
-  fileName: i,
-  language: y,
-  blob: n,
-  contentType: a
+  fileName: o,
+  language: p,
+  blob: m,
+  contentType: c
 }) {
-  const [o, m] = _(""), { isCopied: u, copy: k, copyBlob: C } = P(), s = y || (e == null ? void 0 : e.replace(/^language-/, "")) || "text", c = j(t), v = !!i, b = T.useMemo(() => {
-    var d, w;
+  const [n, a] = y("");
+  w();
+  const i = p || (e == null ? void 0 : e.replace(/^language-/, "")) || "text", d = T(t), _ = !!o, u = v.useMemo(() => {
+    var f, g;
     if (typeof t != "object" || t == null)
       return !1;
-    const p = Array.isArray(t) ? t : [t];
-    for (const l of p)
-      if (typeof l == "object" && l != null && "props" in l && ((d = l.props) != null && d.children)) {
-        const B = Array.isArray(l.props.children) ? l.props.children : [l.props.children];
-        for (const f of B)
-          if (typeof f == "object" && f != null && "props" in f && ((w = f.props) != null && w.className))
+    const s = Array.isArray(t) ? t : [t];
+    for (const l of s)
+      if (typeof l == "object" && l != null && "props" in l && ((f = l.props) != null && f.children)) {
+        const C = Array.isArray(l.props.children) ? l.props.children : [l.props.children];
+        for (const x of C)
+          if (typeof x == "object" && x != null && "props" in x && ((g = x.props) != null && g.className))
             return !0;
       }
     return !1;
   }, [t]);
-  I(() => {
-    if (!b)
+  return N(() => {
+    if (!u)
       try {
-        const p = h.languages[s] || h.languages.plaintext, d = h.highlight(c, p, s);
-        m(d);
-      } catch (p) {
-        console.error("Failed to highlight code:", p), m(c);
+        const s = b.languages[i] || b.languages.plaintext, f = b.highlight(d, s, i);
+        a(f);
+      } catch (s) {
+        console.error("Failed to highlight code:", s), a(d);
       }
-  }, [c, s, b]);
-  const N = () => {
-    n && a ? C(n, a) : k(c);
-  };
-  return /* @__PURE__ */ x(
+  }, [d, i, u]), /* @__PURE__ */ r(
     "div",
     {
-      className: v ? "flex flex-col gap-2 mt-4 mb-4 border border-[#e5e5e5] dark:border-[#262626] pt-2.5 px-2 pb-2 rounded-xl overflow-hidden" : void 0,
-      children: [
-        i && /* @__PURE__ */ r("span", { className: "mint:text-sm mint:font-medium mint:px-2", children: i }),
-        /* @__PURE__ */ x("div", { className: "not-prose mint:relative mint:rounded-xl mint:bg-[#f5f5f5] mint:dark:bg-[#141414]", children: [
-          /* @__PURE__ */ x("div", { className: "mint:flex mint:items-center mint:justify-between mint:px-4 mint:pt-2", children: [
-            /* @__PURE__ */ r("span", { className: "mint:text-xs mint:font-medium mint:text-[#737373] mint:dark:text-[#a3a3a3]", children: A(s) }),
-            /* @__PURE__ */ r(F, { onClick: N, isCopied: u })
-          ] }),
-          /* @__PURE__ */ r("div", { className: "mint:code-scrollbar mint:overflow-x-auto", children: /* @__PURE__ */ r("pre", { className: "mint:px-4 mint:pb-3 mint:pt-2 mint:m-0 mint:whitespace-pre mint:text-sm", children: b ? /* @__PURE__ */ r(
-            "code",
-            {
-              className: g(
-                `language-${s}`,
-                "mint:block mint:text-[#24292e] mint:dark:text-[#e6edf3]"
-              ),
-              children: t
-            }
-          ) : o ? /* @__PURE__ */ r(
-            "code",
-            {
-              className: g(
-                `language-${s}`,
-                "mint:block mint:text-[#24292e] mint:dark:text-[#e6edf3]"
-              ),
-              dangerouslySetInnerHTML: { __html: o }
-            }
-          ) : /* @__PURE__ */ r(
-            "code",
-            {
-              className: g(
-                `language-${s}`,
-                "mint:block mint:text-[#24292e] mint:dark:text-[#e6edf3]"
-              ),
-              children: c
-            }
-          ) }) })
-        ] })
-      ]
+      className: _ ? "flex flex-col gap-2 mt-4 mb-4 border border-[#e5e5e5] dark:border-[#262626] pt-2.5 px-2 pb-2 rounded-xl overflow-hidden" : void 0,
+      children: /* @__PURE__ */ r("div", { className: "not-prose mint:relative mint:rounded-xl mint:bg-[#f5f5f5] mint:dark:bg-[#141414]", children: /* @__PURE__ */ r("div", { className: "mint:code-scrollbar mint:overflow-x-auto", children: /* @__PURE__ */ r("pre", { className: "mint:px-4 mint:pb-3 mint:pt-2 mint:m-0 mint:whitespace-pre mint:text-sm", children: u ? /* @__PURE__ */ r(
+        "code",
+        {
+          className: h(
+            `language-${i}`,
+            "mint:block mint:text-[#24292e] mint:dark:text-[#e6edf3]"
+          ),
+          children: t
+        }
+      ) : n ? /* @__PURE__ */ r(
+        "code",
+        {
+          className: h(
+            `language-${i}`,
+            "mint:block mint:text-[#24292e] mint:dark:text-[#e6edf3]"
+          ),
+          dangerouslySetInnerHTML: { __html: n }
+        }
+      ) : /* @__PURE__ */ r(
+        "code",
+        {
+          className: h(
+            `language-${i}`,
+            "mint:block mint:text-[#24292e] mint:dark:text-[#e6edf3]"
+          ),
+          children: d
+        }
+      ) }) }) })
     }
   );
 }
 export {
-  W as CodeBlock,
-  F as CopyIconButton,
-  P as useCopyToClipboard
+  G as CodeBlock,
+  R as CopyIconButton,
+  q as CopyToClipboardButton,
+  w as useCopyToClipboard
 };
 //# sourceMappingURL=code-block.js.map