@cloudvoyant/helix-react 0.16.0 → 0.17.0-rc.202609030336.1746ebf

package/dist/index.cjs

@@ -40,11 +40,17 @@ __export(index_exports, {
   CardHeader: () => CardHeader,
   CardTitle: () => CardTitle,
   Center: () => Center,
+  Chart: () => Chart,
   Checkbox: () => Checkbox,
   CheckboxControl: () => CheckboxControl,
   CheckboxGroup: () => CheckboxGroup,
   CheckboxIndicator: () => CheckboxIndicator,
   CheckboxLabel: () => CheckboxLabel,
+  CodeBlock: () => CodeBlock,
+  CodeBlockContent: () => CodeBlockContent,
+  CodeBlockCopyButton: () => CodeBlockCopyButton,
+  CodeBlockHeader: () => CodeBlockHeader,
+  CodeBlockTitle: () => CodeBlockTitle,
   Col: () => Col,
   Combobox: () => Combobox,
   ComboboxClear: () => ComboboxClear,
@@ -60,6 +66,7 @@ __export(index_exports, {
   ComboboxList: () => ComboboxList,
   ComboboxTrigger: () => ComboboxTrigger,
   Container: () => Container,
+  CopyButton: () => CopyButton,
   Dialog: () => Dialog,
   DialogBackdrop: () => DialogBackdrop,
   DialogContent: () => DialogContent,
@@ -79,10 +86,17 @@ __export(index_exports, {
   FieldSetError: () => FieldSetError,
   FieldSetHelper: () => FieldSetHelper,
   FieldSetLegend: () => FieldSetLegend,
+  Figure: () => Figure,
   HStack: () => HStack,
+  InlineLaTeX: () => InlineLaTeX,
   Input: () => Input2,
   Item: () => Item,
+  LaTeX: () => LaTeX,
+  LanguageTabsCodeBlock: () => LanguageTabsCodeBlock,
+  Manim: () => Manim,
   Mermaid: () => Mermaid,
+  MultiFileCodeBlock: () => MultiFileCodeBlock,
+  MultipleChoiceQuestion: () => MultipleChoiceQuestion,
   Navbar: () => Navbar,
   NavbarActions: () => NavbarActions,
   NavbarActivationArea: () => NavbarActivationArea,
@@ -102,11 +116,13 @@ __export(index_exports, {
   NavbarMobileOverlay: () => NavbarMobileOverlay,
   NavbarProvider: () => NavbarProvider,
   NavbarTrigger: () => NavbarTrigger,
+  Notice: () => Notice,
   NumberInput: () => NumberInput,
   NumberInputControl: () => NumberInputControl,
   NumberInputDecrement: () => NumberInputDecrement,
   NumberInputIncrement: () => NumberInputIncrement,
   NumberInputInput: () => NumberInputInput,
+  NumericQuestion: () => NumericQuestion,
   Page: () => Page,
   PageContent: () => PageContent,
   PageFooter: () => PageFooter,
@@ -128,6 +144,11 @@ __export(index_exports, {
   PopoverTitle: () => PopoverTitle,
   PopoverTrigger: () => PopoverTrigger,
   Portal: () => import_portal5.Portal,
+  PrevNext: () => PrevNext,
+  Quiz: () => Quiz,
+  RadioGroup: () => RadioGroup,
+  RadioGroupItem: () => RadioGroupItem,
+  Reveal: () => Reveal,
   Row: () => Row,
   Scroll: () => Scroll,
   Select: () => Select,
@@ -164,6 +185,7 @@ __export(index_exports, {
   SidebarRail: () => Rail,
   SidebarSeparator: () => Separator,
   SidebarTrigger: () => Trigger,
+  SingleChoiceQuestion: () => SingleChoiceQuestion,
   Splitter: () => Splitter,
   SplitterPanel: () => SplitterPanel,
   SplitterResizeTrigger: () => SplitterResizeTrigger,
@@ -205,6 +227,9 @@ __export(index_exports, {
   WindowResizeTrigger: () => WindowResizeTrigger,
   WindowStageTrigger: () => WindowStageTrigger,
   WindowTitle: () => WindowTitle,
+  YouTube: () => YouTube,
+  YoutubeTimestampAt: () => YoutubeTimestampAt,
+  YoutubeTimestamps: () => YoutubeTimestamps,
   navbarMenuTriggerStyle: () => import_helix49.navbarMenuTriggerStyle,
   useCheckbox: () => useCheckbox,
   useCombobox: () => useCombobox,
@@ -216,6 +241,7 @@ __export(index_exports, {
   useNumberInput: () => useNumberInput,
   usePopover: () => import_popover.usePopover,
   usePopoverContext: () => import_popover.usePopoverContext,
+  useRadioGroup: () => useRadioGroup,
   useSelect: () => useSelect,
   useSidebar: () => useSidebar,
   useSwitch: () => useSwitch,
@@ -2058,6 +2084,1113 @@ function Mermaid({ code, svg, className, ...props }) {
     }
   );
 }
+
+// src/clipboard.tsx
+var import_clipboard = require("@ark-ui/react/clipboard");
+var import_helix60 = require("@cloudvoyant/helix");
+var import_jsx_runtime59 = require("react/jsx-runtime");
+function CopyIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+      ]
+    }
+  );
+}
+function CheckIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("path", { d: "M20 6 9 17l-5-5" })
+    }
+  );
+}
+function CopyButton({ value, label = "Copy", className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_clipboard.ClipboardRoot, { value, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_clipboard.ClipboardTrigger, { className: (0, import_helix60.cn)(import_helix60.clipboardTriggerBase, className), "aria-label": label, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_clipboard.ClipboardIndicator, { copied: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(CheckIcon, {}), children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(CopyIcon, {}) }) }) });
+}
+
+// src/radio-group.tsx
+var import_radio_group = require("@ark-ui/react/radio-group");
+var import_helix61 = require("@cloudvoyant/helix");
+var import_jsx_runtime60 = require("react/jsx-runtime");
+function RadioGroup({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_radio_group.RadioGroupRoot, { className: (0, import_helix61.cn)(import_helix61.radioGroupRootBase, className), ...props });
+}
+function RadioGroupItem({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_radio_group.RadioGroupItem, { className: (0, import_helix61.cn)("flex cursor-pointer items-center gap-2.5", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_radio_group.RadioGroupItemControl, { className: import_helix61.radioGroupItemControlBase, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "size-1.5 rounded-full bg-current hidden [[data-state=checked]>&]:block" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_radio_group.RadioGroupItemText, { className: import_helix61.radioGroupItemTextBase, children }),
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_radio_group.RadioGroupItemHiddenInput, {})
+  ] });
+}
+var useRadioGroup = import_radio_group.useRadioGroupContext;
+
+// src/notice.tsx
+var import_factory36 = require("@ark-ui/react/factory");
+var import_helix62 = require("@cloudvoyant/helix");
+var import_jsx_runtime61 = require("react/jsx-runtime");
+function InfoIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "M12 16v-4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "M12 8h.01" })
+      ]
+    }
+  );
+}
+function CheckCircleIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "m9 12 2 2 4-4" })
+      ]
+    }
+  );
+}
+function TriangleAlertIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "M12 9v4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "M12 17h.01" })
+      ]
+    }
+  );
+}
+function CircleXIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "m15 9-6 6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "m9 9 6 6" })
+      ]
+    }
+  );
+}
+var noticeIcons = {
+  info: InfoIcon,
+  success: CheckCircleIcon,
+  warning: TriangleAlertIcon,
+  error: CircleXIcon
+};
+function Notice({ variant = "info", title, children, className, ...props }) {
+  const Icon = variant !== null && variant !== void 0 && variant !== "none" ? noticeIcons[variant] : null;
+  const role = variant === "error" ? "alert" : variant === "none" ? void 0 : "status";
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_factory36.ark.div, { role, className: (0, import_helix62.cn)((0, import_helix62.noticeVariants)({ variant }), className), ...props, children: [
+    Icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, {}) : null,
+    title ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_factory36.ark.div, { className: import_helix62.noticeTitleBase, children: title }) : null,
+    children ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_factory36.ark.div, { className: import_helix62.noticeDescriptionBase, children }) : null
+  ] });
+}
+
+// src/figure.tsx
+var import_factory37 = require("@ark-ui/react/factory");
+var import_helix63 = require("@cloudvoyant/helix");
+var import_jsx_runtime62 = require("react/jsx-runtime");
+function Figure({ src, alt, img, caption, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_factory37.ark.figure, { className: (0, import_helix63.cn)(import_helix63.figureRootBase, className), ...props, children: [
+    img ?? (src ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_factory37.ark.img, { src, alt, loading: "lazy", className: import_helix63.figureImageBase }) : null),
+    caption ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_factory37.ark.figcaption, { className: import_helix63.figureCaptionBase, children: caption }) : null
+  ] });
+}
+
+// src/reveal.tsx
+var import_collapsible2 = require("@ark-ui/react/collapsible");
+var import_helix64 = require("@cloudvoyant/helix");
+var import_jsx_runtime63 = require("react/jsx-runtime");
+function ChevronRightIcon({ className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("path", { d: "m9 18 6-6-6-6" })
+    }
+  );
+}
+function Reveal({ question, children, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_collapsible2.CollapsibleRoot, { className: (0, import_helix64.cn)(import_helix64.revealRootBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_collapsible2.CollapsibleTrigger, { className: import_helix64.revealTriggerBase, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ChevronRightIcon, { className: import_helix64.revealChevronBase }),
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: question })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_collapsible2.CollapsibleContent, { className: import_helix64.revealContentBase, children })
+  ] });
+}
+
+// src/prevnext.tsx
+var import_factory38 = require("@ark-ui/react/factory");
+var import_helix65 = require("@cloudvoyant/helix");
+var import_jsx_runtime64 = require("react/jsx-runtime");
+function PrevNext({ prev, next, className, ...props }) {
+  if (!prev && !next) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_factory38.ark.nav, { className: (0, import_helix65.cn)(import_helix65.prevNextRootBase, className), "aria-label": "Previous and next pages", ...props, children: [
+    prev ? /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_factory38.ark.a, { href: prev.href, className: import_helix65.prevNextLinkBase, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_factory38.ark.span, { className: import_helix65.prevNextDirectionBase, children: "Previous" }),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_factory38.ark.span, { className: import_helix65.prevNextTitleBase, children: [
+        "\u2190 ",
+        prev.title
+      ] })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_factory38.ark.span, { className: import_helix65.prevNextSpacerBase }),
+    next ? /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_factory38.ark.a, { href: next.href, className: (0, import_helix65.cn)(import_helix65.prevNextLinkBase, import_helix65.prevNextLinkNextBase), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_factory38.ark.span, { className: import_helix65.prevNextDirectionBase, children: "Next" }),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_factory38.ark.span, { className: import_helix65.prevNextTitleBase, children: [
+        next.title,
+        " \u2192"
+      ] })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_factory38.ark.span, { className: import_helix65.prevNextSpacerBase })
+  ] });
+}
+
+// src/latex.tsx
+var import_factory39 = require("@ark-ui/react/factory");
+var import_helix66 = require("@cloudvoyant/helix");
+var import_jsx_runtime65 = require("react/jsx-runtime");
+function LaTeX({ latex, html, className, ...props }) {
+  let markup;
+  let error = false;
+  if (html !== void 0) {
+    markup = html;
+  } else {
+    try {
+      markup = (0, import_helix66.toLaTeX)(latex, { displayMode: true });
+    } catch {
+      markup = latex;
+      error = true;
+    }
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    import_factory39.ark.div,
+    {
+      ...props,
+      "data-latex-state": error ? "error" : "done",
+      className: (0, import_helix66.cn)(import_helix66.latexRootBase, import_helix66.latexDisplayBase, className),
+      children: error ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("code", { className: import_helix66.latexErrorBase, children: latex }) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { dangerouslySetInnerHTML: { __html: markup } })
+    }
+  );
+}
+function InlineLaTeX({ latex, html, className, ...props }) {
+  let markup;
+  let error = false;
+  if (html !== void 0) {
+    markup = html;
+  } else {
+    try {
+      markup = (0, import_helix66.toLaTeX)(latex);
+    } catch {
+      markup = latex;
+      error = true;
+    }
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    import_factory39.ark.span,
+    {
+      ...props,
+      "data-latex-state": error ? "error" : "done",
+      className: (0, import_helix66.cn)(import_helix66.latexRootBase, import_helix66.latexInlineBase, className),
+      children: error ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("code", { className: import_helix66.latexErrorBase, children: latex }) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { dangerouslySetInnerHTML: { __html: markup } })
+    }
+  );
+}
+
+// src/code-block.tsx
+var import_react8 = require("react");
+var import_factory40 = require("@ark-ui/react/factory");
+var import_helix67 = require("@cloudvoyant/helix");
+var import_jsx_runtime66 = require("react/jsx-runtime");
+var CodeBlockContext = (0, import_react8.createContext)(null);
+function useCodeBlock() {
+  const ctx = (0, import_react8.useContext)(CodeBlockContext);
+  if (!ctx) throw new Error("CodeBlock parts must be rendered inside a <CodeBlock>.");
+  return ctx;
+}
+function CodeRenderer({ code, language, html, showLineNumbers, scrollable, maxHeight, highlightLines }) {
+  const [rendered, setRendered] = (0, import_react8.useState)(html ?? null);
+  (0, import_react8.useEffect)(() => {
+    (0, import_helix67.injectCodeBlockStyles)();
+  }, []);
+  const highlightKey = highlightLines?.join(",");
+  (0, import_react8.useEffect)(() => {
+    if (html !== void 0) return;
+    let cancelled = false;
+    setRendered(null);
+    (0, import_helix67.renderCodeToHtml)(code, language, highlightLines).then((h) => {
+      if (!cancelled) setRendered(h);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [code, language, html, highlightKey]);
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+    "div",
+    {
+      className: (0, import_helix67.cn)(import_helix67.codeBlockBodyBase, scrollable && import_helix67.codeBlockBodyScrollableBase),
+      style: scrollable ? { maxHeight: `${maxHeight}px` } : void 0,
+      children: rendered !== null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        "div",
+        {
+          dangerouslySetInnerHTML: { __html: rendered },
+          className: (0, import_helix67.cn)(
+            import_helix67.codeBlockContentBase,
+            showLineNumbers && import_helix67.codeBlockLineNumbersBase,
+            highlightLines?.length && import_helix67.codeBlockHighlightBase
+          )
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: import_helix67.codeBlockLoadingBase, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: import_helix67.codeBlockSpinnerBase }) })
+    }
+  );
+}
+function CodeBlock({
+  code,
+  language = "tsx",
+  filename,
+  html,
+  showLineNumbers = false,
+  scrollable = false,
+  maxHeight = 400,
+  highlightLines,
+  className,
+  children,
+  ...props
+}) {
+  const ctx = { code, language, html, showLineNumbers, scrollable, maxHeight, highlightLines };
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CodeBlockContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_factory40.ark.div, { "data-code-block": true, className: (0, import_helix67.cn)(import_helix67.codeBlockRootBase, className), ...props, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(CodeBlockHeader, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CodeBlockTitle, { children: filename ?? language }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "ml-auto", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CodeBlockCopyButton, {}) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CodeBlockContent, {})
+  ] }) }) });
+}
+function CodeBlockHeader({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_factory40.ark.div, { className: (0, import_helix67.cn)(import_helix67.codeBlockHeaderBase, className), ...props, children });
+}
+function CodeBlockTitle({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_factory40.ark.span, { className: (0, import_helix67.cn)(import_helix67.codeBlockTitleBase, className), ...props, children });
+}
+function CodeBlockCopyButton({ label = "Copy code", className, ...props }) {
+  const { code } = useCodeBlock();
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_factory40.ark.div, { className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CopyButton, { value: code, label }) });
+}
+function CodeBlockContent({ className, html, ...props }) {
+  const ctx = useCodeBlock();
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_factory40.ark.div, { className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CodeRenderer, { ...ctx, html: html ?? ctx.html }) });
+}
+function MultiFileCodeBlock({
+  files,
+  showLineNumbers = false,
+  scrollable = false,
+  maxHeight = 400,
+  className,
+  ...props
+}) {
+  const [active, setActive] = (0, import_react8.useState)(files[0]?.filename ?? "");
+  const file = files.find((f) => f.filename === active) ?? files[0];
+  (0, import_react8.useEffect)(() => {
+    if (!files.some((f) => f.filename === active)) {
+      setActive(files[0]?.filename ?? "");
+    }
+  }, [files, active]);
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_factory40.ark.div, { "data-code-block": true, className: (0, import_helix67.cn)(import_helix67.codeBlockRootBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "flex items-center justify-between border-b bg-muted/50", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { role: "tablist", "aria-label": "Files", className: "flex overflow-x-auto no-scrollbar pl-1", children: files.map((f) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        "button",
+        {
+          role: "tab",
+          "aria-selected": active === f.filename,
+          onClick: () => setActive(f.filename),
+          className: (0, import_helix67.cn)(
+            "h-10 shrink-0 border-b-2 px-3 font-mono text-xs transition-colors",
+            active === f.filename ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
+          ),
+          children: f.filename
+        },
+        f.filename
+      )) }),
+      file ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "shrink-0 pr-3", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CopyButton, { value: file.code, label: "Copy code" }) }) : null
+    ] }),
+    file ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      CodeRenderer,
+      {
+        code: file.code,
+        language: file.language ?? "tsx",
+        html: file.html,
+        showLineNumbers,
+        scrollable,
+        maxHeight
+      }
+    ) : null
+  ] });
+}
+function LanguageTabsCodeBlock({
+  tabs,
+  showLineNumbers = false,
+  scrollable = false,
+  maxHeight = 400,
+  className,
+  ...props
+}) {
+  const [active, setActive] = (0, import_react8.useState)(tabs[0]?.label ?? "");
+  const tab = tabs.find((t) => t.label === active) ?? tabs[0];
+  (0, import_react8.useEffect)(() => {
+    if (!tabs.some((t) => t.label === active)) {
+      setActive(tabs[0]?.label ?? "");
+    }
+  }, [tabs, active]);
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_factory40.ark.div, { "data-code-block": true, className: (0, import_helix67.cn)(import_helix67.codeBlockRootBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(CodeBlockHeader, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CodeBlockTitle, { children: tab?.filename }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "ml-auto", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+        Select,
+        {
+          items: tabs.map((t) => ({ value: t.label, label: t.label })),
+          value: [active],
+          onValueChange: (details) => setActive(details.value[0]),
+          "aria-label": "Language",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(SelectTrigger, { size: "sm", className: "min-w-28 justify-between font-mono text-xs", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SelectValue, {}),
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SelectIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                "svg",
+                {
+                  xmlns: "http://www.w3.org/2000/svg",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  "aria-hidden": "true",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("path", { d: "m6 9 6 6 6-6" })
+                }
+              ) })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SelectContent, { children: tabs.map((t) => /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(SelectItem, { item: { value: t.label, label: t.label }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SelectItemText, { children: t.label }),
+              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SelectItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                "svg",
+                {
+                  xmlns: "http://www.w3.org/2000/svg",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  "aria-hidden": "true",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("path", { d: "M20 6 9 17l-5-5" })
+                }
+              ) })
+            ] }, t.label)) })
+          ]
+        }
+      ) })
+    ] }),
+    tab ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "relative", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        CodeRenderer,
+        {
+          code: tab.code,
+          language: tab.language ?? "tsx",
+          html: tab.html,
+          showLineNumbers,
+          scrollable,
+          maxHeight
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: import_helix67.codeBlockCopyFloatBase, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CopyButton, { value: tab.code, label: "Copy code" }) })
+    ] }) : null
+  ] });
+}
+
+// src/manim.tsx
+var import_react9 = require("react");
+var import_factory41 = require("@ark-ui/react/factory");
+var import_helix68 = require("@cloudvoyant/helix");
+var import_jsx_runtime67 = require("react/jsx-runtime");
+function Manim({ build, width = 800, height = 450, caption, className, ...props }) {
+  const wrapperRef = (0, import_react9.useRef)(null);
+  const containerRef = (0, import_react9.useRef)(null);
+  const [state, setState] = (0, import_react9.useState)("loading");
+  const [errorMsg, setErrorMsg] = (0, import_react9.useState)("");
+  (0, import_react9.useEffect)(() => {
+    const wrapper = wrapperRef.current;
+    if (!wrapper) return;
+    let disposed = false;
+    let player = null;
+    let resizeTimer;
+    let mountedWidth = 0;
+    let generation = 0;
+    function fail(msg) {
+      if (!disposed) {
+        setErrorMsg(msg);
+        setState("error");
+      }
+    }
+    async function mount(pixelWidth) {
+      const gen = ++generation;
+      try {
+        const manim = await import("manim-web");
+        if (disposed || gen !== generation || !containerRef.current) return;
+        try {
+          player?.dispose?.();
+        } catch {
+        }
+        containerRef.current.replaceChildren();
+        mountedWidth = pixelWidth;
+        player = new manim.Player(containerRef.current, {
+          width: pixelWidth,
+          height: Math.round(pixelWidth * height / width),
+          backgroundOpacity: 0,
+          autoPlay: true,
+          loop: false
+        });
+        setState("ready");
+        await player.sequence(async (scene) => {
+          await build(manim, scene);
+        });
+      } catch (err) {
+        if (gen === generation) {
+          fail(`Failed to load animation: ${err instanceof Error ? err.message : String(err)}`);
+        }
+      }
+    }
+    const initialWidth = Math.floor(wrapper.getBoundingClientRect().width);
+    if (initialWidth > 0) void mount(initialWidth);
+    const observer = new ResizeObserver((entries) => {
+      const measured = Math.floor(entries[0]?.contentRect.width ?? 0);
+      if (measured <= 0 || measured === mountedWidth) return;
+      clearTimeout(resizeTimer);
+      resizeTimer = setTimeout(() => {
+        if (!disposed) void mount(measured);
+      }, 200);
+    });
+    observer.observe(wrapper);
+    return () => {
+      disposed = true;
+      clearTimeout(resizeTimer);
+      observer.disconnect();
+      try {
+        player?.dispose?.();
+      } catch {
+      }
+    };
+  }, [build, width, height]);
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_factory41.ark.figure, { "data-manim-state": state, className: (0, import_helix68.cn)(import_helix68.manimRootBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { ref: wrapperRef, className: import_helix68.manimContainerBase, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { ref: containerRef, className: "w-full" }),
+      state === "loading" && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: import_helix68.manimPlaceholderBase, style: { aspectRatio: `${width} / ${height}` }, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: import_helix68.manimPlaceholderLabelBase, children: "Loading animation\u2026" }) }),
+      state === "error" && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: import_helix68.manimErrorBase, children: errorMsg })
+    ] }),
+    caption ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_factory41.ark.figcaption, { className: import_helix68.manimCaptionBase, children: caption }) : null
+  ] });
+}
+
+// src/youtube.tsx
+var import_react10 = require("react");
+var import_factory42 = require("@ark-ui/react/factory");
+var import_helix69 = require("@cloudvoyant/helix");
+var import_jsx_runtime68 = require("react/jsx-runtime");
+function PlayIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      className: "h-8 w-8",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("path", { d: "M8 5v14l11-7z" })
+    }
+  );
+}
+function ChevronRightIcon2({ className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("path", { d: "m9 18 6-6-6-6" })
+    }
+  );
+}
+var YouTubeContext = (0, import_react10.createContext)(null);
+function useYouTube() {
+  const ctx = (0, import_react10.useContext)(YouTubeContext);
+  if (!ctx) throw new Error("YoutubeTimestamps must be rendered inside a <YouTube>.");
+  return ctx;
+}
+function YouTube({ url, title, description, poster, className, children, ...props }) {
+  const videoId = (0, import_helix69.extractYouTubeId)(url);
+  const posterUrl = poster ?? `https://i.ytimg.com/vi/${videoId}/hqdefault.jpg`;
+  const [playing, setPlaying] = (0, import_react10.useState)(false);
+  const [startAt, setStartAt] = (0, import_react10.useState)(null);
+  const seek = (t) => {
+    setStartAt(t);
+    setPlaying(true);
+  };
+  const src = `https://www.youtube-nocookie.com/embed/${videoId}?autoplay=1${startAt != null ? `&start=${startAt}` : ""}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(YouTubeContext.Provider, { value: { url, videoId, seek }, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_factory42.ark.div, { "data-youtube-id": videoId, className: (0, import_helix69.cn)(import_helix69.youtubeRootBase, className), ...props, children: [
+    title ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.h3, { className: import_helix69.youtubeTitleBase, children: title }) : null,
+    playing ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+      "iframe",
+      {
+        src,
+        title: title ?? `YouTube video ${videoId}`,
+        allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+        allowFullScreen: true,
+        className: "aspect-video w-full rounded-md border border-border"
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+      import_factory42.ark.button,
+      {
+        type: "button",
+        className: import_helix69.youtubeFacadeBase,
+        onClick: () => setPlaying(true),
+        "aria-label": title ? `Play video: ${title}` : "Play video",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.img, { src: posterUrl, alt: title ?? `YouTube video ${videoId}`, loading: "lazy", className: "h-full w-full object-cover" }),
+          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.span, { className: import_helix69.youtubePlayButtonBase, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.span, { className: import_helix69.youtubePlayButtonInnerBase, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(PlayIcon, {}) }) })
+        ]
+      }
+    ),
+    description ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.p, { className: import_helix69.youtubeDescriptionBase, children: description }) : null,
+    children
+  ] }) });
+}
+function YoutubeTimestampAt({ t, children, className, ...props }) {
+  const { seek } = useYouTube();
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.li, { className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_factory42.ark.button, { type: "button", onClick: () => seek(t), className: import_helix69.youtubeChapterButtonBase, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.span, { className: import_helix69.youtubeChapterTimeBase, children: (0, import_helix69.formatTime)(t) }),
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.span, { className: import_helix69.youtubeChapterLabelBase, children })
+  ] }) });
+}
+function YoutubeTimestamps({ chapters, children, className, ...props }) {
+  const { url } = useYouTube();
+  const [inferred, setInferred] = (0, import_react10.useState)([]);
+  const [loading, setLoading] = (0, import_react10.useState)(chapters === void 0);
+  (0, import_react10.useEffect)(() => {
+    if (chapters !== void 0) return;
+    let cancelled = false;
+    setLoading(true);
+    (0, import_helix69.fetchYouTubeMetadata)(url).then((meta) => {
+      if (!cancelled) {
+        setInferred(meta.description ? (0, import_helix69.parseYouTubeChapters)(meta.description) : []);
+        setLoading(false);
+      }
+    }).catch(() => {
+      if (!cancelled) setLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [url, chapters]);
+  const resolved = chapters ?? inferred;
+  const hasChildren = children !== void 0 && children !== null;
+  if (!loading && resolved.length === 0 && !hasChildren) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.div, { className: (0, import_helix69.cn)(import_helix69.youtubeChaptersBase, className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("details", { className: "group", open: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_factory42.ark.summary, { className: import_helix69.youtubeChaptersSummaryBase, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ChevronRightIcon2, { className: import_helix69.youtubeChaptersChevronBase }),
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { children: "Timestamps" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_factory42.ark.nav, { "aria-label": "Video timestamps", className: import_helix69.youtubeChaptersListBase, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(import_factory42.ark.ul, { className: "space-y-1", children: [
+      resolved.map((ch) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(YoutubeTimestampAt, { t: ch.t, children: ch.label }, ch.t)),
+      children
+    ] }) })
+  ] }) });
+}
+
+// src/chart.tsx
+var import_factory43 = require("@ark-ui/react/factory");
+var import_react11 = require("@tanstack/charts/react");
+var import_helix70 = require("@cloudvoyant/helix");
+var import_jsx_runtime69 = require("react/jsx-runtime");
+function Chart({ svg, className, ...props }) {
+  const { type, height = 320 } = props;
+  if (svg !== void 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_factory43.ark.div, { "data-chart-state": "prerendered", "data-chart-type": type, className: (0, import_helix70.cn)(import_helix70.chartRootBase, className), children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "flex w-full justify-center [&>svg]:max-w-full", dangerouslySetInnerHTML: { __html: svg } }) });
+  }
+  const definition = (0, import_helix70.buildChartDefinition)(props);
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_factory43.ark.div, { "data-chart-state": "ready", "data-chart-type": type, className: (0, import_helix70.cn)(import_helix70.chartRootBase, className), children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react11.Chart, { definition, height, ariaLabel: type === "pie" ? "Pie chart" : "Chart" }) });
+}
+
+// src/questions.tsx
+var import_react12 = require("react");
+var import_factory44 = require("@ark-ui/react/factory");
+var import_helix71 = require("@cloudvoyant/helix");
+var import_jsx_runtime70 = require("react/jsx-runtime");
+function CheckCircleIcon2() {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className: "size-4 shrink-0",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("path", { d: "m9 12 2 2 4-4" })
+      ]
+    }
+  );
+}
+function CircleXIcon2() {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className: "size-4 shrink-0",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("path", { d: "m15 9-6 6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("path", { d: "m9 9 6 6" })
+      ]
+    }
+  );
+}
+function CheckIcon2() {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("path", { d: "M20 6 9 17l-5-5" })
+    }
+  );
+}
+function Feedback({ correct, explanation }) {
+  if (correct === null) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { "aria-live": "polite", role: "status", className: "mt-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+      "div",
+      {
+        className: (0, import_helix71.cn)(
+          "flex items-center gap-2 text-sm font-medium",
+          correct ? import_helix71.feedbackCorrectBase : import_helix71.feedbackIncorrectBase
+        ),
+        children: correct ? /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CheckCircleIcon2, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { children: "Correct" })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CircleXIcon2, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { children: "Incorrect" })
+        ] })
+      }
+    ),
+    explanation ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: import_helix71.feedbackExplanationBase, children: explanation }) : null
+  ] });
+}
+function SingleChoiceRenderer({
+  prompt,
+  choices,
+  correct,
+  explanation,
+  quiz = false,
+  submitted = false,
+  onAnswerChange,
+  onGraded,
+  className,
+  ...rest
+}) {
+  const [selected, setSelected] = (0, import_react12.useState)(null);
+  const [result, setResult] = (0, import_react12.useState)(null);
+  (0, import_react12.useEffect)(() => {
+    if (quiz) {
+      const isAnswered = selected !== null;
+      onAnswerChange?.({ answered: isAnswered, correct: isAnswered && selected === correct });
+    }
+  }, [quiz, selected, correct]);
+  const displayResult = quiz ? submitted ? selected === correct : null : result;
+  const handleCheck = () => {
+    if (selected === null) return;
+    const isCorrect = selected === correct;
+    setResult(isCorrect);
+    onGraded?.(isCorrect);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: (0, import_helix71.cn)(import_helix71.questionCardBase, className), ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: import_helix71.questionPromptBase, children: prompt }),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+      RadioGroup,
+      {
+        orientation: "vertical",
+        value: selected !== null ? String(selected) : null,
+        onValueChange: (details) => {
+          if (quiz ? submitted : result !== null) return;
+          setSelected(details.value != null ? Number(details.value) : null);
+        },
+        disabled: quiz ? submitted : result !== null,
+        className: import_helix71.questionGroupBase,
+        children: choices.map((choice, i) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+          RadioGroupItem,
+          {
+            value: String(i),
+            className: (0, import_helix71.cn)(
+              import_helix71.questionOptionBase,
+              displayResult !== null && i === correct && import_helix71.questionOptionCorrectBase,
+              displayResult !== null && i === selected && i !== correct && import_helix71.questionOptionIncorrectBase
+            ),
+            children: choice
+          },
+          i
+        ))
+      }
+    ),
+    !quiz && result === null && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+      import_factory44.ark.button,
+      {
+        type: "button",
+        onClick: handleCheck,
+        disabled: selected === null,
+        className: import_helix71.questionCheckButtonBase,
+        children: "Check"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Feedback, { correct: displayResult, explanation: displayResult !== null ? explanation : void 0 })
+  ] });
+}
+function MultipleChoiceRenderer({
+  prompt,
+  choices,
+  correct,
+  explanation,
+  quiz = false,
+  submitted = false,
+  onAnswerChange,
+  onGraded,
+  className,
+  ...rest
+}) {
+  const [selected, setSelected] = (0, import_react12.useState)(/* @__PURE__ */ new Set());
+  const [result, setResult] = (0, import_react12.useState)(null);
+  const computeCorrect = () => {
+    const correctSet = new Set(correct);
+    return selected.size === correctSet.size && [...selected].every((v) => correctSet.has(v));
+  };
+  (0, import_react12.useEffect)(() => {
+    if (quiz) {
+      const isAnswered = selected.size > 0;
+      onAnswerChange?.({ answered: isAnswered, correct: isAnswered && computeCorrect() });
+    }
+  }, [quiz, selected, correct]);
+  const toggleOption = (index) => {
+    if (quiz ? submitted : result !== null) return;
+    setSelected((prev) => {
+      const next = new Set(prev);
+      if (next.has(index)) next.delete(index);
+      else next.add(index);
+      return next;
+    });
+  };
+  const displayResult = quiz ? submitted ? computeCorrect() : null : result;
+  const handleCheck = () => {
+    if (selected.size === 0) return;
+    const isCorrect = computeCorrect();
+    setResult(isCorrect);
+    onGraded?.(isCorrect);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: (0, import_helix71.cn)(import_helix71.questionCardBase, className), ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: import_helix71.questionPromptBase, children: prompt }),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { role: "group", className: import_helix71.questionGroupBase, children: choices.map((choice, i) => {
+      const isCorrectOption = correct.includes(i);
+      return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+        Checkbox,
+        {
+          checked: selected.has(i),
+          onCheckedChange: () => toggleOption(i),
+          disabled: quiz ? submitted : result !== null,
+          className: (0, import_helix71.cn)(
+            import_helix71.questionOptionBase,
+            displayResult !== null && isCorrectOption && import_helix71.questionOptionCorrectBase,
+            displayResult !== null && selected.has(i) && !isCorrectOption && import_helix71.questionOptionIncorrectBase
+          ),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CheckboxControl, { children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CheckboxIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CheckIcon2, {}) }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(CheckboxLabel, { children: choice })
+          ]
+        },
+        i
+      );
+    }) }),
+    !quiz && result === null && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+      import_factory44.ark.button,
+      {
+        type: "button",
+        onClick: handleCheck,
+        disabled: selected.size === 0,
+        className: import_helix71.questionCheckButtonBase,
+        children: "Check"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Feedback, { correct: displayResult, explanation: displayResult !== null ? explanation : void 0 })
+  ] });
+}
+function NumericRenderer({
+  id,
+  prompt,
+  answer,
+  tolerance = 0,
+  unit,
+  explanation,
+  quiz = false,
+  submitted = false,
+  onAnswerChange,
+  onGraded,
+  className,
+  ...rest
+}) {
+  const inputId = `q-${id}-input`;
+  const [value, setValue] = (0, import_react12.useState)("");
+  const [result, setResult] = (0, import_react12.useState)(null);
+  const computeCorrect = () => {
+    const parsed = parseFloat(value);
+    return !Number.isNaN(parsed) && Math.abs(parsed - answer) <= tolerance;
+  };
+  (0, import_react12.useEffect)(() => {
+    if (quiz) {
+      const parsed = parseFloat(value);
+      const isAnswered = value.trim() !== "" && !Number.isNaN(parsed);
+      onAnswerChange?.({ answered: isAnswered, correct: isAnswered && computeCorrect() });
+    }
+  }, [quiz, value, answer, tolerance]);
+  const displayResult = quiz ? submitted ? computeCorrect() : null : result;
+  const handleCheck = () => {
+    const parsed = parseFloat(value);
+    if (Number.isNaN(parsed)) return;
+    const isCorrect = Math.abs(parsed - answer) <= tolerance;
+    setResult(isCorrect);
+    onGraded?.(isCorrect);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: (0, import_helix71.cn)(import_helix71.questionCardBase, className), ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_factory44.ark.label, { htmlFor: inputId, className: import_helix71.questionPromptBase, children: prompt }),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+        import_factory44.ark.input,
+        {
+          id: inputId,
+          type: "text",
+          inputMode: "decimal",
+          value,
+          onChange: (e) => {
+            if (quiz ? submitted : result !== null) return;
+            setValue(e.currentTarget.value);
+          },
+          disabled: quiz ? submitted : result !== null,
+          className: import_helix71.questionInputBase
+        }
+      ),
+      unit ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_factory44.ark.span, { className: import_helix71.questionUnitBase, children: unit }) : null
+    ] }),
+    !quiz && result === null && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+      import_factory44.ark.button,
+      {
+        type: "button",
+        onClick: handleCheck,
+        disabled: value.trim() === "" || Number.isNaN(parseFloat(value)),
+        className: import_helix71.questionCheckButtonBase,
+        children: "Check"
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Feedback, { correct: displayResult, explanation: displayResult !== null ? explanation : void 0 })
+  ] });
+}
+function SingleChoiceQuestion(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(SingleChoiceRenderer, { ...props });
+}
+function MultipleChoiceQuestion(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(MultipleChoiceRenderer, { ...props });
+}
+function NumericQuestion(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(NumericRenderer, { ...props });
+}
+function Quiz({ id, title, questions, className, ...props }) {
+  const [answers, setAnswers] = (0, import_react12.useState)({});
+  const [submitted, setSubmitted] = (0, import_react12.useState)(false);
+  const [resetKey, setResetKey] = (0, import_react12.useState)(0);
+  const total = questions.length;
+  const allAnswered = questions.length > 0 && questions.every((q) => answers[q.id]?.answered === true);
+  const score = questions.filter((q) => answers[q.id]?.correct === true).length;
+  const pct = total > 0 ? Math.round(score / total * 100) : 0;
+  const handleAnswerChange = (questionId) => (state) => {
+    setAnswers((prev) => ({ ...prev, [questionId]: state }));
+  };
+  const handleReset = () => {
+    setAnswers({});
+    setSubmitted(false);
+    setResetKey((k) => k + 1);
+  };
+  const renderQuestion = (q) => {
+    const key = `${q.id}-${String(resetKey)}`;
+    const quizProps = {
+      quiz: true,
+      submitted,
+      onAnswerChange: handleAnswerChange(q.id)
+    };
+    switch (q.type) {
+      case "single":
+        return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+          SingleChoiceRenderer,
+          {
+            id: q.id,
+            prompt: q.prompt,
+            choices: q.choices,
+            correct: q.correct,
+            explanation: q.explanation,
+            ...quizProps
+          },
+          key
+        );
+      case "multiple":
+        return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+          MultipleChoiceRenderer,
+          {
+            id: q.id,
+            prompt: q.prompt,
+            choices: q.choices,
+            correct: q.correct,
+            explanation: q.explanation,
+            ...quizProps
+          },
+          key
+        );
+      case "numeric":
+        return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+          NumericRenderer,
+          {
+            id: q.id,
+            prompt: q.prompt,
+            answer: q.answer,
+            tolerance: q.tolerance,
+            unit: q.unit,
+            explanation: q.explanation,
+            ...quizProps
+          },
+          key
+        );
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { "data-quiz-id": id, className: (0, import_helix71.cn)(import_helix71.quizRootBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: import_helix71.quizHeaderBase, children: title ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_factory44.ark.h3, { className: import_helix71.quizTitleBase, children: title }) : null }),
+    questions.map(renderQuestion),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "mt-4 flex items-center gap-3", children: [
+      !submitted ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+        import_factory44.ark.button,
+        {
+          type: "button",
+          onClick: () => setSubmitted(true),
+          disabled: !allAnswered,
+          className: import_helix71.quizSubmitButtonBase,
+          children: "Submit"
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_factory44.ark.button, { type: "button", onClick: handleReset, className: import_helix71.quizResetButtonBase, children: "Reset" }),
+      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_factory44.ark.span, { role: "status", className: import_helix71.quizScoreBase, children: submitted ? `${score}/${total} (${pct}%)` : `${total} question${total === 1 ? "" : "s"}` })
+    ] }),
+    submitted && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: import_helix71.quizResultBase, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { "aria-live": "polite", role: "status", className: "text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("p", { className: import_helix71.quizResultTitleBase, children: [
+        score,
+        "/",
+        total,
+        " (",
+        pct,
+        "%)"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: import_helix71.quizResultTextBase, children: pct >= 70 ? "Well done!" : "Keep studying and try again." })
+    ] }) })
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Badge,
@@ -2070,11 +3203,17 @@ function Mermaid({ code, svg, className, ...props }) {
   CardHeader,
   CardTitle,
   Center,
+  Chart,
   Checkbox,
   CheckboxControl,
   CheckboxGroup,
   CheckboxIndicator,
   CheckboxLabel,
+  CodeBlock,
+  CodeBlockContent,
+  CodeBlockCopyButton,
+  CodeBlockHeader,
+  CodeBlockTitle,
   Col,
   Combobox,
   ComboboxClear,
@@ -2090,6 +3229,7 @@ function Mermaid({ code, svg, className, ...props }) {
   ComboboxList,
   ComboboxTrigger,
   Container,
+  CopyButton,
   Dialog,
   DialogBackdrop,
   DialogContent,
@@ -2109,10 +3249,17 @@ function Mermaid({ code, svg, className, ...props }) {
   FieldSetError,
   FieldSetHelper,
   FieldSetLegend,
+  Figure,
   HStack,
+  InlineLaTeX,
   Input,
   Item,
+  LaTeX,
+  LanguageTabsCodeBlock,
+  Manim,
   Mermaid,
+  MultiFileCodeBlock,
+  MultipleChoiceQuestion,
   Navbar,
   NavbarActions,
   NavbarActivationArea,
@@ -2132,11 +3279,13 @@ function Mermaid({ code, svg, className, ...props }) {
   NavbarMobileOverlay,
   NavbarProvider,
   NavbarTrigger,
+  Notice,
   NumberInput,
   NumberInputControl,
   NumberInputDecrement,
   NumberInputIncrement,
   NumberInputInput,
+  NumericQuestion,
   Page,
   PageContent,
   PageFooter,
@@ -2158,6 +3307,11 @@ function Mermaid({ code, svg, className, ...props }) {
   PopoverTitle,
   PopoverTrigger,
   Portal,
+  PrevNext,
+  Quiz,
+  RadioGroup,
+  RadioGroupItem,
+  Reveal,
   Row,
   Scroll,
   Select,
@@ -2194,6 +3348,7 @@ function Mermaid({ code, svg, className, ...props }) {
   SidebarRail,
   SidebarSeparator,
   SidebarTrigger,
+  SingleChoiceQuestion,
   Splitter,
   SplitterPanel,
   SplitterResizeTrigger,
@@ -2235,6 +3390,9 @@ function Mermaid({ code, svg, className, ...props }) {
   WindowResizeTrigger,
   WindowStageTrigger,
   WindowTitle,
+  YouTube,
+  YoutubeTimestampAt,
+  YoutubeTimestamps,
   navbarMenuTriggerStyle,
   useCheckbox,
   useCombobox,
@@ -2246,6 +3404,7 @@ function Mermaid({ code, svg, className, ...props }) {
   useNumberInput,
   usePopover,
   usePopoverContext,
+  useRadioGroup,
   useSelect,
   useSidebar,
   useSwitch,