@oxide/design-system 3.2.0--canary.151.18509831946.0 → 3.2.0--canary.151.18510677674.0

package/dist/components/src/index.js

@@ -1,31 +1,2514 @@
+// components/src/asciidoc/index.tsx
+import asciidoctor2 from "@asciidoctor/core";
+import { Content as Content4 } from "@oxide/react-asciidoc";
+
+// components/src/asciidoc/Admonition.tsx
+import { Content, parse, Title } from "@oxide/react-asciidoc";
+
+// components/src/utils.ts
+import cn from "classnames";
+import { createElement } from "react";
+var titleCase = (text) => {
+  return text.replace(
+    /\w\S*/g,
+    (text2) => text2.charAt(0).toUpperCase() + text2.substring(1).toLowerCase()
+  );
+};
+var make = (tag) => (
+  // only one argument here means string interpolations are not allowed
+  (strings) => {
+    const Comp = ({ className, children, ...rest }) => createElement(tag, { className: cn(strings[0], className), ...rest }, children);
+    Comp.displayName = `classed.${tag}`;
+    return Comp;
+  }
+);
+var classed = {
+  button: make("button"),
+  div: make("div"),
+  h1: make("h1"),
+  h2: make("h2"),
+  h3: make("h3"),
+  h4: make("h4"),
+  hr: make("hr"),
+  header: make("header"),
+  input: make("input"),
+  label: make("label"),
+  li: make("li"),
+  main: make("main"),
+  ol: make("ol"),
+  p: make("p"),
+  span: make("span"),
+  table: make("table"),
+  tbody: make("tbody"),
+  td: make("td"),
+  th: make("th"),
+  tr: make("tr")
+};
+
+// components/src/asciidoc/Admonition.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var Admonition = ({ node }) => {
+  const attrs2 = node.attributes;
+  let icon;
+  if (attrs2.name === "caution") {
+    icon = /* @__PURE__ */ jsx(Error12, {});
+  } else if (attrs2.name === "warning") {
+    icon = /* @__PURE__ */ jsx(Warning12, {});
+  } else {
+    icon = /* @__PURE__ */ jsx(Error12, { className: "rotate-180" });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `admonitionblock ${attrs2.name}`, children: [
+    /* @__PURE__ */ jsx("div", { className: "admonition-icon", children: icon }),
+    /* @__PURE__ */ jsxs("div", { className: "admonition-content content", children: [
+      /* @__PURE__ */ jsx(Title, { text: node.title }),
+      /* @__PURE__ */ jsx("div", { children: titleCase(attrs2.name.toString()) }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(Title, { text: node.title }),
+        node.content && parse(node.content),
+        /* @__PURE__ */ jsx(Content, { blocks: node.blocks })
+      ] })
+    ] })
+  ] });
+};
+var Error12 = ({ className }) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "12",
+    height: "12",
+    viewBox: "0 0 12 12",
+    xmlns: "http://www.w3.org/2000/svg",
+    className,
+    children: /* @__PURE__ */ jsx(
+      "path",
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M6 12A6 6 0 1 0 6 0a6 6 0 0 0 0 12Zm.083-9c.368 0 .667.299.667.667v2.666A.667.667 0 0 1 6.083 7h-.166a.667.667 0 0 1-.667-.667V3.667c0-.368.299-.667.667-.667h.166Zm0 5c.368 0 .667.299.667.667v.166a.667.667 0 0 1-.667.667h-.166a.667.667 0 0 1-.667-.667v-.166c0-.368.299-.667.667-.667h.166Z",
+        fill: "currentColor"
+      }
+    )
+  }
+);
+var Warning12 = ({ className }) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "12",
+    height: "12",
+    viewBox: "0 0 12 12",
+    xmlns: "http://www.w3.org/2000/svg",
+    className,
+    children: /* @__PURE__ */ jsx(
+      "path",
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M6 12A6 6 0 1 0 6 0a6 6 0 0 0 0 12Zm.083-9c.368 0 .667.299.667.667v2.666A.667.667 0 0 1 6.083 7h-.166a.667.667 0 0 1-.667-.667V3.667c0-.368.299-.667.667-.667h.166Zm0 5c.368 0 .667.299.667.667v.166a.667.667 0 0 1-.667.667h-.166a.667.667 0 0 1-.667-.667v-.166c0-.368.299-.667.667-.667h.166Z",
+        fill: "currentColor"
+      }
+    )
+  }
+);
+var Admonition_default = Admonition;
+
+// icons/react/Link16Icon.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var Link16Icon = ({ title, titleId, ...props }) => /* @__PURE__ */ jsxs2(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    viewBox: "0 0 16 16",
+    role: "img",
+    "aria-labelledby": titleId,
+    ...props,
+    children: [
+      title ? /* @__PURE__ */ jsx2("title", { id: titleId, children: title }) : null,
+      /* @__PURE__ */ jsxs2("g", { fill: "currentColor", children: [
+        /* @__PURE__ */ jsx2("path", { d: "m6.586 12.243 1.59-1.591a.75.75 0 0 1 1.061 0l.354.353a.75.75 0 0 1 0 1.06L8 13.658A4 4 0 0 1 2.343 8l1.591-1.591a.75.75 0 0 1 1.06 0l.354.354a.75.75 0 0 1 0 1.06l-1.59 1.591a2 2 0 1 0 2.828 2.829M12.066 9.591a.75.75 0 0 1-1.06 0l-.354-.354a.75.75 0 0 1 0-1.06l1.59-1.591a2 2 0 1 0-2.828-2.829l-1.59 1.591a.75.75 0 0 1-1.061 0l-.354-.353a.75.75 0 0 1 0-1.06L8 2.342A4 4 0 0 1 13.657 8z" }),
+        /* @__PURE__ */ jsx2("path", { d: "M9.945 5.702a.75.75 0 0 0-1.061 0L5.702 8.884a.75.75 0 0 0 0 1.06l.353.354a.75.75 0 0 0 1.061 0l3.182-3.182a.75.75 0 0 0 0-1.06z" })
+      ] })
+    ]
+  }
+);
+var Link16Icon_default = Link16Icon;
+
+// icons/react/Checkmark12Icon.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var Checkmark12Icon = ({
+  title,
+  titleId,
+  ...props
+}) => /* @__PURE__ */ jsxs3(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 12,
+    height: 12,
+    viewBox: "0 0 12 12",
+    role: "img",
+    "aria-labelledby": titleId,
+    ...props,
+    children: [
+      title ? /* @__PURE__ */ jsx3("title", { id: titleId, children: title }) : null,
+      /* @__PURE__ */ jsx3(
+        "path",
+        {
+          fill: "currentColor",
+          fillRule: "evenodd",
+          d: "M10.492 2.651c.28.242.31.665.067.944L5.448 9.463a.667.667 0 0 1-.974.035L1.475 6.516a.667.667 0 0 1 0-.946l.237-.235a.667.667 0 0 1 .94 0l2.24 2.226L9.3 2.501a.667.667 0 0 1 .938-.068z",
+          clipRule: "evenodd"
+        }
+      )
+    ]
+  }
+);
+var Checkmark12Icon_default = Checkmark12Icon;
+
+// icons/react/DirectionRightIcon.tsx
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var DirectionRightIcon = ({
+  title,
+  titleId,
+  ...props
+}) => /* @__PURE__ */ jsxs4(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 12,
+    height: 12,
+    viewBox: "0 0 12 12",
+    role: "img",
+    "aria-labelledby": titleId,
+    ...props,
+    children: [
+      title ? /* @__PURE__ */ jsx4("title", { id: titleId, children: title }) : null,
+      /* @__PURE__ */ jsx4(
+        "path",
+        {
+          fill: "currentColor",
+          d: "M8.807 6.597a.667.667 0 0 0 0-1.194l-5.842-2.92A.667.667 0 0 0 2 3.079v5.842c0 .496.522.818.965.596z"
+        }
+      )
+    ]
+  }
+);
+var DirectionRightIcon_default = DirectionRightIcon;
+
+// icons/react/SelectArrows6Icon.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var SelectArrows6Icon = ({
+  title,
+  titleId,
+  ...props
+}) => /* @__PURE__ */ jsxs5(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 6,
+    height: 14,
+    viewBox: "0 0 6 14",
+    role: "img",
+    "aria-labelledby": titleId,
+    ...props,
+    children: [
+      title ? /* @__PURE__ */ jsx5("title", { id: titleId, children: title }) : null,
+      /* @__PURE__ */ jsx5(
+        "path",
+        {
+          fill: "currentColor",
+          fillRule: "evenodd",
+          d: "M3.322.536a.375.375 0 0 0-.644 0L.341 4.432C.19 4.682.37 5 .662 5h4.676a.375.375 0 0 0 .321-.568zm-.644 12.928a.375.375 0 0 0 .644 0l2.337-3.896A.375.375 0 0 0 5.338 9H.662a.375.375 0 0 0-.321.568z",
+          clipRule: "evenodd"
+        }
+      )
+    ]
+  }
+);
+var SelectArrows6Icon_default = SelectArrows6Icon;
+
+// components/src/asciidoc/Section.tsx
+import { Content as Content2, parse as parse2 } from "@oxide/react-asciidoc";
+import cn2 from "classnames";
+import { createElement as createElement2 } from "react";
+import { Fragment, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var stripAnchors = (str) => str.replace(/<a[^>]*>(.*?)<\/a>/gi, "$1");
+var Section = ({ node }) => {
+  const level = node.level;
+  let title = "";
+  let sectNum = node.num;
+  sectNum = sectNum && sectNum[0] === "." ? "" : sectNum;
+  title = /* @__PURE__ */ jsxs6(Fragment, { children: [
+    /* @__PURE__ */ jsx6("span", { className: "anchor", id: node.id || "", "aria-hidden": "true" }),
+    /* @__PURE__ */ jsxs6("a", { className: "link group", href: `#${node.id}`, children: [
+      parse2(stripAnchors(node.title)),
+      /* @__PURE__ */ jsx6(Link16Icon_default, { className: "text-accent-secondary ml-2 hidden group-hover:inline-block" })
+    ] })
+  ] });
+  if (level === 0) {
+    return /* @__PURE__ */ jsxs6(Fragment, { children: [
+      /* @__PURE__ */ jsx6("h1", { className: cn2("sect0", node.role), "data-sectnum": sectNum, children: title }),
+      /* @__PURE__ */ jsx6(Content2, { blocks: node.blocks })
+    ] });
+  } else {
+    return /* @__PURE__ */ jsxs6("div", { className: cn2(`sect${level}`, node.role), children: [
+      createElement2(`h${level + 1}`, { "data-sectnum": sectNum }, title),
+      /* @__PURE__ */ jsx6("div", { className: "sectionbody", children: /* @__PURE__ */ jsx6(Content2, { blocks: node.blocks }) })
+    ] });
+  }
+};
+var Section_default = Section;
+
+// components/src/asciidoc/Table.tsx
+import { Table as InnerTable } from "@oxide/react-asciidoc";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var Table = ({ node }) => /* @__PURE__ */ jsx7("div", { className: "table-wrapper", children: /* @__PURE__ */ jsx7(InnerTable, { node }) });
+var Table_default = Table;
+
+// components/src/asciidoc/TableOfContents.tsx
+import { parse as parse3 } from "@oxide/react-asciidoc";
+import * as Accordion from "@radix-ui/react-accordion";
+import cn3 from "classnames";
+import { Fragment as Fragment2, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function useIntersectionObserver(elements, callback, options) {
+  const [observer, setObserver] = useState(null);
+  useEffect(() => {
+    const observer2 = new IntersectionObserver(callback, options);
+    setObserver(observer2);
+    return () => {
+      observer2.disconnect();
+    };
+  }, [callback, options]);
+  useEffect(() => {
+    if (observer) {
+      for (const element of elements) {
+        observer.observe(element);
+      }
+    }
+    return () => {
+      if (observer) {
+        for (const element of elements) {
+          observer.unobserve(element);
+        }
+      }
+    };
+  }, [elements, observer]);
+  return observer;
+}
+var THRESHOLD = [...Array(2e3).keys()].map((n) => n / 2e3);
+function isTopLevelSection(element) {
+  return element.classList.contains("sect1");
+}
+function findParentSection(element) {
+  const sect2Wrapper = element.closest(".sect2");
+  return sect2Wrapper ? sect2Wrapper : element.closest(".sect1");
+}
+function newSection(node, element, wrapper, parent) {
+  return {
+    node,
+    element,
+    wrapper,
+    parent,
+    children: []
+  };
+}
+function buildSectionTree(elements) {
+  const sections = [];
+  let parent = null;
+  for (let i = 0; i < elements.length; i++) {
+    const element = elements[i];
+    const parentWrapper = findParentSection(element);
+    if (parentWrapper) {
+      if (parentWrapper && isTopLevelSection(parentWrapper)) {
+        const section = newSection(i, element, parentWrapper, null);
+        sections.push(section);
+        parent = section;
+      } else {
+        if (parent === null) {
+          return [];
+        } else {
+          const section = newSection(i, element, parentWrapper, parent.node);
+          parent.children.push(i);
+          sections.push(section);
+        }
+      }
+    } else {
+      return [];
+    }
+  }
+  return sections;
+}
+function maxIndex(nums) {
+  return nums.reduce((maxIndex2, current, currentIndex) => {
+    const currentMax = maxIndex2 !== void 0 ? nums[maxIndex2] : 0;
+    return current > currentMax ? currentIndex : maxIndex2;
+  }, void 0);
+}
+function useActiveSectionTracking(initialSections, onSectionChange, debug = false) {
+  const [sectionWrappers, setSectionWrappers] = useState(
+    buildSectionTree(initialSections)
+  );
+  const sectionMeasurements = useRef([]);
+  const setSections = useCallback(
+    (sections) => {
+      setSectionWrappers(buildSectionTree(sections));
+      sectionMeasurements.current = [];
+    },
+    [setSectionWrappers]
+  );
+  const wrapperActivator = useCallback(
+    (entries) => {
+      for (const entry of entries) {
+        const index = sectionWrappers.findIndex((node) => node.wrapper === entry.target);
+        const covered = entry.intersectionRect.height / (entry.rootBounds?.height || 1);
+        sectionMeasurements.current[index] = covered;
+      }
+      const ownedSectionSizes = sectionWrappers.map((section) => {
+        const childSizes = section.children.map((c) => sectionMeasurements.current[c]).reduce((c, a) => c + a, 0);
+        return sectionMeasurements.current[section.node] - childSizes;
+      });
+      const activeSectionIndex = maxIndex(ownedSectionSizes);
+      if (activeSectionIndex !== void 0) {
+        onSectionChange(sectionWrappers[activeSectionIndex].element);
+      }
+    },
+    [sectionWrappers, onSectionChange]
+  );
+  const wrapperSettings = useMemo(
+    () => ({ threshold: THRESHOLD, rootMargin: `-15% 0px -70% 0px` }),
+    []
+  );
+  const bindableWrappers = useMemo(
+    () => sectionWrappers.map((s) => s.wrapper),
+    [sectionWrappers]
+  );
+  const sectionObserver = useIntersectionObserver(
+    bindableWrappers,
+    wrapperActivator,
+    wrapperSettings
+  );
+  let debugNode = null;
+  if (debug && sectionObserver?.root === null) {
+    const edges = sectionObserver.rootMargin.split(" ").map((margin) => {
+      if (margin.endsWith("%")) {
+        return parseInt(margin) * -1 + "%";
+      } else if (margin.endsWith("px")) {
+        return parseInt(margin) * -1 + "px";
+      } else {
+        return "0px";
+      }
+    });
+    debugNode = /* @__PURE__ */ jsx8(
+      "div",
+      {
+        style: {
+          position: "fixed",
+          top: edges[0],
+          right: edges[1],
+          bottom: edges[2],
+          left: edges[3],
+          background: "rgba(255, 92, 170, 0.2)",
+          border: "1px solid rgba(255, 92, 170)",
+          pointerEvents: "none",
+          zIndex: 500
+        }
+      }
+    );
+  }
+  return {
+    setSections,
+    debugNode
+  };
+}
+var DesktopOutline = ({
+  toc,
+  activeItem,
+  className
+}) => {
+  const renderToc = (sections) => {
+    return sections.map((item) => /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx8(
+        "li",
+        {
+          "data-level": item.level,
+          className: cn3("text-sans-sm mb-0 list-none", item.level > 2 && "hidden"),
+          children: /* @__PURE__ */ jsx8(
+            "a",
+            {
+              href: `#${item.id}`,
+              className: cn3(
+                "block border-l py-[4px] pr-4",
+                activeItem === item.id ? "active text-accent-secondary border-accent-secondary hover:text-accent" : "text-tertiary border-secondary hover:text-secondary"
+              ),
+              style: {
+                paddingLeft: `${0.5 + item.level * 0.5}rem`
+              },
+              children: parse3(stripAnchors(item.title))
+            }
+          )
+        }
+      ),
+      item.sections && renderToc(item.sections)
+    ] }, item.id));
+  };
+  if (toc && toc.length > 0) {
+    return /* @__PURE__ */ jsx8("ul", { className: cn3("toc w-(--toc-width)", className), children: renderToc(toc) });
+  }
+  return null;
+};
+var SmallScreenOutline = ({
+  toc,
+  activeItem,
+  className
+}) => {
+  const [value, setValue] = useState("");
+  const renderToc = (sections) => {
+    return sections.map((item) => /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx8(
+        "li",
+        {
+          "data-level": item.level,
+          className: cn3("text-sans-sm list-none", item.level > 2 && "hidden"),
+          children: /* @__PURE__ */ jsx8(
+            "a",
+            {
+              href: `#${item.id}`,
+              onClick: () => setValue(""),
+              className: cn3(
+                "block border-l py-[4px]",
+                activeItem === item.id ? "active text-accent-secondary border-accent-secondary hover:text-accent" : "text-tertiary border-secondary hover:text-secondary"
+              ),
+              style: {
+                paddingLeft: `${0.5 + item.level * 0.5}rem`
+              },
+              children: parse3(stripAnchors(item.title))
+            }
+          )
+        }
+      ),
+      item.sections && renderToc(item.sections)
+    ] }, item.id));
+  };
+  if (toc && toc.length > 0) {
+    return /* @__PURE__ */ jsx8(
+      Accordion.Root,
+      {
+        type: "single",
+        className: cn3(
+          "toc bg-default border-secondary sticky top-[calc(var(--header-height)-1px)] z-10 -mt-px mb-10 block w-full border-b border-t print:hidden",
+          className
+        ),
+        collapsible: true,
+        value,
+        onValueChange: setValue,
+        children: /* @__PURE__ */ jsxs7(Accordion.Item, { value: "toc", children: [
+          /* @__PURE__ */ jsx8(Accordion.Header, { children: /* @__PURE__ */ jsxs7(Accordion.Trigger, { className: "text-sans-md text-default hover:bg-hover px-(--container-px) flex h-12 w-full items-center justify-between [&>svg]:data-[state=open]:rotate-90", children: [
+            "Table of Contents",
+            " ",
+            /* @__PURE__ */ jsx8(DirectionRightIcon_default, { className: "text-tertiary transition-all" })
+          ] }) }),
+          /* @__PURE__ */ jsx8(Accordion.Content, { className: "animated-accordion hydrated border-secondary px-(--container-px) max-h-[60vh] w-full overflow-y-scroll border-t", children: /* @__PURE__ */ jsx8("div", { className: "py-4", children: renderToc(toc) }) })
+        ] })
+      }
+    );
+  }
+  return null;
+};
+
+// components/src/asciidoc/use-delegated-links.ts
+import { useEffect as useEffect2 } from "react";
+function useDelegatedReactRouterLinks(navigate, nodeRef, key) {
+  useEffect2(() => {
+    const node = nodeRef.current;
+    const handler = (event) => {
+      if (!nodeRef.current) return;
+      if (!(event.target instanceof HTMLElement)) return;
+      const a = event.target.closest("a");
+      if (a && // is anchor or has anchor parent
+      a.hasAttribute("href") && // has an href
+      a.host === window.location.host && // is internal
+      event.button === 0 && // left click
+      (!a.target || a.target === "_self") && // Let browser handle "target=_blank" etc.
+      !(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey)) {
+        event.preventDefault();
+        const { pathname, search, hash } = a;
+        navigate({ pathname, search, hash });
+      }
+    };
+    if (!node) return;
+    node.addEventListener("click", handler);
+    return () => {
+      node?.removeEventListener("click", handler);
+    };
+  }, [navigate, nodeRef, key]);
+}
+
+// components/src/asciidoc/util.ts
+import asciidoctor from "@asciidoctor/core";
 import {
-  AsciiDocBlocks,
-  Badge,
-  Button,
-  Checkbox,
-  DesktopOutline,
-  InlineConverter,
-  Listbox,
-  SmallScreenOutline,
-  Spinner,
-  SpinnerLoader,
-  Tabs,
-  attrs,
-  badgeColors,
-  buttonSizes,
-  buttonStyle,
-  handleDocument,
-  highlight,
-  loadAsciidoctor,
-  renderWithBreaks,
-  spinnerSizes,
-  spinnerVariants,
-  useActiveSectionTracking,
-  useDelegatedReactRouterLinks,
-  useIntersectionObserver,
-  variants
-} from "../../chunk-XPHTG73Y.js";
-import "../../chunk-BTKC2KJ2.js";
+  prepareDocument,
+  processDocument
+} from "@oxide/react-asciidoc";
+import {
+  bundledLanguages,
+  createHighlighter
+} from "shiki";
+
+// components/src/asciidoc/langs/oxql.tmLanguage.json
+var oxql_tmLanguage_default = {
+  $schema: "https://raw.githubusercontent.com/martinring/tmlanguage/master/tmlanguage.json",
+  name: "oxql",
+  repository: {
+    keywords: {
+      patterns: [
+        {
+          name: "keyword.control.oxql",
+          match: "\\b(if|while|for|return)\\b"
+        }
+      ]
+    },
+    strings: {
+      name: "string.quoted.double.oxql",
+      begin: '"',
+      end: '"',
+      patterns: [
+        {
+          name: "constant.character.escape.oxql",
+          match: "\\\\."
+        }
+      ]
+    }
+  },
+  scopeName: "source.oxql",
+  patterns: [
+    {
+      name: "keyword.control.oxql",
+      match: "\\b(get|join|align|filter|group_by)\\b"
+    },
+    {
+      name: "string.quoted.double.oxql",
+      begin: '"',
+      end: '"',
+      patterns: [
+        {
+          name: "constant.character.escape.oxql",
+          match: "\\\\."
+        }
+      ]
+    },
+    {
+      name: "constant.numeric.oxql",
+      match: "\\b\\d+[smhdw]\\b"
+    },
+    {
+      name: "constant.numeric.datetime.oxql",
+      match: "@\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}"
+    },
+    {
+      name: "constant.numeric.function.oxql",
+      match: "@now\\(\\)"
+    },
+    {
+      name: "constant.numeric.oxql",
+      match: "\\b\\d+\\b"
+    },
+    {
+      name: "comment.block.oxql",
+      begin: "/\\*",
+      end: "\\*/"
+    },
+    {
+      name: "comment.line.double-slash.oxql",
+      match: "//.*$"
+    },
+    {
+      name: "keyword.operator.oxql",
+      match: "\\|"
+    }
+  ]
+};
+
+// components/src/asciidoc/oxide-dark.json
+var oxide_dark_default = {
+  name: "Oxide Dark",
+  colors: {
+    "editor.background": "#080F11",
+    "editor.foreground": "#E7E7E8"
+  },
+  tokenColors: [
+    {
+      scope: [
+        "text",
+        "source",
+        "variable.other.readwrite",
+        "punctuation.definition.variable"
+      ],
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "punctuation",
+      settings: {
+        foreground: "#A1A4A5",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["comment", "punctuation.definition.comment"],
+      settings: {
+        foreground: "#A1A4A5"
+      }
+    },
+    {
+      scope: ["string", "punctuation.definition.string"],
+      settings: {
+        foreground: "#68D9A7"
+      }
+    },
+    {
+      scope: "constant.character.escape",
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: [
+        "constant.numeric",
+        "variable.other.constant",
+        "entity.name.constant",
+        "constant.language.boolean",
+        "constant.language.false",
+        "constant.language.true",
+        "keyword.other.unit.user-defined",
+        "keyword.other.unit.suffix.floating-point"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "keyword",
+        "keyword.operator.word",
+        "keyword.operator.new",
+        "variable.language.super",
+        "support.type.primitive",
+        "storage.type",
+        "storage.modifier",
+        "punctuation.definition.keyword"
+      ],
+      settings: {
+        foreground: "#C6A5EA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "entity.name.tag.documentation",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: [
+        "keyword.operator",
+        "punctuation.accessor",
+        "punctuation.definition.generic",
+        "meta.function.closure punctuation.section.parameters",
+        "punctuation.definition.tag",
+        "punctuation.separator.key-value"
+      ],
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: [
+        "entity.name.function",
+        "meta.function-call.method",
+        "support.function",
+        "support.function.misc",
+        "variable.function"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "entity.name.class",
+        "entity.other.inherited-class",
+        "support.class",
+        "meta.function-call.constructor",
+        "entity.name.struct"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "entity.name.enum",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: ["meta.enum variable.other.readwrite", "variable.other.enummember"],
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "meta.property.object",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: ["meta.type", "meta.type-alias", "support.type", "entity.name.type"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "meta.annotation variable.function",
+        "meta.annotation variable.annotation.function",
+        "meta.annotation punctuation.definition.annotation",
+        "meta.decorator",
+        "punctuation.decorator"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: ["variable.parameter", "meta.function.parameters"],
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: ["constant.language", "support.function.builtin"],
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: "entity.other.attribute-name.documentation",
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: ["keyword.control.directive", "punctuation.definition.directive"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "punctuation.definition.typeparameters",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "entity.name.namespace",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "support.type.property-name.css",
+      settings: {
+        foreground: "#9DAFFA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: [
+        "variable.language.this",
+        "variable.language.this punctuation.definition.variable"
+      ],
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: "variable.object.property",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: ["string.template variable", "string variable"],
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "keyword.operator.new",
+      settings: {
+        fontStyle: "bold"
+      }
+    },
+    {
+      scope: "storage.modifier.specifier.extern.cpp",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: [
+        "entity.name.scope-resolution.template.call.cpp",
+        "entity.name.scope-resolution.parameter.cpp",
+        "entity.name.scope-resolution.cpp",
+        "entity.name.scope-resolution.function.definition.cpp"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "storage.type.class.doxygen",
+      settings: {
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["storage.modifier.reference.cpp"],
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "meta.interpolation.cs",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "comment.block.documentation.cs",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: [
+        "source.css entity.other.attribute-name.class.css",
+        "entity.other.attribute-name.parent-selector.css punctuation.definition.entity.css"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "punctuation.separator.operator.css",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "source.css entity.other.attribute-name.pseudo-class",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "source.css constant.other.unicode-range",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "source.css variable.parameter.url",
+      settings: {
+        foreground: "#88DCB7",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["support.type.vendored.property-name"],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "source.css meta.property-value variable",
+        "source.css meta.property-value variable.other.less",
+        "source.css meta.property-value variable.other.less punctuation.definition.variable.less",
+        "meta.definition.variable.scss"
+      ],
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: [
+        "source.css meta.property-list variable",
+        "meta.property-list variable.other.less",
+        "meta.property-list variable.other.less punctuation.definition.variable.less"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "keyword.other.unit.percentage.css",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "source.css meta.attribute-selector",
+      settings: {
+        foreground: "#88DCB7"
+      }
+    },
+    {
+      scope: [
+        "keyword.other.definition.ini",
+        "punctuation.support.type.property-name.json",
+        "support.type.property-name.json",
+        "punctuation.support.type.property-name.toml",
+        "support.type.property-name.toml",
+        "entity.name.tag.yaml",
+        "punctuation.support.type.property-name.yaml",
+        "support.type.property-name.yaml"
+      ],
+      settings: {
+        foreground: "#9DAFFA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["constant.language.json", "constant.language.yaml"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: ["entity.name.type.anchor.yaml", "variable.other.alias.yaml"],
+      settings: {
+        foreground: "#EDD5A6",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["support.type.property-name.table", "entity.name.section.group-title.ini"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.other.time.datetime.offset.toml",
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: ["punctuation.definition.anchor.yaml", "punctuation.definition.alias.yaml"],
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "entity.other.document.begin.yaml",
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "markup.changed.diff",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "meta.diff.header.from-file",
+        "meta.diff.header.to-file",
+        "punctuation.definition.from-file.diff",
+        "punctuation.definition.to-file.diff"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "markup.inserted.diff",
+      settings: {
+        foreground: "#88DCB7"
+      }
+    },
+    {
+      scope: "markup.deleted.diff",
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: ["variable.other.env"],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: ["string.quoted variable.other.env"],
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "support.function.builtin.gdscript",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "constant.language.gdscript",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "comment meta.annotation.go",
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: "comment meta.annotation.parameters.go",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.language.go",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "variable.graphql",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "string.unquoted.alias.graphql",
+      settings: {
+        foreground: "#F2CDCD"
+      }
+    },
+    {
+      scope: "constant.character.enum.graphql",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "meta.objectvalues.graphql constant.object.key.graphql string.unquoted.graphql",
+      settings: {
+        foreground: "#F2CDCD"
+      }
+    },
+    {
+      scope: [
+        "keyword.other.doctype",
+        "meta.tag.sgml.doctype punctuation.definition.tag",
+        "meta.tag.metadata.doctype entity.name.tag",
+        "meta.tag.metadata.doctype punctuation.definition.tag"
+      ],
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: ["entity.name.tag"],
+      settings: {
+        foreground: "#9DAFFA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: [
+        "text.html constant.character.entity",
+        "text.html constant.character.entity punctuation",
+        "constant.character.entity.xml",
+        "constant.character.entity.xml punctuation",
+        "constant.character.entity.js.jsx",
+        "constant.charactger.entity.js.jsx punctuation",
+        "constant.character.entity.tsx",
+        "constant.character.entity.tsx punctuation"
+      ],
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: ["entity.other.attribute-name"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "support.class.component",
+        "support.class.component.jsx",
+        "support.class.component.tsx",
+        "support.class.component.vue"
+      ],
+      settings: {
+        foreground: "#EFB7C2",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["punctuation.definition.annotation", "storage.type.annotation"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.other.enum.java",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "storage.modifier.import.java",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "comment.block.javadoc.java keyword.other.documentation.javadoc.java",
+      settings: {
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "meta.export variable.other.readwrite.js",
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: [
+        "variable.other.constant.js",
+        "variable.other.constant.ts",
+        "variable.other.property.js",
+        "variable.other.property.ts"
+      ],
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: ["variable.other.jsdoc", "comment.block.documentation variable.other"],
+      settings: {
+        foreground: "#F39EAE",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "storage.type.class.jsdoc",
+      settings: {
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "support.type.object.console.js",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: ["support.constant.node", "support.type.object.module.js"],
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "storage.modifier.implements",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: [
+        "constant.language.null.js",
+        "constant.language.null.ts",
+        "constant.language.undefined.js",
+        "constant.language.undefined.ts",
+        "support.type.builtin.ts"
+      ],
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "variable.parameter.generic",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: ["keyword.declaration.function.arrow.js", "storage.type.function.arrow.ts"],
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "punctuation.decorator.ts",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "keyword.operator.expression.in.js",
+        "keyword.operator.expression.in.ts",
+        "keyword.operator.expression.infer.ts",
+        "keyword.operator.expression.instanceof.js",
+        "keyword.operator.expression.instanceof.ts",
+        "keyword.operator.expression.is",
+        "keyword.operator.expression.keyof.ts",
+        "keyword.operator.expression.of.js",
+        "keyword.operator.expression.of.ts",
+        "keyword.operator.expression.typeof.ts"
+      ],
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "support.function.macro.julia",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "constant.language.julia",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.other.symbol.julia",
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: "text.tex keyword.control.preamble",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "text.tex support.function.be",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "constant.other.general.math.tex",
+      settings: {
+        foreground: "#F2CDCD"
+      }
+    },
+    {
+      scope: "comment.line.double-dash.documentation.lua storage.type.annotation.lua",
+      settings: {
+        foreground: "#C6A5EA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: [
+        "comment.line.double-dash.documentation.lua entity.name.variable.lua",
+        "comment.line.double-dash.documentation.lua variable.lua"
+      ],
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: [
+        "heading.1.markdown punctuation.definition.heading.markdown",
+        "heading.1.markdown",
+        "heading.1.quarto punctuation.definition.heading.quarto",
+        "heading.1.quarto",
+        "markup.heading.atx.1.mdx",
+        "markup.heading.atx.1.mdx punctuation.definition.heading.mdx",
+        "markup.heading.setext.1.markdown",
+        "markup.heading.heading-0.asciidoc"
+      ],
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: [
+        "heading.2.markdown punctuation.definition.heading.markdown",
+        "heading.2.markdown",
+        "heading.2.quarto punctuation.definition.heading.quarto",
+        "heading.2.quarto",
+        "markup.heading.atx.2.mdx",
+        "markup.heading.atx.2.mdx punctuation.definition.heading.mdx",
+        "markup.heading.setext.2.markdown",
+        "markup.heading.heading-1.asciidoc"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "heading.3.markdown punctuation.definition.heading.markdown",
+        "heading.3.markdown",
+        "heading.3.quarto punctuation.definition.heading.quarto",
+        "heading.3.quarto",
+        "markup.heading.atx.3.mdx",
+        "markup.heading.atx.3.mdx punctuation.definition.heading.mdx",
+        "markup.heading.heading-2.asciidoc"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "heading.4.markdown punctuation.definition.heading.markdown",
+        "heading.4.markdown",
+        "heading.4.quarto punctuation.definition.heading.quarto",
+        "heading.4.quarto",
+        "markup.heading.atx.4.mdx",
+        "markup.heading.atx.4.mdx punctuation.definition.heading.mdx",
+        "markup.heading.heading-3.asciidoc"
+      ],
+      settings: {
+        foreground: "#88DCB7"
+      }
+    },
+    {
+      scope: [
+        "heading.5.markdown punctuation.definition.heading.markdown",
+        "heading.5.markdown",
+        "heading.5.quarto punctuation.definition.heading.quarto",
+        "heading.5.quarto",
+        "markup.heading.atx.5.mdx",
+        "markup.heading.atx.5.mdx punctuation.definition.heading.mdx",
+        "markup.heading.heading-4.asciidoc"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "heading.6.markdown punctuation.definition.heading.markdown",
+        "heading.6.markdown",
+        "heading.6.quarto punctuation.definition.heading.quarto",
+        "heading.6.quarto",
+        "markup.heading.atx.6.mdx",
+        "markup.heading.atx.6.mdx punctuation.definition.heading.mdx",
+        "markup.heading.heading-5.asciidoc"
+      ],
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "markup.bold",
+      settings: {
+        foreground: "#F7869B",
+        fontStyle: "bold"
+      }
+    },
+    {
+      scope: "markup.italic",
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: "markup.strikethrough",
+      settings: {
+        foreground: "#A6ADC8",
+        fontStyle: "strikethrough"
+      }
+    },
+    {
+      scope: ["punctuation.definition.link", "markup.underline.link"],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "text.html.markdown punctuation.definition.link.title",
+        "text.html.quarto punctuation.definition.link.title",
+        "string.other.link.title.markdown",
+        "string.other.link.title.quarto",
+        "markup.link",
+        "punctuation.definition.constant.markdown",
+        "punctuation.definition.constant.quarto",
+        "constant.other.reference.link.markdown",
+        "constant.other.reference.link.quarto",
+        "markup.substitution.attribute-reference"
+      ],
+      settings: {
+        foreground: "#B4BEFE"
+      }
+    },
+    {
+      scope: [
+        "punctuation.definition.raw.markdown",
+        "punctuation.definition.raw.quarto",
+        "markup.inline.raw.string.markdown",
+        "markup.inline.raw.string.quarto",
+        "markup.raw.block.markdown",
+        "markup.raw.block.quarto"
+      ],
+      settings: {
+        foreground: "#88DCB7"
+      }
+    },
+    {
+      scope: "fenced_code.block.language",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "markup.fenced_code.block punctuation.definition",
+        "markup.raw support.asciidoc"
+      ],
+      settings: {
+        foreground: "#A1A4A5"
+      }
+    },
+    {
+      scope: ["markup.quote", "punctuation.definition.quote.begin"],
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "meta.separator.markdown",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: [
+        "punctuation.definition.list.begin.markdown",
+        "punctuation.definition.list.begin.quarto",
+        "markup.list.bullet"
+      ],
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "markup.heading.quarto",
+      settings: {
+        fontStyle: "bold"
+      }
+    },
+    {
+      scope: [
+        "entity.other.attribute-name.multipart.nix",
+        "entity.other.attribute-name.single.nix"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "variable.parameter.name.nix",
+      settings: {
+        foreground: "#E7E7E8",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "meta.embedded variable.parameter.name.nix",
+      settings: {
+        foreground: "#B4BEFE",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "string.unquoted.path.nix",
+      settings: {
+        foreground: "#EFB7C2",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["support.attribute.builtin", "meta.attribute.php"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "meta.function.parameters.php punctuation.definition.variable.php",
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: "constant.language.php",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "text.html.php support.function",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "keyword.other.phpdoc.php",
+      settings: {
+        fontStyle: ""
+      }
+    },
+    {
+      scope: ["support.variable.magic.python", "meta.function-call.arguments.python"],
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: ["support.function.magic.python"],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "variable.parameter.function.language.special.self.python",
+        "variable.language.special.self.python"
+      ],
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: ["keyword.control.flow.python", "keyword.operator.logical.python"],
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "storage.type.function.python",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: [
+        "support.token.decorator.python",
+        "meta.function.decorator.identifier.python"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: ["meta.function-call.python"],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "entity.name.function.decorator.python",
+        "punctuation.definition.decorator.python"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.character.format.placeholder.other.python",
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: ["support.type.exception.python", "support.function.builtin.python"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: ["support.type.python"],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.language.python",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: ["meta.indexed-name.python", "meta.item-access.python"],
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: "storage.type.string.python",
+      settings: {
+        foreground: "#88DCB7"
+      }
+    },
+    {
+      scope: "meta.function.parameters.python",
+      settings: {
+        fontStyle: ""
+      }
+    },
+    {
+      scope: [
+        "string.regexp punctuation.definition.string.begin",
+        "string.regexp punctuation.definition.string.end"
+      ],
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "keyword.control.anchor.regexp",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "string.regexp.ts",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: [
+        "punctuation.definition.group.regexp",
+        "keyword.other.back-reference.regexp"
+      ],
+      settings: {
+        foreground: "#88DCB7"
+      }
+    },
+    {
+      scope: "punctuation.definition.character-class.regexp",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "constant.other.character-class.regexp",
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "constant.other.character-class.range.regexp",
+      settings: {
+        foreground: "#F5E0DC"
+      }
+    },
+    {
+      scope: "keyword.operator.quantifier.regexp",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "constant.character.numeric.regexp",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "punctuation.definition.group.no-capture.regexp",
+        "meta.assertion.look-ahead.regexp",
+        "meta.assertion.negative-look-ahead.regexp"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: [
+        "meta.annotation.rust",
+        "meta.annotation.rust punctuation",
+        "meta.attribute.rust",
+        "punctuation.definition.attribute.rust"
+      ],
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "meta.attribute.rust string.quoted.double.rust",
+        "meta.attribute.rust string.quoted.single.char.rust"
+      ],
+      settings: {
+        fontStyle: ""
+      }
+    },
+    {
+      scope: [
+        "entity.name.function.macro.rules.rust",
+        "storage.type.module.rust",
+        "storage.modifier.rust",
+        "storage.type.struct.rust",
+        "storage.type.enum.rust",
+        "storage.type.trait.rust",
+        "storage.type.union.rust",
+        "storage.type.impl.rust",
+        "storage.type.rust",
+        "storage.type.function.rust",
+        "storage.type.type.rust"
+      ],
+      settings: {
+        foreground: "#C6A5EA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "entity.name.type.numeric.rust",
+      settings: {
+        foreground: "#C6A5EA",
+        fontStyle: ""
+      }
+    },
+    {
+      scope: "meta.generic.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "entity.name.impl.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "entity.name.module.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "entity.name.trait.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "storage.type.source.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "entity.name.union.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: "meta.enum.rust storage.type.source.rust",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: [
+        "support.macro.rust",
+        "meta.macro.rust support.function.rust",
+        "entity.name.function.macro.rust"
+      ],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: ["storage.modifier.lifetime.rust", "entity.name.type.lifetime"],
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "string.quoted.double.rust constant.other.placeholder.rust",
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "meta.function.return-type.rust meta.generic.rust storage.type.rust",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "meta.function.call.rust",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "punctuation.brackets.angle.rust",
+      settings: {
+        foreground: "#9DAFFA"
+      }
+    },
+    {
+      scope: "constant.other.caps.rust",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: ["meta.function.definition.rust variable.other.rust"],
+      settings: {
+        foreground: "#F39EAE"
+      }
+    },
+    {
+      scope: "meta.function.call.rust variable.other.rust",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "variable.language.self.rust",
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: [
+        "variable.other.metavariable.name.rust",
+        "meta.macro.metavariable.rust keyword.operator.macro.dollar.rust"
+      ],
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: [
+        "comment.line.shebang",
+        "comment.line.shebang punctuation.definition.comment",
+        "comment.line.shebang",
+        "punctuation.definition.comment.shebang.shell",
+        "meta.shebang.shell"
+      ],
+      settings: {
+        foreground: "#EFB7C2"
+      }
+    },
+    {
+      scope: "comment.line.shebang constant.language",
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: [
+        "meta.function-call.arguments.shell punctuation.definition.variable.shell",
+        "meta.function-call.arguments.shell punctuation.section.interpolation",
+        "meta.function-call.arguments.shell punctuation.definition.variable.shell",
+        "meta.function-call.arguments.shell punctuation.section.interpolation"
+      ],
+      settings: {
+        foreground: "#F7869B"
+      }
+    },
+    {
+      scope: "meta.string meta.interpolation.parameter.shell variable.other.readwrite",
+      settings: {
+        foreground: "#EDD5A6"
+      }
+    },
+    {
+      scope: [
+        "source.shell punctuation.section.interpolation",
+        "punctuation.definition.evaluation.backticks.shell"
+      ],
+      settings: {
+        foreground: "#A7E0C8"
+      }
+    },
+    {
+      scope: "entity.name.tag.heredoc.shell",
+      settings: {
+        foreground: "#C6A5EA"
+      }
+    },
+    {
+      scope: "string.quoted.double.shell variable.other.normal.shell",
+      settings: {
+        foreground: "#E7E7E8"
+      }
+    },
+    {
+      scope: "token.info-token",
+      settings: {
+        foreground: "#8BA1FF"
+      }
+    },
+    {
+      scope: "token.warn-token",
+      settings: {
+        foreground: "#F5B944"
+      }
+    },
+    {
+      scope: "token.error-token",
+      settings: {
+        foreground: "#FB6E88"
+      }
+    },
+    {
+      scope: "token.debug-token",
+      settings: {
+        foreground: "#BE95EB"
+      }
+    }
+  ]
+};
+
+// components/src/asciidoc/util.ts
+var highlighter = null;
+var customLanguages = ["oxql"];
+var supportedLanguages = [...Object.keys(bundledLanguages), ...customLanguages];
+async function getOrCreateHighlighter() {
+  if (!highlighter) {
+    const langs = [];
+    langs.push({
+      ...oxql_tmLanguage_default
+    });
+    highlighter = await createHighlighter({
+      themes: [oxide_dark_default],
+      langs
+    });
+  }
+  return highlighter;
+}
+var highlight = async (block) => {
+  if (block.type === "listing") {
+    const literalBlock = block;
+    if (!literalBlock.content) {
+      return block;
+    }
+    const calloutRegex = /<i class="conum" data-value="\d+"><\/i>/g;
+    const callouts = [];
+    const placeholderContent = literalBlock.content.replace(calloutRegex, (match) => {
+      callouts.push(match);
+      return `__CALLOUT_PLACEHOLDER_${callouts.length - 1}__`;
+    });
+    if (!literalBlock.language) {
+      return {
+        ...block,
+        content: placeholderContent.replace(
+          /__CALLOUT_PLACEHOLDER_(\d+)__/g,
+          (_, index) => callouts[parseInt(index)]
+        )
+      };
+    }
+    let lang = literalBlock.language;
+    const h = await getOrCreateHighlighter();
+    const loadedLanguages = h.getLoadedLanguages();
+    if (!supportedLanguages.includes(lang)) {
+      lang = "text";
+    }
+    if (!loadedLanguages.includes(lang)) {
+      await h.loadLanguage(lang);
+    }
+    const highlightedContent = h.codeToHtml(placeholderContent, {
+      lang,
+      theme: oxide_dark_default,
+      structure: "inline"
+    });
+    const restoredContent = highlightedContent.replace(
+      /__CALLOUT_PLACEHOLDER_(\d+)__/g,
+      (_, index) => callouts[parseInt(index)]
+    );
+    return {
+      ...block,
+      content: restoredContent
+    };
+  }
+  return block;
+};
+var attrs = {
+  sectlinks: "true",
+  stem: "latexmath",
+  stylesheet: false
+};
+var loadAsciidoctor = ({
+  extensions = []
+}) => {
+  const ad2 = asciidoctor();
+  class InlineConverter2 {
+    baseConverter;
+    constructor() {
+      this.baseConverter = new ad2.Html5Converter();
+    }
+    convert(node, transform) {
+      switch (node.getNodeName()) {
+        case "inline_callout":
+          return convertInlineCallout(node);
+        // We know this is always inline
+        default:
+          break;
+      }
+      return this.baseConverter.convert(node, transform);
+    }
+  }
+  extensions.forEach((extension) => ad2.Extensions.register(extension));
+  ad2.ConverterFactory.register(new InlineConverter2(), ["html5"]);
+  return ad2;
+};
+function convertInlineCallout(node) {
+  return `<i class="conum" data-value="${node.getText()}"></i>`;
+}
+var handleDocument = async (document) => {
+  const doc = prepareDocument(document);
+  return await processDocument(doc, highlight);
+};
+
+// components/src/asciidoc/index.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var MinimalDocument = ({ document }) => /* @__PURE__ */ jsx9("div", { id: "content", className: "asciidoc-body w-full", children: /* @__PURE__ */ jsx9(Content4, { blocks: document.blocks }) });
+var AsciiDocBlocks = {
+  Admonition: Admonition_default,
+  Table: Table_default,
+  Section: Section_default,
+  MinimalDocument
+};
+var renderWithBreaks = (text) => {
+  return text.split(/(<[^>]*>)/g).map((segment) => {
+    if (segment.startsWith("<") && segment.endsWith(">")) {
+      return segment;
+    }
+    return segment.replace(/(?:^|(?<=\S))\/(?=\S)/g, "/<wbr/>");
+  }).join("");
+};
+var QUOTE_TAGS = {
+  "monospaced": ["<code>", "</code>", true],
+  "emphasis": ["<em>", "</em>", true],
+  "strong": ["<strong>", "</strong>", true],
+  "double": ["&#8220;", "&#8221;"],
+  "single": ["&#8216;", "&#8217;"],
+  "mark": ["<mark>", "</mark>", true],
+  "superscript": ["<sup>", "</sup>", true],
+  "subscript": ["<sub>", "</sub>", true],
+  "unquoted": ["<span>", "</span>", true],
+  "asciimath": ["\\$", "\\$"],
+  "latexmath": ["\\(", "\\)"]
+};
+var chop = (str) => str.substring(0, str.length - 1);
+var convertInlineQuoted = (node) => {
+  const type = node.getType();
+  const quoteTag = QUOTE_TAGS[type];
+  const [open, close, tag] = quoteTag || ["", ""];
+  let text = node.getText();
+  if (type === "monospaced") {
+    text = renderWithBreaks(text);
+  }
+  const id = node.getId();
+  const role = node.getRole();
+  const idAttr = id ? `id="${id}"` : "";
+  const classAttr = role ? `class="${role}"` : "";
+  const attrs2 = `${idAttr} ${classAttr}`;
+  if (id || role) {
+    if (tag) {
+      return `${chop(open)} ${attrs2}>${text}${close}`;
+    } else {
+      return `<span ${attrs2}>${open}${text}${close}</span>`;
+    }
+  } else {
+    return `${open}${text}${close}`;
+  }
+};
+function convertInlineCallout2(node) {
+  return `<i class="conum" data-value="${node.getText()}"></i>`;
+}
+var ad = asciidoctor2();
+var InlineConverter = class {
+  baseConverter;
+  constructor() {
+    this.baseConverter = new ad.Html5Converter();
+  }
+  convert(node, transform) {
+    switch (node.getNodeName()) {
+      case "inline_quoted":
+        return convertInlineQuoted(node);
+      // We know this is always inline
+      case "inline_callout":
+        return convertInlineCallout2(node);
+      // We know this is always inline
+      default:
+        break;
+    }
+    return this.baseConverter.convert(node, transform);
+  }
+};
+
+// components/src/ui/badge/Badge.tsx
+import cn4 from "classnames";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var badgeColors = {
+  default: {
+    default: "bg-accent-secondary text-accent ring-accent/15",
+    destructive: "bg-destructive-secondary text-destructive ring-destructive/15",
+    notice: "bg-notice-secondary text-notice ring-notice/15",
+    blue: "bg-blue-200 text-blue-800 ring-blue-800/15",
+    purple: "bg-purple-200 text-purple-800 ring-purple-800/15",
+    neutral: "bg-secondary text-default ring-neutral-700/15"
+  },
+  solid: {
+    default: "bg-accent text-inverse",
+    destructive: "bg-destructive text-inverse",
+    notice: "bg-notice text-inverse",
+    neutral: "bg-inverse-tertiary text-inverse",
+    purple: "bg-purple-700 text-inverse",
+    blue: "bg-info text-inverse"
+  }
+};
+var Badge = ({
+  className,
+  children,
+  color = "default",
+  variant = "default"
+}) => {
+  return /* @__PURE__ */ jsx10(
+    "span",
+    {
+      className: cn4(
+        "ox-badge ring ring-inset",
+        `variant-${variant}`,
+        "text-mono-sm inline-flex h-4 items-center whitespace-nowrap rounded-sm px-[3px] py-[1px] uppercase",
+        badgeColors[variant][color],
+        className
+      ),
+      children: /* @__PURE__ */ jsx10("span", { children })
+    }
+  );
+};
+
+// components/src/ui/button/Button.tsx
+import cn5 from "classnames";
+import { forwardRef } from "react";
+import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+var buttonSizes = ["sm", "icon", "base"];
+var variants = ["primary", "secondary", "ghost", "danger"];
+var sizeStyle = {
+  sm: "h-8 px-3 text-mono-sm svg:w-4",
+  // meant for buttons that only contain a single icon
+  icon: "h-8 w-8 text-mono-sm svg:w-4",
+  base: "h-10 px-4 text-mono-sm svg:w-5"
+};
+var buttonStyle = ({
+  size: size2 = "base",
+  variant = "primary"
+} = {}) => {
+  return cn5(
+    "ox-button inline-flex items-center justify-center rounded align-top elevation-1 disabled:cursor-not-allowed",
+    `btn-${variant}`,
+    sizeStyle[size2],
+    variant === "danger" ? "focus:outline-destructive-secondary" : "focus:outline-accent-secondary"
+  );
+};
+var noop = (e) => {
+  e.stopPropagation();
+  e.preventDefault();
+};
+var Button = forwardRef(
+  ({
+    type = "button",
+    children,
+    size: size2,
+    variant,
+    className,
+    loading,
+    innerClassName,
+    disabled,
+    onClick,
+    // needs to be a spread because we sometimes get passed arbitrary <button>
+    // props by the parent
+    ...rest
+  }, ref) => {
+    const isDisabled = disabled || loading;
+    return /* @__PURE__ */ jsxs8(
+      "button",
+      {
+        className: cn5(buttonStyle({ size: size2, variant }), className, {
+          "visually-disabled": isDisabled
+        }),
+        ref,
+        type,
+        onMouseDown: isDisabled ? noop : void 0,
+        onClick: isDisabled ? noop : onClick,
+        "aria-disabled": isDisabled,
+        ...rest,
+        children: [
+          loading && /* @__PURE__ */ jsx11(Spinner, { className: "absolute", variant }),
+          /* @__PURE__ */ jsx11("span", { className: cn5("flex items-center", innerClassName, { invisible: loading }), children })
+        ]
+      }
+    );
+  }
+);
+
+// components/src/ui/spinner/Spinner.tsx
+import cn6 from "classnames";
+import { useEffect as useEffect3, useRef as useRef2, useState as useState2 } from "react";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
+var spinnerSizes = ["base", "lg"];
+var spinnerVariants = ["primary", "secondary", "ghost", "danger"];
+var Spinner = ({
+  className,
+  size: size2 = "base",
+  variant = "primary"
+}) => {
+  const frameSize = size2 === "lg" ? 36 : 12;
+  const center = size2 === "lg" ? 18 : 6;
+  const radius = size2 === "lg" ? 16 : 5;
+  const strokeWidth = size2 === "lg" ? 3 : 2;
+  return /* @__PURE__ */ jsxs9(
+    "svg",
+    {
+      width: frameSize,
+      height: frameSize,
+      viewBox: `0 0 ${frameSize + " " + frameSize}`,
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-labelledby": "Spinner",
+      className: cn6("spinner", `spinner-${variant}`, `spinner-${size2}`, className),
+      children: [
+        /* @__PURE__ */ jsx12(
+          "circle",
+          {
+            fill: "none",
+            className: "bg",
+            strokeWidth,
+            strokeLinecap: "round",
+            cx: center,
+            cy: center,
+            r: radius,
+            strokeOpacity: 0.2
+          }
+        ),
+        /* @__PURE__ */ jsx12(
+          "circle",
+          {
+            className: "path",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth,
+            strokeLinecap: "round",
+            cx: center,
+            cy: center,
+            r: radius
+          }
+        )
+      ]
+    }
+  );
+};
+var SpinnerLoader = ({ isLoading, children = null, minTime = 500 }) => {
+  const [isVisible, setIsVisible] = useState2(isLoading);
+  const hideTimeout = useRef2(null);
+  const loadingStartTime = useRef2(0);
+  useEffect3(() => {
+    if (isLoading) {
+      setIsVisible(true);
+      loadingStartTime.current = Date.now();
+    } else {
+      if (hideTimeout.current) clearTimeout(hideTimeout.current);
+      const elapsedTime = Date.now() - loadingStartTime.current;
+      const remainingTime = Math.max(0, minTime - elapsedTime);
+      if (remainingTime === 0) {
+        setIsVisible(false);
+      } else {
+        hideTimeout.current = setTimeout(() => setIsVisible(false), remainingTime);
+      }
+    }
+    return () => {
+      if (hideTimeout.current) clearTimeout(hideTimeout.current);
+    };
+  }, [isLoading, minTime]);
+  return isVisible ? /* @__PURE__ */ jsx12(Spinner, {}) : /* @__PURE__ */ jsx12(Fragment3, { children });
+};
+
+// components/src/ui/tabs/Tabs.tsx
+import { Content as Content5, List, Root as Root2, Trigger as Trigger2 } from "@radix-ui/react-tabs";
+import cn7 from "classnames";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Tabs = {
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx13(Root2, { ...props, className: cn7("ox-tabs", className) }),
+  Trigger: ({ children, className, ...props }) => /* @__PURE__ */ jsx13(Trigger2, { ...props, className: cn7("ox-tab", className), children: /* @__PURE__ */ jsx13("div", { children }) }),
+  List: ({ className, ...props }) => /* @__PURE__ */ jsx13(List, { ...props, className: cn7("ox-tabs-list", className) }),
+  Content: ({ className, ...props }) => /* @__PURE__ */ jsx13(Content5, { ...props, className: cn7("ox-tabs-panel", className) })
+};
+
+// components/src/ui/checkbox/Checkbox.tsx
+import cn8 from "classnames";
+import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
+var Check = () => /* @__PURE__ */ jsx14(Checkmark12Icon_default, { className: "text-accent pointer-events-none absolute left-0.5 top-0.5 h-3 w-3 fill-current" });
+var Indeterminate = classed.div`absolute w-2 h-0.5 left-1 top-[7px] bg-accent pointer-events-none`;
+var inputStyle = `
+  appearance-none border border-default bg-default h-4 w-4 rounded-sm absolute left-0 outline-none
+  disabled:cursor-not-allowed
+  hover:border-hover hover:cursor-pointer
+  checked:bg-accent-secondary checked:border-accent-secondary checked:hover:border-accent
+  indeterminate:bg-accent-secondary indeterminate:border-accent hover:indeterminate:bg-accent-secondary-hover
+`;
+var Checkbox = ({
+  indeterminate,
+  children,
+  className,
+  ...inputProps
+}) => /* @__PURE__ */ jsxs10("label", { className: "inline-flex items-center", children: [
+  /* @__PURE__ */ jsxs10("span", { className: "relative h-4 w-4", children: [
+    /* @__PURE__ */ jsx14(
+      "input",
+      {
+        className: cn8(inputStyle, className),
+        type: "checkbox",
+        ref: (el) => {
+          if (el) el.indeterminate = !!indeterminate;
+        },
+        ...inputProps
+      }
+    ),
+    inputProps.checked && !indeterminate && /* @__PURE__ */ jsx14(Check, {}),
+    indeterminate && /* @__PURE__ */ jsx14(Indeterminate, {})
+  ] }),
+  children && /* @__PURE__ */ jsx14("span", { className: "text-sans-md text-secondary ml-2.5", children })
+] });
+
+// components/src/ui/listbox/Listbox.tsx
+import { flip, FloatingPortal, offset, size, useFloating } from "@floating-ui/react";
+import { Listbox as Select } from "@headlessui/react";
+import cn9 from "classnames";
+import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+var Listbox = ({
+  name,
+  selected,
+  items,
+  placeholder = "Select an option",
+  className,
+  onChange,
+  hasError = false,
+  disabled,
+  isLoading = false,
+  ...props
+}) => {
+  const { refs, floatingStyles } = useFloating({
+    middleware: [
+      offset(12),
+      flip(),
+      size({
+        apply({ rects, elements }) {
+          Object.assign(elements.floating.style, {
+            width: `${rects.reference.width}px`
+          });
+        }
+      })
+    ]
+  });
+  const selectedItem = selected && items.find((i) => i.value === selected);
+  const noItems = !isLoading && items.length === 0;
+  const isDisabled = disabled || noItems;
+  return /* @__PURE__ */ jsx15("div", { className: cn9("relative", className), children: /* @__PURE__ */ jsx15(
+    Select,
+    {
+      value: selected,
+      onChange: (val) => val !== null && onChange(val),
+      disabled: isDisabled || isLoading,
+      children: ({ open }) => /* @__PURE__ */ jsxs11(Fragment4, { children: [
+        /* @__PURE__ */ jsxs11(
+          Select.Button,
+          {
+            name,
+            ref: refs.setReference,
+            className: cn9(
+              `text-sans-md flex h-10 w-full items-center justify-between rounded border`,
+              hasError ? "focus-error border-error-secondary hover:border-error" : "border-default hover:border-hover",
+              open && "ring-accent-secondary ring-2",
+              open && hasError && "ring-error-secondary",
+              isDisabled ? "text-disabled bg-disabled !border-default cursor-not-allowed" : "bg-default",
+              isDisabled && hasError && "!border-error-secondary"
+            ),
+            ...props,
+            children: [
+              /* @__PURE__ */ jsx15("div", { className: "w-full px-3 text-left", children: selectedItem ? (
+                // labelString is one line, which is what we need when label is a ReactNode
+                selectedItem.labelString || selectedItem.label
+              ) : /* @__PURE__ */ jsx15("span", { className: "text-quaternary", children: noItems ? "No items" : placeholder }) }),
+              !isDisabled && /* @__PURE__ */ jsx15(SpinnerLoader, { isLoading }),
+              /* @__PURE__ */ jsx15(
+                "div",
+                {
+                  className: "border-secondary ml-3 flex h-[calc(100%-12px)] items-center border-l px-3",
+                  "aria-hidden": true,
+                  children: /* @__PURE__ */ jsx15(SelectArrows6Icon_default, { className: "text-tertiary h-[14px] w-2" })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx15(FloatingPortal, { children: /* @__PURE__ */ jsx15(
+          Select.Options,
+          {
+            ref: refs.setFloating,
+            style: floatingStyles,
+            className: "ox-menu pointer-events-auto z-50 overflow-y-auto !outline-none",
+            children: items.map((item) => /* @__PURE__ */ jsx15(
+              Select.Option,
+              {
+                value: item.value,
+                className: "border-secondary relative border-b last:border-0",
+                children: ({ active, selected: selected2 }) => /* @__PURE__ */ jsx15(
+                  "div",
+                  {
+                    className: cn9(
+                      "ox-menu-item text-secondary",
+                      selected2 && "is-selected",
+                      active && "is-highlighted"
+                    ),
+                    children: item.label
+                  }
+                )
+              },
+              item.value
+            ))
+          }
+        ) })
+      ] })
+    }
+  ) });
+};
 export {
   AsciiDocBlocks,
   Badge,