@lostgradient/cinder 0.3.0 → 0.4.0

package/dist/components/approval-card/index.js

@@ -0,0 +1,3794 @@
+var __defProp = Object.defineProperty;
+var __returnValue = (v) => v;
+function __exportSetter(name, newValue) {
+  this[name] = __returnValue.bind(null, newValue);
+}
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {
+      get: all[name],
+      enumerable: true,
+      configurable: true,
+      set: __exportSetter.bind(all, name)
+    });
+};
+var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// src/utilities/retrying-loader-cache.ts
+function createRetryingLoaderCache(loader) {
+  let cached;
+  return () => {
+    if (cached === undefined) {
+      const pending = loader();
+      pending.catch(() => {
+        if (cached === pending) {
+          cached = undefined;
+        }
+      });
+      cached = pending;
+    }
+    return cached;
+  };
+}
+
+// src/highlighters/shiki/index.ts
+var exports_shiki = {};
+__export(exports_shiki, {
+  shikiHighlighter: () => shikiHighlighter,
+  createRetryingLoaderCache: () => createRetryingLoaderCache
+});
+function escapeHtml(value) {
+  const safe = typeof value === "string" ? value : "";
+  return safe.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#39;");
+}
+function plaintextBlock(code) {
+  return `<pre class="shiki shiki-plaintext"><code>${escapeHtml(code)}</code></pre>`;
+}
+function stripRootPreTabIndex(html) {
+  const openingPre = /^<pre\b[^>]*>/i.exec(html);
+  if (openingPre === null)
+    return html;
+  return openingPre[0].replace(/\s+tabindex=(?:"[^"]*"|'[^']*'|[^\s>]+)/i, "") + html.slice(openingPre[0].length);
+}
+function shikiHighlighter(options = {}) {
+  const { theme = DEFAULT_THEME, langs } = options;
+  const warnedLanguages = new Set;
+  const loadShiki = createRetryingLoaderCache(async () => {
+    const module_ = await import("shiki");
+    if (langs !== undefined) {
+      for (const lang of langs) {
+        try {
+          await module_.codeToHtml("", { lang, ...buildThemeOption(theme) });
+        } catch {}
+      }
+    }
+    return {
+      codeToHtml: module_.codeToHtml,
+      bundledLanguages: module_.bundledLanguages
+    };
+  });
+  return async function highlight(code, lang) {
+    const normalizedLang = typeof lang === "string" ? lang.trim().split(/\s+/, 1)[0] ?? "" : "";
+    if (normalizedLang === "") {
+      return plaintextBlock(code);
+    }
+    let shiki;
+    try {
+      shiki = await loadShiki();
+    } catch (error) {
+      console.warn("[cinder/highlighters/shiki] failed to load shiki:", error);
+      return plaintextBlock(code);
+    }
+    if (!Object.hasOwn(shiki.bundledLanguages, normalizedLang)) {
+      if (!warnedLanguages.has(normalizedLang)) {
+        warnedLanguages.add(normalizedLang);
+        console.warn(`[cinder/highlighters/shiki] language "${normalizedLang}" is not in Shiki's bundle; rendering as plaintext.`);
+      }
+      return plaintextBlock(code);
+    }
+    try {
+      const html = await shiki.codeToHtml(code, {
+        lang: normalizedLang,
+        ...buildThemeOption(theme)
+      });
+      return stripRootPreTabIndex(html);
+    } catch (error) {
+      if (!warnedLanguages.has(normalizedLang)) {
+        warnedLanguages.add(normalizedLang);
+        console.warn(`[cinder/highlighters/shiki] failed to highlight "${normalizedLang}":`, error);
+      }
+      return plaintextBlock(code);
+    }
+  };
+}
+function buildThemeOption(theme) {
+  if (typeof theme === "string")
+    return { theme };
+  return { themes: theme };
+}
+var DEFAULT_THEME;
+var init_shiki = __esm(() => {
+  DEFAULT_THEME = {
+    light: "github-light",
+    dark: "github-dark"
+  };
+});
+
+// src/components/approval-card/index.ts
+import"@lostgradient/cinder/approval-card/styles";
+
+// src/components/approval-card/approval-card.svelte
+import"svelte/internal/disclose-version";
+import * as $22 from "svelte/internal/client";
+import { onDestroy as onDestroy2 } from "svelte";
+
+// src/utilities/class-names.ts
+function classNames(...parts) {
+  return parts.filter((part) => typeof part === "string" && part.length > 0).join(" ");
+}
+
+// src/components/badge/badge.svelte
+import"svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+var root_3 = $.from_svg(`<path></path>`);
+var root_2 = $.from_svg(`<svg class="icon-sm" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></svg>`);
+var root_1 = $.from_html(`<!> <!>`, 1);
+var root = $.from_html(`<span><!></span>`);
+function Badge($$anchor, $$props) {
+  $.push($$props, true);
+  const subscriptionStateConfigurations = {
+    active: { variant: "success", label: "Active" },
+    trialing: { variant: "info", label: "Trialing" },
+    "past-due": { variant: "warning", label: "Past due" },
+    canceled: { variant: "neutral", label: "Canceled" },
+    expired: { variant: "danger", label: "Expired" },
+    refunded: { variant: "neutral", label: "Refunded" }
+  };
+  const subscriptionStateIconPaths = {
+    active: ["M21.801 10A10 10 0 1 1 17 3.335", "m9 11 3 3L22 4"],
+    trialing: ["M12 6v6l4 2", "M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"],
+    "past-due": [
+      "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-3Z",
+      "M12 9v4",
+      "M12 17h.01"
+    ],
+    canceled: [
+      "M15 9 9 15",
+      "M9 9l6 6",
+      "M22 12A10 10 0 1 1 12 2a10 10 0 0 1 10 10Z"
+    ],
+    expired: [
+      "M8 2v4",
+      "M16 2v4",
+      "M21 13V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h8",
+      "M3 10h18",
+      "m17 14-5-5",
+      "m12 14 5 5"
+    ],
+    refunded: [
+      "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
+      "M3 3v5h5"
+    ]
+  };
+  let variant = $.prop($$props, "variant", 3, "neutral"), size = $.prop($$props, "size", 3, "md"), mono = $.prop($$props, "mono", 3, false), rest = $.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "variant",
+    "size",
+    "mono",
+    "subscriptionState",
+    "class",
+    "children"
+  ]);
+  const subscriptionStateConfiguration = $.derived(() => $$props.subscriptionState === undefined ? undefined : subscriptionStateConfigurations[$$props.subscriptionState]);
+  const resolvedVariant = $.derived(() => $.get(subscriptionStateConfiguration)?.variant ?? variant());
+  const resolvedSubscriptionIconPaths = $.derived(() => $$props.subscriptionState === undefined ? undefined : subscriptionStateIconPaths[$$props.subscriptionState]);
+  var span = root();
+  $.attribute_effect(span, ($0) => ({
+    class: $0,
+    "data-cinder-variant": $.get(resolvedVariant),
+    "data-cinder-size": size(),
+    "data-cinder-mono": mono() ? "" : undefined,
+    "data-cinder-subscription-state": $$props.subscriptionState,
+    ...rest
+  }), [() => classNames("cinder-badge", $$props.class)]);
+  var node = $.child(span);
+  {
+    var consequent_2 = ($$anchor2) => {
+      var fragment = root_1();
+      var node_1 = $.first_child(fragment);
+      {
+        var consequent = ($$anchor3) => {
+          var svg = root_2();
+          $.each(svg, 20, () => $.get(resolvedSubscriptionIconPaths), (iconPath) => iconPath, ($$anchor4, iconPath) => {
+            var path = root_3();
+            $.template_effect(() => $.set_attribute(path, "d", iconPath));
+            $.append($$anchor4, path);
+          });
+          $.reset(svg);
+          $.append($$anchor3, svg);
+        };
+        $.if(node_1, ($$render) => {
+          if ($.get(resolvedSubscriptionIconPaths))
+            $$render(consequent);
+        });
+      }
+      var node_2 = $.sibling(node_1, 2);
+      {
+        var consequent_1 = ($$anchor3) => {
+          var fragment_1 = $.comment();
+          var node_3 = $.first_child(fragment_1);
+          $.snippet(node_3, () => $$props.children);
+          $.append($$anchor3, fragment_1);
+        };
+        var alternate = ($$anchor3) => {
+          var text2 = $.text();
+          $.template_effect(() => $.set_text(text2, $.get(subscriptionStateConfiguration).label));
+          $.append($$anchor3, text2);
+        };
+        $.if(node_2, ($$render) => {
+          if ($$props.children)
+            $$render(consequent_1);
+          else
+            $$render(alternate, -1);
+        });
+      }
+      $.append($$anchor2, fragment);
+    };
+    var alternate_1 = ($$anchor2) => {
+      var fragment_3 = $.comment();
+      var node_4 = $.first_child(fragment_3);
+      $.snippet(node_4, () => $$props.children ?? $.noop);
+      $.append($$anchor2, fragment_3);
+    };
+    $.if(node, ($$render) => {
+      if ($.get(subscriptionStateConfiguration))
+        $$render(consequent_2);
+      else
+        $$render(alternate_1, -1);
+    });
+  }
+  $.reset(span);
+  $.append($$anchor, span);
+  $.pop();
+}
+
+// src/components/button/button.svelte
+import"svelte/internal/disclose-version";
+import * as $2 from "svelte/internal/client";
+
+// ../../node_modules/esm-env/true.js
+var true_default = true;
+// src/utilities/dev-warn.ts
+function devWarn(message, ...args) {
+  if (!true_default)
+    return;
+  console.warn(message, ...args);
+}
+
+// src/components/button/button.svelte
+var root_22 = $2.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
+var root_4 = $2.from_html(`<span class="cinder-sr-only"> </span>`);
+var root_5 = $2.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
+var root_32 = $2.from_html(`<!> <!>`, 1);
+var root_8 = $2.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
+var root_12 = $2.from_html(`<!> <!> <!>`, 1);
+var root_9 = $2.from_html(`<a><!></a>`);
+var root_10 = $2.from_html(`<button><!></button>`);
+function Button($$anchor, $$props) {
+  $2.push($$props, true);
+  const buttonContent = ($$anchor2) => {
+    var fragment = root_12();
+    var node = $2.first_child(fragment);
+    {
+      var consequent = ($$anchor3) => {
+        var span = root_22();
+        var node_1 = $2.child(span);
+        $2.snippet(node_1, () => $$props.leadingIcon);
+        $2.reset(span);
+        $2.append($$anchor3, span);
+      };
+      $2.if(node, ($$render) => {
+        if ($$props.leadingIcon)
+          $$render(consequent);
+      });
+    }
+    var node_2 = $2.sibling(node, 2);
+    {
+      var consequent_3 = ($$anchor3) => {
+        var fragment_1 = root_32();
+        var node_3 = $2.first_child(fragment_1);
+        {
+          var consequent_1 = ($$anchor4) => {
+            var span_1 = root_4();
+            var text3 = $2.child(span_1, true);
+            $2.reset(span_1);
+            $2.template_effect(() => $2.set_text(text3, $$props.label));
+            $2.append($$anchor4, span_1);
+          };
+          $2.if(node_3, ($$render) => {
+            if (!$2.get(resolvedAriaLabel) && !$2.get(resolvedAriaLabelledBy) && $$props.label)
+              $$render(consequent_1);
+          });
+        }
+        var node_4 = $2.sibling(node_3, 2);
+        {
+          var consequent_2 = ($$anchor4) => {
+            var span_2 = root_5();
+            var node_5 = $2.child(span_2);
+            $2.snippet(node_5, () => $$props.children);
+            $2.reset(span_2);
+            $2.append($$anchor4, span_2);
+          };
+          $2.if(node_4, ($$render) => {
+            if ($$props.children)
+              $$render(consequent_2);
+          });
+        }
+        $2.append($$anchor3, fragment_1);
+      };
+      var consequent_4 = ($$anchor3) => {
+        var fragment_2 = $2.comment();
+        var node_6 = $2.first_child(fragment_2);
+        $2.snippet(node_6, () => $$props.children);
+        $2.append($$anchor3, fragment_2);
+      };
+      var alternate = ($$anchor3) => {
+        var text_1 = $2.text();
+        $2.template_effect(() => $2.set_text(text_1, $$props.label));
+        $2.append($$anchor3, text_1);
+      };
+      $2.if(node_2, ($$render) => {
+        if (iconOnly())
+          $$render(consequent_3);
+        else if ($$props.children)
+          $$render(consequent_4, 1);
+        else
+          $$render(alternate, -1);
+      });
+    }
+    var node_7 = $2.sibling(node_2, 2);
+    {
+      var consequent_5 = ($$anchor3) => {
+        var span_3 = root_8();
+        var node_8 = $2.child(span_3);
+        $2.snippet(node_8, () => $$props.trailingIcon);
+        $2.reset(span_3);
+        $2.append($$anchor3, span_3);
+      };
+      $2.if(node_7, ($$render) => {
+        if ($$props.trailingIcon)
+          $$render(consequent_5);
+      });
+    }
+    $2.append($$anchor2, fragment);
+  };
+  const variant = $2.prop($$props, "variant", 3, "secondary"), size = $2.prop($$props, "size", 3, "md"), fullWidth = $2.prop($$props, "fullWidth", 3, false), loading = $2.prop($$props, "loading", 3, false), iconOnly = $2.prop($$props, "iconOnly", 3, false), rest = $2.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "variant",
+    "size",
+    "fullWidth",
+    "loading",
+    "iconOnly",
+    "leadingIcon",
+    "trailingIcon",
+    "children",
+    "label",
+    "class",
+    "href",
+    "onclick",
+    "aria-disabled",
+    "aria-busy",
+    "aria-label",
+    "aria-labelledby",
+    "aria-expanded",
+    "aria-controls",
+    "aria-haspopup"
+  ]);
+  const mergedClassName = $2.derived(() => classNames("cinder-button", $$props.class));
+  const dataAttributes = $2.derived(() => ({
+    "data-cinder-variant": variant(),
+    "data-cinder-size": size(),
+    "data-cinder-full-width": fullWidth() ? "" : undefined,
+    "data-cinder-loading": loading() ? "" : undefined,
+    "data-cinder-icon-only": iconOnly() ? "" : undefined
+  }));
+  const resolvedAriaDisabled = $2.derived(() => loading() ? "true" : $$props["aria-disabled"]);
+  const resolvedAriaBusy = $2.derived(() => loading() ? "true" : $$props["aria-busy"]);
+  const resolvedAriaLabel = $2.derived(() => typeof $$props["aria-label"] === "string" && $$props["aria-label"].trim().length > 0 ? $$props["aria-label"] : undefined);
+  const resolvedAriaLabelledBy = $2.derived(() => typeof $$props["aria-labelledby"] === "string" && $$props["aria-labelledby"].trim().length > 0 ? $$props["aria-labelledby"] : undefined);
+  const anchorAttributes = rest;
+  const buttonAttributes = rest;
+  const anchorTabIndex = $2.derived(() => $$props.tabindex);
+  const buttonType = $2.derived(() => $$props.type);
+  const buttonDisabled = $2.derived(() => $$props.disabled ?? false);
+  function handleClick(event) {
+    if (loading()) {
+      event.preventDefault();
+      return;
+    }
+    if (typeof $$props.onclick === "function") {
+      $$props.onclick(event);
+    }
+  }
+  $2.user_effect(() => {
+    const hasLabel = typeof $$props.label === "string" && $$props.label.trim().length > 0;
+    const hasChildren = Boolean($$props.children);
+    const hasAriaLabel = $2.get(resolvedAriaLabel) !== undefined;
+    const hasAriaLabelledBy = $2.get(resolvedAriaLabelledBy) !== undefined;
+    if (!hasLabel && !hasChildren && !hasAriaLabel && !hasAriaLabelledBy) {
+      devWarn("[cinder/Button] rendered without an accessible name — pass a non-empty `label`, `children`, `aria-label`, or `aria-labelledby`.");
+    }
+    if (iconOnly() && !hasAriaLabel && !hasAriaLabelledBy && !hasLabel) {
+      devWarn("[cinder/Button] iconOnly=true requires aria-label, aria-labelledby, or a non-empty label.");
+    }
+    if (iconOnly() && !$$props.leadingIcon && !$$props.trailingIcon && !$$props.children) {
+      devWarn("[cinder/Button] iconOnly=true requires a visible icon — pass leadingIcon, trailingIcon, or children.");
+    }
+  });
+  var fragment_4 = $2.comment();
+  var node_9 = $2.first_child(fragment_4);
+  {
+    var consequent_6 = ($$anchor2) => {
+      var a = root_9();
+      $2.attribute_effect(a, () => ({
+        ...anchorAttributes,
+        href: loading() ? undefined : $$props.href,
+        tabindex: loading() ? -1 : $2.get(anchorTabIndex),
+        class: $2.get(mergedClassName),
+        ...$2.get(dataAttributes),
+        "aria-disabled": $2.get(resolvedAriaDisabled),
+        "aria-busy": $2.get(resolvedAriaBusy),
+        "aria-label": $2.get(resolvedAriaLabel),
+        "aria-labelledby": $2.get(resolvedAriaLabelledBy),
+        "aria-expanded": $$props["aria-expanded"],
+        "aria-controls": $$props["aria-controls"],
+        "aria-haspopup": $$props["aria-haspopup"],
+        onclick: handleClick
+      }));
+      var node_10 = $2.child(a);
+      buttonContent(node_10);
+      $2.reset(a);
+      $2.append($$anchor2, a);
+    };
+    var alternate_1 = ($$anchor2) => {
+      var button = root_10();
+      $2.attribute_effect(button, () => ({
+        ...buttonAttributes,
+        type: $2.get(buttonType) ?? "button",
+        class: $2.get(mergedClassName),
+        ...$2.get(dataAttributes),
+        disabled: $2.get(buttonDisabled) || loading(),
+        "aria-disabled": $2.get(resolvedAriaDisabled),
+        "aria-busy": $2.get(resolvedAriaBusy),
+        "aria-label": $2.get(resolvedAriaLabel),
+        "aria-labelledby": $2.get(resolvedAriaLabelledBy),
+        "aria-expanded": $$props["aria-expanded"],
+        "aria-controls": $$props["aria-controls"],
+        "aria-haspopup": $$props["aria-haspopup"],
+        onclick: handleClick
+      }));
+      var node_11 = $2.child(button);
+      buttonContent(node_11);
+      $2.reset(button);
+      $2.append($$anchor2, button);
+    };
+    $2.if(node_9, ($$render) => {
+      if ($$props.href !== undefined)
+        $$render(consequent_6);
+      else
+        $$render(alternate_1, -1);
+    });
+  }
+  $2.append($$anchor, fragment_4);
+  $2.pop();
+}
+
+// src/components/button-group/button-group.svelte
+import"svelte/internal/disclose-version";
+import * as $4 from "svelte/internal/client";
+
+// src/utilities/use-mutation-observer.svelte.ts
+import * as $3 from "svelte/internal/client";
+function useMutationObserver(onMutate, options = {}) {
+  const {
+    childList,
+    attributes,
+    characterData,
+    subtree,
+    attributeFilter,
+    attributeOldValue,
+    characterDataOldValue,
+    enabled = () => true
+  } = options;
+  const init = {};
+  if (childList !== undefined)
+    init.childList = childList;
+  if (attributes !== undefined)
+    init.attributes = attributes;
+  if (characterData !== undefined)
+    init.characterData = characterData;
+  if (subtree !== undefined)
+    init.subtree = subtree;
+  if (attributeFilter !== undefined)
+    init.attributeFilter = attributeFilter;
+  if (attributeOldValue !== undefined)
+    init.attributeOldValue = attributeOldValue;
+  if (characterDataOldValue !== undefined)
+    init.characterDataOldValue = characterDataOldValue;
+  if (init.childList === undefined && init.attributes === undefined && init.characterData === undefined) {
+    init.childList = true;
+  }
+  return (node) => {
+    if (typeof MutationObserver === "undefined") {
+      return () => {};
+    }
+    let observer = null;
+    const disconnectObserver = () => {
+      observer?.disconnect();
+      observer = null;
+    };
+    $3.user_effect(() => {
+      if (!enabled()) {
+        disconnectObserver();
+        return;
+      }
+      observer = new MutationObserver((mutations) => {
+        if (!enabled()) {
+          return;
+        }
+        onMutate(mutations);
+      });
+      observer.observe(node, init);
+      return () => {
+        disconnectObserver();
+      };
+    });
+    return () => {
+      disconnectObserver();
+    };
+  };
+}
+
+// src/components/button-group/button-group.svelte
+var groupIdCounter = 0;
+var root2 = $4.from_html(`<div><!></div>`);
+function Button_group($$anchor, $$props) {
+  $4.push($$props, true);
+  let orientation = $4.prop($$props, "orientation", 3, "horizontal"), rest = $4.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "label",
+    "labelledBy",
+    "orientation",
+    "class",
+    "children"
+  ]);
+  const mergedClassName = $4.derived(() => classNames("cinder-button-group", $$props.class));
+  const ariaLabelAttribute = $4.derived(() => typeof $$props.label === "string" ? $$props.label : undefined);
+  const ariaLabelledByAttribute = $4.derived(() => typeof $$props.labelledBy === "string" ? $$props.labelledBy : undefined);
+  const groupId = String(++groupIdCounter);
+  const tagDirectChildren = (element) => {
+    const ATTR = "data-cinder-button-group-item";
+    const tagged = new Set;
+    const sync = () => {
+      const currentChildren = new Set(Array.from(element.children));
+      for (const child4 of currentChildren) {
+        child4.setAttribute(ATTR, groupId);
+        tagged.add(child4);
+      }
+      for (const previouslyTagged of Array.from(tagged)) {
+        if (!currentChildren.has(previouslyTagged)) {
+          if (previouslyTagged.getAttribute(ATTR) === groupId) {
+            previouslyTagged.removeAttribute(ATTR);
+          }
+          tagged.delete(previouslyTagged);
+        }
+      }
+    };
+    sync();
+    const detachObserver = useMutationObserver(sync, { childList: true })(element);
+    return () => {
+      detachObserver?.();
+      for (const child4 of Array.from(tagged)) {
+        if (child4.getAttribute(ATTR) === groupId) {
+          child4.removeAttribute(ATTR);
+        }
+      }
+    };
+  };
+  $4.user_effect(() => {
+    const hasLabel = typeof $$props.label === "string";
+    const hasLabelledBy = typeof $$props.labelledBy === "string";
+    if (!hasLabel && !hasLabelledBy) {
+      devWarn("[cinder/ButtonGroup] rendered without a non-empty accessible name — pass a non-empty 'label' or 'labelledBy'.");
+      return;
+    }
+    if (hasLabel && $$props.label.trim().length === 0) {
+      devWarn("[cinder/ButtonGroup] rendered without a non-empty accessible name — pass a non-empty 'label' or 'labelledBy'.");
+    }
+    if (hasLabelledBy && $$props.labelledBy.trim().length === 0) {
+      devWarn("[cinder/ButtonGroup] rendered without a non-empty accessible name — pass a non-empty 'label' or 'labelledBy'.");
+    }
+  });
+  var div = root2();
+  $4.attribute_effect(div, () => ({
+    ...rest,
+    role: "group",
+    "aria-label": $4.get(ariaLabelAttribute),
+    "aria-labelledby": $4.get(ariaLabelledByAttribute),
+    class: $4.get(mergedClassName),
+    "data-cinder-orientation": orientation()
+  }));
+  var node = $4.child(div);
+  $4.snippet(node, () => $$props.children);
+  $4.reset(div);
+  $4.attach(div, () => tagDirectChildren);
+  $4.append($$anchor, div);
+  $4.pop();
+}
+
+// src/components/card/card.svelte
+import"svelte/internal/disclose-version";
+import * as $5 from "svelte/internal/client";
+var root_13 = $5.from_html(`<div class="cinder-card__header"><!></div>`);
+var root_42 = $5.from_html(`<p class="cinder-card__description"> </p>`);
+var root_23 = $5.from_html(`<div class="cinder-card__header"><!> <!></div>`);
+var root_52 = $5.from_html(`<div class="cinder-card__footer"><!></div>`);
+var root3 = $5.from_html(`<div><!> <div class="cinder-card__body"><!></div> <!></div>`);
+function Card($$anchor, $$props) {
+  $5.push($$props, true);
+  let headingLevel = $5.prop($$props, "headingLevel", 3, 3), variant = $5.prop($$props, "variant", 3, "card"), bodyTone = $5.prop($$props, "bodyTone", 3, "default"), footerTone = $5.prop($$props, "footerTone", 3, "default"), edgeToEdgeOnMobile = $5.prop($$props, "edgeToEdgeOnMobile", 3, false), padding = $5.prop($$props, "padding", 3, "default"), rest = $5.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "class",
+    "children",
+    "header",
+    "title",
+    "headingLevel",
+    "description",
+    "footer",
+    "variant",
+    "bodyTone",
+    "footerTone",
+    "edgeToEdgeOnMobile",
+    "padding"
+  ]);
+  const resolvedHeadingLevel = $5.derived(() => Number.isFinite(Math.trunc(Number(headingLevel()))) ? Math.min(6, Math.max(1, Math.trunc(Number(headingLevel())))) : 3);
+  const titleTag = $5.derived(() => `h${$5.get(resolvedHeadingLevel)}`);
+  var div = root3();
+  $5.attribute_effect(div, ($0) => ({
+    class: $0,
+    "data-cinder-variant": variant(),
+    "data-cinder-edge-to-edge-mobile": edgeToEdgeOnMobile() ? "" : undefined,
+    ...rest
+  }), [() => classNames("cinder-card", $$props.class)]);
+  var node = $5.child(div);
+  {
+    var consequent = ($$anchor2) => {
+      var div_1 = root_13();
+      var node_1 = $5.child(div_1);
+      $5.snippet(node_1, () => $$props.header);
+      $5.reset(div_1);
+      $5.append($$anchor2, div_1);
+    };
+    var consequent_2 = ($$anchor2) => {
+      var div_2 = root_23();
+      var node_2 = $5.child(div_2);
+      $5.element(node_2, () => $5.get(titleTag), false, ($$element, $$anchor3) => {
+        $5.set_class($$element, 0, "cinder-card__title");
+        var text4 = $5.text();
+        $5.template_effect(() => $5.set_text(text4, $$props.title));
+        $5.append($$anchor3, text4);
+      });
+      var node_3 = $5.sibling(node_2, 2);
+      {
+        var consequent_1 = ($$anchor3) => {
+          var p = root_42();
+          var text_1 = $5.child(p, true);
+          $5.reset(p);
+          $5.template_effect(() => $5.set_text(text_1, $$props.description));
+          $5.append($$anchor3, p);
+        };
+        $5.if(node_3, ($$render) => {
+          if ($$props.description)
+            $$render(consequent_1);
+        });
+      }
+      $5.reset(div_2);
+      $5.append($$anchor2, div_2);
+    };
+    $5.if(node, ($$render) => {
+      if ($$props.header)
+        $$render(consequent);
+      else if ($$props.title)
+        $$render(consequent_2, 1);
+    });
+  }
+  var div_3 = $5.sibling(node, 2);
+  var node_4 = $5.child(div_3);
+  $5.snippet(node_4, () => $$props.children);
+  $5.reset(div_3);
+  var node_5 = $5.sibling(div_3, 2);
+  {
+    var consequent_3 = ($$anchor2) => {
+      var div_4 = root_52();
+      var node_6 = $5.child(div_4);
+      $5.snippet(node_6, () => $$props.footer);
+      $5.reset(div_4);
+      $5.template_effect(() => $5.set_attribute(div_4, "data-cinder-tone", footerTone()));
+      $5.append($$anchor2, div_4);
+    };
+    $5.if(node_5, ($$render) => {
+      if ($$props.footer)
+        $$render(consequent_3);
+    });
+  }
+  $5.reset(div);
+  $5.template_effect(() => {
+    $5.set_attribute(div_3, "data-cinder-tone", bodyTone());
+    $5.set_attribute(div_3, "data-cinder-padding", padding());
+  });
+  $5.append($$anchor, div);
+  $5.pop();
+}
+
+// src/components/code-block/code-block.svelte
+import"svelte/internal/disclose-version";
+import * as $11 from "svelte/internal/client";
+
+// src/components/code-block/code-block-default-highlighter.ts
+var loadShikiAdapterModule = createRetryingLoaderCache(() => Promise.resolve().then(() => (init_shiki(), exports_shiki)));
+var defaultHighlighter;
+async function loadDefaultHighlighter() {
+  if (defaultHighlighter !== undefined)
+    return defaultHighlighter;
+  const module_ = await loadShikiAdapterModule();
+  defaultHighlighter ??= module_.shikiHighlighter();
+  return defaultHighlighter;
+}
+
+// src/components/copy-button/copy-button.svelte
+import"svelte/internal/disclose-version";
+import * as $10 from "svelte/internal/client";
+
+// ../../node_modules/lucide-svelte/dist/icons/check.svelte
+import"svelte/internal/disclose-version";
+import"svelte/internal/flags/legacy";
+import * as $7 from "svelte/internal/client";
+
+// ../../node_modules/lucide-svelte/dist/Icon.svelte
+import"svelte/internal/disclose-version";
+import"svelte/internal/flags/legacy";
+import * as $6 from "svelte/internal/client";
+
+// ../../node_modules/lucide-svelte/dist/defaultAttributes.js
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": 2,
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+};
+var defaultAttributes_default = defaultAttributes;
+
+// ../../node_modules/lucide-svelte/dist/Icon.svelte
+var root4 = $6.from_svg(`<svg><!><!></svg>`);
+function Icon($$anchor, $$props) {
+  const $$sanitized_props = $6.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const $$restProps = $6.legacy_rest_props($$sanitized_props, [
+    "name",
+    "color",
+    "size",
+    "strokeWidth",
+    "absoluteStrokeWidth",
+    "iconNode"
+  ]);
+  $6.push($$props, false);
+  let name = $6.prop($$props, "name", 8, undefined);
+  let color = $6.prop($$props, "color", 8, "currentColor");
+  let size = $6.prop($$props, "size", 8, 24);
+  let strokeWidth = $6.prop($$props, "strokeWidth", 8, 2);
+  let absoluteStrokeWidth = $6.prop($$props, "absoluteStrokeWidth", 8, false);
+  let iconNode = $6.prop($$props, "iconNode", 24, () => []);
+  const mergeClasses = (...classes) => classes.filter((className, index2, array) => {
+    return Boolean(className) && array.indexOf(className) === index2;
+  }).join(" ");
+  $6.init();
+  var svg = root4();
+  $6.attribute_effect(svg, ($0, $1) => ({
+    ...defaultAttributes_default,
+    ...$$restProps,
+    width: size(),
+    height: size(),
+    stroke: color(),
+    "stroke-width": $0,
+    class: $1
+  }), [
+    () => ($6.deep_read_state(absoluteStrokeWidth()), $6.deep_read_state(strokeWidth()), $6.deep_read_state(size()), $6.untrack(() => absoluteStrokeWidth() ? Number(strokeWidth()) * 24 / Number(size()) : strokeWidth())),
+    () => ($6.deep_read_state(name()), $6.deep_read_state($$sanitized_props), $6.untrack(() => mergeClasses("lucide-icon", "lucide", name() ? `lucide-${name()}` : "", $$sanitized_props.class)))
+  ]);
+  var node = $6.child(svg);
+  $6.each(node, 1, iconNode, $6.index, ($$anchor2, $$item) => {
+    var $$array = $6.derived(() => $6.to_array($6.get($$item), 2));
+    let tag = () => $6.get($$array)[0];
+    let attrs = () => $6.get($$array)[1];
+    var fragment = $6.comment();
+    var node_1 = $6.first_child(fragment);
+    $6.element(node_1, tag, true, ($$element, $$anchor3) => {
+      $6.attribute_effect($$element, () => ({ ...attrs() }));
+    });
+    $6.append($$anchor2, fragment);
+  });
+  var node_2 = $6.sibling(node);
+  $6.slot(node_2, $$props, "default", {}, null);
+  $6.reset(svg);
+  $6.append($$anchor, svg);
+  $6.pop();
+}
+
+// ../../node_modules/lucide-svelte/dist/icons/check.svelte
+function Check($$anchor, $$props) {
+  const $$sanitized_props = $7.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const iconNode = [["path", { d: "M20 6 9 17l-5-5" }]];
+  Icon($$anchor, $7.spread_props({ name: "check" }, () => $$sanitized_props, {
+    get iconNode() {
+      return iconNode;
+    },
+    children: ($$anchor2, $$slotProps) => {
+      var fragment_1 = $7.comment();
+      var node = $7.first_child(fragment_1);
+      $7.slot(node, $$props, "default", {}, null);
+      $7.append($$anchor2, fragment_1);
+    },
+    $$slots: { default: true }
+  }));
+}
+// ../../node_modules/lucide-svelte/dist/icons/copy.svelte
+import"svelte/internal/disclose-version";
+import"svelte/internal/flags/legacy";
+import * as $8 from "svelte/internal/client";
+function Copy($$anchor, $$props) {
+  const $$sanitized_props = $8.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const iconNode = [
+    [
+      "rect",
+      {
+        width: "14",
+        height: "14",
+        x: "8",
+        y: "8",
+        rx: "2",
+        ry: "2"
+      }
+    ],
+    [
+      "path",
+      {
+        d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"
+      }
+    ]
+  ];
+  Icon($$anchor, $8.spread_props({ name: "copy" }, () => $$sanitized_props, {
+    get iconNode() {
+      return iconNode;
+    },
+    children: ($$anchor2, $$slotProps) => {
+      var fragment_1 = $8.comment();
+      var node = $8.first_child(fragment_1);
+      $8.slot(node, $$props, "default", {}, null);
+      $8.append($$anchor2, fragment_1);
+    },
+    $$slots: { default: true }
+  }));
+}
+// src/utilities/clipboard.ts
+async function copyToClipboard(text4) {
+  if (typeof navigator !== "undefined" && navigator.clipboard?.writeText) {
+    try {
+      await navigator.clipboard.writeText(text4);
+      return true;
+    } catch {}
+  }
+  return legacyCopy(text4);
+}
+function legacyCopy(text4) {
+  if (typeof document === "undefined")
+    return false;
+  const textarea = document.createElement("textarea");
+  textarea.value = text4;
+  textarea.setAttribute("readonly", "");
+  textarea.setAttribute("aria-hidden", "true");
+  textarea.setAttribute("tabindex", "-1");
+  textarea.style.position = "absolute";
+  textarea.style.left = "-9999px";
+  document.body.appendChild(textarea);
+  textarea.select();
+  let succeeded = false;
+  try {
+    succeeded = document.execCommand("copy");
+  } catch {
+    succeeded = false;
+  }
+  textarea.remove();
+  return succeeded;
+}
+
+// src/components/_visually-hidden-live-region.svelte
+import"svelte/internal/disclose-version";
+import * as $9 from "svelte/internal/client";
+var root5 = $9.from_html(`<div aria-atomic="true"> </div>`);
+function _visually_hidden_live_region($$anchor, $$props) {
+  $9.push($$props, true);
+  let message = $9.prop($$props, "message", 3, ""), announcementSequence = $9.prop($$props, "announcementSequence", 3, 0), priority = $9.prop($$props, "priority", 3, "polite");
+  let rendered = $9.state("");
+  let setTimeoutId = null;
+  let version = 0;
+  let isDestroyed = false;
+  $9.user_effect(() => {
+    return () => {
+      isDestroyed = true;
+      if (setTimeoutId) {
+        clearTimeout(setTimeoutId);
+        setTimeoutId = null;
+      }
+    };
+  });
+  $9.user_effect(() => {
+    const next = message();
+    announcementSequence();
+    const current = ++version;
+    if (setTimeoutId) {
+      clearTimeout(setTimeoutId);
+      setTimeoutId = null;
+    }
+    $9.set(rendered, "");
+    if (next === "")
+      return;
+    setTimeoutId = setTimeout(() => {
+      if (isDestroyed || version !== current)
+        return;
+      $9.set(rendered, next, true);
+      setTimeoutId = null;
+    }, 0);
+  });
+  var div = root5();
+  var text4 = $9.child(div, true);
+  $9.reset(div);
+  $9.template_effect(($0) => {
+    $9.set_attribute(div, "role", priority() === "assertive" ? "alert" : "status");
+    $9.set_attribute(div, "aria-live", priority() === "assertive" ? "assertive" : "polite");
+    $9.set_class(div, 1, $0);
+    $9.set_text(text4, $9.get(rendered));
+  }, [() => $9.clsx(classNames("cinder-sr-only", $$props.class))]);
+  $9.append($$anchor, div);
+  $9.pop();
+}
+
+// src/components/copy-button/copy-button.svelte
+var root6 = $10.from_html(`<button><!></button> <!>`, 1);
+function Copy_button($$anchor, $$props) {
+  $10.push($$props, true);
+  let confirmDuration = $10.prop($$props, "confirmDuration", 3, 1500), iconOnly = $10.prop($$props, "iconOnly", 3, false), rest = $10.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "value",
+    "confirmDuration",
+    "label",
+    "copiedLabel",
+    "iconOnly",
+    "class",
+    "children",
+    "confirmation"
+  ]);
+  let copied = $10.state(false);
+  let resetTimer;
+  const copiedAnnouncement = $10.derived(() => $10.get(copied) ? $$props.copiedLabel ?? "Copied" : "");
+  async function handleClick() {
+    const ok = await copyToClipboard($$props.value);
+    if (!ok)
+      return;
+    $10.set(copied, true);
+    if (resetTimer)
+      clearTimeout(resetTimer);
+    resetTimer = setTimeout(() => {
+      $10.set(copied, false);
+    }, confirmDuration());
+  }
+  $10.user_effect(() => {
+    return () => {
+      if (resetTimer)
+        clearTimeout(resetTimer);
+    };
+  });
+  var fragment = root6();
+  var button = $10.first_child(fragment);
+  $10.attribute_effect(button, ($0) => ({
+    ...rest,
+    type: "button",
+    "data-cinder-copied": $10.get(copied) || undefined,
+    "aria-label": $$props.label ?? "Copy to clipboard",
+    onclick: handleClick,
+    class: $0
+  }), [() => classNames("cinder-copy-button", $$props.class)]);
+  var node = $10.child(button);
+  {
+    var consequent = ($$anchor2) => {
+      var fragment_1 = $10.comment();
+      var node_1 = $10.first_child(fragment_1);
+      $10.snippet(node_1, () => $$props.confirmation);
+      $10.append($$anchor2, fragment_1);
+    };
+    var consequent_1 = ($$anchor2) => {
+      Check($$anchor2, { class: "icon-sm", "aria-hidden": "true" });
+    };
+    var consequent_2 = ($$anchor2) => {
+      var text5 = $10.text("Copied");
+      $10.append($$anchor2, text5);
+    };
+    var consequent_3 = ($$anchor2) => {
+      var fragment_3 = $10.comment();
+      var node_2 = $10.first_child(fragment_3);
+      $10.snippet(node_2, () => $$props.children);
+      $10.append($$anchor2, fragment_3);
+    };
+    var consequent_4 = ($$anchor2) => {
+      Copy($$anchor2, { class: "icon-sm", "aria-hidden": "true" });
+    };
+    var alternate = ($$anchor2) => {
+      var text_1 = $10.text("Copy");
+      $10.append($$anchor2, text_1);
+    };
+    $10.if(node, ($$render) => {
+      if ($10.get(copied) && $$props.confirmation)
+        $$render(consequent);
+      else if ($10.get(copied) && iconOnly())
+        $$render(consequent_1, 1);
+      else if ($10.get(copied))
+        $$render(consequent_2, 2);
+      else if ($$props.children)
+        $$render(consequent_3, 3);
+      else if (iconOnly())
+        $$render(consequent_4, 4);
+      else
+        $$render(alternate, -1);
+    });
+  }
+  $10.reset(button);
+  var node_3 = $10.sibling(button, 2);
+  _visually_hidden_live_region(node_3, {
+    get message() {
+      return $10.get(copiedAnnouncement);
+    }
+  });
+  $10.append($$anchor, fragment);
+  $10.pop();
+}
+
+// src/components/code-block/code-block.svelte
+var root_24 = $11.from_html(`<span class="cinder-code-block__language"> </span>`);
+var root_14 = $11.from_html(`<header class="cinder-code-block__header"><!> <!></header>`);
+var root_43 = $11.from_html(`<pre class="cinder-code-block__pre"><code class="cinder-code-block__code"> </code></pre>`);
+var root_6 = $11.from_html(`<div class="cinder-code-block__highlighted"></div>`);
+var root_7 = $11.from_html(`<pre class="cinder-code-block__pre"><code class="cinder-code-block__code"> </code></pre>`);
+var root7 = $11.from_html(`<div><!> <div class="cinder-code-block__viewport" tabindex="0"><!></div></div>`);
+function Code_block($$anchor, $$props) {
+  $11.push($$props, true);
+  let copyable = $11.prop($$props, "copyable", 3, false);
+  let highlighted = $11.state(null);
+  $11.user_effect(() => {
+    if ($$props.highlight === false || !$$props.language) {
+      $11.set(highlighted, null);
+      return;
+    }
+    const pendingCode = $$props.code;
+    const pendingLanguage = $$props.language;
+    const explicitHighlighter = $$props.highlighter;
+    $11.set(highlighted, null);
+    let cancelled = false;
+    (async () => {
+      try {
+        const resolvedHighlighter = explicitHighlighter ?? await loadDefaultHighlighter();
+        if (cancelled)
+          return;
+        const html2 = await resolvedHighlighter(pendingCode, pendingLanguage);
+        if (!cancelled)
+          $11.set(highlighted, html2 === "" ? null : html2, true);
+      } catch (error) {
+        if (!cancelled)
+          $11.set(highlighted, null);
+        const detail = error instanceof Error ? `${error.name}: ${error.message}` : String(error);
+        devWarn(`[cinder/CodeBlock] highlight failed for language "${pendingLanguage}":`, detail);
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  });
+  var div = root7();
+  var node = $11.child(div);
+  {
+    var consequent_2 = ($$anchor2) => {
+      var header = root_14();
+      var node_1 = $11.child(header);
+      {
+        var consequent = ($$anchor3) => {
+          var span = root_24();
+          var text5 = $11.child(span, true);
+          $11.reset(span);
+          $11.template_effect(() => $11.set_text(text5, $$props.language));
+          $11.append($$anchor3, span);
+        };
+        $11.if(node_1, ($$render) => {
+          if ($$props.language)
+            $$render(consequent);
+        });
+      }
+      var node_2 = $11.sibling(node_1, 2);
+      {
+        var consequent_1 = ($$anchor3) => {
+          Copy_button($$anchor3, {
+            get value() {
+              return $$props.code;
+            },
+            class: "cinder-code-block__copy",
+            label: "Copy code",
+            copiedLabel: "Code copied",
+            iconOnly: true
+          });
+        };
+        $11.if(node_2, ($$render) => {
+          if (copyable())
+            $$render(consequent_1);
+        });
+      }
+      $11.reset(header);
+      $11.append($$anchor2, header);
+    };
+    $11.if(node, ($$render) => {
+      if ($$props.language || copyable())
+        $$render(consequent_2);
+    });
+  }
+  var div_1 = $11.sibling(node, 2);
+  var node_3 = $11.child(div_1);
+  {
+    const failed = ($$anchor2) => {
+      var pre = root_43();
+      var code_1 = $11.child(pre);
+      var text_1 = $11.child(code_1, true);
+      $11.reset(code_1);
+      $11.reset(pre);
+      $11.template_effect(() => $11.set_text(text_1, $$props.code));
+      $11.append($$anchor2, pre);
+    };
+    $11.boundary(node_3, { failed }, ($$anchor2) => {
+      var fragment_1 = $11.comment();
+      var node_4 = $11.first_child(fragment_1);
+      {
+        var consequent_3 = ($$anchor3) => {
+          var div_2 = root_6();
+          $11.html(div_2, () => $11.get(highlighted), true);
+          $11.reset(div_2);
+          $11.append($$anchor3, div_2);
+        };
+        var alternate = ($$anchor3) => {
+          var pre_1 = root_7();
+          var code_2 = $11.child(pre_1);
+          var text_2 = $11.child(code_2, true);
+          $11.reset(code_2);
+          $11.reset(pre_1);
+          $11.template_effect(() => $11.set_text(text_2, $$props.code));
+          $11.append($$anchor3, pre_1);
+        };
+        $11.if(node_4, ($$render) => {
+          if ($11.get(highlighted) !== null)
+            $$render(consequent_3);
+          else
+            $$render(alternate, -1);
+        });
+      }
+      $11.append($$anchor2, fragment_1);
+    });
+  }
+  $11.reset(div_1);
+  $11.reset(div);
+  $11.template_effect(($0) => $11.set_class(div, 1, $0), [() => $11.clsx(classNames("cinder-code-block", $$props.class))]);
+  $11.append($$anchor, div);
+  $11.pop();
+}
+
+// src/components/payload-inspector/payload-inspector.svelte
+import"svelte/internal/disclose-version";
+import * as $19 from "svelte/internal/client";
+
+// src/components/description-list/description-list.svelte
+import"svelte/internal/disclose-version";
+import * as $12 from "svelte/internal/client";
+var root_25 = $12.from_html(`<div class="cinder-description-list__actions"><!></div>`);
+var root_15 = $12.from_html(`<div class="cinder-description-list__row"><dt> </dt> <dd><div class="cinder-description-list__definition"> </div> <!></dd></div>`);
+var root8 = $12.from_html(`<dl></dl>`);
+function Description_list($$anchor, $$props) {
+  $12.push($$props, true);
+  let variant = $12.prop($$props, "variant", 3, "default"), rest = $12.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "items",
+    "variant",
+    "class",
+    "actions"
+  ]);
+  const duplicateKey = $12.derived(() => {
+    const seen = new Set;
+    for (const item of $$props.items) {
+      const key = item.id ?? item.term;
+      if (seen.has(key))
+        return key;
+      seen.add(key);
+    }
+    return;
+  });
+  let lastWarnedDuplicateKey;
+  $12.user_effect(() => {
+    if ($12.get(duplicateKey) === undefined) {
+      lastWarnedDuplicateKey = undefined;
+      return;
+    }
+    if ($12.get(duplicateKey) !== lastWarnedDuplicateKey) {
+      lastWarnedDuplicateKey = $12.get(duplicateKey);
+      devWarn(`[cinder/DescriptionList] Duplicate key "${$12.get(duplicateKey)}". Two items share a term and no \`id\`. Provide a unique \`id\` on each DescriptionListItem to avoid broken reconciliation.`);
+    }
+  });
+  var dl = root8();
+  $12.attribute_effect(dl, ($0) => ({ ...rest, class: $0, "data-cinder-variant": variant() }), [() => classNames("cinder-description-list", $$props.class)]);
+  $12.each(dl, 21, () => $$props.items, (item) => item.id ?? item.term, ($$anchor2, item) => {
+    var div = root_15();
+    var dt = $12.child(div);
+    var text5 = $12.child(dt, true);
+    $12.reset(dt);
+    var dd = $12.sibling(dt, 2);
+    var div_1 = $12.child(dd);
+    var text_1 = $12.child(div_1, true);
+    $12.reset(div_1);
+    var node = $12.sibling(div_1, 2);
+    {
+      var consequent = ($$anchor3) => {
+        var div_2 = root_25();
+        var node_1 = $12.child(div_2);
+        $12.snippet(node_1, () => $$props.actions, () => $12.get(item));
+        $12.reset(div_2);
+        $12.append($$anchor3, div_2);
+      };
+      $12.if(node, ($$render) => {
+        if ($$props.actions)
+          $$render(consequent);
+      });
+    }
+    $12.reset(dd);
+    $12.reset(div);
+    $12.template_effect(() => {
+      $12.set_class(dt, 1, $12.clsx(variant() === "narrow" ? "cinder-sr-only" : undefined));
+      $12.set_text(text5, $12.get(item).term);
+      $12.set_text(text_1, $12.get(item).definition);
+    });
+    $12.append($$anchor2, div);
+  });
+  $12.reset(dl);
+  $12.append($$anchor, dl);
+  $12.pop();
+}
+
+// src/components/json-viewer/json-viewer.svelte
+import"svelte/internal/disclose-version";
+import * as $14 from "svelte/internal/client";
+
+// src/components/json-viewer/_json-viewer-node.svelte
+import"svelte/internal/disclose-version";
+import * as $13 from "svelte/internal/client";
+import { untrack as untrack2 } from "svelte";
+var root_33 = $13.from_html(`<span class="cinder-json-viewer__key"> </span>`);
+var root_44 = $13.from_html(`<span class="cinder-json-viewer__summary"> </span> <span class="cinder-json-viewer__brace"> </span>`, 1);
+var root_62 = $13.from_html(`<li role="none"><!></li>`);
+var root_53 = $13.from_html(`<ul class="cinder-json-viewer__children" role="group"></ul> <span class="cinder-json-viewer__brace"> </span>`, 1);
+var root_26 = $13.from_html(`<span role="treeitem"><button type="button" class="cinder-json-viewer__toggle" tabindex="-1"><!> <span class="cinder-json-viewer__caret"></span> <span class="cinder-json-viewer__brace"> </span> <!></button> <!></span>`);
+var root_82 = $13.from_html(`<span class="cinder-json-viewer__key"> </span>`);
+var root_72 = $13.from_html(`<span class="cinder-json-viewer__node" role="treeitem"><!> <span class="cinder-json-viewer__too-deep">…</span></span>`);
+var root_102 = $13.from_html(`<span class="cinder-json-viewer__key"> </span>`);
+var root_92 = $13.from_html(`<span class="cinder-json-viewer__node" role="treeitem"><!> <span class="cinder-json-viewer__value"><!></span></span>`);
+function _json_viewer_node($$anchor, $$props) {
+  $13.push($$props, true);
+  let root9 = $13.prop($$props, "root", 3, false);
+  const isObject = $13.derived(() => $$props.value !== null && typeof $$props.value === "object");
+  const isArray = $13.derived(() => Array.isArray($$props.value));
+  const tooDeep = $13.derived(() => $$props.depth >= $$props.maxDepth);
+  let collapsed = $13.state($13.proxy(untrack2(() => $$props.depth >= $$props.initialDepth)));
+  const entries = $13.derived(() => {
+    if (!$13.get(isObject) || $13.get(tooDeep))
+      return [];
+    if ($13.get(isArray)) {
+      return $$props.value.map((item, i) => [i, item]);
+    }
+    return Object.entries($$props.value);
+  });
+  const itemCount = $13.derived(() => $13.get(entries).length);
+  const collectionLabel = $13.derived(() => `${$13.get(isArray) ? "array" : "object"}, ${$13.get(itemCount)} ${$13.get(itemCount) === 1 ? "item" : "items"}`);
+  const toggleLabel = $13.derived(() => $$props.keyName === undefined ? $13.get(collectionLabel) : `${$$props.keyName}: ${$13.get(collectionLabel)}`);
+  function valueClass(v) {
+    if (v === null)
+      return "null";
+    if (typeof v === "string")
+      return "string";
+    if (typeof v === "number")
+      return "number";
+    if (typeof v === "boolean")
+      return "boolean";
+    return "unknown";
+  }
+  var fragment = $13.comment();
+  var node = $13.first_child(fragment);
+  {
+    var consequent_3 = ($$anchor2) => {
+      var span = root_26();
+      var button = $13.child(span);
+      var node_1 = $13.child(button);
+      {
+        var consequent = ($$anchor3) => {
+          var span_1 = root_33();
+          var text6 = $13.child(span_1);
+          $13.reset(span_1);
+          $13.template_effect(() => $13.set_text(text6, `${$$props.keyName ?? ""}:`));
+          $13.append($$anchor3, span_1);
+        };
+        $13.if(node_1, ($$render) => {
+          if ($$props.keyName !== undefined)
+            $$render(consequent);
+        });
+      }
+      var span_2 = $13.sibling(node_1, 2);
+      var span_3 = $13.sibling(span_2, 2);
+      var text_1 = $13.child(span_3, true);
+      $13.reset(span_3);
+      var node_2 = $13.sibling(span_3, 2);
+      {
+        var consequent_1 = ($$anchor3) => {
+          var fragment_1 = root_44();
+          var span_4 = $13.first_child(fragment_1);
+          var text_2 = $13.child(span_4);
+          $13.reset(span_4);
+          var span_5 = $13.sibling(span_4, 2);
+          var text_3 = $13.child(span_5, true);
+          $13.reset(span_5);
+          $13.template_effect(() => {
+            $13.set_text(text_2, `${$13.get(itemCount) ?? ""} ${$13.get(itemCount) === 1 ? "item" : "items"}`);
+            $13.set_text(text_3, $13.get(isArray) ? "]" : "}");
+          });
+          $13.append($$anchor3, fragment_1);
+        };
+        $13.if(node_2, ($$render) => {
+          if ($13.get(collapsed))
+            $$render(consequent_1);
+        });
+      }
+      $13.reset(button);
+      var node_3 = $13.sibling(button, 2);
+      {
+        var consequent_2 = ($$anchor3) => {
+          var fragment_2 = root_53();
+          var ul = $13.first_child(fragment_2);
+          $13.each(ul, 23, () => $13.get(entries), ([k, v]) => k, ($$anchor4, $$item, index2) => {
+            var $$array = $13.derived(() => $13.to_array($13.get($$item), 2));
+            let k = () => $13.get($$array)[0];
+            let v = () => $13.get($$array)[1];
+            var li = root_62();
+            var node_4 = $13.child(li);
+            {
+              let $0 = $13.derived(() => $$props.depth + 1);
+              let $1 = $13.derived(() => $13.get(index2) + 1);
+              _json_viewer_node(node_4, {
+                get value() {
+                  return v();
+                },
+                get keyName() {
+                  return k();
+                },
+                get depth() {
+                  return $13.get($0);
+                },
+                get initialDepth() {
+                  return $$props.initialDepth;
+                },
+                get maxDepth() {
+                  return $$props.maxDepth;
+                },
+                get position() {
+                  return $13.get($1);
+                },
+                get setSize() {
+                  return $13.get(entries).length;
+                }
+              });
+            }
+            $13.reset(li);
+            $13.append($$anchor4, li);
+          });
+          $13.reset(ul);
+          var span_6 = $13.sibling(ul, 2);
+          var text_4 = $13.child(span_6, true);
+          $13.reset(span_6);
+          $13.template_effect(() => $13.set_text(text_4, $13.get(isArray) ? "]" : "}"));
+          $13.append($$anchor3, fragment_2);
+        };
+        $13.if(node_3, ($$render) => {
+          if (!$13.get(collapsed))
+            $$render(consequent_2);
+        });
+      }
+      $13.reset(span);
+      $13.template_effect(($0) => {
+        $13.set_class(span, 1, $0);
+        $13.set_attribute(span, "aria-expanded", !$13.get(collapsed));
+        $13.set_attribute(span, "aria-label", $13.get(toggleLabel));
+        $13.set_attribute(span, "aria-level", $$props.depth + 1);
+        $13.set_attribute(span, "aria-posinset", $$props.position);
+        $13.set_attribute(span, "aria-setsize", $$props.setSize);
+        $13.set_attribute(span, "tabindex", root9() ? 0 : -1);
+        $13.set_attribute(button, "aria-label", $13.get(toggleLabel));
+        $13.set_attribute(span_2, "data-cinder-collapsed", $13.get(collapsed) || undefined);
+        $13.set_text(text_1, $13.get(isArray) ? "[" : "{");
+      }, [() => $13.clsx(classNames("cinder-json-viewer__node"))]);
+      $13.delegated("click", button, () => $13.set(collapsed, !$13.get(collapsed)));
+      $13.append($$anchor2, span);
+    };
+    var consequent_5 = ($$anchor2) => {
+      var span_7 = root_72();
+      var node_5 = $13.child(span_7);
+      {
+        var consequent_4 = ($$anchor3) => {
+          var span_8 = root_82();
+          var text_5 = $13.child(span_8);
+          $13.reset(span_8);
+          $13.template_effect(() => $13.set_text(text_5, `${$$props.keyName ?? ""}:`));
+          $13.append($$anchor3, span_8);
+        };
+        $13.if(node_5, ($$render) => {
+          if ($$props.keyName !== undefined)
+            $$render(consequent_4);
+        });
+      }
+      $13.next(2);
+      $13.reset(span_7);
+      $13.template_effect(() => {
+        $13.set_attribute(span_7, "tabindex", root9() ? 0 : -1);
+        $13.set_attribute(span_7, "aria-level", $$props.depth + 1);
+        $13.set_attribute(span_7, "aria-posinset", $$props.position);
+        $13.set_attribute(span_7, "aria-setsize", $$props.setSize);
+      });
+      $13.append($$anchor2, span_7);
+    };
+    var alternate_1 = ($$anchor2) => {
+      var span_9 = root_92();
+      var node_6 = $13.child(span_9);
+      {
+        var consequent_6 = ($$anchor3) => {
+          var span_10 = root_102();
+          var text_6 = $13.child(span_10);
+          $13.reset(span_10);
+          $13.template_effect(() => $13.set_text(text_6, `${$$props.keyName ?? ""}:`));
+          $13.append($$anchor3, span_10);
+        };
+        $13.if(node_6, ($$render) => {
+          if ($$props.keyName !== undefined)
+            $$render(consequent_6);
+        });
+      }
+      var span_11 = $13.sibling(node_6, 2);
+      var node_7 = $13.child(span_11);
+      {
+        var consequent_7 = ($$anchor3) => {
+          var text_7 = $13.text();
+          $13.template_effect(() => $13.set_text(text_7, `"${$$props.value ?? ""}"`));
+          $13.append($$anchor3, text_7);
+        };
+        var alternate = ($$anchor3) => {
+          var text_8 = $13.text();
+          $13.template_effect(($0) => $13.set_text(text_8, $0), [() => String($$props.value)]);
+          $13.append($$anchor3, text_8);
+        };
+        $13.if(node_7, ($$render) => {
+          if (typeof $$props.value === "string")
+            $$render(consequent_7);
+          else
+            $$render(alternate, -1);
+        });
+      }
+      $13.reset(span_11);
+      $13.reset(span_9);
+      $13.template_effect(($0) => {
+        $13.set_attribute(span_9, "tabindex", root9() ? 0 : -1);
+        $13.set_attribute(span_9, "aria-level", $$props.depth + 1);
+        $13.set_attribute(span_9, "aria-posinset", $$props.position);
+        $13.set_attribute(span_9, "aria-setsize", $$props.setSize);
+        $13.set_attribute(span_11, "data-cinder-type", $0);
+      }, [() => valueClass($$props.value)]);
+      $13.append($$anchor2, span_9);
+    };
+    $13.if(node, ($$render) => {
+      if ($13.get(isObject) && !$13.get(tooDeep))
+        $$render(consequent_3);
+      else if ($13.get(isObject) && $13.get(tooDeep))
+        $$render(consequent_5, 1);
+      else
+        $$render(alternate_1, -1);
+    });
+  }
+  $13.append($$anchor, fragment);
+  $13.pop();
+}
+$13.delegate(["click"]);
+
+// src/components/json-viewer/json-viewer.svelte
+var root_16 = $14.from_html(`<div class="cinder-json-viewer__fallback" role="status"><p>This value can't be serialized as JSON (it may contain a circular reference or a BigInt).</p> <p>Pass a plain JSON-serializable value, or use the consumer's download or copy action.</p></div>`);
+var root_27 = $14.from_html(`<div class="cinder-json-viewer__fallback" role="status"><p> </p> <p>Use the consumer's download or copy action to inspect the raw JSON.</p></div>`);
+var root_34 = $14.from_html(`<div role="tree" aria-label="JSON tree" tabindex="-1"><!></div>`);
+var root9 = $14.from_html(`<div><!></div>`);
+function Json_viewer($$anchor, $$props) {
+  $14.push($$props, true);
+  let initialDepth = $14.prop($$props, "initialDepth", 3, 1), maxDepth = $14.prop($$props, "maxDepth", 3, 50), maxBytes = $14.prop($$props, "maxBytes", 3, 1048576);
+  const serialized = $14.derived(() => {
+    try {
+      const json = JSON.stringify($$props.value);
+      if (typeof json !== "string")
+        return { ok: false };
+      return { ok: true, size: new Blob([json]).size };
+    } catch {
+      return { ok: false };
+    }
+  });
+  const unserializable = $14.derived(() => !$14.get(serialized).ok);
+  const tooLarge = $14.derived(() => $14.get(serialized).ok && $14.get(serialized).size > maxBytes());
+  function handleTreeKeydown(event) {
+    const tree = event.currentTarget;
+    const items = Array.from(tree.querySelectorAll('[role="treeitem"]'));
+    const eventTarget = event.target instanceof HTMLElement ? event.target : null;
+    const current = eventTarget?.closest('[role="treeitem"]') ?? null;
+    const targetIsToggle = eventTarget?.closest(".cinder-json-viewer__toggle") !== null;
+    const currentIndex = current ? items.indexOf(current) : -1;
+    function focusItem(index2) {
+      const item = items[index2];
+      item?.focus();
+    }
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      focusItem(Math.min(currentIndex + 1, items.length - 1));
+    } else if (event.key === "ArrowUp") {
+      event.preventDefault();
+      focusItem(Math.max(currentIndex - 1, 0));
+    } else if (event.key === "Home") {
+      event.preventDefault();
+      focusItem(0);
+    } else if (event.key === "End") {
+      event.preventDefault();
+      focusItem(items.length - 1);
+    } else if (event.key === "ArrowRight" && current && !targetIsToggle) {
+      if (current.getAttribute("aria-expanded") === "false") {
+        event.preventDefault();
+        current.querySelector(".cinder-json-viewer__toggle")?.click();
+      } else if (current.getAttribute("aria-expanded") === "true") {
+        const firstChild = current.querySelector('.cinder-json-viewer__children [role="treeitem"]');
+        if (firstChild) {
+          event.preventDefault();
+          firstChild.focus();
+        }
+      }
+    } else if (event.key === "ArrowLeft" && current && !targetIsToggle) {
+      if (current.getAttribute("aria-expanded") === "true") {
+        event.preventDefault();
+        current.querySelector(".cinder-json-viewer__toggle")?.click();
+      } else {
+        const parent = current.parentElement?.closest('[role="treeitem"]');
+        if (parent) {
+          event.preventDefault();
+          parent.focus();
+        }
+      }
+    } else if ((event.key === "Enter" || event.key === " " || event.key === "Spacebar") && current && !targetIsToggle) {
+      event.preventDefault();
+      const toggle = current.querySelector(".cinder-json-viewer__toggle");
+      toggle?.click();
+    }
+  }
+  var div = root9();
+  var node = $14.child(div);
+  {
+    var consequent = ($$anchor2) => {
+      var div_1 = root_16();
+      $14.append($$anchor2, div_1);
+    };
+    var consequent_1 = ($$anchor2) => {
+      var div_2 = root_27();
+      var p = $14.child(div_2);
+      var text6 = $14.child(p);
+      $14.reset(p);
+      $14.next(2);
+      $14.reset(div_2);
+      $14.template_effect(($0, $1) => $14.set_text(text6, `Payload too large to render (~${$0 ?? ""} KB; cap
+        is ${$1 ?? ""} KB).`), [
+        () => Math.round(($14.get(serialized).ok ? $14.get(serialized).size : 0) / 1024),
+        () => Math.round(maxBytes() / 1024)
+      ]);
+      $14.append($$anchor2, div_2);
+    };
+    var alternate = ($$anchor2) => {
+      var div_3 = root_34();
+      var node_1 = $14.child(div_3);
+      _json_viewer_node(node_1, {
+        get value() {
+          return $$props.value;
+        },
+        depth: 0,
+        get initialDepth() {
+          return initialDepth();
+        },
+        get maxDepth() {
+          return maxDepth();
+        },
+        position: 1,
+        setSize: 1,
+        root: true
+      });
+      $14.reset(div_3);
+      $14.delegated("keydown", div_3, handleTreeKeydown);
+      $14.append($$anchor2, div_3);
+    };
+    $14.if(node, ($$render) => {
+      if ($14.get(unserializable))
+        $$render(consequent);
+      else if ($14.get(tooLarge))
+        $$render(consequent_1, 1);
+      else
+        $$render(alternate, -1);
+    });
+  }
+  $14.reset(div);
+  $14.template_effect(($0) => $14.set_class(div, 1, $0), [
+    () => $14.clsx(classNames("cinder-json-viewer", $$props.class))
+  ]);
+  $14.append($$anchor, div);
+  $14.pop();
+}
+$14.delegate(["keydown"]);
+
+// src/components/tabs/tabs.svelte
+import"svelte/internal/disclose-version";
+import * as $15 from "svelte/internal/client";
+
+// src/components/tabs/tabs-context.ts
+import { createContext } from "svelte";
+var [getTabsContextStrict, setTabsContext] = createContext();
+var getTabsContext = getTabsContextStrict;
+
+// src/utilities/roving-tabindex.ts
+var ROVING_KEYS = new Set(["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"]);
+function isRovingKey(key) {
+  return ROVING_KEYS.has(key);
+}
+function findNextIndex(currentIndex, length, direction, isDisabled) {
+  if (length === 0)
+    return -1;
+  if (!isDisabled) {
+    return (currentIndex + direction + length) % length;
+  }
+  for (let offset = 1;offset <= length; offset += 1) {
+    const candidateIndex = (currentIndex + offset * direction + length * offset) % length;
+    if (!isDisabled(candidateIndex)) {
+      return candidateIndex;
+    }
+  }
+  return currentIndex;
+}
+function findFirstIndex(length, isDisabled, currentIndex = 0) {
+  if (length === 0)
+    return -1;
+  if (!isDisabled)
+    return 0;
+  for (let index2 = 0;index2 < length; index2 += 1) {
+    if (!isDisabled(index2))
+      return index2;
+  }
+  return currentIndex;
+}
+function findLastIndex(length, isDisabled, currentIndex = 0) {
+  if (length === 0)
+    return -1;
+  if (!isDisabled)
+    return length - 1;
+  for (let index2 = length - 1;index2 >= 0; index2 -= 1) {
+    if (!isDisabled(index2))
+      return index2;
+  }
+  return currentIndex;
+}
+function handleRovingKeydown(event, currentIndex, length, options = {}) {
+  const { isDisabled, vertical = true, horizontal = true } = options;
+  if (length === 0)
+    return null;
+  switch (event.key) {
+    case "ArrowRight":
+      return horizontal ? findNextIndex(currentIndex, length, 1, isDisabled) : null;
+    case "ArrowDown":
+      return vertical ? findNextIndex(currentIndex, length, 1, isDisabled) : null;
+    case "ArrowLeft":
+      return horizontal ? findNextIndex(currentIndex, length, -1, isDisabled) : null;
+    case "ArrowUp":
+      return vertical ? findNextIndex(currentIndex, length, -1, isDisabled) : null;
+    case "Home":
+      return findFirstIndex(length, isDisabled, currentIndex);
+    case "End":
+      return findLastIndex(length, isDisabled, currentIndex);
+    default:
+      return null;
+  }
+}
+function getFocusableIndex(selectedIndex, length, isDisabled) {
+  if (length === 0)
+    return -1;
+  if (selectedIndex >= 0 && selectedIndex < length)
+    return selectedIndex;
+  return findFirstIndex(length, isDisabled, 0);
+}
+
+// src/utilities/value-change.ts
+function commitValue(proposed, onValueChange, setValue) {
+  const committed = onValueChange?.(proposed) ?? proposed;
+  setValue(committed);
+  return committed;
+}
+
+// src/components/tabs/tabs.svelte
+var root10 = $15.from_html(`<div><!></div>`);
+function Tabs($$anchor, $$props) {
+  const baseId = $15.props_id();
+  $15.push($$props, true);
+  let value = $15.prop($$props, "value", 15, ""), orientation = $15.prop($$props, "orientation", 3, "horizontal");
+  const effectiveActivateOnFocus = $15.derived(() => $$props.activateOnFocus ?? orientation() === "horizontal");
+  const buttons = new Map;
+  let version = $15.state(0);
+  const focusableValue = $15.derived(() => {
+    $15.get(version);
+    for (const [registeredValue, entry] of buttons) {
+      if (!entry.disabled)
+        return registeredValue;
+    }
+    return;
+  });
+  function focusValue(target) {
+    const entry = buttons.get(target);
+    if (entry)
+      entry.button.focus();
+  }
+  function resolveFocusedIndex(active) {
+    const entries = [...buttons.values()];
+    return entries.findIndex(({ button }) => button === active);
+  }
+  function readActiveElement(event) {
+    const target = event.target instanceof HTMLElement ? event.target : null;
+    if (target) {
+      for (const { button } of buttons.values()) {
+        if (button === target)
+          return target;
+      }
+    }
+    const currentTarget = event.currentTarget instanceof HTMLElement ? event.currentTarget : null;
+    return currentTarget?.ownerDocument.activeElement ?? null;
+  }
+  function resolveStartingIndex(event) {
+    const entries = [...buttons.values()];
+    if (entries.length === 0)
+      return -1;
+    const focused = resolveFocusedIndex(readActiveElement(event));
+    if (focused !== -1)
+      return focused;
+    const order = [...buttons.keys()];
+    const activeIdx = order.indexOf(value());
+    if (activeIdx !== -1 && !entries[activeIdx]?.disabled)
+      return activeIdx;
+    return entries.findIndex((entry) => !entry.disabled);
+  }
+  function isOrientedKey(key, isHorizontal) {
+    if (!isRovingKey(key))
+      return false;
+    if (key === "Home" || key === "End")
+      return true;
+    if (isHorizontal)
+      return key === "ArrowLeft" || key === "ArrowRight";
+    return key === "ArrowUp" || key === "ArrowDown";
+  }
+  function handleKeydown(event) {
+    const entries = [...buttons.values()];
+    const order = [...buttons.keys()];
+    if (event.key === "Enter" || event.key === " ") {
+      const focused = resolveFocusedIndex(readActiveElement(event));
+      if (focused === -1)
+        return;
+      if (entries[focused]?.disabled !== false)
+        return;
+      const focusedValue = order[focused];
+      if (focusedValue === undefined)
+        return;
+      event.preventDefault();
+      commitValue(focusedValue, $$props.onValueChange, (next3) => {
+        value(next3);
+      });
+      return;
+    }
+    const isHorizontal = orientation() === "horizontal";
+    if (!isOrientedKey(event.key, isHorizontal))
+      return;
+    if (entries.length === 0)
+      return;
+    const currentIndex = resolveStartingIndex(event);
+    if (currentIndex === -1) {
+      event.preventDefault();
+      return;
+    }
+    const nextIdx = handleRovingKeydown(event, currentIndex, entries.length, {
+      isDisabled: (i) => entries[i]?.disabled ?? false,
+      horizontal: isHorizontal,
+      vertical: !isHorizontal
+    });
+    if (nextIdx === null)
+      return;
+    event.preventDefault();
+    if (nextIdx === currentIndex)
+      return;
+    const nextValue = order[nextIdx];
+    if (nextValue === undefined)
+      return;
+    focusValue(nextValue);
+    if ($15.get(effectiveActivateOnFocus)) {
+      commitValue(nextValue, $$props.onValueChange, (next3) => {
+        value(next3);
+      });
+    }
+  }
+  setTabsContext({
+    get value() {
+      return value();
+    },
+    get orientation() {
+      return orientation();
+    },
+    get activateOnFocus() {
+      return $15.get(effectiveActivateOnFocus);
+    },
+    get baseId() {
+      return baseId;
+    },
+    select(next3) {
+      commitValue(next3, $$props.onValueChange, (nextValue) => {
+        value(nextValue);
+      });
+    },
+    isActive(candidate) {
+      return value() === candidate;
+    },
+    register(target, button, disabled = false) {
+      const existing = buttons.get(target);
+      if (existing) {
+        existing.button = button;
+        existing.disabled = disabled;
+      } else {
+        buttons.set(target, { button, disabled });
+      }
+      $15.set(version, $15.get(version) + 1);
+    },
+    unregister(target) {
+      if (buttons.delete(target)) {
+        $15.set(version, $15.get(version) + 1);
+      }
+    },
+    setDisabled(target, disabled) {
+      const existing = buttons.get(target);
+      if (!existing)
+        return;
+      if (existing.disabled === disabled)
+        return;
+      existing.disabled = disabled;
+      $15.set(version, $15.get(version) + 1);
+    },
+    isFocusable(candidate) {
+      value();
+      $15.get(version);
+      const selectedEntry = buttons.get(value());
+      const selectedIsEnabled = selectedEntry !== undefined && !selectedEntry.disabled;
+      const entry = buttons.get(candidate);
+      if (!entry || entry.disabled)
+        return false;
+      if (selectedIsEnabled)
+        return value() === candidate;
+      return $15.get(focusableValue) === candidate;
+    },
+    handleKeydown
+  });
+  var div = root10();
+  var node = $15.child(div);
+  $15.snippet(node, () => $$props.children);
+  $15.reset(div);
+  $15.template_effect(($0) => {
+    $15.set_class(div, 1, $0);
+    $15.set_attribute(div, "data-cinder-orientation", orientation());
+  }, [() => $15.clsx(classNames("cinder-tabs", $$props.class))]);
+  $15.append($$anchor, div);
+  $15.pop();
+}
+
+// src/components/tab-list/tab-list.svelte
+import"svelte/internal/disclose-version";
+import * as $16 from "svelte/internal/client";
+var root11 = $16.from_html(`<div role="tablist"><!></div>`);
+function Tab_list($$anchor, $$props) {
+  $16.push($$props, true);
+  const tabs = getTabsContext();
+  var div = root11();
+  var node = $16.child(div);
+  $16.snippet(node, () => $$props.children);
+  $16.reset(div);
+  $16.template_effect(($0) => {
+    $16.set_class(div, 1, $0);
+    $16.set_attribute(div, "data-cinder-orientation", tabs.orientation);
+    $16.set_attribute(div, "aria-label", $$props.label);
+    $16.set_attribute(div, "aria-labelledby", $$props.labelledBy);
+    $16.set_attribute(div, "aria-orientation", tabs.orientation);
+  }, [() => $16.clsx(classNames("cinder-tab-list", $$props.class))]);
+  $16.append($$anchor, div);
+  $16.pop();
+}
+
+// src/components/tab/tab.svelte
+import"svelte/internal/disclose-version";
+import * as $17 from "svelte/internal/client";
+import { untrack as untrack3 } from "svelte";
+
+// src/_internal/collection.ts
+function createSingleSelection(getValue, setValue) {
+  return {
+    get value() {
+      return getValue();
+    },
+    select(next3) {
+      setValue(next3);
+    },
+    isSelected(candidate) {
+      return getValue() === candidate;
+    }
+  };
+}
+function createMultiSelection(getValues, setValues) {
+  return {
+    get values() {
+      return getValues();
+    },
+    toggle(item) {
+      const current = getValues();
+      const index2 = current.indexOf(item);
+      if (index2 === -1) {
+        setValues([...current, item]);
+      } else {
+        setValues(current.filter((existing) => existing !== item));
+      }
+    },
+    isSelected(candidate) {
+      return getValues().includes(candidate);
+    }
+  };
+}
+function rovingTabIndex(isActive) {
+  return isActive ? 0 : -1;
+}
+
+// src/components/tab/tab.svelte
+var root_17 = $17.from_html(`<span class="cinder-tab__trailing" aria-hidden="true"><!></span>`);
+var root12 = $17.from_html(`<button type="button" role="tab"><!> <!></button>`);
+function Tab($$anchor, $$props) {
+  $17.push($$props, true);
+  let disabled = $17.prop($$props, "disabled", 3, false);
+  const tabs = getTabsContext();
+  const tabId = $17.derived(() => $$props.id ?? `${tabs.baseId}-tab-${$$props.value}`);
+  const panelId = $17.derived(() => `${tabs.baseId}-panel-${$$props.value}`);
+  const isActive = $17.derived(() => tabs.isActive($$props.value));
+  const isFocusable = $17.derived(() => tabs.isFocusable($$props.value));
+  let buttonElement = $17.state(undefined);
+  const registeredValue = untrack3(() => $$props.value);
+  $17.user_effect(() => {
+    if (!$17.get(buttonElement))
+      return;
+    const button = $17.get(buttonElement);
+    const initialDisabled = untrack3(() => disabled());
+    untrack3(() => {
+      tabs.register(registeredValue, button, initialDisabled);
+    });
+    return () => {
+      untrack3(() => {
+        tabs.unregister(registeredValue);
+      });
+    };
+  });
+  $17.user_effect(() => {
+    const next3 = disabled();
+    untrack3(() => {
+      tabs.setDisabled(registeredValue, next3);
+    });
+  });
+  function handleClick() {
+    if (disabled())
+      return;
+    tabs.select($$props.value);
+  }
+  var button_1 = root12();
+  var node = $17.child(button_1);
+  $17.snippet(node, () => $$props.children);
+  var node_1 = $17.sibling(node, 2);
+  {
+    var consequent = ($$anchor2) => {
+      var span = root_17();
+      var node_2 = $17.child(span);
+      $17.snippet(node_2, () => $$props.trailing);
+      $17.reset(span);
+      $17.append($$anchor2, span);
+    };
+    $17.if(node_1, ($$render) => {
+      if ($$props.trailing)
+        $$render(consequent);
+    });
+  }
+  $17.reset(button_1);
+  $17.bind_this(button_1, ($$value) => $17.set(buttonElement, $$value), () => $17.get(buttonElement));
+  $17.template_effect(($0, $1) => {
+    $17.set_attribute(button_1, "id", $17.get(tabId));
+    $17.set_class(button_1, 1, $0);
+    $17.set_attribute(button_1, "data-cinder-value", $$props.value);
+    $17.set_attribute(button_1, "data-cinder-active", $17.get(isActive) ? "" : undefined);
+    $17.set_attribute(button_1, "data-cinder-disabled", disabled() || undefined);
+    $17.set_attribute(button_1, "data-variant", tabs.orientation);
+    $17.set_attribute(button_1, "aria-selected", $17.get(isActive));
+    $17.set_attribute(button_1, "aria-controls", $17.get(panelId));
+    $17.set_attribute(button_1, "tabindex", $1);
+    button_1.disabled = disabled();
+  }, [
+    () => $17.clsx(classNames("cinder-tab", $$props.class)),
+    () => rovingTabIndex($17.get(isFocusable))
+  ]);
+  $17.delegated("click", button_1, handleClick);
+  $17.delegated("keydown", button_1, function(...$$args) {
+    tabs.handleKeydown?.apply(this, $$args);
+  });
+  $17.append($$anchor, button_1);
+  $17.pop();
+}
+$17.delegate(["click", "keydown"]);
+
+// src/components/tab-panel/tab-panel.svelte
+import"svelte/internal/disclose-version";
+import * as $18 from "svelte/internal/client";
+var root_18 = $18.from_html(`<div role="tabpanel" tabindex="0"><!></div>`);
+function Tab_panel($$anchor, $$props) {
+  $18.push($$props, true);
+  const tabs = getTabsContext();
+  const isActive = $18.derived(() => tabs.isActive($$props.value));
+  const panelId = $18.derived(() => `${tabs.baseId}-panel-${$$props.value}`);
+  const labelledBy = $18.derived(() => $$props.ariaLabelledby ?? `${tabs.baseId}-tab-${$$props.value}`);
+  var fragment = $18.comment();
+  var node = $18.first_child(fragment);
+  {
+    var consequent = ($$anchor2) => {
+      var div = root_18();
+      var node_1 = $18.child(div);
+      $18.snippet(node_1, () => $$props.children);
+      $18.reset(div);
+      $18.template_effect(($0) => {
+        $18.set_attribute(div, "id", $18.get(panelId));
+        $18.set_class(div, 1, $0);
+        $18.set_attribute(div, "data-cinder-value", $$props.value);
+        $18.set_attribute(div, "aria-labelledby", $18.get(labelledBy));
+      }, [() => $18.clsx(classNames("cinder-tab-panel", $$props.class))]);
+      $18.append($$anchor2, div);
+    };
+    $18.if(node, ($$render) => {
+      if ($18.get(isActive))
+        $$render(consequent);
+    });
+  }
+  $18.append($$anchor, fragment);
+  $18.pop();
+}
+
+// src/components/payload-inspector/payload-inspector.svelte
+var root_19 = $19.from_html(`<span class="cinder-payload-inspector__size"> </span>`);
+var root_73 = $19.from_html(`<!> <!> <!>`, 1);
+var root_122 = $19.from_html(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+var root_182 = $19.from_html(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning" role="alert"> </div>`);
+var root_192 = $19.from_html(`<div class="cinder-payload-inspector__summary-value"><span class="cinder-payload-inspector__summary-value-label">Value</span> <span class="cinder-payload-inspector__primitive"> </span></div>`);
+var root_132 = $19.from_html(`<div class="cinder-payload-inspector__summary"><div class="cinder-payload-inspector__summary-badges"><!> <!></div> <!> <!> <!></div>`);
+var root_11 = $19.from_html(`<div class="cinder-payload-inspector__panel"><!> <!></div>`);
+var root_21 = $19.from_html(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+var root_222 = $19.from_html(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning" role="alert"> </div>`);
+var root_232 = $19.from_html(`<div class="cinder-payload-inspector__notice" role="status">This value can't be serialized as JSON (it may contain circular references or BigInt
+              values).</div>`);
+var root_20 = $19.from_html(`<div class="cinder-payload-inspector__panel"><!> <!> <!> <!></div>`);
+var root_262 = $19.from_html(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+var root_272 = $19.from_html(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning">This payload has been truncated by the producer. The raw view shows only the received
+              portion.</div>`);
+var root_28 = $19.from_html(`<div class="cinder-payload-inspector__notice" role="status">This value can't be serialized as JSON (it may contain circular references or BigInt
+              values).</div>`);
+var root_252 = $19.from_html(`<div class="cinder-payload-inspector__panel cinder-payload-inspector__panel--code"><!> <!> <!> <!></div>`);
+var root_63 = $19.from_html(`<!> <!> <!> <!>`, 1);
+var root13 = $19.from_html(`<section><div class="cinder-payload-inspector__header"><span class="cinder-payload-inspector__label"> </span> <div class="cinder-payload-inspector__header-actions"><!> <!> <!> <!></div></div> <div class="cinder-payload-inspector__tabs"><!></div></section>`);
+function Payload_inspector($$anchor, $$props) {
+  $19.push($$props, true);
+  let truncated = $19.prop($$props, "truncated", 3, false), maxBytes = $19.prop($$props, "maxBytes", 3, 1048576), activeView = $19.prop($$props, "activeView", 15, "summary"), label = $19.prop($$props, "label", 3, "Payload inspector"), rest = $19.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "value",
+    "truncated",
+    "maxBytes",
+    "meta",
+    "format",
+    "parse",
+    "activeView",
+    "label",
+    "class"
+  ]);
+  function shouldParseString(raw) {
+    const trimmed = raw.trim();
+    if (/^[{\["]/.test(trimmed))
+      return true;
+    return /^(?:true|false|null|-?(?:0|[1-9]\d*)(?:\.\d+)?(?:[eE][+-]?\d+)?)$/.test(trimmed);
+  }
+  const parseResult = $19.derived(() => {
+    if (typeof $$props.value !== "string") {
+      return { ok: true, parsed: $$props.value };
+    }
+    if ($$props.value.trim() === "") {
+      return { ok: true, parsed: null };
+    }
+    if ($$props.parse === undefined && !shouldParseString($$props.value)) {
+      return { ok: true, parsed: $$props.value };
+    }
+    try {
+      const parser = $$props.parse ?? JSON.parse;
+      return { ok: true, parsed: parser($$props.value) };
+    } catch (error) {
+      return {
+        ok: false,
+        error: error instanceof Error ? error.message : String(error)
+      };
+    }
+  });
+  const parsedValue = $19.derived(() => $19.get(parseResult).ok ? $19.get(parseResult).parsed : undefined);
+  const sizeResult = $19.derived(() => {
+    if (!$19.get(parseResult).ok)
+      return { ok: false };
+    try {
+      const json = JSON.stringify($19.get(parsedValue));
+      if (typeof json !== "string")
+        return { ok: false };
+      return { ok: true, bytes: new Blob([json]).size };
+    } catch {
+      return { ok: false };
+    }
+  });
+  const byteLabel = $19.derived(() => {
+    if (!$19.get(sizeResult).ok)
+      return "Unknown size";
+    const bytes = $19.get(sizeResult).bytes;
+    if (bytes < 1024)
+      return `${bytes} B`;
+    if (bytes < 1024 * 1024)
+      return `${(bytes / 1024).toFixed(1)} KB`;
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+  });
+  const rawText = $19.derived(() => {
+    if (!$19.get(parseResult).ok) {
+      return typeof $$props.value === "string" ? $$props.value : "";
+    }
+    try {
+      const formatter = $$props.format ?? ((v) => JSON.stringify(v, null, 2));
+      return formatter($19.get(parsedValue)) ?? "";
+    } catch {
+      return typeof $$props.value === "string" ? $$props.value : "";
+    }
+  });
+  const unserializable = $19.derived(() => {
+    if (typeof $$props.value === "string" || !$19.get(parseResult).ok)
+      return false;
+    try {
+      JSON.stringify($19.get(parsedValue));
+      return false;
+    } catch {
+      return true;
+    }
+  });
+  const summaryItems = $19.derived(() => {
+    const items = [];
+    items.push({ term: "Size", definition: $19.get(byteLabel) });
+    if ($$props.meta?.contentType) {
+      items.push({ term: "Content type", definition: $$props.meta.contentType });
+    }
+    if ($$props.meta?.source) {
+      items.push({ term: "Source", definition: $$props.meta.source });
+    }
+    if ($$props.meta?.timestamp) {
+      let displayTime = $$props.meta.timestamp;
+      try {
+        displayTime = new Date($$props.meta.timestamp).toLocaleString();
+      } catch {}
+      items.push({ term: "Timestamp", definition: displayTime });
+    }
+    return items;
+  });
+  const valueKind = $19.derived(() => {
+    if (!$19.get(parseResult).ok)
+      return "invalid";
+    const v = $19.get(parsedValue);
+    if (v === null)
+      return "null";
+    if (v === undefined)
+      return "undefined";
+    if (typeof v === "boolean")
+      return "boolean";
+    if (typeof v === "number")
+      return "number";
+    if (typeof v === "string")
+      return "string";
+    if (Array.isArray(v))
+      return "array";
+    return "object";
+  });
+  const isPrimitive = $19.derived(() => $19.get(valueKind) === "null" || $19.get(valueKind) === "undefined" || $19.get(valueKind) === "boolean" || $19.get(valueKind) === "number" || $19.get(valueKind) === "string");
+  const isEmpty = $19.derived(() => $19.get(parsedValue) === undefined && $$props.value === undefined);
+  const copyRawText = $19.derived(() => {
+    if (typeof $$props.value === "string")
+      return $$props.value;
+    if (!$19.get(parseResult).ok)
+      return "";
+    try {
+      return JSON.stringify($19.get(parsedValue)) ?? "";
+    } catch {
+      return "";
+    }
+  });
+  const copyFormattedText = $19.derived(() => {
+    if (!$19.get(parseResult).ok)
+      return $19.get(rawText);
+    try {
+      return JSON.stringify($19.get(parsedValue), null, 2) ?? "";
+    } catch {
+      return $19.get(rawText);
+    }
+  });
+  const canCopyFormatted = $19.derived(() => !$19.get(isEmpty) && $19.get(parseResult).ok && !$19.get(unserializable));
+  const canCopyRaw = $19.derived(() => !$19.get(isEmpty) && (typeof $$props.value === "string" || $19.get(canCopyFormatted)));
+  function kindVariant(kind) {
+    if (kind === "invalid")
+      return "danger";
+    if (kind === "null" || kind === "undefined")
+      return "warning";
+    if (kind === "object" || kind === "array")
+      return "info";
+    return "neutral";
+  }
+  var section = root13();
+  $19.attribute_effect(section, ($0) => ({ ...rest, class: $0, "aria-label": label() }), [() => classNames("cinder-payload-inspector", $$props.class)]);
+  var div = $19.child(section);
+  var span = $19.child(div);
+  var text7 = $19.child(span, true);
+  $19.reset(span);
+  var div_1 = $19.sibling(span, 2);
+  var node = $19.child(div_1);
+  {
+    var consequent = ($$anchor2) => {
+      var span_1 = root_19();
+      var text_1 = $19.child(span_1, true);
+      $19.reset(span_1);
+      $19.template_effect(() => {
+        $19.set_attribute(span_1, "aria-label", `${$19.get(byteLabel)} payload size`);
+        $19.set_text(text_1, $19.get(byteLabel));
+      });
+      $19.append($$anchor2, span_1);
+    };
+    $19.if(node, ($$render) => {
+      if ($19.get(sizeResult).ok)
+        $$render(consequent);
+    });
+  }
+  var node_1 = $19.sibling(node, 2);
+  {
+    var consequent_1 = ($$anchor2) => {
+      Badge($$anchor2, {
+        variant: "warning",
+        size: "xs",
+        children: ($$anchor3, $$slotProps) => {
+          $19.next();
+          var text_2 = $19.text("Truncated");
+          $19.append($$anchor3, text_2);
+        },
+        $$slots: { default: true }
+      });
+    };
+    $19.if(node_1, ($$render) => {
+      if (truncated())
+        $$render(consequent_1);
+    });
+  }
+  var node_2 = $19.sibling(node_1, 2);
+  {
+    var consequent_2 = ($$anchor2) => {
+      Copy_button($$anchor2, {
+        get value() {
+          return $19.get(copyFormattedText);
+        },
+        label: "Copy formatted",
+        copiedLabel: "Formatted copied",
+        title: "Copy formatted payload",
+        iconOnly: true
+      });
+    };
+    $19.if(node_2, ($$render) => {
+      if ($19.get(canCopyFormatted))
+        $$render(consequent_2);
+    });
+  }
+  var node_3 = $19.sibling(node_2, 2);
+  {
+    var consequent_3 = ($$anchor2) => {
+      Copy_button($$anchor2, {
+        get value() {
+          return $19.get(copyRawText);
+        },
+        label: "Copy raw",
+        copiedLabel: "Raw copied",
+        title: "Copy raw payload",
+        iconOnly: true
+      });
+    };
+    $19.if(node_3, ($$render) => {
+      if ($19.get(canCopyRaw))
+        $$render(consequent_3);
+    });
+  }
+  $19.reset(div_1);
+  $19.reset(div);
+  var div_2 = $19.sibling(div, 2);
+  var node_4 = $19.child(div_2);
+  Tabs(node_4, {
+    get value() {
+      return activeView();
+    },
+    set value($$value) {
+      activeView($$value);
+    },
+    children: ($$anchor2, $$slotProps) => {
+      var fragment_3 = root_63();
+      var node_5 = $19.first_child(fragment_3);
+      Tab_list(node_5, {
+        label: "Inspector views",
+        children: ($$anchor3, $$slotProps2) => {
+          var fragment_4 = root_73();
+          var node_6 = $19.first_child(fragment_4);
+          Tab(node_6, {
+            value: "summary",
+            children: ($$anchor4, $$slotProps3) => {
+              $19.next();
+              var text_3 = $19.text("Summary");
+              $19.append($$anchor4, text_3);
+            },
+            $$slots: { default: true }
+          });
+          var node_7 = $19.sibling(node_6, 2);
+          Tab(node_7, {
+            value: "tree",
+            children: ($$anchor4, $$slotProps3) => {
+              $19.next();
+              var text_4 = $19.text("Tree");
+              $19.append($$anchor4, text_4);
+            },
+            $$slots: { default: true }
+          });
+          var node_8 = $19.sibling(node_7, 2);
+          Tab(node_8, {
+            value: "raw",
+            children: ($$anchor4, $$slotProps3) => {
+              $19.next();
+              var text_5 = $19.text("Raw");
+              $19.append($$anchor4, text_5);
+            },
+            $$slots: { default: true }
+          });
+          $19.append($$anchor3, fragment_4);
+        },
+        $$slots: { default: true }
+      });
+      var node_9 = $19.sibling(node_5, 2);
+      Tab_panel(node_9, {
+        value: "summary",
+        children: ($$anchor3, $$slotProps2) => {
+          var div_3 = root_11();
+          var node_10 = $19.child(div_3);
+          {
+            var consequent_4 = ($$anchor4) => {
+              var div_4 = root_122();
+              $19.append($$anchor4, div_4);
+            };
+            $19.if(node_10, ($$render) => {
+              if ($19.get(isEmpty))
+                $$render(consequent_4);
+            });
+          }
+          var node_11 = $19.sibling(node_10, 2);
+          {
+            var consequent_9 = ($$anchor4) => {
+              var div_5 = root_132();
+              var div_6 = $19.child(div_5);
+              var node_12 = $19.child(div_6);
+              {
+                let $0 = $19.derived(() => kindVariant($19.get(valueKind)));
+                Badge(node_12, {
+                  get variant() {
+                    return $19.get($0);
+                  },
+                  size: "xs",
+                  mono: true,
+                  children: ($$anchor5, $$slotProps3) => {
+                    $19.next();
+                    var text_6 = $19.text();
+                    $19.template_effect(() => $19.set_text(text_6, $19.get(valueKind)));
+                    $19.append($$anchor5, text_6);
+                  },
+                  $$slots: { default: true }
+                });
+              }
+              var node_13 = $19.sibling(node_12, 2);
+              {
+                var consequent_5 = ($$anchor5) => {
+                  Badge($$anchor5, {
+                    variant: "warning",
+                    size: "xs",
+                    children: ($$anchor6, $$slotProps3) => {
+                      $19.next();
+                      var text_7 = $19.text("Truncated");
+                      $19.append($$anchor6, text_7);
+                    },
+                    $$slots: { default: true }
+                  });
+                };
+                $19.if(node_13, ($$render) => {
+                  if (truncated())
+                    $$render(consequent_5);
+                });
+              }
+              $19.reset(div_6);
+              var node_14 = $19.sibling(div_6, 2);
+              {
+                var consequent_6 = ($$anchor5) => {
+                  Description_list($$anchor5, {
+                    get items() {
+                      return $19.get(summaryItems);
+                    },
+                    variant: "two-column"
+                  });
+                };
+                $19.if(node_14, ($$render) => {
+                  if ($19.get(summaryItems).length > 0)
+                    $$render(consequent_6);
+                });
+              }
+              var node_15 = $19.sibling(node_14, 2);
+              {
+                var consequent_7 = ($$anchor5) => {
+                  var div_7 = root_182();
+                  var text_8 = $19.child(div_7);
+                  $19.reset(div_7);
+                  $19.template_effect(() => $19.set_text(text_8, `Parse error: ${$19.get(parseResult).error ?? ""}`));
+                  $19.append($$anchor5, div_7);
+                };
+                $19.if(node_15, ($$render) => {
+                  if (!$19.get(parseResult).ok)
+                    $$render(consequent_7);
+                });
+              }
+              var node_16 = $19.sibling(node_15, 2);
+              {
+                var consequent_8 = ($$anchor5) => {
+                  var div_8 = root_192();
+                  var span_2 = $19.sibling($19.child(div_8), 2);
+                  var text_9 = $19.child(span_2, true);
+                  $19.reset(span_2);
+                  $19.reset(div_8);
+                  $19.template_effect(($0) => $19.set_text(text_9, $0), [() => String($19.get(parsedValue))]);
+                  $19.append($$anchor5, div_8);
+                };
+                $19.if(node_16, ($$render) => {
+                  if ($19.get(parseResult).ok && $19.get(isPrimitive))
+                    $$render(consequent_8);
+                });
+              }
+              $19.reset(div_5);
+              $19.append($$anchor4, div_5);
+            };
+            $19.if(node_11, ($$render) => {
+              if (!$19.get(isEmpty))
+                $$render(consequent_9);
+            });
+          }
+          $19.reset(div_3);
+          $19.append($$anchor3, div_3);
+        },
+        $$slots: { default: true }
+      });
+      var node_17 = $19.sibling(node_9, 2);
+      Tab_panel(node_17, {
+        value: "tree",
+        children: ($$anchor3, $$slotProps2) => {
+          var div_9 = root_20();
+          var node_18 = $19.child(div_9);
+          {
+            var consequent_10 = ($$anchor4) => {
+              var div_10 = root_21();
+              $19.append($$anchor4, div_10);
+            };
+            $19.if(node_18, ($$render) => {
+              if ($19.get(isEmpty))
+                $$render(consequent_10);
+            });
+          }
+          var node_19 = $19.sibling(node_18, 2);
+          {
+            var consequent_11 = ($$anchor4) => {
+              var div_11 = root_222();
+              var text_10 = $19.child(div_11);
+              $19.reset(div_11);
+              $19.template_effect(() => $19.set_text(text_10, `Cannot render tree: ${$19.get(parseResult).error ?? ""}`));
+              $19.append($$anchor4, div_11);
+            };
+            $19.if(node_19, ($$render) => {
+              if (!$19.get(isEmpty) && !$19.get(parseResult).ok)
+                $$render(consequent_11);
+            });
+          }
+          var node_20 = $19.sibling(node_19, 2);
+          {
+            var consequent_12 = ($$anchor4) => {
+              var div_12 = root_232();
+              $19.append($$anchor4, div_12);
+            };
+            $19.if(node_20, ($$render) => {
+              if (!$19.get(isEmpty) && $19.get(parseResult).ok && $19.get(unserializable))
+                $$render(consequent_12);
+            });
+          }
+          var node_21 = $19.sibling(node_20, 2);
+          {
+            var consequent_13 = ($$anchor4) => {
+              Json_viewer($$anchor4, {
+                get value() {
+                  return $19.get(parsedValue);
+                },
+                get maxBytes() {
+                  return maxBytes();
+                }
+              });
+            };
+            $19.if(node_21, ($$render) => {
+              if (!$19.get(isEmpty) && $19.get(parseResult).ok && !$19.get(unserializable))
+                $$render(consequent_13);
+            });
+          }
+          $19.reset(div_9);
+          $19.append($$anchor3, div_9);
+        },
+        $$slots: { default: true }
+      });
+      var node_22 = $19.sibling(node_17, 2);
+      Tab_panel(node_22, {
+        value: "raw",
+        children: ($$anchor3, $$slotProps2) => {
+          var div_13 = root_252();
+          var node_23 = $19.child(div_13);
+          {
+            var consequent_14 = ($$anchor4) => {
+              var div_14 = root_262();
+              $19.append($$anchor4, div_14);
+            };
+            $19.if(node_23, ($$render) => {
+              if ($19.get(isEmpty))
+                $$render(consequent_14);
+            });
+          }
+          var node_24 = $19.sibling(node_23, 2);
+          {
+            var consequent_15 = ($$anchor4) => {
+              var div_15 = root_272();
+              $19.append($$anchor4, div_15);
+            };
+            $19.if(node_24, ($$render) => {
+              if (!$19.get(isEmpty) && truncated())
+                $$render(consequent_15);
+            });
+          }
+          var node_25 = $19.sibling(node_24, 2);
+          {
+            var consequent_16 = ($$anchor4) => {
+              var div_16 = root_28();
+              $19.append($$anchor4, div_16);
+            };
+            $19.if(node_25, ($$render) => {
+              if (!$19.get(isEmpty) && $19.get(unserializable))
+                $$render(consequent_16);
+            });
+          }
+          var node_26 = $19.sibling(node_25, 2);
+          {
+            var consequent_17 = ($$anchor4) => {
+              Code_block($$anchor4, {
+                get code() {
+                  return $19.get(rawText);
+                },
+                highlight: false,
+                class: "cinder-payload-inspector__raw"
+              });
+            };
+            $19.if(node_26, ($$render) => {
+              if (!$19.get(isEmpty) && !$19.get(unserializable))
+                $$render(consequent_17);
+            });
+          }
+          $19.reset(div_13);
+          $19.append($$anchor3, div_13);
+        },
+        $$slots: { default: true }
+      });
+      $19.append($$anchor2, fragment_3);
+    },
+    $$slots: { default: true }
+  });
+  $19.reset(div_2);
+  $19.reset(section);
+  $19.template_effect(() => $19.set_text(text7, label()));
+  $19.append($$anchor, section);
+  $19.pop();
+}
+
+// src/components/secret-value-field/secret-value-field.svelte
+import"svelte/internal/disclose-version";
+import * as $20 from "svelte/internal/client";
+import { onDestroy, untrack as untrack4 } from "svelte";
+var root_110 = $20.from_html(`<span class="cinder-secret-value-field__prefix" aria-hidden="true"> </span>`);
+var root_29 = $20.from_html(`<span class="cinder-secret-value-field__suffix" aria-hidden="true"> </span>`);
+var root_45 = $20.from_svg(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="cinder-secret-value-field__icon" aria-hidden="true"><path fill-rule="evenodd" d="M3.28 2.22a.75.75 0 00-1.06 1.06l14.5 14.5a.75.75 0 101.06-1.06l-1.745-1.745a10.029 10.029 0 003.3-4.38 1.651 1.651 0 000-1.185A10.004 10.004 0 009.999 3a9.956 9.956 0 00-4.744 1.194L3.28 2.22zM7.752 6.69l1.092 1.092a2.5 2.5 0 013.374 3.373l1.091 1.092a4 4 0 00-5.557-5.557z" clip-rule="evenodd"></path><path d="M10.748 13.93l2.523 2.524a9.987 9.987 0 01-3.27.547c-4.258 0-7.894-2.66-9.337-6.41a1.651 1.651 0 010-1.186A10.007 10.007 0 012.839 6.02L6.07 9.252a4 4 0 004.678 4.678z"></path></svg>`);
+var root_54 = $20.from_svg(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="cinder-secret-value-field__icon" aria-hidden="true"><path d="M10 12.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5z"></path><path fill-rule="evenodd" d="M.664 10.59a1.651 1.651 0 010-1.186A10.004 10.004 0 0110 3c4.257 0 7.893 2.66 9.336 6.41.147.381.146.804 0 1.186A10.004 10.004 0 0110 17c-4.257 0-7.893-2.66-9.336-6.41zM14 10a4 4 0 11-8 0 4 4 0 018 0z" clip-rule="evenodd"></path></svg>`);
+var root_35 = $20.from_html(`<button type="button" class="cinder-secret-value-field__toggle"><!></button>`);
+var root_64 = $20.from_svg(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="cinder-secret-value-field__icon" aria-hidden="true"><path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd"></path></svg>`);
+var root_74 = $20.from_svg(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="cinder-secret-value-field__icon" aria-hidden="true"><path d="M7 3.5A1.5 1.5 0 018.5 2h3.879a1.5 1.5 0 011.06.44l3.122 3.12A1.5 1.5 0 0117 6.622V12.5a1.5 1.5 0 01-1.5 1.5h-1v-3.379a3 3 0 00-.879-2.121L10.5 5.379A3 3 0 008.379 4.5H7v-1z"></path><path d="M4.5 6A1.5 1.5 0 003 7.5v9A1.5 1.5 0 004.5 18h7a1.5 1.5 0 001.5-1.5v-5.879a1.5 1.5 0 00-.44-1.06L9.44 6.439A1.5 1.5 0 008.378 6H4.5z"></path></svg>`);
+var root_83 = $20.from_html(`<div class="cinder-secret-value-field__warning"><!></div>`);
+var root14 = $20.from_html(`<div><span class="cinder-secret-value-field__label"> </span> <div class="cinder-secret-value-field__row" role="group"><!> <span class="cinder-secret-value-field__value"> </span> <!> <div class="cinder-secret-value-field__actions"><!> <button type="button" class="cinder-secret-value-field__copy"><!></button></div></div> <!> <!></div>`);
+function Secret_value_field($$anchor, $$props) {
+  const fieldId = $20.props_id();
+  $20.push($$props, true);
+  let label = $20.prop($$props, "label", 3, "Secret value"), allowReveal = $20.prop($$props, "allowReveal", 3, false), initiallyRevealed = $20.prop($$props, "initiallyRevealed", 3, false), confirmDuration = $20.prop($$props, "confirmDuration", 3, 1500), copiedLabel = $20.prop($$props, "copiedLabel", 3, "Copied"), rest = $20.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "value",
+    "prefix",
+    "suffix",
+    "label",
+    "allowReveal",
+    "initiallyRevealed",
+    "confirmDuration",
+    "copiedLabel",
+    "warning",
+    "class"
+  ]);
+  let revealed = $20.state($20.proxy(untrack4(() => initiallyRevealed())));
+  let previousValue = $20.state($20.proxy(untrack4(() => $$props.value)));
+  let copied = $20.state(false);
+  let resetTimer;
+  const copiedAnnouncement = $20.derived(() => $20.get(copied) ? copiedLabel() : "");
+  const MASK = "••••••••••••••••";
+  async function handleCopy() {
+    const ok = await copyToClipboard($$props.value);
+    if (!ok)
+      return;
+    $20.set(copied, true);
+    if (resetTimer)
+      clearTimeout(resetTimer);
+    resetTimer = setTimeout(() => {
+      $20.set(copied, false);
+    }, confirmDuration());
+  }
+  function handleRevealToggle() {
+    if (!allowReveal())
+      return;
+    $20.set(revealed, !$20.get(revealed));
+  }
+  $20.user_effect(() => {
+    if ($$props.value === $20.get(previousValue))
+      return;
+    $20.set(previousValue, $$props.value, true);
+    $20.set(revealed, initiallyRevealed());
+  });
+  onDestroy(() => {
+    if (resetTimer)
+      clearTimeout(resetTimer);
+  });
+  var div = root14();
+  $20.attribute_effect(div, ($0) => ({
+    ...rest,
+    class: $0,
+    "data-cinder-copied": $20.get(copied) || undefined,
+    "data-cinder-revealed": $20.get(revealed) || undefined
+  }), [() => classNames("cinder-secret-value-field", $$props.class)]);
+  var span = $20.child(div);
+  var text7 = $20.child(span, true);
+  $20.reset(span);
+  var div_1 = $20.sibling(span, 2);
+  var node = $20.child(div_1);
+  {
+    var consequent = ($$anchor2) => {
+      var span_1 = root_110();
+      var text_1 = $20.child(span_1, true);
+      $20.reset(span_1);
+      $20.template_effect(() => $20.set_text(text_1, $$props.prefix));
+      $20.append($$anchor2, span_1);
+    };
+    $20.if(node, ($$render) => {
+      if ($$props.prefix)
+        $$render(consequent);
+    });
+  }
+  var span_2 = $20.sibling(node, 2);
+  var text_2 = $20.child(span_2, true);
+  $20.reset(span_2);
+  var node_1 = $20.sibling(span_2, 2);
+  {
+    var consequent_1 = ($$anchor2) => {
+      var span_3 = root_29();
+      var text_3 = $20.child(span_3, true);
+      $20.reset(span_3);
+      $20.template_effect(() => $20.set_text(text_3, $$props.suffix));
+      $20.append($$anchor2, span_3);
+    };
+    $20.if(node_1, ($$render) => {
+      if ($$props.suffix)
+        $$render(consequent_1);
+    });
+  }
+  var div_2 = $20.sibling(node_1, 2);
+  var node_2 = $20.child(div_2);
+  {
+    var consequent_3 = ($$anchor2) => {
+      var button = root_35();
+      var node_3 = $20.child(button);
+      {
+        var consequent_2 = ($$anchor3) => {
+          var svg = root_45();
+          $20.append($$anchor3, svg);
+        };
+        var alternate = ($$anchor3) => {
+          var svg_1 = root_54();
+          $20.append($$anchor3, svg_1);
+        };
+        $20.if(node_3, ($$render) => {
+          if ($20.get(revealed))
+            $$render(consequent_2);
+          else
+            $$render(alternate, -1);
+        });
+      }
+      $20.reset(button);
+      $20.template_effect(() => {
+        $20.set_attribute(button, "aria-pressed", $20.get(revealed));
+        $20.set_attribute(button, "aria-label", $20.get(revealed) ? `Hide ${label()}` : `Reveal ${label()}`);
+      });
+      $20.delegated("click", button, handleRevealToggle);
+      $20.append($$anchor2, button);
+    };
+    $20.if(node_2, ($$render) => {
+      if (allowReveal())
+        $$render(consequent_3);
+    });
+  }
+  var button_1 = $20.sibling(node_2, 2);
+  var node_4 = $20.child(button_1);
+  {
+    var consequent_4 = ($$anchor2) => {
+      var svg_2 = root_64();
+      $20.append($$anchor2, svg_2);
+    };
+    var alternate_1 = ($$anchor2) => {
+      var svg_3 = root_74();
+      $20.append($$anchor2, svg_3);
+    };
+    $20.if(node_4, ($$render) => {
+      if ($20.get(copied))
+        $$render(consequent_4);
+      else
+        $$render(alternate_1, -1);
+    });
+  }
+  $20.reset(button_1);
+  $20.reset(div_2);
+  $20.reset(div_1);
+  var node_5 = $20.sibling(div_1, 2);
+  {
+    var consequent_5 = ($$anchor2) => {
+      var div_3 = root_83();
+      var node_6 = $20.child(div_3);
+      $20.snippet(node_6, () => $$props.warning);
+      $20.reset(div_3);
+      $20.append($$anchor2, div_3);
+    };
+    $20.if(node_5, ($$render) => {
+      if ($$props.warning)
+        $$render(consequent_5);
+    });
+  }
+  var node_7 = $20.sibling(node_5, 2);
+  _visually_hidden_live_region(node_7, {
+    get message() {
+      return $20.get(copiedAnnouncement);
+    }
+  });
+  $20.reset(div);
+  $20.template_effect(() => {
+    $20.set_attribute(span, "id", fieldId);
+    $20.set_text(text7, label());
+    $20.set_attribute(div_1, "aria-labelledby", fieldId);
+    $20.set_attribute(span_2, "aria-label", $20.get(revealed) ? `${label()}, revealed` : `${label()}, masked`);
+    $20.set_attribute(span_2, "data-cinder-masked", !$20.get(revealed) || undefined);
+    $20.set_text(text_2, $20.get(revealed) ? $$props.value : MASK);
+    $20.set_attribute(button_1, "aria-label", `Copy ${label()}`);
+    $20.set_attribute(button_1, "data-cinder-copied", $20.get(copied) || undefined);
+  });
+  $20.delegated("click", button_1, handleCopy);
+  $20.append($$anchor, div);
+  $20.pop();
+}
+$20.delegate(["click"]);
+
+// src/components/status-dot/status-dot.svelte
+import"svelte/internal/disclose-version";
+import * as $21 from "svelte/internal/client";
+var root_111 = $21.from_html(`<span class="cinder-status-dot__label"> </span>`);
+var root_211 = $21.from_html(`<span class="cinder-sr-only"> </span>`);
+var root15 = $21.from_html(`<span><span class="cinder-status-dot__indicator" aria-hidden="true"></span> <!> <!></span>`);
+function Status_dot($$anchor, $$props) {
+  $21.push($$props, true);
+  const connectionStatusMap = {
+    connected: "online",
+    connecting: "warning",
+    disconnected: "offline",
+    error: "danger"
+  };
+  const connectionLabels = {
+    connected: "Connected",
+    connecting: "Connecting",
+    disconnected: "Disconnected",
+    error: "Error"
+  };
+  let showLabel = $21.prop($$props, "showLabel", 3, true), size = $21.prop($$props, "size", 3, "md"), rest = $21.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "status",
+    "connectionState",
+    "label",
+    "live",
+    "showLabel",
+    "size",
+    "class",
+    "aria-label"
+  ]);
+  const normalizedAriaLabel = $21.derived(() => $$props["aria-label"]?.trim() ? $$props["aria-label"].trim() : undefined);
+  const resolvedStatus = $21.derived(() => $$props.status ?? ($$props.connectionState === undefined ? "neutral" : connectionStatusMap[$$props.connectionState]));
+  const resolvedLive = $21.derived(() => $$props.live ?? $$props.connectionState !== undefined);
+  const normalizedLabel = $21.derived(() => $$props.label?.trim() ? $$props.label.trim() : $$props.connectionState === undefined ? undefined : connectionLabels[$$props.connectionState]);
+  const hasVisibleLabel = $21.derived(() => showLabel() && $21.get(normalizedLabel) !== undefined);
+  const resolvedAriaLabel = $21.derived(() => $21.get(normalizedAriaLabel) ?? $21.get(normalizedLabel) ?? $21.get(resolvedStatus));
+  const visibleLabelIsLiveDuplicate = $21.derived(() => $21.get(resolvedLive) && $21.get(normalizedLabel) !== undefined && $21.get(resolvedAriaLabel) !== $21.get(normalizedLabel));
+  const needsHiddenLiveLabel = $21.derived(() => $21.get(resolvedLive) && (!$21.get(hasVisibleLabel) || $21.get(visibleLabelIsLiveDuplicate)));
+  var span = root15();
+  $21.attribute_effect(span, ($0) => ({
+    ...rest,
+    class: $0,
+    "data-cinder-status": $21.get(resolvedStatus),
+    "data-cinder-state": $$props.connectionState,
+    "data-cinder-size": size(),
+    role: $21.get(resolvedLive) ? "status" : "img",
+    "aria-live": $21.get(resolvedLive) ? "polite" : undefined,
+    "aria-atomic": $21.get(resolvedLive) ? "true" : undefined,
+    "aria-label": $21.get(resolvedLive) ? undefined : $21.get(resolvedAriaLabel)
+  }), [() => classNames("cinder-status-dot", $$props.class)]);
+  var node = $21.sibling($21.child(span), 2);
+  {
+    var consequent = ($$anchor2) => {
+      var span_1 = root_111();
+      var text7 = $21.child(span_1, true);
+      $21.reset(span_1);
+      $21.template_effect(() => {
+        $21.set_attribute(span_1, "aria-hidden", $21.get(visibleLabelIsLiveDuplicate) ? "true" : undefined);
+        $21.set_text(text7, $21.get(normalizedLabel));
+      });
+      $21.append($$anchor2, span_1);
+    };
+    $21.if(node, ($$render) => {
+      if ($21.get(hasVisibleLabel))
+        $$render(consequent);
+    });
+  }
+  var node_1 = $21.sibling(node, 2);
+  {
+    var consequent_1 = ($$anchor2) => {
+      var span_2 = root_211();
+      var text_1 = $21.child(span_2, true);
+      $21.reset(span_2);
+      $21.template_effect(() => $21.set_text(text_1, $21.get(resolvedAriaLabel)));
+      $21.append($$anchor2, span_2);
+    };
+    $21.if(node_1, ($$render) => {
+      if ($21.get(needsHiddenLiveLabel))
+        $$render(consequent_1);
+    });
+  }
+  $21.reset(span);
+  $21.append($$anchor, span);
+  $21.pop();
+}
+
+// src/components/approval-card/approval-card-state.ts
+function resolveEffectiveApprovalState(approvalState, expirationTimestamp, currentTime) {
+  if (approvalState !== "pending" || expirationTimestamp === undefined)
+    return approvalState;
+  return resolveComparisonTime(currentTime) >= expirationTimestamp ? "expired" : approvalState;
+}
+function isApprovalActionable(approvalState, expirationTimestamp, currentTime) {
+  if (approvalState !== "pending")
+    return false;
+  if (expirationTimestamp === undefined)
+    return true;
+  return resolveComparisonTime(currentTime) < expirationTimestamp;
+}
+function resolveComparisonTime(currentTime) {
+  return currentTime ?? Date.now();
+}
+
+// src/components/approval-card/approval-card.svelte
+var root_112 = $22.from_html(`<div class="cinder-approval-card__header"><div class="cinder-approval-card__title-group"><p class="cinder-approval-card__eyebrow"> </p> <h3 class="cinder-approval-card__title"> </h3> <p class="cinder-approval-card__description"> </p></div> <div class="cinder-approval-card__badges" role="group" aria-label="Approval status"><!> <!> <!></div></div>`);
+var root_65 = $22.from_html(`<div class="cinder-approval-card__metadata-item"><dt>Snapshot</dt> <dd> </dd></div>`);
+var root_75 = $22.from_html(`<section class="cinder-approval-card__section" aria-label="Sandbox context"><h4 class="cinder-approval-card__section-title">Sandbox</h4> <dl class="cinder-approval-card__metadata cinder-approval-card__metadata--compact"><div class="cinder-approval-card__metadata-item"><dt>Provider</dt> <dd> </dd></div> <div class="cinder-approval-card__metadata-item"><dt>Name</dt> <dd> </dd></div> <div class="cinder-approval-card__metadata-item"><dt>Working directory</dt> <dd> </dd></div></dl></section>`);
+var root_113 = $22.from_html(`<p class="cinder-approval-card__muted">Review the touched files and arguments before approving this file write.</p>`);
+var root_123 = $22.from_html(`<p class="cinder-approval-card__muted">Review the arguments and metadata before approving this operation.</p>`);
+var root_152 = $22.from_html(`<li> </li>`);
+var root_133 = $22.from_html(`<div class="cinder-approval-card__files"><div class="cinder-approval-card__section-heading"><h5 class="cinder-approval-card__subsection-title">Files touched</h5> <!></div> <ul class="cinder-approval-card__file-list"></ul></div>`);
+var root_172 = $22.from_html(`<p class="cinder-approval-card__muted">No arguments were provided.</p>`);
+var root_183 = $22.from_html(`<section class="cinder-approval-card__section" aria-label="Environment names"><h4 class="cinder-approval-card__section-title">Environment</h4> <div class="cinder-approval-card__environment-list"></div></section>`);
+var root_212 = $22.from_html(`<!> <!> <!> <!> <!>`, 1);
+var root_292 = $22.from_html(`<p class="cinder-approval-card__error" role="alert"> </p>`);
+var root_282 = $22.from_html(`<div class="cinder-approval-card__editor"><label class="cinder-approval-card__editor-label">Edited arguments JSON</label> <p class="cinder-approval-card__muted">Confirming parses this JSON and sends the parsed value to the approval callback.</p> <textarea class="cinder-approval-card__textarea" rows="8" spellcheck="false"></textarea> <!> <div class="cinder-approval-card__editor-actions"><!></div></div>`);
+var root_202 = $22.from_html(`<section class="cinder-approval-card__section cinder-approval-card__actions-section"><!> <!></section>`);
+var root_31 = $22.from_html(`<p class="cinder-approval-card__readonly-summary">No approval actions are available for this request.</p>`);
+var root_55 = $22.from_html(`<div class="cinder-approval-card__body"><dl class="cinder-approval-card__metadata" aria-label="Approval metadata"><div class="cinder-approval-card__metadata-item"><dt>Policy</dt> <dd> </dd></div> <div class="cinder-approval-card__metadata-item"><dt>Idempotency key</dt> <dd> </dd></div> <!></dl> <!> <section class="cinder-approval-card__section" aria-label="Operation details"><div class="cinder-approval-card__section-heading"><h4 class="cinder-approval-card__section-title">Operation</h4> <!></div> <!> <!></section> <section class="cinder-approval-card__section" aria-label="Arguments preview"><!></section> <!> <!></div>`);
+var root16 = $22.from_html(`<section><!></section>`);
+function Approval_card($$anchor, $$props) {
+  const generatedId = $22.props_id();
+  $22.push($$props, true);
+  const ARGUMENTS_PREVIEW_MAX_CHARACTERS = 4096;
+  let env = $22.prop($$props, "env", 19, () => []), editableArgs = $22.prop($$props, "editableArgs", 3, false), rest = $22.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "tool",
+    "sandbox",
+    "operation",
+    "env",
+    "snapshotId",
+    "policyVersion",
+    "idempotencyKey",
+    "expiresAt",
+    "state",
+    "editableArgs",
+    "onapprove",
+    "onapprovewithedits",
+    "ondeny",
+    "onremember",
+    "oncancel",
+    "id",
+    "class"
+  ]);
+  const rootId = $22.derived(() => $$props.id ?? generatedId);
+  const titleId = $22.derived(() => `${$22.get(rootId)}-title`);
+  const descriptionId = $22.derived(() => `${$22.get(rootId)}-description`);
+  const editDescriptionId = $22.derived(() => `${$22.get(rootId)}-edit-description`);
+  const editErrorId = $22.derived(() => `${$22.get(rootId)}-edit-error`);
+  let currentTime = $22.state(undefined);
+  let editingArgumentsSeedKey = $22.state(null);
+  let editedArgumentsDrafts = $22.state($22.proxy({}));
+  let expirationTimer;
+  const expirationTimestamp = $22.derived(() => parseExpirationTimestamp($$props.expiresAt));
+  const effectiveState = $22.derived(() => resolveEffectiveApprovalState($$props.state, $22.get(expirationTimestamp), $22.get(currentTime)));
+  const isActionable = $22.derived(() => isApprovalActionable($$props.state, $22.get(expirationTimestamp), $22.get(currentTime)));
+  const operationKindLabel = $22.derived(() => formatOperationKind($$props.operation.kind));
+  const riskLabel = $22.derived(() => formatRisk($$props.tool.risk));
+  const stateText = $22.derived(() => formatState($22.get(effectiveState)));
+  const stateDescription = $22.derived(() => $22.get(isActionable) ? `${$22.get(operationKindLabel)} approval is waiting for a decision.` : `No approval actions are available because this request is ${$22.get(stateText).toLowerCase()}.`);
+  const expirationText = $22.derived(() => {
+    if ($22.get(effectiveState) === "expired")
+      return "Expired";
+    if ($$props.state !== "pending" || $22.get(expirationTimestamp) === undefined || $22.get(currentTime) === undefined) {
+      return;
+    }
+    return `Expires in ${formatRemainingTime($22.get(expirationTimestamp) - $22.get(currentTime))}`;
+  });
+  const hasArgumentsPreview = $22.derived(() => $$props.operation.argsPreview !== undefined);
+  const editableArgumentsValue = $22.derived(() => normalizeArgumentsPreviewValue($$props.operation.argsPreview));
+  const argumentsPreview = $22.derived(() => prepareArgumentsPreview($22.get(editableArgumentsValue)));
+  const filesTouched = $22.derived(() => $$props.operation.filesTouched ?? []);
+  const filesTouchedLabel = $22.derived(() => `${$22.get(filesTouched).length} file${$22.get(filesTouched).length === 1 ? "" : "s"}`);
+  const environmentNames = $22.derived(() => sanitizeEnvironmentNames(env()));
+  const currentEditedArgumentsText = $22.derived(() => formatEditableArguments($22.get(editableArgumentsValue)));
+  const currentEditedArgumentsSeedKey = $22.derived(() => `${$$props.idempotencyKey}\x00${$22.get(currentEditedArgumentsText)}`);
+  const canEditArguments = $22.derived(() => editableArgs() && $22.get(hasArgumentsPreview));
+  const editingArguments = $22.derived(() => $22.get(canEditArguments) && $22.get(editingArgumentsSeedKey) === $22.get(currentEditedArgumentsSeedKey));
+  const editedArgumentsText = $22.derived(() => $22.get(editedArgumentsDrafts)[$22.get(currentEditedArgumentsSeedKey)] ?? $22.get(currentEditedArgumentsText));
+  const editParseResult = $22.derived(() => parseJsonText($22.get(editedArgumentsText)));
+  const canConfirmEditedApproval = $22.derived(() => $22.get(canEditArguments) && $22.get(editParseResult).ok && typeof $$props.onapprovewithedits === "function");
+  $22.user_effect(() => {
+    clearExpirationTimer();
+    if ($$props.state === "pending" && $22.get(expirationTimestamp) !== undefined) {
+      const updateCurrentTime = () => {
+        const nextCurrentTime = Date.now();
+        $22.set(currentTime, nextCurrentTime, true);
+        if (nextCurrentTime >= $22.get(expirationTimestamp)) {
+          clearExpirationTimer();
+          return;
+        }
+        const nextDelay = Math.min(1000, $22.get(expirationTimestamp) - nextCurrentTime);
+        expirationTimer = setTimeout(updateCurrentTime, nextDelay);
+      };
+      updateCurrentTime();
+    }
+    return clearExpirationTimer;
+  });
+  onDestroy2(clearExpirationTimer);
+  function clearExpirationTimer() {
+    if (expirationTimer !== undefined) {
+      clearTimeout(expirationTimer);
+      expirationTimer = undefined;
+    }
+  }
+  function parseExpirationTimestamp(value) {
+    if (!value)
+      return;
+    const timestamp = Date.parse(value);
+    return Number.isFinite(timestamp) ? timestamp : undefined;
+  }
+  function formatRemainingTime(milliseconds) {
+    const totalSeconds = Math.max(0, Math.ceil(milliseconds / 1000));
+    const hours = Math.floor(totalSeconds / 3600);
+    const minutes = Math.floor(totalSeconds % 3600 / 60);
+    const seconds = totalSeconds % 60;
+    if (hours > 0)
+      return `${hours}h ${minutes}m`;
+    if (minutes > 0)
+      return `${minutes}m ${seconds}s`;
+    return `${seconds}s`;
+  }
+  function formatRisk(risk) {
+    switch (risk) {
+      case "low":
+        return "Low risk";
+      case "medium":
+        return "Medium risk";
+      case "high":
+        return "High risk";
+    }
+  }
+  function riskBadgeVariant(risk) {
+    switch (risk) {
+      case "low":
+        return "success";
+      case "medium":
+        return "warning";
+      case "high":
+        return "danger";
+    }
+  }
+  function formatOperationKind(kind) {
+    switch (kind) {
+      case "command":
+        return "Command";
+      case "file-write":
+        return "File write";
+      case "patch":
+        return "Patch";
+      case "other":
+        return "Operation";
+    }
+  }
+  function formatState(approvalState) {
+    switch (approvalState) {
+      case "pending":
+        return "Pending";
+      case "approved":
+        return "Approved";
+      case "approved_with_edits":
+        return "Approved with edits";
+      case "denied":
+        return "Denied";
+      case "expired":
+        return "Expired";
+      case "cancelled":
+        return "Cancelled";
+    }
+  }
+  function stateDotStatus(approvalState) {
+    switch (approvalState) {
+      case "pending":
+        return "pending";
+      case "approved":
+      case "approved_with_edits":
+        return "success";
+      case "denied":
+        return "danger";
+      case "expired":
+        return "neutral";
+      case "cancelled":
+        return "offline";
+    }
+  }
+  function normalizeArgumentsPreviewValue(value) {
+    if (typeof value !== "string")
+      return value;
+    try {
+      return JSON.parse(value);
+    } catch {
+      return value;
+    }
+  }
+  function prepareArgumentsPreview(value) {
+    try {
+      const serialized = JSON.stringify(value);
+      if (typeof serialized !== "string" || serialized.length <= ARGUMENTS_PREVIEW_MAX_CHARACTERS) {
+        return {
+          value: typeof value === "string" ? serialized : value,
+          truncated: false
+        };
+      }
+      return {
+        value: {
+          notice: "Arguments preview truncated",
+          originalCharacters: serialized.length,
+          displayedCharacters: ARGUMENTS_PREVIEW_MAX_CHARACTERS,
+          excerpt: serialized.slice(0, ARGUMENTS_PREVIEW_MAX_CHARACTERS)
+        },
+        truncated: true
+      };
+    } catch {
+      return { value, truncated: false };
+    }
+  }
+  function formatEditableArguments(value) {
+    try {
+      const serialized = JSON.stringify(value, null, 2);
+      return serialized ?? "null";
+    } catch {
+      return "{}";
+    }
+  }
+  function parseJsonText(text8) {
+    try {
+      return { ok: true, value: JSON.parse(text8) };
+    } catch {
+      return { ok: false, message: "Edited arguments must be valid JSON." };
+    }
+  }
+  function sanitizeEnvironmentName(name) {
+    const [firstPart] = name.split("=");
+    return firstPart?.trim() ?? "";
+  }
+  function sanitizeEnvironmentNames(names) {
+    const seen = [];
+    const sanitizedNames = [];
+    for (const name of names) {
+      const sanitizedName = sanitizeEnvironmentName(name);
+      if (!sanitizedName || seen.includes(sanitizedName))
+        continue;
+      seen.push(sanitizedName);
+      sanitizedNames.push(sanitizedName);
+    }
+    return sanitizedNames;
+  }
+  function currentApprovalIsActionable() {
+    const comparisonTime = $22.get(expirationTimestamp) === undefined ? $22.get(currentTime) : Date.now();
+    const actionable = isApprovalActionable($$props.state, $22.get(expirationTimestamp), comparisonTime);
+    if (!actionable && $$props.state === "pending" && $22.get(expirationTimestamp) !== undefined) {
+      $22.set(currentTime, comparisonTime, true);
+    }
+    return actionable;
+  }
+  function beginEditingArguments() {
+    if (!currentApprovalIsActionable())
+      return;
+    if (!$22.get(canEditArguments))
+      return;
+    if (!($22.get(currentEditedArgumentsSeedKey) in $22.get(editedArgumentsDrafts))) {
+      $22.set(editedArgumentsDrafts, {
+        ...$22.get(editedArgumentsDrafts),
+        [$22.get(currentEditedArgumentsSeedKey)]: $22.get(currentEditedArgumentsText)
+      }, true);
+    }
+    $22.set(editingArgumentsSeedKey, $22.get(currentEditedArgumentsSeedKey), true);
+  }
+  function handleEditedArgumentsInput(event) {
+    $22.set(editedArgumentsDrafts, {
+      ...$22.get(editedArgumentsDrafts),
+      [$22.get(currentEditedArgumentsSeedKey)]: event.currentTarget.value
+    }, true);
+  }
+  function handleApprove() {
+    if (!currentApprovalIsActionable())
+      return;
+    $$props.onapprove?.();
+  }
+  function handleApproveWithEdits() {
+    if (!currentApprovalIsActionable())
+      return;
+    if (!$22.get(canEditArguments))
+      return;
+    if (!$22.get(editParseResult).ok)
+      return;
+    $$props.onapprovewithedits?.($22.get(editParseResult).value);
+  }
+  function handleDeny() {
+    if (!currentApprovalIsActionable())
+      return;
+    $$props.ondeny?.();
+  }
+  function handleRemember() {
+    if (!currentApprovalIsActionable())
+      return;
+    $$props.onremember?.();
+  }
+  function handleCancel() {
+    if (!currentApprovalIsActionable())
+      return;
+    $$props.oncancel?.();
+  }
+  var section = root16();
+  $22.attribute_effect(section, ($0) => ({
+    ...rest,
+    id: $22.get(rootId),
+    class: $0,
+    "aria-labelledby": $22.get(titleId),
+    "aria-describedby": $22.get(descriptionId),
+    "data-cinder-state": $22.get(effectiveState),
+    "data-cinder-risk": $$props.tool.risk
+  }), [() => classNames("cinder-approval-card", $$props.class)]);
+  var node = $22.child(section);
+  {
+    const header = ($$anchor2) => {
+      var div = root_112();
+      var div_1 = $22.child(div);
+      var p = $22.child(div_1);
+      var text_1 = $22.child(p);
+      $22.reset(p);
+      var h3 = $22.sibling(p, 2);
+      var text_2 = $22.child(h3);
+      $22.reset(h3);
+      var p_1 = $22.sibling(h3, 2);
+      var text_3 = $22.child(p_1, true);
+      $22.reset(p_1);
+      $22.reset(div_1);
+      var div_2 = $22.sibling(div_1, 2);
+      var node_1 = $22.child(div_2);
+      {
+        let $0 = $22.derived(() => stateDotStatus($22.get(effectiveState)));
+        Status_dot(node_1, {
+          get status() {
+            return $22.get($0);
+          },
+          get label() {
+            return $22.get(stateText);
+          }
+        });
+      }
+      var node_2 = $22.sibling(node_1, 2);
+      {
+        let $0 = $22.derived(() => riskBadgeVariant($$props.tool.risk));
+        Badge(node_2, {
+          get variant() {
+            return $22.get($0);
+          },
+          size: "sm",
+          children: ($$anchor3, $$slotProps) => {
+            $22.next();
+            var text_4 = $22.text();
+            $22.template_effect(() => $22.set_text(text_4, $22.get(riskLabel)));
+            $22.append($$anchor3, text_4);
+          },
+          $$slots: { default: true }
+        });
+      }
+      var node_3 = $22.sibling(node_2, 2);
+      {
+        var consequent = ($$anchor3) => {
+          {
+            let $0 = $22.derived(() => $22.get(effectiveState) === "expired" ? "neutral" : "warning");
+            Badge($$anchor3, {
+              get variant() {
+                return $22.get($0);
+              },
+              size: "sm",
+              children: ($$anchor4, $$slotProps) => {
+                $22.next();
+                var text_5 = $22.text();
+                $22.template_effect(() => $22.set_text(text_5, $22.get(expirationText)));
+                $22.append($$anchor4, text_5);
+              },
+              $$slots: { default: true }
+            });
+          }
+        };
+        $22.if(node_3, ($$render) => {
+          if ($22.get(expirationText))
+            $$render(consequent);
+        });
+      }
+      $22.reset(div_2);
+      $22.reset(div);
+      $22.template_effect(() => {
+        $22.set_text(text_1, `${$22.get(operationKindLabel) ?? ""} approval`);
+        $22.set_attribute(h3, "id", $22.get(titleId));
+        $22.set_text(text_2, `Approval required for ${$$props.tool.name ?? ""}`);
+        $22.set_attribute(p_1, "id", $22.get(descriptionId));
+        $22.set_text(text_3, $22.get(stateDescription));
+      });
+      $22.append($$anchor2, div);
+    };
+    Card(node, {
+      padding: "none",
+      class: "cinder-approval-card__surface",
+      header,
+      children: ($$anchor2, $$slotProps) => {
+        var div_3 = root_55();
+        var dl = $22.child(div_3);
+        var div_4 = $22.child(dl);
+        var dd = $22.sibling($22.child(div_4), 2);
+        var text_6 = $22.child(dd, true);
+        $22.reset(dd);
+        $22.reset(div_4);
+        var div_5 = $22.sibling(div_4, 2);
+        var dd_1 = $22.sibling($22.child(div_5), 2);
+        var text_7 = $22.child(dd_1, true);
+        $22.reset(dd_1);
+        $22.reset(div_5);
+        var node_4 = $22.sibling(div_5, 2);
+        {
+          var consequent_1 = ($$anchor3) => {
+            var div_6 = root_65();
+            var dd_2 = $22.sibling($22.child(div_6), 2);
+            var text_8 = $22.child(dd_2, true);
+            $22.reset(dd_2);
+            $22.reset(div_6);
+            $22.template_effect(() => $22.set_text(text_8, $$props.snapshotId));
+            $22.append($$anchor3, div_6);
+          };
+          $22.if(node_4, ($$render) => {
+            if ($$props.snapshotId)
+              $$render(consequent_1);
+          });
+        }
+        $22.reset(dl);
+        var node_5 = $22.sibling(dl, 2);
+        {
+          var consequent_2 = ($$anchor3) => {
+            var section_1 = root_75();
+            var dl_1 = $22.sibling($22.child(section_1), 2);
+            var div_7 = $22.child(dl_1);
+            var dd_3 = $22.sibling($22.child(div_7), 2);
+            var text_9 = $22.child(dd_3, true);
+            $22.reset(dd_3);
+            $22.reset(div_7);
+            var div_8 = $22.sibling(div_7, 2);
+            var dd_4 = $22.sibling($22.child(div_8), 2);
+            var text_10 = $22.child(dd_4, true);
+            $22.reset(dd_4);
+            $22.reset(div_8);
+            var div_9 = $22.sibling(div_8, 2);
+            var dd_5 = $22.sibling($22.child(div_9), 2);
+            var text_11 = $22.child(dd_5, true);
+            $22.reset(dd_5);
+            $22.reset(div_9);
+            $22.reset(dl_1);
+            $22.reset(section_1);
+            $22.template_effect(() => {
+              $22.set_text(text_9, $$props.sandbox.provider);
+              $22.set_text(text_10, $$props.sandbox.name);
+              $22.set_text(text_11, $$props.sandbox.workingDir);
+            });
+            $22.append($$anchor3, section_1);
+          };
+          $22.if(node_5, ($$render) => {
+            if ($$props.sandbox)
+              $$render(consequent_2);
+          });
+        }
+        var section_2 = $22.sibling(node_5, 2);
+        var div_10 = $22.child(section_2);
+        var node_6 = $22.sibling($22.child(div_10), 2);
+        Badge(node_6, {
+          size: "sm",
+          mono: true,
+          children: ($$anchor3, $$slotProps2) => {
+            $22.next();
+            var text_12 = $22.text();
+            $22.template_effect(() => $22.set_text(text_12, $$props.operation.kind));
+            $22.append($$anchor3, text_12);
+          },
+          $$slots: { default: true }
+        });
+        $22.reset(div_10);
+        var node_7 = $22.sibling(div_10, 2);
+        {
+          var consequent_3 = ($$anchor3) => {
+            Code_block($$anchor3, {
+              get code() {
+                return $$props.operation.command;
+              },
+              language: "shell",
+              highlight: false
+            });
+          };
+          var consequent_4 = ($$anchor3) => {
+            Code_block($$anchor3, {
+              get code() {
+                return $$props.operation.diff;
+              },
+              language: "diff",
+              highlight: false
+            });
+          };
+          var consequent_5 = ($$anchor3) => {
+            var p_2 = root_113();
+            $22.append($$anchor3, p_2);
+          };
+          var alternate = ($$anchor3) => {
+            var p_3 = root_123();
+            $22.append($$anchor3, p_3);
+          };
+          $22.if(node_7, ($$render) => {
+            if ($$props.operation.kind === "command" && $$props.operation.command)
+              $$render(consequent_3);
+            else if ($$props.operation.kind === "patch" && $$props.operation.diff)
+              $$render(consequent_4, 1);
+            else if ($$props.operation.kind === "file-write")
+              $$render(consequent_5, 2);
+            else
+              $$render(alternate, -1);
+          });
+        }
+        var node_8 = $22.sibling(node_7, 2);
+        {
+          var consequent_6 = ($$anchor3) => {
+            var div_11 = root_133();
+            var div_12 = $22.child(div_11);
+            var node_9 = $22.sibling($22.child(div_12), 2);
+            Badge(node_9, {
+              size: "sm",
+              children: ($$anchor4, $$slotProps2) => {
+                $22.next();
+                var text_13 = $22.text();
+                $22.template_effect(() => $22.set_text(text_13, $22.get(filesTouchedLabel)));
+                $22.append($$anchor4, text_13);
+              },
+              $$slots: { default: true }
+            });
+            $22.reset(div_12);
+            var ul = $22.sibling(div_12, 2);
+            $22.each(ul, 23, () => $22.get(filesTouched), (file, fileIndex) => `${fileIndex}:${file}`, ($$anchor4, file) => {
+              var li = root_152();
+              var text_14 = $22.child(li, true);
+              $22.reset(li);
+              $22.template_effect(() => $22.set_text(text_14, $22.get(file)));
+              $22.append($$anchor4, li);
+            });
+            $22.reset(ul);
+            $22.reset(div_11);
+            $22.append($$anchor3, div_11);
+          };
+          $22.if(node_8, ($$render) => {
+            if ($22.get(filesTouched).length > 0)
+              $$render(consequent_6);
+          });
+        }
+        $22.reset(section_2);
+        var section_3 = $22.sibling(section_2, 2);
+        var node_10 = $22.child(section_3);
+        {
+          var consequent_7 = ($$anchor3) => {
+            Payload_inspector($$anchor3, {
+              get value() {
+                return $22.get(argumentsPreview).value;
+              },
+              get truncated() {
+                return $22.get(argumentsPreview).truncated;
+              },
+              label: "Arguments preview"
+            });
+          };
+          var alternate_1 = ($$anchor3) => {
+            var p_4 = root_172();
+            $22.append($$anchor3, p_4);
+          };
+          $22.if(node_10, ($$render) => {
+            if ($22.get(hasArgumentsPreview))
+              $$render(consequent_7);
+            else
+              $$render(alternate_1, -1);
+          });
+        }
+        $22.reset(section_3);
+        var node_11 = $22.sibling(section_3, 2);
+        {
+          var consequent_8 = ($$anchor3) => {
+            var section_4 = root_183();
+            var div_13 = $22.sibling($22.child(section_4), 2);
+            $22.each(div_13, 23, () => $22.get(environmentNames), (environmentName, environmentIndex) => `${environmentIndex}:${environmentName}`, ($$anchor4, environmentName) => {
+              Secret_value_field($$anchor4, {
+                get value() {
+                  return $22.get(environmentName);
+                },
+                get label() {
+                  return $22.get(environmentName);
+                }
+              });
+            });
+            $22.reset(div_13);
+            $22.reset(section_4);
+            $22.append($$anchor3, section_4);
+          };
+          $22.if(node_11, ($$render) => {
+            if ($22.get(environmentNames).length > 0)
+              $$render(consequent_8);
+          });
+        }
+        var node_12 = $22.sibling(node_11, 2);
+        {
+          var consequent_12 = ($$anchor3) => {
+            var section_5 = root_202();
+            var node_13 = $22.child(section_5);
+            Button_group(node_13, {
+              label: "Approval actions",
+              children: ($$anchor4, $$slotProps2) => {
+                var fragment_9 = root_212();
+                var node_14 = $22.first_child(fragment_9);
+                {
+                  let $0 = $22.derived(() => !$$props.onapprove);
+                  Button(node_14, {
+                    type: "button",
+                    variant: "primary",
+                    onclick: handleApprove,
+                    get disabled() {
+                      return $22.get($0);
+                    },
+                    children: ($$anchor5, $$slotProps3) => {
+                      $22.next();
+                      var text_15 = $22.text("Approve");
+                      $22.append($$anchor5, text_15);
+                    },
+                    $$slots: { default: true }
+                  });
+                }
+                var node_15 = $22.sibling(node_14, 2);
+                {
+                  var consequent_9 = ($$anchor5) => {
+                    {
+                      let $0 = $22.derived(() => !$$props.onapprovewithedits);
+                      Button($$anchor5, {
+                        type: "button",
+                        variant: "secondary",
+                        onclick: beginEditingArguments,
+                        get disabled() {
+                          return $22.get($0);
+                        },
+                        children: ($$anchor6, $$slotProps3) => {
+                          $22.next();
+                          var text_16 = $22.text("Approve with edits");
+                          $22.append($$anchor6, text_16);
+                        },
+                        $$slots: { default: true }
+                      });
+                    }
+                  };
+                  $22.if(node_15, ($$render) => {
+                    if ($22.get(canEditArguments))
+                      $$render(consequent_9);
+                  });
+                }
+                var node_16 = $22.sibling(node_15, 2);
+                {
+                  let $0 = $22.derived(() => !$$props.ondeny);
+                  Button(node_16, {
+                    type: "button",
+                    variant: "soft-danger",
+                    onclick: handleDeny,
+                    get disabled() {
+                      return $22.get($0);
+                    },
+                    children: ($$anchor5, $$slotProps3) => {
+                      $22.next();
+                      var text_17 = $22.text("Deny");
+                      $22.append($$anchor5, text_17);
+                    },
+                    $$slots: { default: true }
+                  });
+                }
+                var node_17 = $22.sibling(node_16, 2);
+                {
+                  let $0 = $22.derived(() => !$$props.onremember);
+                  Button(node_17, {
+                    type: "button",
+                    variant: "soft",
+                    onclick: handleRemember,
+                    get disabled() {
+                      return $22.get($0);
+                    },
+                    children: ($$anchor5, $$slotProps3) => {
+                      $22.next();
+                      var text_18 = $22.text("Remember");
+                      $22.append($$anchor5, text_18);
+                    },
+                    $$slots: { default: true }
+                  });
+                }
+                var node_18 = $22.sibling(node_17, 2);
+                {
+                  let $0 = $22.derived(() => !$$props.oncancel);
+                  Button(node_18, {
+                    type: "button",
+                    variant: "ghost",
+                    onclick: handleCancel,
+                    get disabled() {
+                      return $22.get($0);
+                    },
+                    children: ($$anchor5, $$slotProps3) => {
+                      $22.next();
+                      var text_19 = $22.text("Cancel");
+                      $22.append($$anchor5, text_19);
+                    },
+                    $$slots: { default: true }
+                  });
+                }
+                $22.append($$anchor4, fragment_9);
+              },
+              $$slots: { default: true }
+            });
+            var node_19 = $22.sibling(node_13, 2);
+            {
+              var consequent_11 = ($$anchor4) => {
+                var div_14 = root_282();
+                var label = $22.child(div_14);
+                var p_5 = $22.sibling(label, 2);
+                var textarea = $22.sibling(p_5, 2);
+                $22.remove_textarea_child(textarea);
+                var node_20 = $22.sibling(textarea, 2);
+                {
+                  var consequent_10 = ($$anchor5) => {
+                    var p_6 = root_292();
+                    var text_20 = $22.child(p_6, true);
+                    $22.reset(p_6);
+                    $22.template_effect(() => {
+                      $22.set_attribute(p_6, "id", $22.get(editErrorId));
+                      $22.set_text(text_20, $22.get(editParseResult).message);
+                    });
+                    $22.append($$anchor5, p_6);
+                  };
+                  $22.if(node_20, ($$render) => {
+                    if (!$22.get(editParseResult).ok)
+                      $$render(consequent_10);
+                  });
+                }
+                var div_15 = $22.sibling(node_20, 2);
+                var node_21 = $22.child(div_15);
+                {
+                  let $0 = $22.derived(() => !$22.get(canConfirmEditedApproval));
+                  Button(node_21, {
+                    type: "button",
+                    variant: "primary",
+                    onclick: handleApproveWithEdits,
+                    get disabled() {
+                      return $22.get($0);
+                    },
+                    children: ($$anchor5, $$slotProps2) => {
+                      $22.next();
+                      var text_21 = $22.text("Confirm edited approval");
+                      $22.append($$anchor5, text_21);
+                    },
+                    $$slots: { default: true }
+                  });
+                }
+                $22.reset(div_15);
+                $22.reset(div_14);
+                $22.template_effect(() => {
+                  $22.set_attribute(label, "for", `${$22.get(rootId)}-edited-arguments`);
+                  $22.set_attribute(p_5, "id", $22.get(editDescriptionId));
+                  $22.set_attribute(textarea, "id", `${$22.get(rootId)}-edited-arguments`);
+                  $22.set_value(textarea, $22.get(editedArgumentsText));
+                  $22.set_attribute(textarea, "aria-describedby", $22.get(editParseResult).ok ? $22.get(editDescriptionId) : `${$22.get(editDescriptionId)} ${$22.get(editErrorId)}`);
+                  $22.set_attribute(textarea, "aria-invalid", $22.get(editParseResult).ok ? undefined : "true");
+                });
+                $22.delegated("input", textarea, handleEditedArgumentsInput);
+                $22.append($$anchor4, div_14);
+              };
+              $22.if(node_19, ($$render) => {
+                if ($22.get(editingArguments))
+                  $$render(consequent_11);
+              });
+            }
+            $22.reset(section_5);
+            $22.append($$anchor3, section_5);
+          };
+          var alternate_2 = ($$anchor3) => {
+            var p_7 = root_31();
+            $22.append($$anchor3, p_7);
+          };
+          $22.if(node_12, ($$render) => {
+            if ($22.get(isActionable))
+              $$render(consequent_12);
+            else
+              $$render(alternate_2, -1);
+          });
+        }
+        $22.reset(div_3);
+        $22.template_effect(() => {
+          $22.set_text(text_6, $$props.policyVersion);
+          $22.set_text(text_7, $$props.idempotencyKey);
+        });
+        $22.append($$anchor2, div_3);
+      },
+      $$slots: { header: true, default: true }
+    });
+  }
+  $22.reset(section);
+  $22.append($$anchor, section);
+  $22.pop();
+}
+$22.delegate(["input"]);
+
+// src/components/approval-card/index.ts
+var approval_card_default = Approval_card;
+export {
+  approval_card_default as default,
+  Approval_card as ApprovalCard
+};
+
+//# debugId=E5B580618418CC6864756E2164756E21