@lostgradient/cinder 0.4.1 → 0.6.0

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

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -38,6 +68,14 @@ function createRetryingLoaderCache(loader) {
   };
 }
 
+// src/highlighters/shiki/strip-root-pre-tab-index.ts
+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);
+}
+
 // src/highlighters/shiki/index.ts
 var exports_shiki = {};
 __export(exports_shiki, {
@@ -51,16 +89,10 @@ function escapeHtml(value) {
 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 = {}) {
+function shikiHighlighter(options = {}, moduleLoader) {
   const { theme = DEFAULT_THEME, langs } = options;
   const warnedLanguages = new Set;
-  const loadShiki = createRetryingLoaderCache(async () => {
+  const loadShiki = createRetryingLoaderCache(moduleLoader ?? (async () => {
     const module_ = await import("shiki");
     if (langs !== undefined) {
       for (const lang of langs) {
@@ -73,7 +105,7 @@ function shikiHighlighter(options = {}) {
       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 === "") {
@@ -126,7 +158,7 @@ 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 * as $23 from "svelte/internal/client";
 import { onDestroy as onDestroy2 } from "svelte";
 
 // src/utilities/class-names.ts
@@ -138,7 +170,7 @@ function classNames(...parts) {
 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_2 = $.from_svg(`<svg class="cinder-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) {
@@ -641,15 +673,160 @@ function Button_group($$anchor, $$props) {
 
 // src/components/card/card.svelte
 import"svelte/internal/disclose-version";
+import * as $7 from "svelte/internal/client";
+
+// ../../node_modules/lucide-svelte/dist/icons/circle-alert.svelte
+import"svelte/internal/disclose-version";
+import"svelte/internal/flags/legacy";
+import * as $6 from "svelte/internal/client";
+
+// ../../node_modules/lucide-svelte/dist/Icon.svelte
+import"svelte/internal/disclose-version";
+import"svelte/internal/flags/legacy";
 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>`);
+
+// ../../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 root3 = $5.from_svg(`<svg><!><!></svg>`);
+function Icon($$anchor, $$props) {
+  const $$sanitized_props = $5.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const $$restProps = $5.legacy_rest_props($$sanitized_props, [
+    "name",
+    "color",
+    "size",
+    "strokeWidth",
+    "absoluteStrokeWidth",
+    "iconNode"
+  ]);
+  $5.push($$props, false);
+  let name = $5.prop($$props, "name", 8, undefined);
+  let color = $5.prop($$props, "color", 8, "currentColor");
+  let size = $5.prop($$props, "size", 8, 24);
+  let strokeWidth = $5.prop($$props, "strokeWidth", 8, 2);
+  let absoluteStrokeWidth = $5.prop($$props, "absoluteStrokeWidth", 8, false);
+  let iconNode = $5.prop($$props, "iconNode", 24, () => []);
+  const mergeClasses = (...classes) => classes.filter((className, index2, array) => {
+    return Boolean(className) && array.indexOf(className) === index2;
+  }).join(" ");
+  $5.init();
+  var svg = root3();
+  $5.attribute_effect(svg, ($0, $1) => ({
+    ...defaultAttributes_default,
+    ...$$restProps,
+    width: size(),
+    height: size(),
+    stroke: color(),
+    "stroke-width": $0,
+    class: $1
+  }), [
+    () => ($5.deep_read_state(absoluteStrokeWidth()), $5.deep_read_state(strokeWidth()), $5.deep_read_state(size()), $5.untrack(() => absoluteStrokeWidth() ? Number(strokeWidth()) * 24 / Number(size()) : strokeWidth())),
+    () => ($5.deep_read_state(name()), $5.deep_read_state($$sanitized_props), $5.untrack(() => mergeClasses("lucide-icon", "lucide", name() ? `lucide-${name()}` : "", $$sanitized_props.class)))
+  ]);
+  var node = $5.child(svg);
+  $5.each(node, 1, iconNode, $5.index, ($$anchor2, $$item) => {
+    var $$array = $5.derived(() => $5.to_array($5.get($$item), 2));
+    let tag = () => $5.get($$array)[0];
+    let attrs = () => $5.get($$array)[1];
+    var fragment = $5.comment();
+    var node_1 = $5.first_child(fragment);
+    $5.element(node_1, tag, true, ($$element, $$anchor3) => {
+      $5.attribute_effect($$element, () => ({ ...attrs() }));
+    });
+    $5.append($$anchor2, fragment);
+  });
+  var node_2 = $5.sibling(node);
+  $5.slot(node_2, $$props, "default", {}, null);
+  $5.reset(svg);
+  $5.append($$anchor, svg);
+  $5.pop();
+}
+
+// ../../node_modules/lucide-svelte/dist/icons/circle-alert.svelte
+function Circle_alert($$anchor, $$props) {
+  const $$sanitized_props = $6.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const iconNode = [
+    ["circle", { cx: "12", cy: "12", r: "10" }],
+    ["line", { x1: "12", x2: "12", y1: "8", y2: "12" }],
+    [
+      "line",
+      { x1: "12", x2: "12.01", y1: "16", y2: "16" }
+    ]
+  ];
+  Icon($$anchor, $6.spread_props({ name: "circle-alert" }, () => $$sanitized_props, {
+    get iconNode() {
+      return iconNode;
+    },
+    children: ($$anchor2, $$slotProps) => {
+      var fragment_1 = $6.comment();
+      var node = $6.first_child(fragment_1);
+      $6.slot(node, $$props, "default", {}, null);
+      $6.append($$anchor2, fragment_1);
+    },
+    $$slots: { default: true }
+  }));
+}
+// src/_internal/field-control.ts
+function describeId(fieldId, hasDescription) {
+  return hasDescription ? `${fieldId}-description` : undefined;
+}
+function errorId(fieldId, hasError) {
+  return hasError ? `${fieldId}-error` : undefined;
+}
+function composeDescribedBy(...ids) {
+  const filtered = ids.flatMap((id) => typeof id === "string" ? id.trim().split(/\s+/).filter(Boolean) : []);
+  const unique = Array.from(new Set(filtered));
+  return unique.length > 0 ? unique.join(" ") : undefined;
+}
+function ariaInvalid(hasError) {
+  return hasError ? "true" : undefined;
+}
+function resolveFieldControl(input) {
+  const resolvedId = input.id ?? input.context?.controlId ?? input.generatedId;
+  const defaultDescriptionId = describeId(resolvedId, input.hasDescription ?? false);
+  const defaultErrorId = errorId(resolvedId, input.hasError ?? false);
+  const ownDescriptionId = defaultDescriptionId && defaultDescriptionId === input.context?.descriptionId && input.localIdNamespace ? `${resolvedId}-${input.localIdNamespace}-description` : defaultDescriptionId;
+  const ownErrorId = defaultErrorId && defaultErrorId === input.context?.errorId && input.localIdNamespace ? `${resolvedId}-${input.localIdNamespace}-error` : defaultErrorId;
+  const descriptionId = ownDescriptionId ?? input.context?.descriptionId;
+  const resolvedErrorId = ownErrorId ?? input.context?.errorId;
+  const explicitInvalid = ariaInvalid(input.hasError ?? false);
+  const consumerInvalid = input.consumerInvalid === true ? "true" : input.consumerInvalid === false ? undefined : input.consumerInvalid ?? undefined;
+  return {
+    id: resolvedId,
+    ownDescriptionId,
+    ownErrorId,
+    descriptionId,
+    errorId: resolvedErrorId,
+    describedBy: composeDescribedBy(descriptionId, ...input.additionalDescribedBy ?? [], resolvedErrorId, input.context?.describedBy, input.consumerDescribedBy),
+    ariaInvalid: explicitInvalid ?? input.context?.invalid ?? consumerInvalid,
+    required: input.required ?? input.context?.required ?? false,
+    disabled: input.disabled ?? input.context?.disabled ?? false
+  };
+}
+
+// src/components/card/card.svelte
+var root_13 = $7.from_html(`<div class="cinder-card__header"><!></div>`);
+var root_33 = $7.from_html(`<span class="cinder-card__risk-icon" aria-hidden="true"><!></span>`);
+var root_52 = $7.from_html(`<p class="cinder-card__description"> </p>`);
+var root_23 = $7.from_html(`<div class="cinder-card__header"><div class="cinder-card__title-row"><!> <!></div> <!></div>`);
+var root_6 = $7.from_html(`<div class="cinder-card__footer"><!></div>`);
+var root4 = $7.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, [
+  const generatedId = $7.props_id();
+  $7.push($$props, true);
+  let headingLevel = $7.prop($$props, "headingLevel", 3, 3), variant = $7.prop($$props, "variant", 3, "card"), tone = $7.prop($$props, "tone", 3, "default"), bodyTone = $7.prop($$props, "bodyTone", 3, "default"), footerTone = $7.prop($$props, "footerTone", 3, "default"), edgeToEdgeOnMobile = $7.prop($$props, "edgeToEdgeOnMobile", 3, false), padding = $7.prop($$props, "padding", 3, "default"), rest = $7.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -661,93 +838,126 @@ function Card($$anchor, $$props) {
     "description",
     "footer",
     "variant",
+    "tone",
     "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) => ({
+  const resolvedHeadingLevel = $7.derived(() => Number.isFinite(Math.trunc(Number(headingLevel()))) ? Math.min(6, Math.max(1, Math.trunc(Number(headingLevel())))) : 3);
+  const titleTag = $7.derived(() => `h${$7.get(resolvedHeadingLevel)}`);
+  const hasGeneratedHeader = $7.derived(() => Boolean($$props.title && !$$props.header));
+  const titleId = $7.derived(() => $7.get(hasGeneratedHeader) ? `${generatedId}-title` : undefined);
+  const descriptionId = $7.derived(() => $7.get(hasGeneratedHeader) && $$props.description ? `${generatedId}-description` : undefined);
+  const hasExternalRole = $7.derived(() => typeof $$props.role === "string" && $$props.role.trim().length > 0);
+  const hasExternalLabel = $7.derived(() => typeof rest["aria-labelledby"] === "string" && rest["aria-labelledby"].trim().length > 0 || typeof rest["aria-label"] === "string" && rest["aria-label"].trim().length > 0);
+  const describedBy = $7.derived(() => composeDescribedBy($7.get(descriptionId), rest["aria-describedby"]));
+  const labelAttributes = $7.derived(() => $7.get(hasGeneratedHeader) ? {
+    ...!$7.get(hasExternalRole) ? { role: "group" } : {},
+    ...!$7.get(hasExternalLabel) ? { "aria-labelledby": $7.get(titleId) } : {},
+    ...$7.get(describedBy) ? { "aria-describedby": $7.get(describedBy) } : {}
+  } : {});
+  var div = root4();
+  $7.attribute_effect(div, ($0) => ({
+    ...rest,
     class: $0,
     "data-cinder-variant": variant(),
+    "data-cinder-tone": tone(),
     "data-cinder-edge-to-edge-mobile": edgeToEdgeOnMobile() ? "" : undefined,
-    ...rest
+    ...$7.get(labelAttributes)
   }), [() => classNames("cinder-card", $$props.class)]);
-  var node = $5.child(div);
+  var node = $7.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 node_1 = $7.child(div_1);
+      $7.snippet(node_1, () => $$props.header);
+      $7.reset(div_1);
+      $7.append($$anchor2, div_1);
     };
-    var consequent_2 = ($$anchor2) => {
+    var consequent_3 = ($$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 div_3 = $7.child(div_2);
+      var node_2 = $7.child(div_3);
       {
         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);
+          var span = root_33();
+          var node_3 = $7.child(span);
+          Circle_alert(node_3, { size: 18, strokeWidth: 2.25 });
+          $7.reset(span);
+          $7.append($$anchor3, span);
         };
-        $5.if(node_3, ($$render) => {
-          if ($$props.description)
+        $7.if(node_2, ($$render) => {
+          if (tone() === "danger")
             $$render(consequent_1);
         });
       }
-      $5.reset(div_2);
-      $5.append($$anchor2, div_2);
+      var node_4 = $7.sibling(node_2, 2);
+      $7.element(node_4, () => $7.get(titleTag), false, ($$element, $$anchor3) => {
+        $7.attribute_effect($$element, () => ({ id: $7.get(titleId), class: "cinder-card__title" }));
+        var text4 = $7.text();
+        $7.template_effect(() => $7.set_text(text4, $$props.title));
+        $7.append($$anchor3, text4);
+      });
+      $7.reset(div_3);
+      var node_5 = $7.sibling(div_3, 2);
+      {
+        var consequent_2 = ($$anchor3) => {
+          var p = root_52();
+          var text_1 = $7.child(p, true);
+          $7.reset(p);
+          $7.template_effect(() => {
+            $7.set_attribute(p, "id", $7.get(descriptionId));
+            $7.set_text(text_1, $$props.description);
+          });
+          $7.append($$anchor3, p);
+        };
+        $7.if(node_5, ($$render) => {
+          if ($$props.description)
+            $$render(consequent_2);
+        });
+      }
+      $7.reset(div_2);
+      $7.append($$anchor2, div_2);
     };
-    $5.if(node, ($$render) => {
+    $7.if(node, ($$render) => {
       if ($$props.header)
         $$render(consequent);
       else if ($$props.title)
-        $$render(consequent_2, 1);
+        $$render(consequent_3, 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 div_4 = $7.sibling(node, 2);
+  var node_6 = $7.child(div_4);
+  $7.snippet(node_6, () => $$props.children);
+  $7.reset(div_4);
+  var node_7 = $7.sibling(div_4, 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);
+    var consequent_4 = ($$anchor2) => {
+      var div_5 = root_6();
+      var node_8 = $7.child(div_5);
+      $7.snippet(node_8, () => $$props.footer);
+      $7.reset(div_5);
+      $7.template_effect(() => $7.set_attribute(div_5, "data-cinder-tone", footerTone()));
+      $7.append($$anchor2, div_5);
     };
-    $5.if(node_5, ($$render) => {
+    $7.if(node_7, ($$render) => {
       if ($$props.footer)
-        $$render(consequent_3);
+        $$render(consequent_4);
     });
   }
-  $5.reset(div);
-  $5.template_effect(() => {
-    $5.set_attribute(div_3, "data-cinder-tone", bodyTone());
-    $5.set_attribute(div_3, "data-cinder-padding", padding());
+  $7.reset(div);
+  $7.template_effect(() => {
+    $7.set_attribute(div_4, "data-cinder-tone", bodyTone());
+    $7.set_attribute(div_4, "data-cinder-padding", padding());
   });
-  $5.append($$anchor, div);
-  $5.pop();
+  $7.append($$anchor, div);
+  $7.pop();
 }
 
 // src/components/code-block/code-block.svelte
 import"svelte/internal/disclose-version";
-import * as $11 from "svelte/internal/client";
+import * as $12 from "svelte/internal/client";
 
 // src/components/code-block/code-block-default-highlighter.ts
 var loadShikiAdapterModule = createRetryingLoaderCache(() => Promise.resolve().then(() => (init_shiki(), exports_shiki)));
@@ -762,100 +972,24 @@ async function loadDefaultHighlighter() {
 
 // src/components/copy-button/copy-button.svelte
 import"svelte/internal/disclose-version";
-import * as $10 from "svelte/internal/client";
+import * as $11 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
+import * as $8 from "svelte/internal/client";
 function Check($$anchor, $$props) {
-  const $$sanitized_props = $7.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const $$sanitized_props = $8.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, {
+  Icon($$anchor, $8.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);
+      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 }
   }));
@@ -863,9 +997,9 @@ function Check($$anchor, $$props) {
 // ../../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";
+import * as $9 from "svelte/internal/client";
 function Copy($$anchor, $$props) {
-  const $$sanitized_props = $8.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
+  const $$sanitized_props = $9.legacy_rest_props($$props, ["children", "$$slots", "$$events", "$$legacy"]);
   const iconNode = [
     [
       "rect",
@@ -885,15 +1019,15 @@ function Copy($$anchor, $$props) {
       }
     ]
   ];
-  Icon($$anchor, $8.spread_props({ name: "copy" }, () => $$sanitized_props, {
+  Icon($$anchor, $9.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);
+      var fragment_1 = $9.comment();
+      var node = $9.first_child(fragment_1);
+      $9.slot(node, $$props, "default", {}, null);
+      $9.append($$anchor2, fragment_1);
     },
     $$slots: { default: true }
   }));
@@ -932,16 +1066,16 @@ function legacyCopy(text4) {
 
 // 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>`);
+import * as $10 from "svelte/internal/client";
+var root5 = $10.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("");
+  $10.push($$props, true);
+  let message = $10.prop($$props, "message", 3, ""), announcementSequence = $10.prop($$props, "announcementSequence", 3, 0), priority = $10.prop($$props, "priority", 3, "polite");
+  let rendered = $10.state("");
   let setTimeoutId = null;
   let version = 0;
   let isDestroyed = false;
-  $9.user_effect(() => {
+  $10.user_effect(() => {
     return () => {
       isDestroyed = true;
       if (setTimeoutId) {
@@ -950,7 +1084,7 @@ function _visually_hidden_live_region($$anchor, $$props) {
       }
     };
   });
-  $9.user_effect(() => {
+  $10.user_effect(() => {
     const next = message();
     announcementSequence();
     const current = ++version;
@@ -958,34 +1092,34 @@ function _visually_hidden_live_region($$anchor, $$props) {
       clearTimeout(setTimeoutId);
       setTimeoutId = null;
     }
-    $9.set(rendered, "");
+    $10.set(rendered, "");
     if (next === "")
       return;
     setTimeoutId = setTimeout(() => {
       if (isDestroyed || version !== current)
         return;
-      $9.set(rendered, next, true);
+      $10.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();
+  var text4 = $10.child(div, true);
+  $10.reset(div);
+  $10.template_effect(($0) => {
+    $10.set_attribute(div, "role", priority() === "assertive" ? "alert" : "status");
+    $10.set_attribute(div, "aria-live", priority() === "assertive" ? "assertive" : "polite");
+    $10.set_class(div, 1, $0);
+    $10.set_text(text4, $10.get(rendered));
+  }, [() => $10.clsx(classNames("cinder-sr-only", $$props.class))]);
+  $10.append($$anchor, div);
+  $10.pop();
 }
 
 // src/components/copy-button/copy-button.svelte
-var root6 = $10.from_html(`<button><!></button> <!>`, 1);
+var root6 = $11.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, [
+  $11.push($$props, true);
+  let confirmDuration = $11.prop($$props, "confirmDuration", 3, 1500), iconOnly = $11.prop($$props, "iconOnly", 3, false), rest = $11.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -998,70 +1132,70 @@ function Copy_button($$anchor, $$props) {
     "children",
     "confirmation"
   ]);
-  let copied = $10.state(false);
+  let copied = $11.state(false);
   let resetTimer;
-  const copiedAnnouncement = $10.derived(() => $10.get(copied) ? $$props.copiedLabel ?? "Copied" : "");
+  const copiedAnnouncement = $11.derived(() => $11.get(copied) ? $$props.copiedLabel ?? "Copied" : "");
   async function handleClick() {
     const ok = await copyToClipboard($$props.value);
     if (!ok)
       return;
-    $10.set(copied, true);
+    $11.set(copied, true);
     if (resetTimer)
       clearTimeout(resetTimer);
     resetTimer = setTimeout(() => {
-      $10.set(copied, false);
+      $11.set(copied, false);
     }, confirmDuration());
   }
-  $10.user_effect(() => {
+  $11.user_effect(() => {
     return () => {
       if (resetTimer)
         clearTimeout(resetTimer);
     };
   });
   var fragment = root6();
-  var button = $10.first_child(fragment);
-  $10.attribute_effect(button, ($0) => ({
+  var button = $11.first_child(fragment);
+  $11.attribute_effect(button, ($0) => ({
     ...rest,
     type: "button",
-    "data-cinder-copied": $10.get(copied) || undefined,
+    "data-cinder-copied": $11.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 node = $11.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 fragment_1 = $11.comment();
+      var node_1 = $11.first_child(fragment_1);
+      $11.snippet(node_1, () => $$props.confirmation);
+      $11.append($$anchor2, fragment_1);
     };
     var consequent_1 = ($$anchor2) => {
-      Check($$anchor2, { class: "icon-sm", "aria-hidden": "true" });
+      Check($$anchor2, { class: "cinder-icon-sm", "aria-hidden": "true" });
     };
     var consequent_2 = ($$anchor2) => {
-      var text5 = $10.text("Copied");
-      $10.append($$anchor2, text5);
+      var text5 = $11.text("Copied");
+      $11.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 fragment_3 = $11.comment();
+      var node_2 = $11.first_child(fragment_3);
+      $11.snippet(node_2, () => $$props.children);
+      $11.append($$anchor2, fragment_3);
     };
     var consequent_4 = ($$anchor2) => {
-      Copy($$anchor2, { class: "icon-sm", "aria-hidden": "true" });
+      Copy($$anchor2, { class: "cinder-icon-sm", "aria-hidden": "true" });
     };
     var alternate = ($$anchor2) => {
-      var text_1 = $10.text("Copy");
-      $10.append($$anchor2, text_1);
+      var text_1 = $11.text("Copy");
+      $11.append($$anchor2, text_1);
     };
-    $10.if(node, ($$render) => {
-      if ($10.get(copied) && $$props.confirmation)
+    $11.if(node, ($$render) => {
+      if ($11.get(copied) && $$props.confirmation)
         $$render(consequent);
-      else if ($10.get(copied) && iconOnly())
+      else if ($11.get(copied) && iconOnly())
         $$render(consequent_1, 1);
-      else if ($10.get(copied))
+      else if ($11.get(copied))
         $$render(consequent_2, 2);
       else if ($$props.children)
         $$render(consequent_3, 3);
@@ -1071,37 +1205,37 @@ function Copy_button($$anchor, $$props) {
         $$render(alternate, -1);
     });
   }
-  $10.reset(button);
-  var node_3 = $10.sibling(button, 2);
+  $11.reset(button);
+  var node_3 = $11.sibling(button, 2);
   _visually_hidden_live_region(node_3, {
     get message() {
-      return $10.get(copiedAnnouncement);
+      return $11.get(copiedAnnouncement);
     }
   });
-  $10.append($$anchor, fragment);
-  $10.pop();
+  $11.append($$anchor, fragment);
+  $11.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>`);
+var root_24 = $12.from_html(`<span class="cinder-code-block__language"> </span>`);
+var root_14 = $12.from_html(`<header class="cinder-code-block__header"><!> <!></header>`);
+var root_42 = $12.from_html(`<pre class="cinder-code-block__pre"><code class="cinder-code-block__code"> </code></pre>`);
+var root_62 = $12.from_html(`<div class="cinder-code-block__highlighted"></div>`);
+var root_7 = $12.from_html(`<pre class="cinder-code-block__pre"><code class="cinder-code-block__code"> </code></pre>`);
+var root7 = $12.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(() => {
+  $12.push($$props, true);
+  let copyable = $12.prop($$props, "copyable", 3, false);
+  let highlighted = $12.state(null);
+  $12.user_effect(() => {
     if ($$props.highlight === false || !$$props.language) {
-      $11.set(highlighted, null);
+      $12.set(highlighted, null);
       return;
     }
     const pendingCode = $$props.code;
     const pendingLanguage = $$props.language;
     const explicitHighlighter = $$props.highlighter;
-    $11.set(highlighted, null);
+    $12.set(highlighted, null);
     let cancelled = false;
     (async () => {
       try {
@@ -1110,10 +1244,10 @@ function Code_block($$anchor, $$props) {
           return;
         const html2 = await resolvedHighlighter(pendingCode, pendingLanguage);
         if (!cancelled)
-          $11.set(highlighted, html2 === "" ? null : html2, true);
+          $12.set(highlighted, html2 === "" ? null : html2, true);
       } catch (error) {
         if (!cancelled)
-          $11.set(highlighted, null);
+          $12.set(highlighted, null);
         const detail = error instanceof Error ? `${error.name}: ${error.message}` : String(error);
         devWarn(`[cinder/CodeBlock] highlight failed for language "${pendingLanguage}":`, detail);
       }
@@ -1123,25 +1257,25 @@ function Code_block($$anchor, $$props) {
     };
   });
   var div = root7();
-  var node = $11.child(div);
+  var node = $12.child(div);
   {
     var consequent_2 = ($$anchor2) => {
       var header = root_14();
-      var node_1 = $11.child(header);
+      var node_1 = $12.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);
+          var text5 = $12.child(span, true);
+          $12.reset(span);
+          $12.template_effect(() => $12.set_text(text5, $$props.language));
+          $12.append($$anchor3, span);
         };
-        $11.if(node_1, ($$render) => {
+        $12.if(node_1, ($$render) => {
           if ($$props.language)
             $$render(consequent);
         });
       }
-      var node_2 = $11.sibling(node_1, 2);
+      var node_2 = $12.sibling(node_1, 2);
       {
         var consequent_1 = ($$anchor3) => {
           Copy_button($$anchor3, {
@@ -1154,80 +1288,80 @@ function Code_block($$anchor, $$props) {
             iconOnly: true
           });
         };
-        $11.if(node_2, ($$render) => {
+        $12.if(node_2, ($$render) => {
           if (copyable())
             $$render(consequent_1);
         });
       }
-      $11.reset(header);
-      $11.append($$anchor2, header);
+      $12.reset(header);
+      $12.append($$anchor2, header);
     };
-    $11.if(node, ($$render) => {
+    $12.if(node, ($$render) => {
       if ($$props.language || copyable())
         $$render(consequent_2);
     });
   }
-  var div_1 = $11.sibling(node, 2);
-  var node_3 = $11.child(div_1);
+  var div_1 = $12.sibling(node, 2);
+  var node_3 = $12.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);
+      var pre = root_42();
+      var code_1 = $12.child(pre);
+      var text_1 = $12.child(code_1, true);
+      $12.reset(code_1);
+      $12.reset(pre);
+      $12.template_effect(() => $12.set_text(text_1, $$props.code));
+      $12.append($$anchor2, pre);
     };
-    $11.boundary(node_3, { failed }, ($$anchor2) => {
-      var fragment_1 = $11.comment();
-      var node_4 = $11.first_child(fragment_1);
+    $12.boundary(node_3, { failed }, ($$anchor2) => {
+      var fragment_1 = $12.comment();
+      var node_4 = $12.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 div_2 = root_62();
+          $12.html(div_2, () => $12.get(highlighted), true);
+          $12.reset(div_2);
+          $12.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);
+          var code_2 = $12.child(pre_1);
+          var text_2 = $12.child(code_2, true);
+          $12.reset(code_2);
+          $12.reset(pre_1);
+          $12.template_effect(() => $12.set_text(text_2, $$props.code));
+          $12.append($$anchor3, pre_1);
         };
-        $11.if(node_4, ($$render) => {
-          if ($11.get(highlighted) !== null)
+        $12.if(node_4, ($$render) => {
+          if ($12.get(highlighted) !== null)
             $$render(consequent_3);
           else
             $$render(alternate, -1);
         });
       }
-      $11.append($$anchor2, fragment_1);
+      $12.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();
+  $12.reset(div_1);
+  $12.reset(div);
+  $12.template_effect(($0) => $12.set_class(div, 1, $0), [() => $12.clsx(classNames("cinder-code-block", $$props.class))]);
+  $12.append($$anchor, div);
+  $12.pop();
 }
 
 // src/components/payload-inspector/payload-inspector.svelte
 import"svelte/internal/disclose-version";
-import * as $19 from "svelte/internal/client";
+import * as $20 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>`);
+import * as $13 from "svelte/internal/client";
+var root_43 = $13.from_html(`<div class="cinder-description-list__actions"><!></div>`);
+var root_15 = $13.from_html(`<div class="cinder-description-list__row"><dt> </dt> <dd><div class="cinder-description-list__definition"><!></div> <!></dd></div>`);
+var root8 = $13.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, [
+  $13.push($$props, true);
+  let variant = $13.prop($$props, "variant", 3, "default"), rest = $13.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -1236,7 +1370,7 @@ function Description_list($$anchor, $$props) {
     "class",
     "actions"
   ]);
-  const duplicateKey = $12.derived(() => {
+  const duplicateKey = $13.derived(() => {
     const seen = new Set;
     for (const item of $$props.items) {
       const key = item.id ?? item.term;
@@ -1247,90 +1381,108 @@ function Description_list($$anchor, $$props) {
     return;
   });
   let lastWarnedDuplicateKey;
-  $12.user_effect(() => {
-    if ($12.get(duplicateKey) === undefined) {
+  $13.user_effect(() => {
+    if ($13.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.`);
+    if ($13.get(duplicateKey) !== lastWarnedDuplicateKey) {
+      lastWarnedDuplicateKey = $13.get(duplicateKey);
+      devWarn(`[cinder/DescriptionList] Duplicate key "${$13.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) => {
+  $13.attribute_effect(dl, ($0) => ({ ...rest, class: $0, "data-cinder-variant": variant() }), [() => classNames("cinder-description-list", $$props.class)]);
+  $13.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 dt = $13.child(div);
+    var text6 = $13.child(dt, true);
+    $13.reset(dt);
+    var dd = $13.sibling(dt, 2);
+    var div_1 = $13.child(dd);
+    var node = $13.child(div_1);
     {
       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);
+        var text_1 = $13.text();
+        $13.template_effect(() => $13.set_text(text_1, $13.get(item).definition));
+        $13.append($$anchor3, text_1);
       };
-      $12.if(node, ($$render) => {
-        if ($$props.actions)
+      var alternate = ($$anchor3) => {
+        var fragment_1 = $13.comment();
+        var node_1 = $13.first_child(fragment_1);
+        $13.snippet(node_1, () => $13.get(item).definition);
+        $13.append($$anchor3, fragment_1);
+      };
+      $13.if(node, ($$render) => {
+        if (typeof $13.get(item).definition === "string")
           $$render(consequent);
+        else
+          $$render(alternate, -1);
       });
     }
-    $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);
+    $13.reset(div_1);
+    var node_2 = $13.sibling(div_1, 2);
+    {
+      var consequent_1 = ($$anchor3) => {
+        var div_2 = root_43();
+        var node_3 = $13.child(div_2);
+        $13.snippet(node_3, () => $$props.actions, () => $13.get(item));
+        $13.reset(div_2);
+        $13.append($$anchor3, div_2);
+      };
+      $13.if(node_2, ($$render) => {
+        if ($$props.actions)
+          $$render(consequent_1);
+      });
+    }
+    $13.reset(dd);
+    $13.reset(div);
+    $13.template_effect(() => {
+      $13.set_class(dt, 1, $13.clsx(variant() === "narrow" ? "cinder-sr-only" : undefined));
+      $13.set_text(text6, $13.get(item).term);
     });
-    $12.append($$anchor2, div);
+    $13.append($$anchor2, div);
   });
-  $12.reset(dl);
-  $12.append($$anchor, dl);
-  $12.pop();
+  $13.reset(dl);
+  $13.append($$anchor, dl);
+  $13.pop();
 }
 
 // src/components/json-viewer/json-viewer.svelte
 import"svelte/internal/disclose-version";
-import * as $14 from "svelte/internal/client";
+import * as $15 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 * as $14 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>`);
+var root_34 = $14.from_html(`<span class="cinder-json-viewer__key"> </span>`);
+var root_44 = $14.from_html(`<span class="cinder-json-viewer__summary"> </span> <span class="cinder-json-viewer__brace"> </span>`, 1);
+var root_63 = $14.from_html(`<li role="none"><!></li>`);
+var root_53 = $14.from_html(`<ul class="cinder-json-viewer__children" role="group"></ul> <span class="cinder-json-viewer__brace"> </span>`, 1);
+var root_25 = $14.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 = $14.from_html(`<span class="cinder-json-viewer__key"> </span>`);
+var root_72 = $14.from_html(`<span class="cinder-json-viewer__node" role="treeitem"><!> <span class="cinder-json-viewer__too-deep">…</span></span>`);
+var root_102 = $14.from_html(`<span class="cinder-json-viewer__key"> </span>`);
+var root_92 = $14.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))
+  $14.push($$props, true);
+  let root9 = $14.prop($$props, "root", 3, false);
+  const isObject = $14.derived(() => $$props.value !== null && typeof $$props.value === "object");
+  const isArray = $14.derived(() => Array.isArray($$props.value));
+  const tooDeep = $14.derived(() => $$props.depth >= $$props.maxDepth);
+  let collapsed = $14.state($14.proxy(untrack2(() => $$props.depth >= $$props.initialDepth)));
+  const entries = $14.derived(() => {
+    if (!$14.get(isObject) || $14.get(tooDeep))
       return [];
-    if ($13.get(isArray)) {
+    if ($14.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)}`);
+  const itemCount = $14.derived(() => $14.get(entries).length);
+  const collectionLabel = $14.derived(() => `${$14.get(isArray) ? "array" : "object"}, ${$14.get(itemCount)} ${$14.get(itemCount) === 1 ? "item" : "items"}`);
+  const toggleLabel = $14.derived(() => $$props.keyName === undefined ? $14.get(collectionLabel) : `${$$props.keyName}: ${$14.get(collectionLabel)}`);
   function valueClass(v) {
     if (v === null)
       return "null";
@@ -1342,66 +1494,66 @@ function _json_viewer_node($$anchor, $$props) {
       return "boolean";
     return "unknown";
   }
-  var fragment = $13.comment();
-  var node = $13.first_child(fragment);
+  var fragment = $14.comment();
+  var node = $14.first_child(fragment);
   {
     var consequent_3 = ($$anchor2) => {
-      var span = root_26();
-      var button = $13.child(span);
-      var node_1 = $13.child(button);
+      var span = root_25();
+      var button = $14.child(span);
+      var node_1 = $14.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);
+          var span_1 = root_34();
+          var text7 = $14.child(span_1);
+          $14.reset(span_1);
+          $14.template_effect(() => $14.set_text(text7, `${$$props.keyName ?? ""}:`));
+          $14.append($$anchor3, span_1);
         };
-        $13.if(node_1, ($$render) => {
+        $14.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 span_2 = $14.sibling(node_1, 2);
+      var span_3 = $14.sibling(span_2, 2);
+      var text_1 = $14.child(span_3, true);
+      $14.reset(span_3);
+      var node_2 = $14.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) ? "]" : "}");
+          var span_4 = $14.first_child(fragment_1);
+          var text_2 = $14.child(span_4);
+          $14.reset(span_4);
+          var span_5 = $14.sibling(span_4, 2);
+          var text_3 = $14.child(span_5, true);
+          $14.reset(span_5);
+          $14.template_effect(() => {
+            $14.set_text(text_2, `${$14.get(itemCount) ?? ""} ${$14.get(itemCount) === 1 ? "item" : "items"}`);
+            $14.set_text(text_3, $14.get(isArray) ? "]" : "}");
           });
-          $13.append($$anchor3, fragment_1);
+          $14.append($$anchor3, fragment_1);
         };
-        $13.if(node_2, ($$render) => {
-          if ($13.get(collapsed))
+        $14.if(node_2, ($$render) => {
+          if ($14.get(collapsed))
             $$render(consequent_1);
         });
       }
-      $13.reset(button);
-      var node_3 = $13.sibling(button, 2);
+      $14.reset(button);
+      var node_3 = $14.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);
+          var ul = $14.first_child(fragment_2);
+          $14.each(ul, 23, () => $14.get(entries), ([k, v]) => k, ($$anchor4, $$item, index2) => {
+            var $$array = $14.derived(() => $14.to_array($14.get($$item), 2));
+            let k = () => $14.get($$array)[0];
+            let v = () => $14.get($$array)[1];
+            var li = root_63();
+            var node_4 = $14.child(li);
             {
-              let $0 = $13.derived(() => $$props.depth + 1);
-              let $1 = $13.derived(() => $13.get(index2) + 1);
+              let $0 = $14.derived(() => $$props.depth + 1);
+              let $1 = $14.derived(() => $14.get(index2) + 1);
               _json_viewer_node(node_4, {
                 get value() {
                   return v();
@@ -1410,7 +1562,7 @@ function _json_viewer_node($$anchor, $$props) {
                   return k();
                 },
                 get depth() {
-                  return $13.get($0);
+                  return $14.get($0);
                 },
                 get initialDepth() {
                   return $$props.initialDepth;
@@ -1419,140 +1571,140 @@ function _json_viewer_node($$anchor, $$props) {
                   return $$props.maxDepth;
                 },
                 get position() {
-                  return $13.get($1);
+                  return $14.get($1);
                 },
                 get setSize() {
-                  return $13.get(entries).length;
+                  return $14.get(entries).length;
                 }
               });
             }
-            $13.reset(li);
-            $13.append($$anchor4, li);
+            $14.reset(li);
+            $14.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);
+          $14.reset(ul);
+          var span_6 = $14.sibling(ul, 2);
+          var text_4 = $14.child(span_6, true);
+          $14.reset(span_6);
+          $14.template_effect(() => $14.set_text(text_4, $14.get(isArray) ? "]" : "}"));
+          $14.append($$anchor3, fragment_2);
         };
-        $13.if(node_3, ($$render) => {
-          if (!$13.get(collapsed))
+        $14.if(node_3, ($$render) => {
+          if (!$14.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);
+      $14.reset(span);
+      $14.template_effect(($0) => {
+        $14.set_class(span, 1, $0);
+        $14.set_attribute(span, "aria-expanded", !$14.get(collapsed));
+        $14.set_attribute(span, "aria-label", $14.get(toggleLabel));
+        $14.set_attribute(span, "aria-level", $$props.depth + 1);
+        $14.set_attribute(span, "aria-posinset", $$props.position);
+        $14.set_attribute(span, "aria-setsize", $$props.setSize);
+        $14.set_attribute(span, "tabindex", root9() ? 0 : -1);
+        $14.set_attribute(button, "aria-label", $14.get(toggleLabel));
+        $14.set_attribute(span_2, "data-cinder-collapsed", $14.get(collapsed) || undefined);
+        $14.set_text(text_1, $14.get(isArray) ? "[" : "{");
+      }, [() => $14.clsx(classNames("cinder-json-viewer__node"))]);
+      $14.delegated("click", button, () => $14.set(collapsed, !$14.get(collapsed)));
+      $14.append($$anchor2, span);
     };
     var consequent_5 = ($$anchor2) => {
       var span_7 = root_72();
-      var node_5 = $13.child(span_7);
+      var node_5 = $14.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);
+          var text_5 = $14.child(span_8);
+          $14.reset(span_8);
+          $14.template_effect(() => $14.set_text(text_5, `${$$props.keyName ?? ""}:`));
+          $14.append($$anchor3, span_8);
         };
-        $13.if(node_5, ($$render) => {
+        $14.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);
+      $14.next(2);
+      $14.reset(span_7);
+      $14.template_effect(() => {
+        $14.set_attribute(span_7, "tabindex", root9() ? 0 : -1);
+        $14.set_attribute(span_7, "aria-level", $$props.depth + 1);
+        $14.set_attribute(span_7, "aria-posinset", $$props.position);
+        $14.set_attribute(span_7, "aria-setsize", $$props.setSize);
       });
-      $13.append($$anchor2, span_7);
+      $14.append($$anchor2, span_7);
     };
     var alternate_1 = ($$anchor2) => {
       var span_9 = root_92();
-      var node_6 = $13.child(span_9);
+      var node_6 = $14.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);
+          var text_6 = $14.child(span_10);
+          $14.reset(span_10);
+          $14.template_effect(() => $14.set_text(text_6, `${$$props.keyName ?? ""}:`));
+          $14.append($$anchor3, span_10);
         };
-        $13.if(node_6, ($$render) => {
+        $14.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 span_11 = $14.sibling(node_6, 2);
+      var node_7 = $14.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 text_7 = $14.text();
+          $14.template_effect(() => $14.set_text(text_7, `"${$$props.value ?? ""}"`));
+          $14.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);
+          var text_8 = $14.text();
+          $14.template_effect(($0) => $14.set_text(text_8, $0), [() => String($$props.value)]);
+          $14.append($$anchor3, text_8);
         };
-        $13.if(node_7, ($$render) => {
+        $14.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);
+      $14.reset(span_11);
+      $14.reset(span_9);
+      $14.template_effect(($0) => {
+        $14.set_attribute(span_9, "tabindex", root9() ? 0 : -1);
+        $14.set_attribute(span_9, "aria-level", $$props.depth + 1);
+        $14.set_attribute(span_9, "aria-posinset", $$props.position);
+        $14.set_attribute(span_9, "aria-setsize", $$props.setSize);
+        $14.set_attribute(span_11, "data-cinder-type", $0);
       }, [() => valueClass($$props.value)]);
-      $13.append($$anchor2, span_9);
+      $14.append($$anchor2, span_9);
     };
-    $13.if(node, ($$render) => {
-      if ($13.get(isObject) && !$13.get(tooDeep))
+    $14.if(node, ($$render) => {
+      if ($14.get(isObject) && !$14.get(tooDeep))
         $$render(consequent_3);
-      else if ($13.get(isObject) && $13.get(tooDeep))
+      else if ($14.get(isObject) && $14.get(tooDeep))
         $$render(consequent_5, 1);
       else
         $$render(alternate_1, -1);
     });
   }
-  $13.append($$anchor, fragment);
-  $13.pop();
+  $14.append($$anchor, fragment);
+  $14.pop();
 }
-$13.delegate(["click"]);
+$14.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>`);
+var root_16 = $15.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_26 = $15.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_35 = $15.from_html(`<div role="tree" aria-label="JSON tree" tabindex="-1"><!></div>`);
+var root9 = $15.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(() => {
+  $15.push($$props, true);
+  let initialDepth = $15.prop($$props, "initialDepth", 3, 1), maxDepth = $15.prop($$props, "maxDepth", 3, 50), maxBytes = $15.prop($$props, "maxBytes", 3, 1048576);
+  const serialized = $15.derived(() => {
     try {
       const json = JSON.stringify($$props.value);
       if (typeof json !== "string")
@@ -1562,8 +1714,8 @@ function Json_viewer($$anchor, $$props) {
       return { ok: false };
     }
   });
-  const unserializable = $14.derived(() => !$14.get(serialized).ok);
-  const tooLarge = $14.derived(() => $14.get(serialized).ok && $14.get(serialized).size > maxBytes());
+  const unserializable = $15.derived(() => !$15.get(serialized).ok);
+  const tooLarge = $15.derived(() => $15.get(serialized).ok && $15.get(serialized).size > maxBytes());
   function handleTreeKeydown(event) {
     const tree = event.currentTarget;
     const items = Array.from(tree.querySelectorAll('[role="treeitem"]'));
@@ -1616,29 +1768,29 @@ function Json_viewer($$anchor, $$props) {
     }
   }
   var div = root9();
-  var node = $14.child(div);
+  var node = $15.child(div);
   {
     var consequent = ($$anchor2) => {
       var div_1 = root_16();
-      $14.append($$anchor2, div_1);
+      $15.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
+      var div_2 = root_26();
+      var p = $15.child(div_2);
+      var text7 = $15.child(p);
+      $15.reset(p);
+      $15.next(2);
+      $15.reset(div_2);
+      $15.template_effect(($0, $1) => $15.set_text(text7, `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(($15.get(serialized).ok ? $15.get(serialized).size : 0) / 1024),
         () => Math.round(maxBytes() / 1024)
       ]);
-      $14.append($$anchor2, div_2);
+      $15.append($$anchor2, div_2);
     };
     var alternate = ($$anchor2) => {
-      var div_3 = root_34();
-      var node_1 = $14.child(div_3);
+      var div_3 = root_35();
+      var node_1 = $15.child(div_3);
       _json_viewer_node(node_1, {
         get value() {
           return $$props.value;
@@ -1654,31 +1806,31 @@ function Json_viewer($$anchor, $$props) {
         setSize: 1,
         root: true
       });
-      $14.reset(div_3);
-      $14.delegated("keydown", div_3, handleTreeKeydown);
-      $14.append($$anchor2, div_3);
+      $15.reset(div_3);
+      $15.delegated("keydown", div_3, handleTreeKeydown);
+      $15.append($$anchor2, div_3);
     };
-    $14.if(node, ($$render) => {
-      if ($14.get(unserializable))
+    $15.if(node, ($$render) => {
+      if ($15.get(unserializable))
         $$render(consequent);
-      else if ($14.get(tooLarge))
+      else if ($15.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))
+  $15.reset(div);
+  $15.template_effect(($0) => $15.set_class(div, 1, $0), [
+    () => $15.clsx(classNames("cinder-json-viewer", $$props.class))
   ]);
-  $14.append($$anchor, div);
-  $14.pop();
+  $15.append($$anchor, div);
+  $15.pop();
 }
-$14.delegate(["keydown"]);
+$15.delegate(["keydown"]);
 
 // src/components/tabs/tabs.svelte
 import"svelte/internal/disclose-version";
-import * as $15 from "svelte/internal/client";
+import * as $16 from "svelte/internal/client";
 
 // src/components/tabs/tabs-context.ts
 import { createContext } from "svelte";
@@ -1763,16 +1915,16 @@ function commitValue(proposed, onValueChange, setValue) {
 }
 
 // src/components/tabs/tabs.svelte
-var root10 = $15.from_html(`<div><!></div>`);
+var root10 = $16.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 baseId = $16.props_id();
+  $16.push($$props, true);
+  let value = $16.prop($$props, "value", 15, ""), orientation = $16.prop($$props, "orientation", 3, "horizontal"), fill = $16.prop($$props, "fill", 3, false);
+  const effectiveActivateOnFocus = $16.derived(() => $$props.activateOnFocus ?? orientation() === "horizontal");
   const buttons = new Map;
-  let version = $15.state(0);
-  const focusableValue = $15.derived(() => {
-    $15.get(version);
+  let version = $16.state(0);
+  const focusableValue = $16.derived(() => {
+    $16.get(version);
     for (const [registeredValue, entry] of buttons) {
       if (!entry.disabled)
         return registeredValue;
@@ -1863,7 +2015,7 @@ function Tabs($$anchor, $$props) {
     if (nextValue === undefined)
       return;
     focusValue(nextValue);
-    if ($15.get(effectiveActivateOnFocus)) {
+    if ($16.get(effectiveActivateOnFocus)) {
       commitValue(nextValue, $$props.onValueChange, (next3) => {
         value(next3);
       });
@@ -1877,7 +2029,7 @@ function Tabs($$anchor, $$props) {
       return orientation();
     },
     get activateOnFocus() {
-      return $15.get(effectiveActivateOnFocus);
+      return $16.get(effectiveActivateOnFocus);
     },
     get baseId() {
       return baseId;
@@ -1898,11 +2050,11 @@ function Tabs($$anchor, $$props) {
       } else {
         buttons.set(target, { button, disabled });
       }
-      $15.set(version, $15.get(version) + 1);
+      $16.set(version, $16.get(version) + 1);
     },
     unregister(target) {
       if (buttons.delete(target)) {
-        $15.set(version, $15.get(version) + 1);
+        $16.set(version, $16.get(version) + 1);
       }
     },
     setDisabled(target, disabled) {
@@ -1912,11 +2064,11 @@ function Tabs($$anchor, $$props) {
       if (existing.disabled === disabled)
         return;
       existing.disabled = disabled;
-      $15.set(version, $15.get(version) + 1);
+      $16.set(version, $16.get(version) + 1);
     },
     isFocusable(candidate) {
       value();
-      $15.get(version);
+      $16.get(version);
       const selectedEntry = buttons.get(value());
       const selectedIsEnabled = selectedEntry !== undefined && !selectedEntry.disabled;
       const entry = buttons.get(candidate);
@@ -1924,47 +2076,48 @@ function Tabs($$anchor, $$props) {
         return false;
       if (selectedIsEnabled)
         return value() === candidate;
-      return $15.get(focusableValue) === candidate;
+      return $16.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.set_attribute(div, "data-cinder-orientation", orientation());
+    $16.set_attribute(div, "data-cinder-fill", fill() ? "" : undefined);
+  }, [() => $16.clsx(classNames("cinder-tabs", $$props.class))]);
   $16.append($$anchor, div);
   $16.pop();
 }
 
-// src/components/tab/tab.svelte
+// src/components/tab-list/tab-list.svelte
 import"svelte/internal/disclose-version";
 import * as $17 from "svelte/internal/client";
+var root11 = $17.from_html(`<div role="tablist"><!></div>`);
+function Tab_list($$anchor, $$props) {
+  $17.push($$props, true);
+  const tabs = getTabsContext();
+  var div = root11();
+  var node = $17.child(div);
+  $17.snippet(node, () => $$props.children);
+  $17.reset(div);
+  $17.template_effect(($0) => {
+    $17.set_class(div, 1, $0);
+    $17.set_attribute(div, "data-cinder-orientation", tabs.orientation);
+    $17.set_attribute(div, "aria-label", $$props.label);
+    $17.set_attribute(div, "aria-labelledby", $$props.labelledBy);
+    $17.set_attribute(div, "aria-orientation", tabs.orientation);
+  }, [() => $17.clsx(classNames("cinder-tab-list", $$props.class))]);
+  $17.append($$anchor, div);
+  $17.pop();
+}
+
+// src/components/tab/tab.svelte
+import"svelte/internal/disclose-version";
+import * as $18 from "svelte/internal/client";
 import { untrack as untrack3 } from "svelte";
 
 // src/_internal/collection.ts
@@ -2005,22 +2158,22 @@ function rovingTabIndex(isActive) {
 }
 
 // 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>`);
+var root_17 = $18.from_html(`<span class="cinder-tab__trailing" aria-hidden="true"><!></span>`);
+var root12 = $18.from_html(`<button type="button" role="tab"><!> <!></button>`);
 function Tab($$anchor, $$props) {
-  $17.push($$props, true);
-  let disabled = $17.prop($$props, "disabled", 3, false);
+  $18.push($$props, true);
+  let disabled = $18.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 tabId = $18.derived(() => $$props.id ?? `${tabs.baseId}-tab-${$$props.value}`);
+  const panelId = $18.derived(() => `${tabs.baseId}-panel-${$$props.value}`);
+  const isActive = $18.derived(() => tabs.isActive($$props.value));
+  const isFocusable = $18.derived(() => tabs.isFocusable($$props.value));
+  let buttonElement = $18.state(undefined);
   const registeredValue = untrack3(() => $$props.value);
-  $17.user_effect(() => {
-    if (!$17.get(buttonElement))
+  $18.user_effect(() => {
+    if (!$18.get(buttonElement))
       return;
-    const button = $17.get(buttonElement);
+    const button = $18.get(buttonElement);
     const initialDisabled = untrack3(() => disabled());
     untrack3(() => {
       tabs.register(registeredValue, button, initialDisabled);
@@ -2031,7 +2184,7 @@ function Tab($$anchor, $$props) {
       });
     };
   });
-  $17.user_effect(() => {
+  $18.user_effect(() => {
     const next3 = disabled();
     untrack3(() => {
       tabs.setDisabled(registeredValue, next3);
@@ -2043,107 +2196,107 @@ function Tab($$anchor, $$props) {
     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 node = $18.child(button_1);
+  $18.snippet(node, () => $$props.children);
+  var node_1 = $18.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);
+      var node_2 = $18.child(span);
+      $18.snippet(node_2, () => $$props.trailing);
+      $18.reset(span);
+      $18.append($$anchor2, span);
     };
-    $17.if(node_1, ($$render) => {
+    $18.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);
+  $18.reset(button_1);
+  $18.bind_this(button_1, ($$value) => $18.set(buttonElement, $$value), () => $18.get(buttonElement));
+  $18.template_effect(($0, $1) => {
+    $18.set_attribute(button_1, "id", $18.get(tabId));
+    $18.set_class(button_1, 1, $0);
+    $18.set_attribute(button_1, "data-cinder-value", $$props.value);
+    $18.set_attribute(button_1, "data-cinder-active", $18.get(isActive) ? "" : undefined);
+    $18.set_attribute(button_1, "data-cinder-disabled", disabled() || undefined);
+    $18.set_attribute(button_1, "data-variant", tabs.orientation);
+    $18.set_attribute(button_1, "aria-selected", $18.get(isActive));
+    $18.set_attribute(button_1, "aria-controls", $18.get(panelId));
+    $18.set_attribute(button_1, "tabindex", $1);
     button_1.disabled = disabled();
   }, [
-    () => $17.clsx(classNames("cinder-tab", $$props.class)),
-    () => rovingTabIndex($17.get(isFocusable))
+    () => $18.clsx(classNames("cinder-tab", $$props.class)),
+    () => rovingTabIndex($18.get(isFocusable))
   ]);
-  $17.delegated("click", button_1, handleClick);
-  $17.delegated("keydown", button_1, function(...$$args) {
+  $18.delegated("click", button_1, handleClick);
+  $18.delegated("keydown", button_1, function(...$$args) {
     tabs.handleKeydown?.apply(this, $$args);
   });
-  $17.append($$anchor, button_1);
-  $17.pop();
+  $18.append($$anchor, button_1);
+  $18.pop();
 }
-$17.delegate(["click", "keydown"]);
+$18.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>`);
+import * as $19 from "svelte/internal/client";
+var root_18 = $19.from_html(`<div role="tabpanel" tabindex="0"><!></div>`);
 function Tab_panel($$anchor, $$props) {
-  $18.push($$props, true);
+  $19.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);
+  const isActive = $19.derived(() => tabs.isActive($$props.value));
+  const panelId = $19.derived(() => `${tabs.baseId}-panel-${$$props.value}`);
+  const labelledBy = $19.derived(() => $$props.ariaLabelledby ?? `${tabs.baseId}-tab-${$$props.value}`);
+  var fragment = $19.comment();
+  var node = $19.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);
+      var node_1 = $19.child(div);
+      $19.snippet(node_1, () => $$props.children);
+      $19.reset(div);
+      $19.template_effect(($0) => {
+        $19.set_attribute(div, "id", $19.get(panelId));
+        $19.set_class(div, 1, $0);
+        $19.set_attribute(div, "data-cinder-value", $$props.value);
+        $19.set_attribute(div, "aria-labelledby", $19.get(labelledBy));
+      }, [() => $19.clsx(classNames("cinder-tab-panel", $$props.class))]);
+      $19.append($$anchor2, div);
     };
-    $18.if(node, ($$render) => {
-      if ($18.get(isActive))
+    $19.if(node, ($$render) => {
+      if ($19.get(isActive))
         $$render(consequent);
     });
   }
-  $18.append($$anchor, fragment);
-  $18.pop();
+  $19.append($$anchor, fragment);
+  $19.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
+var root_19 = $20.from_html(`<span class="cinder-payload-inspector__size"> </span>`);
+var root_73 = $20.from_html(`<!> <!> <!>`, 1);
+var root_122 = $20.from_html(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+var root_182 = $20.from_html(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning" role="alert"> </div>`);
+var root_192 = $20.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 = $20.from_html(`<div class="cinder-payload-inspector__summary"><div class="cinder-payload-inspector__summary-badges"><!> <!></div> <!> <!> <!></div>`);
+var root_11 = $20.from_html(`<div class="cinder-payload-inspector__panel"><!> <!></div>`);
+var root_21 = $20.from_html(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+var root_222 = $20.from_html(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning" role="alert"> </div>`);
+var root_232 = $20.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
+var root_20 = $20.from_html(`<div class="cinder-payload-inspector__panel"><!> <!> <!> <!></div>`);
+var root_262 = $20.from_html(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+var root_27 = $20.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
+var root_28 = $20.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>`);
+var root_252 = $20.from_html(`<div class="cinder-payload-inspector__panel cinder-payload-inspector__panel--code"><!> <!> <!> <!></div>`);
+var root_64 = $20.from_html(`<!> <!> <!> <!>`, 1);
+var root13 = $20.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, [
+  $20.push($$props, true);
+  let truncated = $20.prop($$props, "truncated", 3, false), maxBytes = $20.prop($$props, "maxBytes", 3, 1048576), activeView = $20.prop($$props, "activeView", 15, "summary"), label = $20.prop($$props, "label", 3, "Payload inspector"), rest = $20.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -2163,7 +2316,7 @@ function Payload_inspector($$anchor, $$props) {
       return true;
     return /^(?:true|false|null|-?(?:0|[1-9]\d*)(?:\.\d+)?(?:[eE][+-]?\d+)?)$/.test(trimmed);
   }
-  const parseResult = $19.derived(() => {
+  const parseResult = $20.derived(() => {
     if (typeof $$props.value !== "string") {
       return { ok: true, parsed: $$props.value };
     }
@@ -2183,12 +2336,12 @@ function Payload_inspector($$anchor, $$props) {
       };
     }
   });
-  const parsedValue = $19.derived(() => $19.get(parseResult).ok ? $19.get(parseResult).parsed : undefined);
-  const sizeResult = $19.derived(() => {
-    if (!$19.get(parseResult).ok)
+  const parsedValue = $20.derived(() => $20.get(parseResult).ok ? $20.get(parseResult).parsed : undefined);
+  const sizeResult = $20.derived(() => {
+    if (!$20.get(parseResult).ok)
       return { ok: false };
     try {
-      const json = JSON.stringify($19.get(parsedValue));
+      const json = JSON.stringify($20.get(parsedValue));
       if (typeof json !== "string")
         return { ok: false };
       return { ok: true, bytes: new Blob([json]).size };
@@ -2196,40 +2349,40 @@ function Payload_inspector($$anchor, $$props) {
       return { ok: false };
     }
   });
-  const byteLabel = $19.derived(() => {
-    if (!$19.get(sizeResult).ok)
+  const byteLabel = $20.derived(() => {
+    if (!$20.get(sizeResult).ok)
       return "Unknown size";
-    const bytes = $19.get(sizeResult).bytes;
+    const bytes = $20.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) {
+  const rawText = $20.derived(() => {
+    if (!$20.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)) ?? "";
+      return formatter($20.get(parsedValue)) ?? "";
     } catch {
       return typeof $$props.value === "string" ? $$props.value : "";
     }
   });
-  const unserializable = $19.derived(() => {
-    if (typeof $$props.value === "string" || !$19.get(parseResult).ok)
+  const unserializable = $20.derived(() => {
+    if (typeof $$props.value === "string" || !$20.get(parseResult).ok)
       return false;
     try {
-      JSON.stringify($19.get(parsedValue));
+      JSON.stringify($20.get(parsedValue));
       return false;
     } catch {
       return true;
     }
   });
-  const summaryItems = $19.derived(() => {
+  const summaryItems = $20.derived(() => {
     const items = [];
-    items.push({ term: "Size", definition: $19.get(byteLabel) });
+    items.push({ term: "Size", definition: $20.get(byteLabel) });
     if ($$props.meta?.contentType) {
       items.push({ term: "Content type", definition: $$props.meta.contentType });
     }
@@ -2245,10 +2398,10 @@ function Payload_inspector($$anchor, $$props) {
     }
     return items;
   });
-  const valueKind = $19.derived(() => {
-    if (!$19.get(parseResult).ok)
+  const valueKind = $20.derived(() => {
+    if (!$20.get(parseResult).ok)
       return "invalid";
-    const v = $19.get(parsedValue);
+    const v = $20.get(parsedValue);
     if (v === null)
       return "null";
     if (v === undefined)
@@ -2263,30 +2416,30 @@ function Payload_inspector($$anchor, $$props) {
       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(() => {
+  const isPrimitive = $20.derived(() => $20.get(valueKind) === "null" || $20.get(valueKind) === "undefined" || $20.get(valueKind) === "boolean" || $20.get(valueKind) === "number" || $20.get(valueKind) === "string");
+  const isEmpty = $20.derived(() => $20.get(parsedValue) === undefined && $$props.value === undefined);
+  const copyRawText = $20.derived(() => {
     if (typeof $$props.value === "string")
       return $$props.value;
-    if (!$19.get(parseResult).ok)
+    if (!$20.get(parseResult).ok)
       return "";
     try {
-      return JSON.stringify($19.get(parsedValue)) ?? "";
+      return JSON.stringify($20.get(parsedValue)) ?? "";
     } catch {
       return "";
     }
   });
-  const copyFormattedText = $19.derived(() => {
-    if (!$19.get(parseResult).ok)
-      return $19.get(rawText);
+  const copyFormattedText = $20.derived(() => {
+    if (!$20.get(parseResult).ok)
+      return $20.get(rawText);
     try {
-      return JSON.stringify($19.get(parsedValue), null, 2) ?? "";
+      return JSON.stringify($20.get(parsedValue), null, 2) ?? "";
     } catch {
-      return $19.get(rawText);
+      return $20.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)));
+  const canCopyFormatted = $20.derived(() => !$20.get(isEmpty) && $20.get(parseResult).ok && !$20.get(unserializable));
+  const canCopyRaw = $20.derived(() => !$20.get(isEmpty) && (typeof $$props.value === "string" || $20.get(canCopyFormatted)));
   function kindVariant(kind) {
     if (kind === "invalid")
       return "danger";
@@ -2297,54 +2450,54 @@ function Payload_inspector($$anchor, $$props) {
     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);
+  $20.attribute_effect(section, ($0) => ({ ...rest, class: $0, "aria-label": label() }), [() => classNames("cinder-payload-inspector", $$props.class)]);
+  var div = $20.child(section);
+  var span = $20.child(div);
+  var text8 = $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_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));
+      var text_1 = $20.child(span_1, true);
+      $20.reset(span_1);
+      $20.template_effect(() => {
+        $20.set_attribute(span_1, "aria-label", `${$20.get(byteLabel)} payload size`);
+        $20.set_text(text_1, $20.get(byteLabel));
       });
-      $19.append($$anchor2, span_1);
+      $20.append($$anchor2, span_1);
     };
-    $19.if(node, ($$render) => {
-      if ($19.get(sizeResult).ok)
+    $20.if(node, ($$render) => {
+      if ($20.get(sizeResult).ok)
         $$render(consequent);
     });
   }
-  var node_1 = $19.sibling(node, 2);
+  var node_1 = $20.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);
+          $20.next();
+          var text_2 = $20.text("Truncated");
+          $20.append($$anchor3, text_2);
         },
         $$slots: { default: true }
       });
     };
-    $19.if(node_1, ($$render) => {
+    $20.if(node_1, ($$render) => {
       if (truncated())
         $$render(consequent_1);
     });
   }
-  var node_2 = $19.sibling(node_1, 2);
+  var node_2 = $20.sibling(node_1, 2);
   {
     var consequent_2 = ($$anchor2) => {
       Copy_button($$anchor2, {
         get value() {
-          return $19.get(copyFormattedText);
+          return $20.get(copyFormattedText);
         },
         label: "Copy formatted",
         copiedLabel: "Formatted copied",
@@ -2352,17 +2505,17 @@ function Payload_inspector($$anchor, $$props) {
         iconOnly: true
       });
     };
-    $19.if(node_2, ($$render) => {
-      if ($19.get(canCopyFormatted))
+    $20.if(node_2, ($$render) => {
+      if ($20.get(canCopyFormatted))
         $$render(consequent_2);
     });
   }
-  var node_3 = $19.sibling(node_2, 2);
+  var node_3 = $20.sibling(node_2, 2);
   {
     var consequent_3 = ($$anchor2) => {
       Copy_button($$anchor2, {
         get value() {
-          return $19.get(copyRawText);
+          return $20.get(copyRawText);
         },
         label: "Copy raw",
         copiedLabel: "Raw copied",
@@ -2370,15 +2523,15 @@ function Payload_inspector($$anchor, $$props) {
         iconOnly: true
       });
     };
-    $19.if(node_3, ($$render) => {
-      if ($19.get(canCopyRaw))
+    $20.if(node_3, ($$render) => {
+      if ($20.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);
+  $20.reset(div_1);
+  $20.reset(div);
+  var div_2 = $20.sibling(div, 2);
+  var node_4 = $20.child(div_2);
   Tabs(node_4, {
     get value() {
       return activeView();
@@ -2387,313 +2540,313 @@ function Payload_inspector($$anchor, $$props) {
       activeView($$value);
     },
     children: ($$anchor2, $$slotProps) => {
-      var fragment_3 = root_63();
-      var node_5 = $19.first_child(fragment_3);
+      var fragment_3 = root_64();
+      var node_5 = $20.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);
+          var node_6 = $20.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);
+              $20.next();
+              var text_3 = $20.text("Summary");
+              $20.append($$anchor4, text_3);
             },
             $$slots: { default: true }
           });
-          var node_7 = $19.sibling(node_6, 2);
+          var node_7 = $20.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);
+              $20.next();
+              var text_4 = $20.text("Tree");
+              $20.append($$anchor4, text_4);
             },
             $$slots: { default: true }
           });
-          var node_8 = $19.sibling(node_7, 2);
+          var node_8 = $20.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);
+              $20.next();
+              var text_5 = $20.text("Raw");
+              $20.append($$anchor4, text_5);
             },
             $$slots: { default: true }
           });
-          $19.append($$anchor3, fragment_4);
+          $20.append($$anchor3, fragment_4);
         },
         $$slots: { default: true }
       });
-      var node_9 = $19.sibling(node_5, 2);
+      var node_9 = $20.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 node_10 = $20.child(div_3);
           {
             var consequent_4 = ($$anchor4) => {
               var div_4 = root_122();
-              $19.append($$anchor4, div_4);
+              $20.append($$anchor4, div_4);
             };
-            $19.if(node_10, ($$render) => {
-              if ($19.get(isEmpty))
+            $20.if(node_10, ($$render) => {
+              if ($20.get(isEmpty))
                 $$render(consequent_4);
             });
           }
-          var node_11 = $19.sibling(node_10, 2);
+          var node_11 = $20.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);
+              var div_6 = $20.child(div_5);
+              var node_12 = $20.child(div_6);
               {
-                let $0 = $19.derived(() => kindVariant($19.get(valueKind)));
+                let $0 = $20.derived(() => kindVariant($20.get(valueKind)));
                 Badge(node_12, {
                   get variant() {
-                    return $19.get($0);
+                    return $20.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);
+                    $20.next();
+                    var text_6 = $20.text();
+                    $20.template_effect(() => $20.set_text(text_6, $20.get(valueKind)));
+                    $20.append($$anchor5, text_6);
                   },
                   $$slots: { default: true }
                 });
               }
-              var node_13 = $19.sibling(node_12, 2);
+              var node_13 = $20.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);
+                      $20.next();
+                      var text_7 = $20.text("Truncated");
+                      $20.append($$anchor6, text_7);
                     },
                     $$slots: { default: true }
                   });
                 };
-                $19.if(node_13, ($$render) => {
+                $20.if(node_13, ($$render) => {
                   if (truncated())
                     $$render(consequent_5);
                 });
               }
-              $19.reset(div_6);
-              var node_14 = $19.sibling(div_6, 2);
+              $20.reset(div_6);
+              var node_14 = $20.sibling(div_6, 2);
               {
                 var consequent_6 = ($$anchor5) => {
                   Description_list($$anchor5, {
                     get items() {
-                      return $19.get(summaryItems);
+                      return $20.get(summaryItems);
                     },
                     variant: "two-column"
                   });
                 };
-                $19.if(node_14, ($$render) => {
-                  if ($19.get(summaryItems).length > 0)
+                $20.if(node_14, ($$render) => {
+                  if ($20.get(summaryItems).length > 0)
                     $$render(consequent_6);
                 });
               }
-              var node_15 = $19.sibling(node_14, 2);
+              var node_15 = $20.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);
+                  var text_8 = $20.child(div_7);
+                  $20.reset(div_7);
+                  $20.template_effect(() => $20.set_text(text_8, `Parse error: ${$20.get(parseResult).error ?? ""}`));
+                  $20.append($$anchor5, div_7);
                 };
-                $19.if(node_15, ($$render) => {
-                  if (!$19.get(parseResult).ok)
+                $20.if(node_15, ($$render) => {
+                  if (!$20.get(parseResult).ok)
                     $$render(consequent_7);
                 });
               }
-              var node_16 = $19.sibling(node_15, 2);
+              var node_16 = $20.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);
+                  var span_2 = $20.sibling($20.child(div_8), 2);
+                  var text_9 = $20.child(span_2, true);
+                  $20.reset(span_2);
+                  $20.reset(div_8);
+                  $20.template_effect(($0) => $20.set_text(text_9, $0), [() => String($20.get(parsedValue))]);
+                  $20.append($$anchor5, div_8);
                 };
-                $19.if(node_16, ($$render) => {
-                  if ($19.get(parseResult).ok && $19.get(isPrimitive))
+                $20.if(node_16, ($$render) => {
+                  if ($20.get(parseResult).ok && $20.get(isPrimitive))
                     $$render(consequent_8);
                 });
               }
-              $19.reset(div_5);
-              $19.append($$anchor4, div_5);
+              $20.reset(div_5);
+              $20.append($$anchor4, div_5);
             };
-            $19.if(node_11, ($$render) => {
-              if (!$19.get(isEmpty))
+            $20.if(node_11, ($$render) => {
+              if (!$20.get(isEmpty))
                 $$render(consequent_9);
             });
           }
-          $19.reset(div_3);
-          $19.append($$anchor3, div_3);
+          $20.reset(div_3);
+          $20.append($$anchor3, div_3);
         },
         $$slots: { default: true }
       });
-      var node_17 = $19.sibling(node_9, 2);
+      var node_17 = $20.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 node_18 = $20.child(div_9);
           {
             var consequent_10 = ($$anchor4) => {
               var div_10 = root_21();
-              $19.append($$anchor4, div_10);
+              $20.append($$anchor4, div_10);
             };
-            $19.if(node_18, ($$render) => {
-              if ($19.get(isEmpty))
+            $20.if(node_18, ($$render) => {
+              if ($20.get(isEmpty))
                 $$render(consequent_10);
             });
           }
-          var node_19 = $19.sibling(node_18, 2);
+          var node_19 = $20.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);
+              var text_10 = $20.child(div_11);
+              $20.reset(div_11);
+              $20.template_effect(() => $20.set_text(text_10, `Cannot render tree: ${$20.get(parseResult).error ?? ""}`));
+              $20.append($$anchor4, div_11);
             };
-            $19.if(node_19, ($$render) => {
-              if (!$19.get(isEmpty) && !$19.get(parseResult).ok)
+            $20.if(node_19, ($$render) => {
+              if (!$20.get(isEmpty) && !$20.get(parseResult).ok)
                 $$render(consequent_11);
             });
           }
-          var node_20 = $19.sibling(node_19, 2);
+          var node_20 = $20.sibling(node_19, 2);
           {
             var consequent_12 = ($$anchor4) => {
               var div_12 = root_232();
-              $19.append($$anchor4, div_12);
+              $20.append($$anchor4, div_12);
             };
-            $19.if(node_20, ($$render) => {
-              if (!$19.get(isEmpty) && $19.get(parseResult).ok && $19.get(unserializable))
+            $20.if(node_20, ($$render) => {
+              if (!$20.get(isEmpty) && $20.get(parseResult).ok && $20.get(unserializable))
                 $$render(consequent_12);
             });
           }
-          var node_21 = $19.sibling(node_20, 2);
+          var node_21 = $20.sibling(node_20, 2);
           {
             var consequent_13 = ($$anchor4) => {
               Json_viewer($$anchor4, {
                 get value() {
-                  return $19.get(parsedValue);
+                  return $20.get(parsedValue);
                 },
                 get maxBytes() {
                   return maxBytes();
                 }
               });
             };
-            $19.if(node_21, ($$render) => {
-              if (!$19.get(isEmpty) && $19.get(parseResult).ok && !$19.get(unserializable))
+            $20.if(node_21, ($$render) => {
+              if (!$20.get(isEmpty) && $20.get(parseResult).ok && !$20.get(unserializable))
                 $$render(consequent_13);
             });
           }
-          $19.reset(div_9);
-          $19.append($$anchor3, div_9);
+          $20.reset(div_9);
+          $20.append($$anchor3, div_9);
         },
         $$slots: { default: true }
       });
-      var node_22 = $19.sibling(node_17, 2);
+      var node_22 = $20.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 node_23 = $20.child(div_13);
           {
             var consequent_14 = ($$anchor4) => {
               var div_14 = root_262();
-              $19.append($$anchor4, div_14);
+              $20.append($$anchor4, div_14);
             };
-            $19.if(node_23, ($$render) => {
-              if ($19.get(isEmpty))
+            $20.if(node_23, ($$render) => {
+              if ($20.get(isEmpty))
                 $$render(consequent_14);
             });
           }
-          var node_24 = $19.sibling(node_23, 2);
+          var node_24 = $20.sibling(node_23, 2);
           {
             var consequent_15 = ($$anchor4) => {
-              var div_15 = root_272();
-              $19.append($$anchor4, div_15);
+              var div_15 = root_27();
+              $20.append($$anchor4, div_15);
             };
-            $19.if(node_24, ($$render) => {
-              if (!$19.get(isEmpty) && truncated())
+            $20.if(node_24, ($$render) => {
+              if (!$20.get(isEmpty) && truncated())
                 $$render(consequent_15);
             });
           }
-          var node_25 = $19.sibling(node_24, 2);
+          var node_25 = $20.sibling(node_24, 2);
           {
             var consequent_16 = ($$anchor4) => {
               var div_16 = root_28();
-              $19.append($$anchor4, div_16);
+              $20.append($$anchor4, div_16);
             };
-            $19.if(node_25, ($$render) => {
-              if (!$19.get(isEmpty) && $19.get(unserializable))
+            $20.if(node_25, ($$render) => {
+              if (!$20.get(isEmpty) && $20.get(unserializable))
                 $$render(consequent_16);
             });
           }
-          var node_26 = $19.sibling(node_25, 2);
+          var node_26 = $20.sibling(node_25, 2);
           {
             var consequent_17 = ($$anchor4) => {
               Code_block($$anchor4, {
                 get code() {
-                  return $19.get(rawText);
+                  return $20.get(rawText);
                 },
                 highlight: false,
                 class: "cinder-payload-inspector__raw"
               });
             };
-            $19.if(node_26, ($$render) => {
-              if (!$19.get(isEmpty) && !$19.get(unserializable))
+            $20.if(node_26, ($$render) => {
+              if (!$20.get(isEmpty) && !$20.get(unserializable))
                 $$render(consequent_17);
             });
           }
-          $19.reset(div_13);
-          $19.append($$anchor3, div_13);
+          $20.reset(div_13);
+          $20.append($$anchor3, div_13);
         },
         $$slots: { default: true }
       });
-      $19.append($$anchor2, fragment_3);
+      $20.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();
+  $20.reset(div_2);
+  $20.reset(section);
+  $20.template_effect(() => $20.set_text(text8, label()));
+  $20.append($$anchor, section);
+  $20.pop();
 }
 
 // src/components/secret-value-field/secret-value-field.svelte
 import"svelte/internal/disclose-version";
-import * as $20 from "svelte/internal/client";
+import * as $21 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>`);
+var root_110 = $21.from_html(`<span class="cinder-secret-value-field__prefix" aria-hidden="true"> </span>`);
+var root_29 = $21.from_html(`<span class="cinder-secret-value-field__suffix" aria-hidden="true"> </span>`);
+var root_45 = $21.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 = $21.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_36 = $21.from_html(`<button type="button" class="cinder-secret-value-field__toggle"><!></button>`);
+var root_65 = $21.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 = $21.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 = $21.from_html(`<div class="cinder-secret-value-field__warning"><!></div>`);
+var root14 = $21.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, [
+  const fieldId = $21.props_id();
+  $21.push($$props, true);
+  let label = $21.prop($$props, "label", 3, "Secret value"), allowReveal = $21.prop($$props, "allowReveal", 3, false), initiallyRevealed = $21.prop($$props, "initiallyRevealed", 3, false), confirmDuration = $21.prop($$props, "confirmDuration", 3, 1500), copiedLabel = $21.prop($$props, "copiedLabel", 3, "Copied"), rest = $21.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -2708,181 +2861,181 @@ function Secret_value_field($$anchor, $$props) {
     "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 revealed = $21.state($21.proxy(untrack4(() => initiallyRevealed())));
+  let previousValue = $21.state($21.proxy(untrack4(() => $$props.value)));
+  let copied = $21.state(false);
   let resetTimer;
-  const copiedAnnouncement = $20.derived(() => $20.get(copied) ? copiedLabel() : "");
+  const copiedAnnouncement = $21.derived(() => $21.get(copied) ? copiedLabel() : "");
   const MASK = "••••••••••••••••";
   async function handleCopy() {
     const ok = await copyToClipboard($$props.value);
     if (!ok)
       return;
-    $20.set(copied, true);
+    $21.set(copied, true);
     if (resetTimer)
       clearTimeout(resetTimer);
     resetTimer = setTimeout(() => {
-      $20.set(copied, false);
+      $21.set(copied, false);
     }, confirmDuration());
   }
   function handleRevealToggle() {
     if (!allowReveal())
       return;
-    $20.set(revealed, !$20.get(revealed));
+    $21.set(revealed, !$21.get(revealed));
   }
-  $20.user_effect(() => {
-    if ($$props.value === $20.get(previousValue))
+  $21.user_effect(() => {
+    if ($$props.value === $21.get(previousValue))
       return;
-    $20.set(previousValue, $$props.value, true);
-    $20.set(revealed, initiallyRevealed());
+    $21.set(previousValue, $$props.value, true);
+    $21.set(revealed, initiallyRevealed());
   });
   onDestroy(() => {
     if (resetTimer)
       clearTimeout(resetTimer);
   });
   var div = root14();
-  $20.attribute_effect(div, ($0) => ({
+  $21.attribute_effect(div, ($0) => ({
     ...rest,
     class: $0,
-    "data-cinder-copied": $20.get(copied) || undefined,
-    "data-cinder-revealed": $20.get(revealed) || undefined
+    "data-cinder-copied": $21.get(copied) || undefined,
+    "data-cinder-revealed": $21.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 span = $21.child(div);
+  var text8 = $21.child(span, true);
+  $21.reset(span);
+  var div_1 = $21.sibling(span, 2);
+  var node = $21.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);
+      var text_1 = $21.child(span_1, true);
+      $21.reset(span_1);
+      $21.template_effect(() => $21.set_text(text_1, $$props.prefix));
+      $21.append($$anchor2, span_1);
     };
-    $20.if(node, ($$render) => {
+    $21.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 span_2 = $21.sibling(node, 2);
+  var text_2 = $21.child(span_2, true);
+  $21.reset(span_2);
+  var node_1 = $21.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);
+      var text_3 = $21.child(span_3, true);
+      $21.reset(span_3);
+      $21.template_effect(() => $21.set_text(text_3, $$props.suffix));
+      $21.append($$anchor2, span_3);
     };
-    $20.if(node_1, ($$render) => {
+    $21.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 div_2 = $21.sibling(node_1, 2);
+  var node_2 = $21.child(div_2);
   {
     var consequent_3 = ($$anchor2) => {
-      var button = root_35();
-      var node_3 = $20.child(button);
+      var button = root_36();
+      var node_3 = $21.child(button);
       {
         var consequent_2 = ($$anchor3) => {
           var svg = root_45();
-          $20.append($$anchor3, svg);
+          $21.append($$anchor3, svg);
         };
         var alternate = ($$anchor3) => {
           var svg_1 = root_54();
-          $20.append($$anchor3, svg_1);
+          $21.append($$anchor3, svg_1);
         };
-        $20.if(node_3, ($$render) => {
-          if ($20.get(revealed))
+        $21.if(node_3, ($$render) => {
+          if ($21.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()}`);
+      $21.reset(button);
+      $21.template_effect(() => {
+        $21.set_attribute(button, "aria-pressed", $21.get(revealed));
+        $21.set_attribute(button, "aria-label", $21.get(revealed) ? `Hide ${label()}` : `Reveal ${label()}`);
       });
-      $20.delegated("click", button, handleRevealToggle);
-      $20.append($$anchor2, button);
+      $21.delegated("click", button, handleRevealToggle);
+      $21.append($$anchor2, button);
     };
-    $20.if(node_2, ($$render) => {
+    $21.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 button_1 = $21.sibling(node_2, 2);
+  var node_4 = $21.child(button_1);
   {
     var consequent_4 = ($$anchor2) => {
-      var svg_2 = root_64();
-      $20.append($$anchor2, svg_2);
+      var svg_2 = root_65();
+      $21.append($$anchor2, svg_2);
     };
     var alternate_1 = ($$anchor2) => {
       var svg_3 = root_74();
-      $20.append($$anchor2, svg_3);
+      $21.append($$anchor2, svg_3);
     };
-    $20.if(node_4, ($$render) => {
-      if ($20.get(copied))
+    $21.if(node_4, ($$render) => {
+      if ($21.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);
+  $21.reset(button_1);
+  $21.reset(div_2);
+  $21.reset(div_1);
+  var node_5 = $21.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);
+      var node_6 = $21.child(div_3);
+      $21.snippet(node_6, () => $$props.warning);
+      $21.reset(div_3);
+      $21.append($$anchor2, div_3);
     };
-    $20.if(node_5, ($$render) => {
+    $21.if(node_5, ($$render) => {
       if ($$props.warning)
         $$render(consequent_5);
     });
   }
-  var node_7 = $20.sibling(node_5, 2);
+  var node_7 = $21.sibling(node_5, 2);
   _visually_hidden_live_region(node_7, {
     get message() {
-      return $20.get(copiedAnnouncement);
+      return $21.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);
+  $21.reset(div);
+  $21.template_effect(() => {
+    $21.set_attribute(span, "id", fieldId);
+    $21.set_text(text8, label());
+    $21.set_attribute(div_1, "aria-labelledby", fieldId);
+    $21.set_attribute(span_2, "aria-label", $21.get(revealed) ? `${label()}, revealed` : `${label()}, masked`);
+    $21.set_attribute(span_2, "data-cinder-masked", !$21.get(revealed) || undefined);
+    $21.set_text(text_2, $21.get(revealed) ? $$props.value : MASK);
+    $21.set_attribute(button_1, "aria-label", `Copy ${label()}`);
+    $21.set_attribute(button_1, "data-cinder-copied", $21.get(copied) || undefined);
   });
-  $20.delegated("click", button_1, handleCopy);
-  $20.append($$anchor, div);
-  $20.pop();
+  $21.delegated("click", button_1, handleCopy);
+  $21.append($$anchor, div);
+  $21.pop();
 }
-$20.delegate(["click"]);
+$21.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>`);
+import * as $22 from "svelte/internal/client";
+var root_111 = $22.from_html(`<span class="cinder-status-dot__label"> </span>`);
+var root_211 = $22.from_html(`<span class="cinder-sr-only"> </span>`);
+var root15 = $22.from_html(`<span><span class="cinder-status-dot__indicator" aria-hidden="true"></span> <!> <!></span>`);
 function Status_dot($$anchor, $$props) {
-  $21.push($$props, true);
+  $22.push($$props, true);
   const connectionStatusMap = {
     connected: "online",
     connecting: "warning",
@@ -2895,7 +3048,7 @@ function Status_dot($$anchor, $$props) {
     disconnected: "Disconnected",
     error: "Error"
   };
-  let showLabel = $21.prop($$props, "showLabel", 3, true), size = $21.prop($$props, "size", 3, "md"), rest = $21.rest_props($$props, [
+  let showLabel = $22.prop($$props, "showLabel", 3, true), size = $22.prop($$props, "size", 3, "md"), rest = $22.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -2908,60 +3061,60 @@ function Status_dot($$anchor, $$props) {
     "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)));
+  const normalizedAriaLabel = $22.derived(() => $$props["aria-label"]?.trim() ? $$props["aria-label"].trim() : undefined);
+  const resolvedStatus = $22.derived(() => $$props.status ?? ($$props.connectionState === undefined ? "neutral" : connectionStatusMap[$$props.connectionState]));
+  const resolvedLive = $22.derived(() => $$props.live ?? $$props.connectionState !== undefined);
+  const normalizedLabel = $22.derived(() => $$props.label?.trim() ? $$props.label.trim() : $$props.connectionState === undefined ? undefined : connectionLabels[$$props.connectionState]);
+  const hasVisibleLabel = $22.derived(() => showLabel() && $22.get(normalizedLabel) !== undefined);
+  const resolvedAriaLabel = $22.derived(() => $22.get(normalizedAriaLabel) ?? $22.get(normalizedLabel) ?? $22.get(resolvedStatus));
+  const visibleLabelIsLiveDuplicate = $22.derived(() => $22.get(resolvedLive) && $22.get(normalizedLabel) !== undefined && $22.get(resolvedAriaLabel) !== $22.get(normalizedLabel));
+  const needsHiddenLiveLabel = $22.derived(() => $22.get(resolvedLive) && (!$22.get(hasVisibleLabel) || $22.get(visibleLabelIsLiveDuplicate)));
   var span = root15();
-  $21.attribute_effect(span, ($0) => ({
+  $22.attribute_effect(span, ($0) => ({
     ...rest,
     class: $0,
-    "data-cinder-status": $21.get(resolvedStatus),
+    "data-cinder-status": $22.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)
+    role: $22.get(resolvedLive) ? "status" : "img",
+    "aria-live": $22.get(resolvedLive) ? "polite" : undefined,
+    "aria-atomic": $22.get(resolvedLive) ? "true" : undefined,
+    "aria-label": $22.get(resolvedLive) ? undefined : $22.get(resolvedAriaLabel)
   }), [() => classNames("cinder-status-dot", $$props.class)]);
-  var node = $21.sibling($21.child(span), 2);
+  var node = $22.sibling($22.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));
+      var text8 = $22.child(span_1, true);
+      $22.reset(span_1);
+      $22.template_effect(() => {
+        $22.set_attribute(span_1, "aria-hidden", $22.get(visibleLabelIsLiveDuplicate) ? "true" : undefined);
+        $22.set_text(text8, $22.get(normalizedLabel));
       });
-      $21.append($$anchor2, span_1);
+      $22.append($$anchor2, span_1);
     };
-    $21.if(node, ($$render) => {
-      if ($21.get(hasVisibleLabel))
+    $22.if(node, ($$render) => {
+      if ($22.get(hasVisibleLabel))
         $$render(consequent);
     });
   }
-  var node_1 = $21.sibling(node, 2);
+  var node_1 = $22.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);
+      var text_1 = $22.child(span_2, true);
+      $22.reset(span_2);
+      $22.template_effect(() => $22.set_text(text_1, $22.get(resolvedAriaLabel)));
+      $22.append($$anchor2, span_2);
     };
-    $21.if(node_1, ($$render) => {
-      if ($21.get(needsHiddenLiveLabel))
+    $22.if(node_1, ($$render) => {
+      if ($22.get(needsHiddenLiveLabel))
         $$render(consequent_1);
     });
   }
-  $21.reset(span);
-  $21.append($$anchor, span);
-  $21.pop();
+  $22.reset(span);
+  $22.append($$anchor, span);
+  $22.pop();
 }
 
 // src/components/approval-card/approval-card-state.ts
@@ -2982,27 +3135,28 @@ function resolveComparisonTime(currentTime) {
 }
 
 // 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>`);
+var root_112 = $23.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_66 = $23.from_html(`<div class="cinder-approval-card__metadata-item"><dt>Snapshot</dt> <dd> </dd></div>`);
+var root_75 = $23.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 = $23.from_html(`<p class="cinder-approval-card__muted">Review the touched files and arguments before approving this file write.</p>`);
+var root_123 = $23.from_html(`<p class="cinder-approval-card__muted">Review the arguments and metadata before approving this operation.</p>`);
+var root_152 = $23.from_html(`<li> </li>`);
+var root_133 = $23.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 = $23.from_html(`<p class="cinder-approval-card__muted">No arguments were provided.</p>`);
+var root_183 = $23.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 = $23.from_html(`<div class="cinder-approval-card__resolution-controls"><label class="cinder-approval-card__editor-label">Resolution reason</label> <p class="cinder-approval-card__muted">Optional context included with the host resolution payload.</p> <textarea class="cinder-approval-card__textarea cinder-approval-card__textarea--reason" rows="3"></textarea> <label class="cinder-approval-card__remember-control"><input type="checkbox"/> <span>Remember this approval boundary</span></label></div>`);
+var root_223 = $23.from_html(`<!> <!> <!> <!> <!>`, 1);
+var root_30 = $23.from_html(`<p class="cinder-approval-card__error" role="alert"> </p>`);
+var root_292 = $23.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 = $23.from_html(`<section class="cinder-approval-card__section cinder-approval-card__actions-section"><!> <!> <!></section>`);
+var root_322 = $23.from_html(`<p class="cinder-approval-card__readonly-summary">No approval actions are available for this request.</p>`);
+var root_55 = $23.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 = $23.from_html(`<section><!></section>`);
 function Approval_card($$anchor, $$props) {
-  const generatedId = $22.props_id();
-  $22.push($$props, true);
+  const generatedId = $23.props_id();
+  $23.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, [
+  let env = $23.prop($$props, "env", 19, () => []), editableArgs = $23.prop($$props, "editableArgs", 3, false), rest = $23.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -3016,6 +3170,7 @@ function Approval_card($$anchor, $$props) {
     "expiresAt",
     "state",
     "editableArgs",
+    "onresolve",
     "onapprove",
     "onapprovewithedits",
     "ondeny",
@@ -3024,60 +3179,77 @@ function Approval_card($$anchor, $$props) {
     "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({}));
+  const rootId = $23.derived(() => $$props.id ?? generatedId);
+  const titleId = $23.derived(() => `${$23.get(rootId)}-title`);
+  const descriptionId = $23.derived(() => `${$23.get(rootId)}-description`);
+  const resolutionDescriptionId = $23.derived(() => `${$23.get(rootId)}-resolution-description`);
+  const editDescriptionId = $23.derived(() => `${$23.get(rootId)}-edit-description`);
+  const editErrorId = $23.derived(() => `${$23.get(rootId)}-edit-error`);
+  let currentTime = $23.state(undefined);
+  let resolutionReason = $23.state("");
+  let rememberResolution = $23.state(false);
+  let resolutionSeedKey = $23.state(null);
+  let editingArgumentsSeedKey = $23.state(null);
+  let editedArgumentsDrafts = $23.state($23.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")
+  const expirationTimestamp = $23.derived(() => parseExpirationTimestamp($$props.expiresAt));
+  const effectiveState = $23.derived(() => resolveEffectiveApprovalState($$props.state, $23.get(expirationTimestamp), $23.get(currentTime)));
+  const isActionable = $23.derived(() => isApprovalActionable($$props.state, $23.get(expirationTimestamp), $23.get(currentTime)));
+  const operationKindLabel = $23.derived(() => formatOperationKind($$props.operation.kind));
+  const riskLabel = $23.derived(() => formatRisk($$props.tool.risk));
+  const stateText = $23.derived(() => formatState($23.get(effectiveState)));
+  const stateDescription = $23.derived(() => $23.get(isActionable) ? `${$23.get(operationKindLabel)} approval is waiting for a decision.` : `No approval actions are available because this request is ${$23.get(stateText).toLowerCase()}.`);
+  const expirationText = $23.derived(() => {
+    if ($23.get(effectiveState) === "expired")
       return "Expired";
-    if ($$props.state !== "pending" || $22.get(expirationTimestamp) === undefined || $22.get(currentTime) === undefined) {
+    if ($$props.state !== "pending" || $23.get(expirationTimestamp) === undefined || $23.get(currentTime) === undefined) {
       return;
     }
-    return `Expires in ${formatRemainingTime($22.get(expirationTimestamp) - $22.get(currentTime))}`;
+    return `Expires in ${formatRemainingTime($23.get(expirationTimestamp) - $23.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(() => {
+  const hasArgumentsPreview = $23.derived(() => $$props.operation.argsPreview !== undefined);
+  const editableArgumentsValue = $23.derived(() => normalizeArgumentsPreviewValue($$props.operation.argsPreview));
+  const argumentsPreview = $23.derived(() => prepareArgumentsPreview($23.get(editableArgumentsValue)));
+  const filesTouched = $23.derived(() => $$props.operation.filesTouched ?? []);
+  const filesTouchedLabel = $23.derived(() => `${$23.get(filesTouched).length} file${$23.get(filesTouched).length === 1 ? "" : "s"}`);
+  const environmentNames = $23.derived(() => sanitizeEnvironmentNames(env()));
+  const currentEditedArgumentsText = $23.derived(() => formatEditableArguments($23.get(editableArgumentsValue)));
+  const currentEditedArgumentsSeedKey = $23.derived(() => `${$$props.idempotencyKey}\x00${$23.get(currentEditedArgumentsText)}`);
+  const currentResolutionSeedKey = $23.derived(() => `${$$props.idempotencyKey}\x00${$$props.operation.kind}`);
+  const canEditArguments = $23.derived(() => editableArgs() && $23.get(hasArgumentsPreview));
+  const editingArguments = $23.derived(() => $23.get(canEditArguments) && $23.get(editingArgumentsSeedKey) === $23.get(currentEditedArgumentsSeedKey));
+  const editedArgumentsText = $23.derived(() => $23.get(editedArgumentsDrafts)[$23.get(currentEditedArgumentsSeedKey)] ?? $23.get(currentEditedArgumentsText));
+  const editParseResult = $23.derived(() => parseJsonText($23.get(editedArgumentsText)));
+  const canConfirmEditedApproval = $23.derived(() => $23.get(canEditArguments) && $23.get(editParseResult).ok && (typeof $$props.onapprovewithedits === "function" || typeof $$props.onresolve === "function"));
+  const hasResolutionCallback = $23.derived(() => typeof $$props.onresolve === "function");
+  const canResolveApproval = $23.derived(() => typeof $$props.onapprove === "function" || $23.get(hasResolutionCallback));
+  const canResolveEditedApproval = $23.derived(() => typeof $$props.onapprovewithedits === "function" || $23.get(hasResolutionCallback));
+  const canResolveDenial = $23.derived(() => typeof $$props.ondeny === "function" || $23.get(hasResolutionCallback));
+  const canResolveCancellation = $23.derived(() => typeof $$props.oncancel === "function" || $23.get(hasResolutionCallback));
+  $23.user_effect(() => {
     clearExpirationTimer();
-    if ($$props.state === "pending" && $22.get(expirationTimestamp) !== undefined) {
+    if ($$props.state === "pending" && $23.get(expirationTimestamp) !== undefined) {
       const updateCurrentTime = () => {
         const nextCurrentTime = Date.now();
-        $22.set(currentTime, nextCurrentTime, true);
-        if (nextCurrentTime >= $22.get(expirationTimestamp)) {
+        $23.set(currentTime, nextCurrentTime, true);
+        if (nextCurrentTime >= $23.get(expirationTimestamp)) {
           clearExpirationTimer();
           return;
         }
-        const nextDelay = Math.min(1000, $22.get(expirationTimestamp) - nextCurrentTime);
+        const nextDelay = Math.min(1000, $23.get(expirationTimestamp) - nextCurrentTime);
         expirationTimer = setTimeout(updateCurrentTime, nextDelay);
       };
       updateCurrentTime();
     }
     return clearExpirationTimer;
   });
+  $23.user_effect(() => {
+    if ($23.get(resolutionSeedKey) !== $23.get(currentResolutionSeedKey)) {
+      $23.set(resolutionSeedKey, $23.get(currentResolutionSeedKey), true);
+      $23.set(resolutionReason, "");
+      $23.set(rememberResolution, false);
+    }
+  });
   onDestroy2(clearExpirationTimer);
   function clearExpirationTimer() {
     if (expirationTimer !== undefined) {
@@ -3204,9 +3376,9 @@ function Approval_card($$anchor, $$props) {
       return "{}";
     }
   }
-  function parseJsonText(text8) {
+  function parseJsonText(text9) {
     try {
-      return { ok: true, value: JSON.parse(text8) };
+      return { ok: true, value: JSON.parse(text9) };
     } catch {
       return { ok: false, message: "Edited arguments must be valid JSON." };
     }
@@ -3228,50 +3400,70 @@ function Approval_card($$anchor, $$props) {
     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);
+    const comparisonTime = $23.get(expirationTimestamp) === undefined ? $23.get(currentTime) : Date.now();
+    const actionable = isApprovalActionable($$props.state, $23.get(expirationTimestamp), comparisonTime);
+    if (!actionable && $$props.state === "pending" && $23.get(expirationTimestamp) !== undefined) {
+      $23.set(currentTime, comparisonTime, true);
     }
     return actionable;
   }
   function beginEditingArguments() {
     if (!currentApprovalIsActionable())
       return;
-    if (!$22.get(canEditArguments))
+    if (!$23.get(canEditArguments))
       return;
-    if (!($22.get(currentEditedArgumentsSeedKey) in $22.get(editedArgumentsDrafts))) {
-      $22.set(editedArgumentsDrafts, {
-        ...$22.get(editedArgumentsDrafts),
-        [$22.get(currentEditedArgumentsSeedKey)]: $22.get(currentEditedArgumentsText)
+    if (!($23.get(currentEditedArgumentsSeedKey) in $23.get(editedArgumentsDrafts))) {
+      $23.set(editedArgumentsDrafts, {
+        ...$23.get(editedArgumentsDrafts),
+        [$23.get(currentEditedArgumentsSeedKey)]: $23.get(currentEditedArgumentsText)
       }, true);
     }
-    $22.set(editingArgumentsSeedKey, $22.get(currentEditedArgumentsSeedKey), true);
+    $23.set(editingArgumentsSeedKey, $23.get(currentEditedArgumentsSeedKey), true);
   }
   function handleEditedArgumentsInput(event) {
-    $22.set(editedArgumentsDrafts, {
-      ...$22.get(editedArgumentsDrafts),
-      [$22.get(currentEditedArgumentsSeedKey)]: event.currentTarget.value
+    $23.set(editedArgumentsDrafts, {
+      ...$23.get(editedArgumentsDrafts),
+      [$23.get(currentEditedArgumentsSeedKey)]: event.currentTarget.value
     }, true);
   }
+  function handleReasonInput(event) {
+    $23.set(resolutionReason, event.currentTarget.value, true);
+  }
+  function handleRememberInput(event) {
+    $23.set(rememberResolution, event.currentTarget.checked, true);
+  }
+  function emitResolution(decision, editedArgs) {
+    const trimmedReason = $23.get(resolutionReason).trim();
+    const resolution = { decision, remember: $23.get(rememberResolution) };
+    if (decision === "approve_with_edits") {
+      resolution.editedArgs = editedArgs;
+    }
+    if (trimmedReason) {
+      resolution.reason = trimmedReason;
+    }
+    $$props.onresolve?.(resolution);
+  }
   function handleApprove() {
     if (!currentApprovalIsActionable())
       return;
     $$props.onapprove?.();
+    emitResolution("approve");
   }
   function handleApproveWithEdits() {
     if (!currentApprovalIsActionable())
       return;
-    if (!$22.get(canEditArguments))
+    if (!$23.get(canEditArguments))
       return;
-    if (!$22.get(editParseResult).ok)
+    if (!$23.get(editParseResult).ok)
       return;
-    $$props.onapprovewithedits?.($22.get(editParseResult).value);
+    $$props.onapprovewithedits?.($23.get(editParseResult).value);
+    emitResolution("approve_with_edits", $23.get(editParseResult).value);
   }
   function handleDeny() {
     if (!currentApprovalIsActionable())
       return;
     $$props.ondeny?.();
+    emitResolution("deny");
   }
   function handleRemember() {
     if (!currentApprovalIsActionable())
@@ -3282,97 +3474,98 @@ function Approval_card($$anchor, $$props) {
     if (!currentApprovalIsActionable())
       return;
     $$props.oncancel?.();
+    emitResolution("cancel");
   }
   var section = root16();
-  $22.attribute_effect(section, ($0) => ({
+  $23.attribute_effect(section, ($0) => ({
     ...rest,
-    id: $22.get(rootId),
+    id: $23.get(rootId),
     class: $0,
-    "aria-labelledby": $22.get(titleId),
-    "aria-describedby": $22.get(descriptionId),
-    "data-cinder-state": $22.get(effectiveState),
+    "aria-labelledby": $23.get(titleId),
+    "aria-describedby": $23.get(descriptionId),
+    "data-cinder-state": $23.get(effectiveState),
     "data-cinder-risk": $$props.tool.risk
   }), [() => classNames("cinder-approval-card", $$props.class)]);
-  var node = $22.child(section);
+  var node = $23.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);
+      var div_1 = $23.child(div);
+      var p = $23.child(div_1);
+      var text_1 = $23.child(p);
+      $23.reset(p);
+      var h3 = $23.sibling(p, 2);
+      var text_2 = $23.child(h3);
+      $23.reset(h3);
+      var p_1 = $23.sibling(h3, 2);
+      var text_3 = $23.child(p_1, true);
+      $23.reset(p_1);
+      $23.reset(div_1);
+      var div_2 = $23.sibling(div_1, 2);
+      var node_1 = $23.child(div_2);
       {
-        let $0 = $22.derived(() => stateDotStatus($22.get(effectiveState)));
+        let $0 = $23.derived(() => stateDotStatus($23.get(effectiveState)));
         Status_dot(node_1, {
           get status() {
-            return $22.get($0);
+            return $23.get($0);
           },
           get label() {
-            return $22.get(stateText);
+            return $23.get(stateText);
           }
         });
       }
-      var node_2 = $22.sibling(node_1, 2);
+      var node_2 = $23.sibling(node_1, 2);
       {
-        let $0 = $22.derived(() => riskBadgeVariant($$props.tool.risk));
+        let $0 = $23.derived(() => riskBadgeVariant($$props.tool.risk));
         Badge(node_2, {
           get variant() {
-            return $22.get($0);
+            return $23.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);
+            $23.next();
+            var text_4 = $23.text();
+            $23.template_effect(() => $23.set_text(text_4, $23.get(riskLabel)));
+            $23.append($$anchor3, text_4);
           },
           $$slots: { default: true }
         });
       }
-      var node_3 = $22.sibling(node_2, 2);
+      var node_3 = $23.sibling(node_2, 2);
       {
         var consequent = ($$anchor3) => {
           {
-            let $0 = $22.derived(() => $22.get(effectiveState) === "expired" ? "neutral" : "warning");
+            let $0 = $23.derived(() => $23.get(effectiveState) === "expired" ? "neutral" : "warning");
             Badge($$anchor3, {
               get variant() {
-                return $22.get($0);
+                return $23.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);
+                $23.next();
+                var text_5 = $23.text();
+                $23.template_effect(() => $23.set_text(text_5, $23.get(expirationText)));
+                $23.append($$anchor4, text_5);
               },
               $$slots: { default: true }
             });
           }
         };
-        $22.if(node_3, ($$render) => {
-          if ($22.get(expirationText))
+        $23.if(node_3, ($$render) => {
+          if ($23.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));
+      $23.reset(div_2);
+      $23.reset(div);
+      $23.template_effect(() => {
+        $23.set_text(text_1, `${$23.get(operationKindLabel) ?? ""} approval`);
+        $23.set_attribute(h3, "id", $23.get(titleId));
+        $23.set_text(text_2, `Approval required for ${$$props.tool.name ?? ""}`);
+        $23.set_attribute(p_1, "id", $23.get(descriptionId));
+        $23.set_text(text_3, $23.get(stateDescription));
       });
-      $22.append($$anchor2, div);
+      $23.append($$anchor2, div);
     };
     Card(node, {
       padding: "none",
@@ -3380,84 +3573,84 @@ function Approval_card($$anchor, $$props) {
       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 dl = $23.child(div_3);
+        var div_4 = $23.child(dl);
+        var dd = $23.sibling($23.child(div_4), 2);
+        var text_6 = $23.child(dd, true);
+        $23.reset(dd);
+        $23.reset(div_4);
+        var div_5 = $23.sibling(div_4, 2);
+        var dd_1 = $23.sibling($23.child(div_5), 2);
+        var text_7 = $23.child(dd_1, true);
+        $23.reset(dd_1);
+        $23.reset(div_5);
+        var node_4 = $23.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);
+            var div_6 = root_66();
+            var dd_2 = $23.sibling($23.child(div_6), 2);
+            var text_8 = $23.child(dd_2, true);
+            $23.reset(dd_2);
+            $23.reset(div_6);
+            $23.template_effect(() => $23.set_text(text_8, $$props.snapshotId));
+            $23.append($$anchor3, div_6);
           };
-          $22.if(node_4, ($$render) => {
+          $23.if(node_4, ($$render) => {
             if ($$props.snapshotId)
               $$render(consequent_1);
           });
         }
-        $22.reset(dl);
-        var node_5 = $22.sibling(dl, 2);
+        $23.reset(dl);
+        var node_5 = $23.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);
+            var dl_1 = $23.sibling($23.child(section_1), 2);
+            var div_7 = $23.child(dl_1);
+            var dd_3 = $23.sibling($23.child(div_7), 2);
+            var text_9 = $23.child(dd_3, true);
+            $23.reset(dd_3);
+            $23.reset(div_7);
+            var div_8 = $23.sibling(div_7, 2);
+            var dd_4 = $23.sibling($23.child(div_8), 2);
+            var text_10 = $23.child(dd_4, true);
+            $23.reset(dd_4);
+            $23.reset(div_8);
+            var div_9 = $23.sibling(div_8, 2);
+            var dd_5 = $23.sibling($23.child(div_9), 2);
+            var text_11 = $23.child(dd_5, true);
+            $23.reset(dd_5);
+            $23.reset(div_9);
+            $23.reset(dl_1);
+            $23.reset(section_1);
+            $23.template_effect(() => {
+              $23.set_text(text_9, $$props.sandbox.provider);
+              $23.set_text(text_10, $$props.sandbox.name);
+              $23.set_text(text_11, $$props.sandbox.workingDir);
             });
-            $22.append($$anchor3, section_1);
+            $23.append($$anchor3, section_1);
           };
-          $22.if(node_5, ($$render) => {
+          $23.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);
+        var section_2 = $23.sibling(node_5, 2);
+        var div_10 = $23.child(section_2);
+        var node_6 = $23.sibling($23.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);
+            $23.next();
+            var text_12 = $23.text();
+            $23.template_effect(() => $23.set_text(text_12, $$props.operation.kind));
+            $23.append($$anchor3, text_12);
           },
           $$slots: { default: true }
         });
-        $22.reset(div_10);
-        var node_7 = $22.sibling(div_10, 2);
+        $23.reset(div_10);
+        var node_7 = $23.sibling(div_10, 2);
         {
           var consequent_3 = ($$anchor3) => {
             Code_block($$anchor3, {
@@ -3479,13 +3672,13 @@ function Approval_card($$anchor, $$props) {
           };
           var consequent_5 = ($$anchor3) => {
             var p_2 = root_113();
-            $22.append($$anchor3, p_2);
+            $23.append($$anchor3, p_2);
           };
           var alternate = ($$anchor3) => {
             var p_3 = root_123();
-            $22.append($$anchor3, p_3);
+            $23.append($$anchor3, p_3);
           };
-          $22.if(node_7, ($$render) => {
+          $23.if(node_7, ($$render) => {
             if ($$props.operation.kind === "command" && $$props.operation.command)
               $$render(consequent_3);
             else if ($$props.operation.kind === "patch" && $$props.operation.diff)
@@ -3496,293 +3689,324 @@ function Approval_card($$anchor, $$props) {
               $$render(alternate, -1);
           });
         }
-        var node_8 = $22.sibling(node_7, 2);
+        var node_8 = $23.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);
+            var div_12 = $23.child(div_11);
+            var node_9 = $23.sibling($23.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);
+                $23.next();
+                var text_13 = $23.text();
+                $23.template_effect(() => $23.set_text(text_13, $23.get(filesTouchedLabel)));
+                $23.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) => {
+            $23.reset(div_12);
+            var ul = $23.sibling(div_12, 2);
+            $23.each(ul, 23, () => $23.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);
+              var text_14 = $23.child(li, true);
+              $23.reset(li);
+              $23.template_effect(() => $23.set_text(text_14, $23.get(file)));
+              $23.append($$anchor4, li);
             });
-            $22.reset(ul);
-            $22.reset(div_11);
-            $22.append($$anchor3, div_11);
+            $23.reset(ul);
+            $23.reset(div_11);
+            $23.append($$anchor3, div_11);
           };
-          $22.if(node_8, ($$render) => {
-            if ($22.get(filesTouched).length > 0)
+          $23.if(node_8, ($$render) => {
+            if ($23.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);
+        $23.reset(section_2);
+        var section_3 = $23.sibling(section_2, 2);
+        var node_10 = $23.child(section_3);
         {
           var consequent_7 = ($$anchor3) => {
             Payload_inspector($$anchor3, {
               get value() {
-                return $22.get(argumentsPreview).value;
+                return $23.get(argumentsPreview).value;
               },
               get truncated() {
-                return $22.get(argumentsPreview).truncated;
+                return $23.get(argumentsPreview).truncated;
               },
               label: "Arguments preview"
             });
           };
           var alternate_1 = ($$anchor3) => {
             var p_4 = root_172();
-            $22.append($$anchor3, p_4);
+            $23.append($$anchor3, p_4);
           };
-          $22.if(node_10, ($$render) => {
-            if ($22.get(hasArgumentsPreview))
+          $23.if(node_10, ($$render) => {
+            if ($23.get(hasArgumentsPreview))
               $$render(consequent_7);
             else
               $$render(alternate_1, -1);
           });
         }
-        $22.reset(section_3);
-        var node_11 = $22.sibling(section_3, 2);
+        $23.reset(section_3);
+        var node_11 = $23.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) => {
+            var div_13 = $23.sibling($23.child(section_4), 2);
+            $23.each(div_13, 23, () => $23.get(environmentNames), (environmentName, environmentIndex) => `${environmentIndex}:${environmentName}`, ($$anchor4, environmentName) => {
               Secret_value_field($$anchor4, {
                 get value() {
-                  return $22.get(environmentName);
+                  return $23.get(environmentName);
                 },
                 get label() {
-                  return $22.get(environmentName);
+                  return $23.get(environmentName);
                 }
               });
             });
-            $22.reset(div_13);
-            $22.reset(section_4);
-            $22.append($$anchor3, section_4);
+            $23.reset(div_13);
+            $23.reset(section_4);
+            $23.append($$anchor3, section_4);
           };
-          $22.if(node_11, ($$render) => {
-            if ($22.get(environmentNames).length > 0)
+          $23.if(node_11, ($$render) => {
+            if ($23.get(environmentNames).length > 0)
               $$render(consequent_8);
           });
         }
-        var node_12 = $22.sibling(node_11, 2);
+        var node_12 = $23.sibling(node_11, 2);
         {
-          var consequent_12 = ($$anchor3) => {
+          var consequent_13 = ($$anchor3) => {
             var section_5 = root_202();
-            var node_13 = $22.child(section_5);
-            Button_group(node_13, {
+            var node_13 = $23.child(section_5);
+            {
+              var consequent_9 = ($$anchor4) => {
+                var div_14 = root_212();
+                var label = $23.child(div_14);
+                var p_5 = $23.sibling(label, 2);
+                var textarea = $23.sibling(p_5, 2);
+                $23.remove_textarea_child(textarea);
+                var label_1 = $23.sibling(textarea, 2);
+                var input = $23.child(label_1);
+                $23.remove_input_defaults(input);
+                $23.next(2);
+                $23.reset(label_1);
+                $23.reset(div_14);
+                $23.template_effect(() => {
+                  $23.set_attribute(label, "for", `${$23.get(rootId)}-resolution-reason`);
+                  $23.set_attribute(p_5, "id", $23.get(resolutionDescriptionId));
+                  $23.set_attribute(textarea, "id", `${$23.get(rootId)}-resolution-reason`);
+                  $23.set_value(textarea, $23.get(resolutionReason));
+                  $23.set_attribute(textarea, "aria-describedby", $23.get(resolutionDescriptionId));
+                  $23.set_checked(input, $23.get(rememberResolution));
+                });
+                $23.delegated("input", textarea, handleReasonInput);
+                $23.delegated("change", input, handleRememberInput);
+                $23.append($$anchor4, div_14);
+              };
+              $23.if(node_13, ($$render) => {
+                if ($23.get(hasResolutionCallback))
+                  $$render(consequent_9);
+              });
+            }
+            var node_14 = $23.sibling(node_13, 2);
+            Button_group(node_14, {
               label: "Approval actions",
               children: ($$anchor4, $$slotProps2) => {
-                var fragment_9 = root_212();
-                var node_14 = $22.first_child(fragment_9);
+                var fragment_9 = root_223();
+                var node_15 = $23.first_child(fragment_9);
                 {
-                  let $0 = $22.derived(() => !$$props.onapprove);
-                  Button(node_14, {
+                  let $0 = $23.derived(() => !$23.get(canResolveApproval));
+                  Button(node_15, {
                     type: "button",
                     variant: "primary",
                     onclick: handleApprove,
                     get disabled() {
-                      return $22.get($0);
+                      return $23.get($0);
                     },
                     children: ($$anchor5, $$slotProps3) => {
-                      $22.next();
-                      var text_15 = $22.text("Approve");
-                      $22.append($$anchor5, text_15);
+                      $23.next();
+                      var text_15 = $23.text("Approve");
+                      $23.append($$anchor5, text_15);
                     },
                     $$slots: { default: true }
                   });
                 }
-                var node_15 = $22.sibling(node_14, 2);
+                var node_16 = $23.sibling(node_15, 2);
                 {
-                  var consequent_9 = ($$anchor5) => {
+                  var consequent_10 = ($$anchor5) => {
                     {
-                      let $0 = $22.derived(() => !$$props.onapprovewithedits);
+                      let $0 = $23.derived(() => !$23.get(canResolveEditedApproval));
                       Button($$anchor5, {
                         type: "button",
                         variant: "secondary",
                         onclick: beginEditingArguments,
                         get disabled() {
-                          return $22.get($0);
+                          return $23.get($0);
                         },
                         children: ($$anchor6, $$slotProps3) => {
-                          $22.next();
-                          var text_16 = $22.text("Approve with edits");
-                          $22.append($$anchor6, text_16);
+                          $23.next();
+                          var text_16 = $23.text("Approve with edits");
+                          $23.append($$anchor6, text_16);
                         },
                         $$slots: { default: true }
                       });
                     }
                   };
-                  $22.if(node_15, ($$render) => {
-                    if ($22.get(canEditArguments))
-                      $$render(consequent_9);
+                  $23.if(node_16, ($$render) => {
+                    if ($23.get(canEditArguments))
+                      $$render(consequent_10);
                   });
                 }
-                var node_16 = $22.sibling(node_15, 2);
+                var node_17 = $23.sibling(node_16, 2);
                 {
-                  let $0 = $22.derived(() => !$$props.ondeny);
-                  Button(node_16, {
+                  let $0 = $23.derived(() => !$23.get(canResolveDenial));
+                  Button(node_17, {
                     type: "button",
                     variant: "soft-danger",
                     onclick: handleDeny,
                     get disabled() {
-                      return $22.get($0);
+                      return $23.get($0);
                     },
                     children: ($$anchor5, $$slotProps3) => {
-                      $22.next();
-                      var text_17 = $22.text("Deny");
-                      $22.append($$anchor5, text_17);
+                      $23.next();
+                      var text_17 = $23.text("Deny");
+                      $23.append($$anchor5, text_17);
                     },
                     $$slots: { default: true }
                   });
                 }
-                var node_17 = $22.sibling(node_16, 2);
+                var node_18 = $23.sibling(node_17, 2);
                 {
-                  let $0 = $22.derived(() => !$$props.onremember);
-                  Button(node_17, {
+                  let $0 = $23.derived(() => !$$props.onremember);
+                  Button(node_18, {
                     type: "button",
                     variant: "soft",
                     onclick: handleRemember,
                     get disabled() {
-                      return $22.get($0);
+                      return $23.get($0);
                     },
                     children: ($$anchor5, $$slotProps3) => {
-                      $22.next();
-                      var text_18 = $22.text("Remember");
-                      $22.append($$anchor5, text_18);
+                      $23.next();
+                      var text_18 = $23.text("Remember");
+                      $23.append($$anchor5, text_18);
                     },
                     $$slots: { default: true }
                   });
                 }
-                var node_18 = $22.sibling(node_17, 2);
+                var node_19 = $23.sibling(node_18, 2);
                 {
-                  let $0 = $22.derived(() => !$$props.oncancel);
-                  Button(node_18, {
+                  let $0 = $23.derived(() => !$23.get(canResolveCancellation));
+                  Button(node_19, {
                     type: "button",
                     variant: "ghost",
                     onclick: handleCancel,
                     get disabled() {
-                      return $22.get($0);
+                      return $23.get($0);
                     },
                     children: ($$anchor5, $$slotProps3) => {
-                      $22.next();
-                      var text_19 = $22.text("Cancel");
-                      $22.append($$anchor5, text_19);
+                      $23.next();
+                      var text_19 = $23.text("Cancel");
+                      $23.append($$anchor5, text_19);
                     },
                     $$slots: { default: true }
                   });
                 }
-                $22.append($$anchor4, fragment_9);
+                $23.append($$anchor4, fragment_9);
               },
               $$slots: { default: true }
             });
-            var node_19 = $22.sibling(node_13, 2);
+            var node_20 = $23.sibling(node_14, 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_12 = ($$anchor4) => {
+                var div_15 = root_292();
+                var label_2 = $23.child(div_15);
+                var p_6 = $23.sibling(label_2, 2);
+                var textarea_1 = $23.sibling(p_6, 2);
+                $23.remove_textarea_child(textarea_1);
+                var node_21 = $23.sibling(textarea_1, 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);
+                  var consequent_11 = ($$anchor5) => {
+                    var p_7 = root_30();
+                    var text_20 = $23.child(p_7, true);
+                    $23.reset(p_7);
+                    $23.template_effect(() => {
+                      $23.set_attribute(p_7, "id", $23.get(editErrorId));
+                      $23.set_text(text_20, $23.get(editParseResult).message);
                     });
-                    $22.append($$anchor5, p_6);
+                    $23.append($$anchor5, p_7);
                   };
-                  $22.if(node_20, ($$render) => {
-                    if (!$22.get(editParseResult).ok)
-                      $$render(consequent_10);
+                  $23.if(node_21, ($$render) => {
+                    if (!$23.get(editParseResult).ok)
+                      $$render(consequent_11);
                   });
                 }
-                var div_15 = $22.sibling(node_20, 2);
-                var node_21 = $22.child(div_15);
+                var div_16 = $23.sibling(node_21, 2);
+                var node_22 = $23.child(div_16);
                 {
-                  let $0 = $22.derived(() => !$22.get(canConfirmEditedApproval));
-                  Button(node_21, {
+                  let $0 = $23.derived(() => !$23.get(canConfirmEditedApproval));
+                  Button(node_22, {
                     type: "button",
                     variant: "primary",
                     onclick: handleApproveWithEdits,
                     get disabled() {
-                      return $22.get($0);
+                      return $23.get($0);
                     },
                     children: ($$anchor5, $$slotProps2) => {
-                      $22.next();
-                      var text_21 = $22.text("Confirm edited approval");
-                      $22.append($$anchor5, text_21);
+                      $23.next();
+                      var text_21 = $23.text("Confirm edited approval");
+                      $23.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");
+                $23.reset(div_16);
+                $23.reset(div_15);
+                $23.template_effect(() => {
+                  $23.set_attribute(label_2, "for", `${$23.get(rootId)}-edited-arguments`);
+                  $23.set_attribute(p_6, "id", $23.get(editDescriptionId));
+                  $23.set_attribute(textarea_1, "id", `${$23.get(rootId)}-edited-arguments`);
+                  $23.set_value(textarea_1, $23.get(editedArgumentsText));
+                  $23.set_attribute(textarea_1, "aria-describedby", $23.get(editParseResult).ok ? $23.get(editDescriptionId) : `${$23.get(editDescriptionId)} ${$23.get(editErrorId)}`);
+                  $23.set_attribute(textarea_1, "aria-invalid", $23.get(editParseResult).ok ? undefined : "true");
                 });
-                $22.delegated("input", textarea, handleEditedArgumentsInput);
-                $22.append($$anchor4, div_14);
+                $23.delegated("input", textarea_1, handleEditedArgumentsInput);
+                $23.append($$anchor4, div_15);
               };
-              $22.if(node_19, ($$render) => {
-                if ($22.get(editingArguments))
-                  $$render(consequent_11);
+              $23.if(node_20, ($$render) => {
+                if ($23.get(editingArguments))
+                  $$render(consequent_12);
               });
             }
-            $22.reset(section_5);
-            $22.append($$anchor3, section_5);
+            $23.reset(section_5);
+            $23.append($$anchor3, section_5);
           };
           var alternate_2 = ($$anchor3) => {
-            var p_7 = root_31();
-            $22.append($$anchor3, p_7);
+            var p_8 = root_322();
+            $23.append($$anchor3, p_8);
           };
-          $22.if(node_12, ($$render) => {
-            if ($22.get(isActionable))
-              $$render(consequent_12);
+          $23.if(node_12, ($$render) => {
+            if ($23.get(isActionable))
+              $$render(consequent_13);
             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);
+        $23.reset(div_3);
+        $23.template_effect(() => {
+          $23.set_text(text_6, $$props.policyVersion);
+          $23.set_text(text_7, $$props.idempotencyKey);
         });
-        $22.append($$anchor2, div_3);
+        $23.append($$anchor2, div_3);
       },
       $$slots: { header: true, default: true }
     });
   }
-  $22.reset(section);
-  $22.append($$anchor, section);
-  $22.pop();
+  $23.reset(section);
+  $23.append($$anchor, section);
+  $23.pop();
 }
-$22.delegate(["input"]);
+$23.delegate(["input", "change"]);
 
 // src/components/approval-card/index.ts
 var approval_card_default = Approval_card;
@@ -3791,4 +4015,4 @@ export {
   Approval_card as ApprovalCard
 };
 
-//# debugId=E5B580618418CC6864756E2164756E21
+//# debugId=1F5C4E5A1410FFA064756E2164756E21