@lostgradient/cinder 0.3.0 → 0.4.0

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

@@ -0,0 +1,2499 @@
+import { createRequire } from "node:module";
+var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+// src/components/approval-card/approval-card.svelte
+import * as $22 from "svelte/internal/server";
+import { onDestroy as onDestroy2 } from "svelte";
+
+// src/utilities/class-names.ts
+function classNames(...parts) {
+  return parts.filter((part) => typeof part === "string" && part.length > 0).join(" ");
+}
+
+// src/components/badge/badge.svelte
+import * as $ from "svelte/internal/server";
+function Badge($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const subscriptionStateConfigurations = {
+      active: { variant: "success", label: "Active" },
+      trialing: { variant: "info", label: "Trialing" },
+      "past-due": { variant: "warning", label: "Past due" },
+      canceled: { variant: "neutral", label: "Canceled" },
+      expired: { variant: "danger", label: "Expired" },
+      refunded: { variant: "neutral", label: "Refunded" }
+    };
+    const subscriptionStateIconPaths = {
+      active: ["M21.801 10A10 10 0 1 1 17 3.335", "m9 11 3 3L22 4"],
+      trialing: ["M12 6v6l4 2", "M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"],
+      "past-due": [
+        "m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z",
+        "M12 9v4",
+        "M12 17h.01"
+      ],
+      canceled: [
+        "M15 9 9 15",
+        "M9 9l6 6",
+        "M22 12A10 10 0 1 1 12 2a10 10 0 0 1 10 10Z"
+      ],
+      expired: [
+        "M8 2v4",
+        "M16 2v4",
+        "M21 13V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h8",
+        "M3 10h18",
+        "m17 14-5-5",
+        "m12 14 5 5"
+      ],
+      refunded: [
+        "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
+        "M3 3v5h5"
+      ]
+    };
+    let {
+      variant = "neutral",
+      size = "md",
+      mono = false,
+      subscriptionState,
+      class: customClassName,
+      children,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const subscriptionStateConfiguration = $.derived(() => subscriptionState === undefined ? undefined : subscriptionStateConfigurations[subscriptionState]);
+    const resolvedVariant = $.derived(() => subscriptionStateConfiguration()?.variant ?? variant);
+    const resolvedSubscriptionIconPaths = $.derived(() => subscriptionState === undefined ? undefined : subscriptionStateIconPaths[subscriptionState]);
+    $$renderer2.push(`<span${$.attributes({
+      class: $.clsx(classNames("cinder-badge", customClassName)),
+      "data-cinder-variant": resolvedVariant(),
+      "data-cinder-size": size,
+      "data-cinder-mono": mono ? "" : undefined,
+      "data-cinder-subscription-state": subscriptionState,
+      ...rest
+    })}>`);
+    if (subscriptionStateConfiguration()) {
+      $$renderer2.push("<!--[0-->");
+      if (resolvedSubscriptionIconPaths()) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<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"><!--[-->`);
+        const each_array = $.ensure_array_like(resolvedSubscriptionIconPaths());
+        for (let $$index = 0, $$length = each_array.length;$$index < $$length; $$index++) {
+          let iconPath = each_array[$$index];
+          $$renderer2.push(`<path${$.attr("d", iconPath)}></path>`);
+        }
+        $$renderer2.push(`<!--]--></svg>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--> `);
+      if (children) {
+        $$renderer2.push("<!--[0-->");
+        children($$renderer2);
+        $$renderer2.push(`<!---->`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+        $$renderer2.push(`${$.escape(subscriptionStateConfiguration().label)}`);
+      }
+      $$renderer2.push(`<!--]-->`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+      children?.($$renderer2);
+      $$renderer2.push(`<!---->`);
+    }
+    $$renderer2.push(`<!--]--></span>`);
+  });
+}
+
+// src/components/button/button.svelte
+import * as $2 from "svelte/internal/server";
+
+// ../../node_modules/esm-env/false.js
+var false_default = false;
+// ../../node_modules/esm-env/true.js
+var true_default = true;
+// src/utilities/dev-warn.ts
+function devWarn(message, ...args) {
+  if (!true_default)
+    return;
+  console.warn(message, ...args);
+}
+
+// src/components/button/button.svelte
+function Button($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const {
+      variant = "secondary",
+      size = "md",
+      fullWidth = false,
+      loading = false,
+      iconOnly = false,
+      leadingIcon,
+      trailingIcon,
+      children,
+      label,
+      class: customClassName,
+      href,
+      onclick: consumerOnClick,
+      "aria-disabled": consumerAriaDisabled,
+      "aria-busy": consumerAriaBusy,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-expanded": ariaExpanded,
+      "aria-controls": ariaControls,
+      "aria-haspopup": ariaHaspopup,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const mergedClassName = $2.derived(() => classNames("cinder-button", customClassName));
+    const dataAttributes = $2.derived(() => ({
+      "data-cinder-variant": variant,
+      "data-cinder-size": size,
+      "data-cinder-full-width": fullWidth ? "" : undefined,
+      "data-cinder-loading": loading ? "" : undefined,
+      "data-cinder-icon-only": iconOnly ? "" : undefined
+    }));
+    const resolvedAriaDisabled = $2.derived(() => loading ? "true" : consumerAriaDisabled);
+    const resolvedAriaBusy = $2.derived(() => loading ? "true" : consumerAriaBusy);
+    const resolvedAriaLabel = $2.derived(() => typeof ariaLabel === "string" && ariaLabel.trim().length > 0 ? ariaLabel : undefined);
+    const resolvedAriaLabelledBy = $2.derived(() => typeof ariaLabelledBy === "string" && ariaLabelledBy.trim().length > 0 ? ariaLabelledBy : undefined);
+    const anchorAttributes = rest;
+    const buttonAttributes = rest;
+    const anchorTabIndex = $2.derived(() => rest.tabindex);
+    const buttonType = $2.derived(() => rest.type);
+    const buttonDisabled = $2.derived(() => rest.disabled ?? false);
+    function handleClick(event) {
+      if (loading) {
+        event.preventDefault();
+        return;
+      }
+      if (typeof consumerOnClick === "function") {
+        consumerOnClick(event);
+      }
+    }
+    function buttonContent($$renderer3) {
+      if (leadingIcon) {
+        $$renderer3.push("<!--[0-->");
+        $$renderer3.push(`<span class="cinder-button__icon" aria-hidden="true">`);
+        leadingIcon($$renderer3);
+        $$renderer3.push(`<!----></span>`);
+      } else {
+        $$renderer3.push("<!--[-1-->");
+      }
+      $$renderer3.push(`<!--]--> `);
+      if (iconOnly) {
+        $$renderer3.push("<!--[0-->");
+        if (!resolvedAriaLabel() && !resolvedAriaLabelledBy() && label) {
+          $$renderer3.push("<!--[0-->");
+          $$renderer3.push(`<span class="cinder-sr-only">${$2.escape(label)}</span>`);
+        } else {
+          $$renderer3.push("<!--[-1-->");
+        }
+        $$renderer3.push(`<!--]--> `);
+        if (children) {
+          $$renderer3.push("<!--[0-->");
+          $$renderer3.push(`<span class="cinder-button__icon" aria-hidden="true">`);
+          children($$renderer3);
+          $$renderer3.push(`<!----></span>`);
+        } else {
+          $$renderer3.push("<!--[-1-->");
+        }
+        $$renderer3.push(`<!--]-->`);
+      } else if (children) {
+        $$renderer3.push("<!--[1-->");
+        children($$renderer3);
+        $$renderer3.push(`<!---->`);
+      } else {
+        $$renderer3.push("<!--[-1-->");
+        $$renderer3.push(`${$2.escape(label)}`);
+      }
+      $$renderer3.push(`<!--]--> `);
+      if (trailingIcon) {
+        $$renderer3.push("<!--[0-->");
+        $$renderer3.push(`<span class="cinder-button__icon" aria-hidden="true">`);
+        trailingIcon($$renderer3);
+        $$renderer3.push(`<!----></span>`);
+      } else {
+        $$renderer3.push("<!--[-1-->");
+      }
+      $$renderer3.push(`<!--]-->`);
+    }
+    if (href !== undefined) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<a${$2.attributes({
+        ...anchorAttributes,
+        href: loading ? undefined : href,
+        tabindex: loading ? -1 : anchorTabIndex(),
+        class: $2.clsx(mergedClassName()),
+        ...dataAttributes(),
+        "aria-disabled": resolvedAriaDisabled(),
+        "aria-busy": resolvedAriaBusy(),
+        "aria-label": resolvedAriaLabel(),
+        "aria-labelledby": resolvedAriaLabelledBy(),
+        "aria-expanded": ariaExpanded,
+        "aria-controls": ariaControls,
+        "aria-haspopup": ariaHaspopup
+      })}>`);
+      buttonContent($$renderer2);
+      $$renderer2.push(`<!----></a>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+      $$renderer2.push(`<button${$2.attributes({
+        ...buttonAttributes,
+        type: buttonType() ?? "button",
+        class: $2.clsx(mergedClassName()),
+        ...dataAttributes(),
+        disabled: buttonDisabled() || loading,
+        "aria-disabled": resolvedAriaDisabled(),
+        "aria-busy": resolvedAriaBusy(),
+        "aria-label": resolvedAriaLabel(),
+        "aria-labelledby": resolvedAriaLabelledBy(),
+        "aria-expanded": ariaExpanded,
+        "aria-controls": ariaControls,
+        "aria-haspopup": ariaHaspopup
+      })}>`);
+      buttonContent($$renderer2);
+      $$renderer2.push(`<!----></button>`);
+    }
+    $$renderer2.push(`<!--]-->`);
+  });
+}
+
+// src/components/button-group/button-group.svelte
+import * as $4 from "svelte/internal/server";
+
+// src/utilities/use-mutation-observer.svelte.ts
+import * as $3 from "svelte/internal/server";
+function useMutationObserver(onMutate, options = {}) {
+  const {
+    childList,
+    attributes: attributes3,
+    characterData,
+    subtree,
+    attributeFilter,
+    attributeOldValue,
+    characterDataOldValue,
+    enabled = () => true
+  } = options;
+  const init = {};
+  if (childList !== undefined)
+    init.childList = childList;
+  if (attributes3 !== undefined)
+    init.attributes = attributes3;
+  if (characterData !== undefined)
+    init.characterData = characterData;
+  if (subtree !== undefined)
+    init.subtree = subtree;
+  if (attributeFilter !== undefined)
+    init.attributeFilter = attributeFilter;
+  if (attributeOldValue !== undefined)
+    init.attributeOldValue = attributeOldValue;
+  if (characterDataOldValue !== undefined)
+    init.characterDataOldValue = characterDataOldValue;
+  if (init.childList === undefined && init.attributes === undefined && init.characterData === undefined) {
+    init.childList = true;
+  }
+  return (node) => {
+    if (typeof MutationObserver === "undefined") {
+      return () => {};
+    }
+    let observer = null;
+    const disconnectObserver = () => {
+      observer?.disconnect();
+      observer = null;
+    };
+    return () => {
+      disconnectObserver();
+    };
+  };
+}
+
+// src/components/button-group/button-group.svelte
+var groupIdCounter = 0;
+function Button_group($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      label,
+      labelledBy,
+      orientation = "horizontal",
+      class: customClassName,
+      children,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const mergedClassName = $4.derived(() => classNames("cinder-button-group", customClassName));
+    const ariaLabelAttribute = $4.derived(() => typeof label === "string" ? label : undefined);
+    const ariaLabelledByAttribute = $4.derived(() => typeof labelledBy === "string" ? labelledBy : undefined);
+    const groupId = String(++groupIdCounter);
+    const tagDirectChildren = (element) => {
+      const ATTR = "data-cinder-button-group-item";
+      const tagged = new Set;
+      const sync = () => {
+        const currentChildren = new Set(Array.from(element.children));
+        for (const child of currentChildren) {
+          child.setAttribute(ATTR, groupId);
+          tagged.add(child);
+        }
+        for (const previouslyTagged of Array.from(tagged)) {
+          if (!currentChildren.has(previouslyTagged)) {
+            if (previouslyTagged.getAttribute(ATTR) === groupId) {
+              previouslyTagged.removeAttribute(ATTR);
+            }
+            tagged.delete(previouslyTagged);
+          }
+        }
+      };
+      sync();
+      const detachObserver = useMutationObserver(sync, { childList: true })(element);
+      return () => {
+        detachObserver?.();
+        for (const child of Array.from(tagged)) {
+          if (child.getAttribute(ATTR) === groupId) {
+            child.removeAttribute(ATTR);
+          }
+        }
+      };
+    };
+    $$renderer2.push(`<div${$4.attributes({
+      ...rest,
+      role: "group",
+      "aria-label": ariaLabelAttribute(),
+      "aria-labelledby": ariaLabelledByAttribute(),
+      class: $4.clsx(mergedClassName()),
+      "data-cinder-orientation": orientation
+    })}>`);
+    children($$renderer2);
+    $$renderer2.push(`<!----></div>`);
+  });
+}
+
+// src/components/card/card.svelte
+import * as $5 from "svelte/internal/server";
+function Card($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      class: className,
+      children,
+      header,
+      title,
+      headingLevel = 3,
+      description,
+      footer,
+      variant = "card",
+      bodyTone = "default",
+      footerTone = "default",
+      edgeToEdgeOnMobile = false,
+      padding = "default",
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    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${resolvedHeadingLevel()}`);
+    $$renderer2.push(`<div${$5.attributes({
+      class: $5.clsx(classNames("cinder-card", className)),
+      "data-cinder-variant": variant,
+      "data-cinder-edge-to-edge-mobile": edgeToEdgeOnMobile ? "" : undefined,
+      ...rest
+    })}>`);
+    if (header) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<div class="cinder-card__header">`);
+      header($$renderer2);
+      $$renderer2.push(`<!----></div>`);
+    } else if (title) {
+      $$renderer2.push("<!--[1-->");
+      $$renderer2.push(`<div class="cinder-card__header">`);
+      $5.element($$renderer2, titleTag(), () => {
+        $$renderer2.push(` class="cinder-card__title"`);
+      }, () => {
+        $$renderer2.push(`${$5.escape(title)}`);
+      });
+      $$renderer2.push(` `);
+      if (description) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<p class="cinder-card__description">${$5.escape(description)}</p>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></div>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> <div class="cinder-card__body"${$5.attr("data-cinder-tone", bodyTone)}${$5.attr("data-cinder-padding", padding)}>`);
+    children($$renderer2);
+    $$renderer2.push(`<!----></div> `);
+    if (footer) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<div class="cinder-card__footer"${$5.attr("data-cinder-tone", footerTone)}>`);
+      footer($$renderer2);
+      $$renderer2.push(`<!----></div>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--></div>`);
+  });
+}
+
+// src/components/code-block/code-block.svelte
+import * as $11 from "svelte/internal/server";
+
+// src/components/copy-button/copy-button.svelte
+import * as $10 from "svelte/internal/server";
+
+// ../../node_modules/lucide-svelte/dist/icons/check.svelte
+import * as $7 from "svelte/internal/server";
+
+// ../../node_modules/lucide-svelte/dist/Icon.svelte
+import * as $6 from "svelte/internal/server";
+
+// ../../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
+function Icon($$renderer, $$props) {
+  const $$sanitized_props = $6.sanitize_props($$props);
+  const $$restProps = $6.rest_props($$sanitized_props, [
+    "name",
+    "color",
+    "size",
+    "strokeWidth",
+    "absoluteStrokeWidth",
+    "iconNode"
+  ]);
+  $$renderer.component(($$renderer2) => {
+    let name = $6.fallback($$props["name"], undefined);
+    let color = $6.fallback($$props["color"], "currentColor");
+    let size = $6.fallback($$props["size"], 24);
+    let strokeWidth = $6.fallback($$props["strokeWidth"], 2);
+    let absoluteStrokeWidth = $6.fallback($$props["absoluteStrokeWidth"], false);
+    let iconNode = $6.fallback($$props["iconNode"], () => [], true);
+    const mergeClasses = (...classes) => classes.filter((className, index, array) => {
+      return Boolean(className) && array.indexOf(className) === index;
+    }).join(" ");
+    $$renderer2.push(`<svg${$6.attributes({
+      ...defaultAttributes_default,
+      ...$$restProps,
+      width: size,
+      height: size,
+      stroke: color,
+      "stroke-width": absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
+      class: $6.clsx(mergeClasses("lucide-icon", "lucide", name ? `lucide-${name}` : "", $$sanitized_props.class))
+    }, undefined, undefined, undefined, 3)}><!--[-->`);
+    const each_array = $6.ensure_array_like(iconNode);
+    for (let $$index = 0, $$length = each_array.length;$$index < $$length; $$index++) {
+      let [tag, attrs] = each_array[$$index];
+      $6.element($$renderer2, tag, () => {
+        $$renderer2.push(`${$6.attributes({ ...attrs }, undefined, undefined, undefined, 3)}`);
+      });
+    }
+    $$renderer2.push(`<!--]--><!--[-->`);
+    $6.slot($$renderer2, $$props, "default", {}, null);
+    $$renderer2.push(`<!--]--></svg>`);
+    $6.bind_props($$props, {
+      name,
+      color,
+      size,
+      strokeWidth,
+      absoluteStrokeWidth,
+      iconNode
+    });
+  });
+}
+
+// ../../node_modules/lucide-svelte/dist/icons/check.svelte
+function Check($$renderer, $$props) {
+  const $$sanitized_props = $7.sanitize_props($$props);
+  const iconNode = [["path", { d: "M20 6 9 17l-5-5" }]];
+  Icon($$renderer, $7.spread_props([
+    { name: "check" },
+    $$sanitized_props,
+    {
+      iconNode,
+      children: ($$renderer2) => {
+        $$renderer2.push(`<!--[-->`);
+        $7.slot($$renderer2, $$props, "default", {}, null);
+        $$renderer2.push(`<!--]-->`);
+      },
+      $$slots: { default: true }
+    }
+  ]));
+}
+// ../../node_modules/lucide-svelte/dist/icons/copy.svelte
+import * as $8 from "svelte/internal/server";
+function Copy($$renderer, $$props) {
+  const $$sanitized_props = $8.sanitize_props($$props);
+  const iconNode = [
+    [
+      "rect",
+      {
+        width: "14",
+        height: "14",
+        x: "8",
+        y: "8",
+        rx: "2",
+        ry: "2"
+      }
+    ],
+    [
+      "path",
+      {
+        d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"
+      }
+    ]
+  ];
+  Icon($$renderer, $8.spread_props([
+    { name: "copy" },
+    $$sanitized_props,
+    {
+      iconNode,
+      children: ($$renderer2) => {
+        $$renderer2.push(`<!--[-->`);
+        $8.slot($$renderer2, $$props, "default", {}, null);
+        $$renderer2.push(`<!--]-->`);
+      },
+      $$slots: { default: true }
+    }
+  ]));
+}
+// src/utilities/clipboard.ts
+async function copyToClipboard(text) {
+  if (typeof navigator !== "undefined" && navigator.clipboard?.writeText) {
+    try {
+      await navigator.clipboard.writeText(text);
+      return true;
+    } catch {}
+  }
+  return legacyCopy(text);
+}
+function legacyCopy(text) {
+  if (typeof document === "undefined")
+    return false;
+  const textarea = document.createElement("textarea");
+  textarea.value = text;
+  textarea.setAttribute("readonly", "");
+  textarea.setAttribute("aria-hidden", "true");
+  textarea.setAttribute("tabindex", "-1");
+  textarea.style.position = "absolute";
+  textarea.style.left = "-9999px";
+  document.body.appendChild(textarea);
+  textarea.select();
+  let succeeded = false;
+  try {
+    succeeded = document.execCommand("copy");
+  } catch {
+    succeeded = false;
+  }
+  textarea.remove();
+  return succeeded;
+}
+
+// src/components/_visually-hidden-live-region.svelte
+import * as $9 from "svelte/internal/server";
+function _visually_hidden_live_region($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      message = "",
+      announcementSequence = 0,
+      priority = "polite",
+      class: className
+    } = $$props;
+    let rendered = "";
+    let setTimeoutId = null;
+    let version = 0;
+    let isDestroyed = false;
+    $$renderer2.push(`<div${$9.attr("role", priority === "assertive" ? "alert" : "status")}${$9.attr("aria-live", priority === "assertive" ? "assertive" : "polite")} aria-atomic="true"${$9.attr_class($9.clsx(classNames("cinder-sr-only", className)))}>${$9.escape(rendered)}</div>`);
+  });
+}
+
+// src/components/copy-button/copy-button.svelte
+function Copy_button($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      value,
+      confirmDuration = 1500,
+      label,
+      copiedLabel,
+      iconOnly = false,
+      class: className,
+      children,
+      confirmation,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    let copied = false;
+    let resetTimer;
+    const copiedAnnouncement = $10.derived(() => copied ? copiedLabel ?? "Copied" : "");
+    async function handleClick() {
+      const ok = await copyToClipboard(value);
+      if (!ok)
+        return;
+      copied = true;
+      if (resetTimer)
+        clearTimeout(resetTimer);
+      resetTimer = setTimeout(() => {
+        copied = false;
+      }, confirmDuration);
+    }
+    $$renderer2.push(`<button${$10.attributes({
+      ...rest,
+      type: "button",
+      "data-cinder-copied": copied || undefined,
+      "aria-label": label ?? "Copy to clipboard",
+      class: $10.clsx(classNames("cinder-copy-button", className))
+    })}>`);
+    if (copied && confirmation) {
+      $$renderer2.push("<!--[0-->");
+      confirmation($$renderer2);
+      $$renderer2.push(`<!---->`);
+    } else if (copied && iconOnly) {
+      $$renderer2.push("<!--[1-->");
+      Check($$renderer2, { class: "icon-sm", "aria-hidden": "true" });
+    } else if (copied) {
+      $$renderer2.push("<!--[2-->");
+      $$renderer2.push(`Copied`);
+    } else if (children) {
+      $$renderer2.push("<!--[3-->");
+      children($$renderer2);
+      $$renderer2.push(`<!---->`);
+    } else if (iconOnly) {
+      $$renderer2.push("<!--[4-->");
+      Copy($$renderer2, { class: "icon-sm", "aria-hidden": "true" });
+    } else {
+      $$renderer2.push("<!--[-1-->");
+      $$renderer2.push(`Copy`);
+    }
+    $$renderer2.push(`<!--]--></button> `);
+    _visually_hidden_live_region($$renderer2, { message: copiedAnnouncement() });
+    $$renderer2.push(`<!---->`);
+  });
+}
+
+// src/components/code-block/code-block.svelte
+function Code_block($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      code,
+      language,
+      highlight,
+      highlighter,
+      copyable = false,
+      class: className
+    } = $$props;
+    let highlighted = null;
+    function failed($$renderer3) {
+      $$renderer3.push(`<pre class="cinder-code-block__pre"><code class="cinder-code-block__code">${$11.escape(code)}</code></pre>`);
+    }
+    $$renderer2.push(`<div${$11.attr_class($11.clsx(classNames("cinder-code-block", className)))}>`);
+    if (language || copyable) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<header class="cinder-code-block__header">`);
+      if (language) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<span class="cinder-code-block__language">${$11.escape(language)}</span>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--> `);
+      if (copyable) {
+        $$renderer2.push("<!--[0-->");
+        Copy_button($$renderer2, {
+          value: code,
+          class: "cinder-code-block__copy",
+          label: "Copy code",
+          copiedLabel: "Code copied",
+          iconOnly: true
+        });
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></header>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> <div class="cinder-code-block__viewport" tabindex="0">`);
+    $$renderer2.boundary({ failed }, ($$renderer3) => {
+      $$renderer3.push(`<!--[-->`);
+      {
+        if (highlighted !== null) {
+          $$renderer3.push("<!--[0-->");
+          $$renderer3.push(`<div class="cinder-code-block__highlighted">${$11.html(highlighted)}</div>`);
+        } else {
+          $$renderer3.push("<!--[-1-->");
+          $$renderer3.push(`<pre class="cinder-code-block__pre"><code class="cinder-code-block__code">${$11.escape(code)}</code></pre>`);
+        }
+        $$renderer3.push(`<!--]-->`);
+      }
+      $$renderer3.push(`<!--]-->`);
+    });
+    $$renderer2.push(`</div></div>`);
+  });
+}
+
+// src/components/payload-inspector/payload-inspector.svelte
+import * as $19 from "svelte/internal/server";
+
+// src/components/description-list/description-list.svelte
+import * as $12 from "svelte/internal/server";
+function Description_list($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      items,
+      variant = "default",
+      class: className,
+      actions,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const duplicateKey = $12.derived(() => {
+      const seen = new Set;
+      for (const item of items) {
+        const key = item.id ?? item.term;
+        if (seen.has(key))
+          return key;
+        seen.add(key);
+      }
+      return;
+    });
+    let lastWarnedDuplicateKey;
+    $$renderer2.push(`<dl${$12.attributes({
+      ...rest,
+      class: $12.clsx(classNames("cinder-description-list", className)),
+      "data-cinder-variant": variant
+    })}><!--[-->`);
+    const each_array = $12.ensure_array_like(items);
+    for (let $$index = 0, $$length = each_array.length;$$index < $$length; $$index++) {
+      let item = each_array[$$index];
+      $$renderer2.push(`<div class="cinder-description-list__row"><dt${$12.attr_class($12.clsx(variant === "narrow" ? "cinder-sr-only" : undefined))}>${$12.escape(item.term)}</dt> <dd><div class="cinder-description-list__definition">${$12.escape(item.definition)}</div> `);
+      if (actions) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<div class="cinder-description-list__actions">`);
+        actions($$renderer2, item);
+        $$renderer2.push(`<!----></div>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></dd></div>`);
+    }
+    $$renderer2.push(`<!--]--></dl>`);
+  });
+}
+
+// src/components/json-viewer/json-viewer.svelte
+import * as $14 from "svelte/internal/server";
+
+// src/components/json-viewer/_json-viewer-node.svelte
+import * as $13 from "svelte/internal/server";
+import { untrack } from "svelte";
+function _json_viewer_node($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      value,
+      keyName,
+      depth,
+      initialDepth,
+      maxDepth,
+      position,
+      setSize,
+      root = false
+    } = $$props;
+    const isObject = $13.derived(() => value !== null && typeof value === "object");
+    const isArray = $13.derived(() => Array.isArray(value));
+    const tooDeep = $13.derived(() => depth >= maxDepth);
+    let collapsed = untrack(() => depth >= initialDepth);
+    const entries = $13.derived(() => {
+      if (!isObject() || tooDeep())
+        return [];
+      if (isArray()) {
+        return value.map((item, i) => [i, item]);
+      }
+      return Object.entries(value);
+    });
+    const itemCount = $13.derived(() => entries().length);
+    const collectionLabel = $13.derived(() => `${isArray() ? "array" : "object"}, ${itemCount()} ${itemCount() === 1 ? "item" : "items"}`);
+    const toggleLabel = $13.derived(() => keyName === undefined ? collectionLabel() : `${keyName}: ${collectionLabel()}`);
+    function valueClass(v) {
+      if (v === null)
+        return "null";
+      if (typeof v === "string")
+        return "string";
+      if (typeof v === "number")
+        return "number";
+      if (typeof v === "boolean")
+        return "boolean";
+      return "unknown";
+    }
+    if (isObject() && !tooDeep()) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<span${$13.attr_class($13.clsx(classNames("cinder-json-viewer__node")))} role="treeitem"${$13.attr("aria-expanded", !collapsed)}${$13.attr("aria-label", toggleLabel())}${$13.attr("aria-level", depth + 1)}${$13.attr("aria-posinset", position)}${$13.attr("aria-setsize", setSize)}${$13.attr("tabindex", root ? 0 : -1)}><button type="button" class="cinder-json-viewer__toggle"${$13.attr("aria-label", toggleLabel())} tabindex="-1">`);
+      if (keyName !== undefined) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<span class="cinder-json-viewer__key">${$13.escape(keyName)}:</span>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--> <span class="cinder-json-viewer__caret"${$13.attr("data-cinder-collapsed", collapsed || undefined)}></span> <span class="cinder-json-viewer__brace">${$13.escape(isArray() ? "[" : "{")}</span> `);
+      if (collapsed) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<span class="cinder-json-viewer__summary">${$13.escape(itemCount())} ${$13.escape(itemCount() === 1 ? "item" : "items")}</span> <span class="cinder-json-viewer__brace">${$13.escape(isArray() ? "]" : "}")}</span>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></button> `);
+      if (!collapsed) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<ul class="cinder-json-viewer__children" role="group"><!--[-->`);
+        const each_array = $13.ensure_array_like(entries());
+        for (let index = 0, $$length = each_array.length;index < $$length; index++) {
+          let [k, v] = each_array[index];
+          $$renderer2.push(`<li role="none">`);
+          _json_viewer_node($$renderer2, {
+            value: v,
+            keyName: k,
+            depth: depth + 1,
+            initialDepth,
+            maxDepth,
+            position: index + 1,
+            setSize: entries().length
+          });
+          $$renderer2.push(`<!----></li>`);
+        }
+        $$renderer2.push(`<!--]--></ul> <span class="cinder-json-viewer__brace">${$13.escape(isArray() ? "]" : "}")}</span>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--></span>`);
+    } else if (isObject() && tooDeep()) {
+      $$renderer2.push("<!--[1-->");
+      $$renderer2.push(`<span class="cinder-json-viewer__node" role="treeitem"${$13.attr("tabindex", root ? 0 : -1)}${$13.attr("aria-level", depth + 1)}${$13.attr("aria-posinset", position)}${$13.attr("aria-setsize", setSize)}>`);
+      if (keyName !== undefined) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<span class="cinder-json-viewer__key">${$13.escape(keyName)}:</span>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--> <span class="cinder-json-viewer__too-deep">…</span></span>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+      $$renderer2.push(`<span class="cinder-json-viewer__node" role="treeitem"${$13.attr("tabindex", root ? 0 : -1)}${$13.attr("aria-level", depth + 1)}${$13.attr("aria-posinset", position)}${$13.attr("aria-setsize", setSize)}>`);
+      if (keyName !== undefined) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<span class="cinder-json-viewer__key">${$13.escape(keyName)}:</span>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+      }
+      $$renderer2.push(`<!--]--> <span class="cinder-json-viewer__value"${$13.attr("data-cinder-type", valueClass(value))}>`);
+      if (typeof value === "string") {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`"${$13.escape(value)}"`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+        $$renderer2.push(`${$13.escape(String(value))}`);
+      }
+      $$renderer2.push(`<!--]--></span></span>`);
+    }
+    $$renderer2.push(`<!--]-->`);
+  });
+}
+
+// src/components/json-viewer/json-viewer.svelte
+function Json_viewer($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      value,
+      initialDepth = 1,
+      maxDepth = 50,
+      maxBytes = 1048576,
+      class: className
+    } = $$props;
+    const serialized = $14.derived(() => {
+      try {
+        const json = JSON.stringify(value);
+        if (typeof json !== "string")
+          return { ok: false };
+        return { ok: true, size: new Blob([json]).size };
+      } catch {
+        return { ok: false };
+      }
+    });
+    const unserializable = $14.derived(() => !serialized().ok);
+    const tooLarge = $14.derived(() => serialized().ok && serialized().size > maxBytes);
+    function handleTreeKeydown(event) {
+      const tree = event.currentTarget;
+      const items = Array.from(tree.querySelectorAll('[role="treeitem"]'));
+      const eventTarget = event.target instanceof HTMLElement ? event.target : null;
+      const current = eventTarget?.closest('[role="treeitem"]') ?? null;
+      const targetIsToggle = eventTarget?.closest(".cinder-json-viewer__toggle") !== null;
+      const currentIndex = current ? items.indexOf(current) : -1;
+      function focusItem(index) {
+        const item = items[index];
+        item?.focus();
+      }
+      if (event.key === "ArrowDown") {
+        event.preventDefault();
+        focusItem(Math.min(currentIndex + 1, items.length - 1));
+      } else if (event.key === "ArrowUp") {
+        event.preventDefault();
+        focusItem(Math.max(currentIndex - 1, 0));
+      } else if (event.key === "Home") {
+        event.preventDefault();
+        focusItem(0);
+      } else if (event.key === "End") {
+        event.preventDefault();
+        focusItem(items.length - 1);
+      } else if (event.key === "ArrowRight" && current && !targetIsToggle) {
+        if (current.getAttribute("aria-expanded") === "false") {
+          event.preventDefault();
+          current.querySelector(".cinder-json-viewer__toggle")?.click();
+        } else if (current.getAttribute("aria-expanded") === "true") {
+          const firstChild = current.querySelector('.cinder-json-viewer__children [role="treeitem"]');
+          if (firstChild) {
+            event.preventDefault();
+            firstChild.focus();
+          }
+        }
+      } else if (event.key === "ArrowLeft" && current && !targetIsToggle) {
+        if (current.getAttribute("aria-expanded") === "true") {
+          event.preventDefault();
+          current.querySelector(".cinder-json-viewer__toggle")?.click();
+        } else {
+          const parent = current.parentElement?.closest('[role="treeitem"]');
+          if (parent) {
+            event.preventDefault();
+            parent.focus();
+          }
+        }
+      } else if ((event.key === "Enter" || event.key === " " || event.key === "Spacebar") && current && !targetIsToggle) {
+        event.preventDefault();
+        const toggle = current.querySelector(".cinder-json-viewer__toggle");
+        toggle?.click();
+      }
+    }
+    $$renderer2.push(`<div${$14.attr_class($14.clsx(classNames("cinder-json-viewer", className)))}>`);
+    if (unserializable()) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<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>`);
+    } else if (tooLarge()) {
+      $$renderer2.push("<!--[1-->");
+      $$renderer2.push(`<div class="cinder-json-viewer__fallback" role="status"><p>Payload too large to render (~${$14.escape(Math.round((serialized().ok ? serialized().size : 0) / 1024))} KB; cap
+        is ${$14.escape(Math.round(maxBytes / 1024))} KB).</p> <p>Use the consumer's download or copy action to inspect the raw JSON.</p></div>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+      $$renderer2.push(`<div role="tree" aria-label="JSON tree" tabindex="-1">`);
+      _json_viewer_node($$renderer2, {
+        value,
+        depth: 0,
+        initialDepth,
+        maxDepth,
+        position: 1,
+        setSize: 1,
+        root: true
+      });
+      $$renderer2.push(`<!----></div>`);
+    }
+    $$renderer2.push(`<!--]--></div>`);
+  });
+}
+
+// src/components/tabs/tabs.svelte
+import * as $15 from "svelte/internal/server";
+
+// src/components/tabs/tabs-context.ts
+import { createContext } from "svelte";
+var [getTabsContextStrict, setTabsContext] = createContext();
+var getTabsContext = getTabsContextStrict;
+
+// src/utilities/roving-tabindex.ts
+var ROVING_KEYS = new Set(["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"]);
+function isRovingKey(key) {
+  return ROVING_KEYS.has(key);
+}
+function findNextIndex(currentIndex, length, direction, isDisabled) {
+  if (length === 0)
+    return -1;
+  if (!isDisabled) {
+    return (currentIndex + direction + length) % length;
+  }
+  for (let offset = 1;offset <= length; offset += 1) {
+    const candidateIndex = (currentIndex + offset * direction + length * offset) % length;
+    if (!isDisabled(candidateIndex)) {
+      return candidateIndex;
+    }
+  }
+  return currentIndex;
+}
+function findFirstIndex(length, isDisabled, currentIndex = 0) {
+  if (length === 0)
+    return -1;
+  if (!isDisabled)
+    return 0;
+  for (let index = 0;index < length; index += 1) {
+    if (!isDisabled(index))
+      return index;
+  }
+  return currentIndex;
+}
+function findLastIndex(length, isDisabled, currentIndex = 0) {
+  if (length === 0)
+    return -1;
+  if (!isDisabled)
+    return length - 1;
+  for (let index = length - 1;index >= 0; index -= 1) {
+    if (!isDisabled(index))
+      return index;
+  }
+  return currentIndex;
+}
+function handleRovingKeydown(event, currentIndex, length, options = {}) {
+  const { isDisabled, vertical = true, horizontal = true } = options;
+  if (length === 0)
+    return null;
+  switch (event.key) {
+    case "ArrowRight":
+      return horizontal ? findNextIndex(currentIndex, length, 1, isDisabled) : null;
+    case "ArrowDown":
+      return vertical ? findNextIndex(currentIndex, length, 1, isDisabled) : null;
+    case "ArrowLeft":
+      return horizontal ? findNextIndex(currentIndex, length, -1, isDisabled) : null;
+    case "ArrowUp":
+      return vertical ? findNextIndex(currentIndex, length, -1, isDisabled) : null;
+    case "Home":
+      return findFirstIndex(length, isDisabled, currentIndex);
+    case "End":
+      return findLastIndex(length, isDisabled, currentIndex);
+    default:
+      return null;
+  }
+}
+function getFocusableIndex(selectedIndex, length, isDisabled) {
+  if (length === 0)
+    return -1;
+  if (selectedIndex >= 0 && selectedIndex < length)
+    return selectedIndex;
+  return findFirstIndex(length, isDisabled, 0);
+}
+
+// src/utilities/value-change.ts
+function commitValue(proposed, onValueChange, setValue) {
+  const committed = onValueChange?.(proposed) ?? proposed;
+  setValue(committed);
+  return committed;
+}
+
+// src/components/tabs/tabs.svelte
+function Tabs($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const baseId = $15.props_id($$renderer2);
+    let {
+      value = "",
+      onValueChange,
+      orientation = "horizontal",
+      activateOnFocus,
+      class: className,
+      children
+    } = $$props;
+    const effectiveActivateOnFocus = $15.derived(() => activateOnFocus ?? orientation === "horizontal");
+    const buttons = new Map;
+    let version = 0;
+    const focusableValue = $15.derived(() => {
+      for (const [registeredValue, entry] of buttons) {
+        if (!entry.disabled)
+          return registeredValue;
+      }
+      return;
+    });
+    function focusValue(target) {
+      const entry = buttons.get(target);
+      if (entry)
+        entry.button.focus();
+    }
+    function resolveFocusedIndex(active) {
+      const entries = [...buttons.values()];
+      return entries.findIndex(({ button }) => button === active);
+    }
+    function readActiveElement(event) {
+      const target = event.target instanceof HTMLElement ? event.target : null;
+      if (target) {
+        for (const { button } of buttons.values()) {
+          if (button === target)
+            return target;
+        }
+      }
+      const currentTarget = event.currentTarget instanceof HTMLElement ? event.currentTarget : null;
+      return currentTarget?.ownerDocument.activeElement ?? null;
+    }
+    function resolveStartingIndex(event) {
+      const entries = [...buttons.values()];
+      if (entries.length === 0)
+        return -1;
+      const focused = resolveFocusedIndex(readActiveElement(event));
+      if (focused !== -1)
+        return focused;
+      const order = [...buttons.keys()];
+      const activeIdx = order.indexOf(value);
+      if (activeIdx !== -1 && !entries[activeIdx]?.disabled)
+        return activeIdx;
+      return entries.findIndex((entry) => !entry.disabled);
+    }
+    function isOrientedKey(key, isHorizontal) {
+      if (!isRovingKey(key))
+        return false;
+      if (key === "Home" || key === "End")
+        return true;
+      if (isHorizontal)
+        return key === "ArrowLeft" || key === "ArrowRight";
+      return key === "ArrowUp" || key === "ArrowDown";
+    }
+    function handleKeydown(event) {
+      const entries = [...buttons.values()];
+      const order = [...buttons.keys()];
+      if (event.key === "Enter" || event.key === " ") {
+        const focused = resolveFocusedIndex(readActiveElement(event));
+        if (focused === -1)
+          return;
+        if (entries[focused]?.disabled !== false)
+          return;
+        const focusedValue = order[focused];
+        if (focusedValue === undefined)
+          return;
+        event.preventDefault();
+        commitValue(focusedValue, onValueChange, (next) => {
+          value = next;
+        });
+        return;
+      }
+      const isHorizontal = orientation === "horizontal";
+      if (!isOrientedKey(event.key, isHorizontal))
+        return;
+      if (entries.length === 0)
+        return;
+      const currentIndex = resolveStartingIndex(event);
+      if (currentIndex === -1) {
+        event.preventDefault();
+        return;
+      }
+      const nextIdx = handleRovingKeydown(event, currentIndex, entries.length, {
+        isDisabled: (i) => entries[i]?.disabled ?? false,
+        horizontal: isHorizontal,
+        vertical: !isHorizontal
+      });
+      if (nextIdx === null)
+        return;
+      event.preventDefault();
+      if (nextIdx === currentIndex)
+        return;
+      const nextValue = order[nextIdx];
+      if (nextValue === undefined)
+        return;
+      focusValue(nextValue);
+      if (effectiveActivateOnFocus()) {
+        commitValue(nextValue, onValueChange, (next) => {
+          value = next;
+        });
+      }
+    }
+    setTabsContext({
+      get value() {
+        return value;
+      },
+      get orientation() {
+        return orientation;
+      },
+      get activateOnFocus() {
+        return effectiveActivateOnFocus();
+      },
+      get baseId() {
+        return baseId;
+      },
+      select(next) {
+        commitValue(next, onValueChange, (nextValue) => {
+          value = nextValue;
+        });
+      },
+      isActive(candidate) {
+        return value === candidate;
+      },
+      register(target, button, disabled = false) {
+        const existing = buttons.get(target);
+        if (existing) {
+          existing.button = button;
+          existing.disabled = disabled;
+        } else {
+          buttons.set(target, { button, disabled });
+        }
+        version += 1;
+      },
+      unregister(target) {
+        if (buttons.delete(target)) {
+          version += 1;
+        }
+      },
+      setDisabled(target, disabled) {
+        const existing = buttons.get(target);
+        if (!existing)
+          return;
+        if (existing.disabled === disabled)
+          return;
+        existing.disabled = disabled;
+        version += 1;
+      },
+      isFocusable(candidate) {
+        const selectedEntry = buttons.get(value);
+        const selectedIsEnabled = selectedEntry !== undefined && !selectedEntry.disabled;
+        const entry = buttons.get(candidate);
+        if (!entry || entry.disabled)
+          return false;
+        if (selectedIsEnabled)
+          return value === candidate;
+        return focusableValue() === candidate;
+      },
+      handleKeydown
+    });
+    $$renderer2.push(`<div${$15.attr_class($15.clsx(classNames("cinder-tabs", className)))}${$15.attr("data-cinder-orientation", orientation)}>`);
+    children($$renderer2);
+    $$renderer2.push(`<!----></div>`);
+    $15.bind_props($$props, { value });
+  });
+}
+
+// src/components/tab-list/tab-list.svelte
+import * as $16 from "svelte/internal/server";
+function Tab_list($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let { label, labelledBy, class: className, children } = $$props;
+    const tabs = getTabsContext();
+    $$renderer2.push(`<div role="tablist"${$16.attr_class($16.clsx(classNames("cinder-tab-list", className)))}${$16.attr("data-cinder-orientation", tabs.orientation)}${$16.attr("aria-label", label)}${$16.attr("aria-labelledby", labelledBy)}${$16.attr("aria-orientation", tabs.orientation)}>`);
+    children($$renderer2);
+    $$renderer2.push(`<!----></div>`);
+  });
+}
+
+// src/components/tab/tab.svelte
+import * as $17 from "svelte/internal/server";
+import { untrack as untrack2 } from "svelte";
+
+// src/_internal/collection.ts
+function createSingleSelection(getValue, setValue) {
+  return {
+    get value() {
+      return getValue();
+    },
+    select(next) {
+      setValue(next);
+    },
+    isSelected(candidate) {
+      return getValue() === candidate;
+    }
+  };
+}
+function createMultiSelection(getValues, setValues) {
+  return {
+    get values() {
+      return getValues();
+    },
+    toggle(item) {
+      const current = getValues();
+      const index = current.indexOf(item);
+      if (index === -1) {
+        setValues([...current, item]);
+      } else {
+        setValues(current.filter((existing) => existing !== item));
+      }
+    },
+    isSelected(candidate) {
+      return getValues().includes(candidate);
+    }
+  };
+}
+function rovingTabIndex(isActive) {
+  return isActive ? 0 : -1;
+}
+
+// src/components/tab/tab.svelte
+function Tab($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      value,
+      id,
+      disabled = false,
+      class: className,
+      children,
+      trailing
+    } = $$props;
+    const tabs = getTabsContext();
+    const tabId = $17.derived(() => id ?? `${tabs.baseId}-tab-${value}`);
+    const panelId = $17.derived(() => `${tabs.baseId}-panel-${value}`);
+    const isActive = $17.derived(() => tabs.isActive(value));
+    const isFocusable = $17.derived(() => tabs.isFocusable(value));
+    let buttonElement = undefined;
+    const registeredValue = untrack2(() => value);
+    function handleClick() {
+      if (disabled)
+        return;
+      tabs.select(value);
+    }
+    $$renderer2.push(`<button type="button" role="tab"${$17.attr("id", tabId())}${$17.attr_class($17.clsx(classNames("cinder-tab", className)))}${$17.attr("data-cinder-value", value)}${$17.attr("data-cinder-active", isActive() ? "" : undefined)}${$17.attr("data-cinder-disabled", disabled || undefined)}${$17.attr("data-variant", tabs.orientation)}${$17.attr("aria-selected", isActive())}${$17.attr("aria-controls", panelId())}${$17.attr("tabindex", rovingTabIndex(isFocusable()))}${$17.attr("disabled", disabled, true)}>`);
+    children($$renderer2);
+    $$renderer2.push(`<!----> `);
+    if (trailing) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<span class="cinder-tab__trailing" aria-hidden="true">`);
+      trailing($$renderer2);
+      $$renderer2.push(`<!----></span>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--></button>`);
+  });
+}
+
+// src/components/tab-panel/tab-panel.svelte
+import * as $18 from "svelte/internal/server";
+function Tab_panel($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let { value, ariaLabelledby, class: className, children } = $$props;
+    const tabs = getTabsContext();
+    const isActive = $18.derived(() => tabs.isActive(value));
+    const panelId = $18.derived(() => `${tabs.baseId}-panel-${value}`);
+    const labelledBy = $18.derived(() => ariaLabelledby ?? `${tabs.baseId}-tab-${value}`);
+    if (isActive()) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<div${$18.attr("id", panelId())} role="tabpanel"${$18.attr_class($18.clsx(classNames("cinder-tab-panel", className)))}${$18.attr("data-cinder-value", value)}${$18.attr("aria-labelledby", labelledBy())} tabindex="0">`);
+      children($$renderer2);
+      $$renderer2.push(`<!----></div>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]-->`);
+  });
+}
+
+// src/components/payload-inspector/payload-inspector.svelte
+function Payload_inspector($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let {
+      value,
+      truncated = false,
+      maxBytes = 1048576,
+      meta,
+      format,
+      parse,
+      activeView = "summary",
+      label = "Payload inspector",
+      class: className,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    function shouldParseString(raw) {
+      const trimmed = raw.trim();
+      if (/^[{\["]/.test(trimmed))
+        return true;
+      return /^(?:true|false|null|-?(?:0|[1-9]\d*)(?:\.\d+)?(?:[eE][+-]?\d+)?)$/.test(trimmed);
+    }
+    const parseResult = $19.derived(() => {
+      if (typeof value !== "string") {
+        return { ok: true, parsed: value };
+      }
+      if (value.trim() === "") {
+        return { ok: true, parsed: null };
+      }
+      if (parse === undefined && !shouldParseString(value)) {
+        return { ok: true, parsed: value };
+      }
+      try {
+        const parser = parse ?? JSON.parse;
+        return { ok: true, parsed: parser(value) };
+      } catch (error) {
+        return {
+          ok: false,
+          error: error instanceof Error ? error.message : String(error)
+        };
+      }
+    });
+    const parsedValue = $19.derived(() => parseResult().ok ? parseResult().parsed : undefined);
+    const sizeResult = $19.derived(() => {
+      if (!parseResult().ok)
+        return { ok: false };
+      try {
+        const json = JSON.stringify(parsedValue());
+        if (typeof json !== "string")
+          return { ok: false };
+        return { ok: true, bytes: new Blob([json]).size };
+      } catch {
+        return { ok: false };
+      }
+    });
+    const byteLabel = $19.derived(() => {
+      if (!sizeResult().ok)
+        return "Unknown size";
+      const bytes = 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 (!parseResult().ok) {
+        return typeof value === "string" ? value : "";
+      }
+      try {
+        const formatter = format ?? ((v) => JSON.stringify(v, null, 2));
+        return formatter(parsedValue()) ?? "";
+      } catch {
+        return typeof value === "string" ? value : "";
+      }
+    });
+    const unserializable = $19.derived(() => {
+      if (typeof value === "string" || !parseResult().ok)
+        return false;
+      try {
+        JSON.stringify(parsedValue());
+        return false;
+      } catch {
+        return true;
+      }
+    });
+    const summaryItems = $19.derived(() => {
+      const items = [];
+      items.push({ term: "Size", definition: byteLabel() });
+      if (meta?.contentType) {
+        items.push({ term: "Content type", definition: meta.contentType });
+      }
+      if (meta?.source) {
+        items.push({ term: "Source", definition: meta.source });
+      }
+      if (meta?.timestamp) {
+        let displayTime = meta.timestamp;
+        try {
+          displayTime = new Date(meta.timestamp).toLocaleString();
+        } catch {}
+        items.push({ term: "Timestamp", definition: displayTime });
+      }
+      return items;
+    });
+    const valueKind = $19.derived(() => {
+      if (!parseResult().ok)
+        return "invalid";
+      const v = parsedValue();
+      if (v === null)
+        return "null";
+      if (v === undefined)
+        return "undefined";
+      if (typeof v === "boolean")
+        return "boolean";
+      if (typeof v === "number")
+        return "number";
+      if (typeof v === "string")
+        return "string";
+      if (Array.isArray(v))
+        return "array";
+      return "object";
+    });
+    const isPrimitive = $19.derived(() => valueKind() === "null" || valueKind() === "undefined" || valueKind() === "boolean" || valueKind() === "number" || valueKind() === "string");
+    const isEmpty = $19.derived(() => parsedValue() === undefined && value === undefined);
+    const copyRawText = $19.derived(() => {
+      if (typeof value === "string")
+        return value;
+      if (!parseResult().ok)
+        return "";
+      try {
+        return JSON.stringify(parsedValue()) ?? "";
+      } catch {
+        return "";
+      }
+    });
+    const copyFormattedText = $19.derived(() => {
+      if (!parseResult().ok)
+        return rawText();
+      try {
+        return JSON.stringify(parsedValue(), null, 2) ?? "";
+      } catch {
+        return rawText();
+      }
+    });
+    const canCopyFormatted = $19.derived(() => !isEmpty() && parseResult().ok && !unserializable());
+    const canCopyRaw = $19.derived(() => !isEmpty() && (typeof value === "string" || canCopyFormatted()));
+    function kindVariant(kind) {
+      if (kind === "invalid")
+        return "danger";
+      if (kind === "null" || kind === "undefined")
+        return "warning";
+      if (kind === "object" || kind === "array")
+        return "info";
+      return "neutral";
+    }
+    let $$settled = true;
+    let $$inner_renderer;
+    function $$render_inner($$renderer3) {
+      $$renderer3.push(`<section${$19.attributes({
+        ...rest,
+        class: $19.clsx(classNames("cinder-payload-inspector", className)),
+        "aria-label": label
+      })}><div class="cinder-payload-inspector__header"><span class="cinder-payload-inspector__label">${$19.escape(label)}</span> <div class="cinder-payload-inspector__header-actions">`);
+      if (sizeResult().ok) {
+        $$renderer3.push("<!--[0-->");
+        $$renderer3.push(`<span class="cinder-payload-inspector__size"${$19.attr("aria-label", `${byteLabel()} payload size`)}>${$19.escape(byteLabel())}</span>`);
+      } else {
+        $$renderer3.push("<!--[-1-->");
+      }
+      $$renderer3.push(`<!--]--> `);
+      if (truncated) {
+        $$renderer3.push("<!--[0-->");
+        Badge($$renderer3, {
+          variant: "warning",
+          size: "xs",
+          children: ($$renderer4) => {
+            $$renderer4.push(`<!---->Truncated`);
+          },
+          $$slots: { default: true }
+        });
+      } else {
+        $$renderer3.push("<!--[-1-->");
+      }
+      $$renderer3.push(`<!--]--> `);
+      if (canCopyFormatted()) {
+        $$renderer3.push("<!--[0-->");
+        Copy_button($$renderer3, {
+          value: copyFormattedText(),
+          label: "Copy formatted",
+          copiedLabel: "Formatted copied",
+          title: "Copy formatted payload",
+          iconOnly: true
+        });
+      } else {
+        $$renderer3.push("<!--[-1-->");
+      }
+      $$renderer3.push(`<!--]--> `);
+      if (canCopyRaw()) {
+        $$renderer3.push("<!--[0-->");
+        Copy_button($$renderer3, {
+          value: copyRawText(),
+          label: "Copy raw",
+          copiedLabel: "Raw copied",
+          title: "Copy raw payload",
+          iconOnly: true
+        });
+      } else {
+        $$renderer3.push("<!--[-1-->");
+      }
+      $$renderer3.push(`<!--]--></div></div> <div class="cinder-payload-inspector__tabs">`);
+      Tabs($$renderer3, {
+        get value() {
+          return activeView;
+        },
+        set value($$value) {
+          activeView = $$value;
+          $$settled = false;
+        },
+        children: ($$renderer4) => {
+          Tab_list($$renderer4, {
+            label: "Inspector views",
+            children: ($$renderer5) => {
+              Tab($$renderer5, {
+                value: "summary",
+                children: ($$renderer6) => {
+                  $$renderer6.push(`<!---->Summary`);
+                },
+                $$slots: { default: true }
+              });
+              $$renderer5.push(`<!----> `);
+              Tab($$renderer5, {
+                value: "tree",
+                children: ($$renderer6) => {
+                  $$renderer6.push(`<!---->Tree`);
+                },
+                $$slots: { default: true }
+              });
+              $$renderer5.push(`<!----> `);
+              Tab($$renderer5, {
+                value: "raw",
+                children: ($$renderer6) => {
+                  $$renderer6.push(`<!---->Raw`);
+                },
+                $$slots: { default: true }
+              });
+              $$renderer5.push(`<!---->`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer4.push(`<!----> `);
+          Tab_panel($$renderer4, {
+            value: "summary",
+            children: ($$renderer5) => {
+              $$renderer5.push(`<div class="cinder-payload-inspector__panel">`);
+              if (isEmpty()) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty()) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<div class="cinder-payload-inspector__summary"><div class="cinder-payload-inspector__summary-badges">`);
+                Badge($$renderer5, {
+                  variant: kindVariant(valueKind()),
+                  size: "xs",
+                  mono: true,
+                  children: ($$renderer6) => {
+                    $$renderer6.push(`<!---->${$19.escape(valueKind())}`);
+                  },
+                  $$slots: { default: true }
+                });
+                $$renderer5.push(`<!----> `);
+                if (truncated) {
+                  $$renderer5.push("<!--[0-->");
+                  Badge($$renderer5, {
+                    variant: "warning",
+                    size: "xs",
+                    children: ($$renderer6) => {
+                      $$renderer6.push(`<!---->Truncated`);
+                    },
+                    $$slots: { default: true }
+                  });
+                } else {
+                  $$renderer5.push("<!--[-1-->");
+                }
+                $$renderer5.push(`<!--]--></div> `);
+                if (summaryItems().length > 0) {
+                  $$renderer5.push("<!--[0-->");
+                  Description_list($$renderer5, { items: summaryItems(), variant: "two-column" });
+                } else {
+                  $$renderer5.push("<!--[-1-->");
+                }
+                $$renderer5.push(`<!--]--> `);
+                if (!parseResult().ok) {
+                  $$renderer5.push("<!--[0-->");
+                  $$renderer5.push(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning" role="alert">Parse error: ${$19.escape(parseResult().error)}</div>`);
+                } else {
+                  $$renderer5.push("<!--[-1-->");
+                }
+                $$renderer5.push(`<!--]--> `);
+                if (parseResult().ok && isPrimitive()) {
+                  $$renderer5.push("<!--[0-->");
+                  $$renderer5.push(`<div class="cinder-payload-inspector__summary-value"><span class="cinder-payload-inspector__summary-value-label">Value</span> <span class="cinder-payload-inspector__primitive">${$19.escape(String(parsedValue()))}</span></div>`);
+                } else {
+                  $$renderer5.push("<!--[-1-->");
+                }
+                $$renderer5.push(`<!--]--></div>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--></div>`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer4.push(`<!----> `);
+          Tab_panel($$renderer4, {
+            value: "tree",
+            children: ($$renderer5) => {
+              $$renderer5.push(`<div class="cinder-payload-inspector__panel">`);
+              if (isEmpty()) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty() && !parseResult().ok) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<div class="cinder-payload-inspector__notice cinder-payload-inspector__notice--warning" role="alert">Cannot render tree: ${$19.escape(parseResult().error)}</div>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty() && parseResult().ok && unserializable()) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<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>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty() && parseResult().ok && !unserializable()) {
+                $$renderer5.push("<!--[0-->");
+                Json_viewer($$renderer5, { value: parsedValue(), maxBytes });
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--></div>`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer4.push(`<!----> `);
+          Tab_panel($$renderer4, {
+            value: "raw",
+            children: ($$renderer5) => {
+              $$renderer5.push(`<div class="cinder-payload-inspector__panel cinder-payload-inspector__panel--code">`);
+              if (isEmpty()) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<div class="cinder-payload-inspector__empty" role="status">No payload</div>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty() && truncated) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<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>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty() && unserializable()) {
+                $$renderer5.push("<!--[0-->");
+                $$renderer5.push(`<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>`);
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--> `);
+              if (!isEmpty() && !unserializable()) {
+                $$renderer5.push("<!--[0-->");
+                Code_block($$renderer5, {
+                  code: rawText(),
+                  highlight: false,
+                  class: "cinder-payload-inspector__raw"
+                });
+              } else {
+                $$renderer5.push("<!--[-1-->");
+              }
+              $$renderer5.push(`<!--]--></div>`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer4.push(`<!---->`);
+        },
+        $$slots: { default: true }
+      });
+      $$renderer3.push(`<!----></div></section>`);
+    }
+    do {
+      $$settled = true;
+      $$inner_renderer = $$renderer2.copy();
+      $$render_inner($$inner_renderer);
+    } while (!$$settled);
+    $$renderer2.subsume($$inner_renderer);
+    $19.bind_props($$props, { activeView });
+  });
+}
+
+// src/components/secret-value-field/secret-value-field.svelte
+import * as $20 from "svelte/internal/server";
+import { onDestroy, untrack as untrack3 } from "svelte";
+function Secret_value_field($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const fieldId = $20.props_id($$renderer2);
+    let {
+      value,
+      prefix,
+      suffix,
+      label = "Secret value",
+      allowReveal = false,
+      initiallyRevealed = false,
+      confirmDuration = 1500,
+      copiedLabel = "Copied",
+      warning,
+      class: className,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    let revealed = untrack3(() => initiallyRevealed);
+    let previousValue = untrack3(() => value);
+    let copied = false;
+    let resetTimer;
+    const copiedAnnouncement = $20.derived(() => copied ? copiedLabel : "");
+    const MASK = "••••••••••••••••";
+    async function handleCopy() {
+      const ok = await copyToClipboard(value);
+      if (!ok)
+        return;
+      copied = true;
+      if (resetTimer)
+        clearTimeout(resetTimer);
+      resetTimer = setTimeout(() => {
+        copied = false;
+      }, confirmDuration);
+    }
+    function handleRevealToggle() {
+      if (!allowReveal)
+        return;
+      revealed = !revealed;
+    }
+    onDestroy(() => {
+      if (resetTimer)
+        clearTimeout(resetTimer);
+    });
+    $$renderer2.push(`<div${$20.attributes({
+      ...rest,
+      class: $20.clsx(classNames("cinder-secret-value-field", className)),
+      "data-cinder-copied": copied || undefined,
+      "data-cinder-revealed": revealed || undefined
+    })}><span${$20.attr("id", fieldId)} class="cinder-secret-value-field__label">${$20.escape(label)}</span> <div class="cinder-secret-value-field__row" role="group"${$20.attr("aria-labelledby", fieldId)}>`);
+    if (prefix) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<span class="cinder-secret-value-field__prefix" aria-hidden="true">${$20.escape(prefix)}</span>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> <span class="cinder-secret-value-field__value"${$20.attr("aria-label", revealed ? `${label}, revealed` : `${label}, masked`)}${$20.attr("data-cinder-masked", !revealed || undefined)}>${$20.escape(revealed ? value : MASK)}</span> `);
+    if (suffix) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<span class="cinder-secret-value-field__suffix" aria-hidden="true">${$20.escape(suffix)}</span>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> <div class="cinder-secret-value-field__actions">`);
+    if (allowReveal) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<button type="button" class="cinder-secret-value-field__toggle"${$20.attr("aria-pressed", revealed)}${$20.attr("aria-label", revealed ? `Hide ${label}` : `Reveal ${label}`)}>`);
+      if (revealed) {
+        $$renderer2.push("<!--[0-->");
+        $$renderer2.push(`<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>`);
+      } else {
+        $$renderer2.push("<!--[-1-->");
+        $$renderer2.push(`<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>`);
+      }
+      $$renderer2.push(`<!--]--></button>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> <button type="button" class="cinder-secret-value-field__copy"${$20.attr("aria-label", `Copy ${label}`)}${$20.attr("data-cinder-copied", copied || undefined)}>`);
+    if (copied) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<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>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+      $$renderer2.push(`<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>`);
+    }
+    $$renderer2.push(`<!--]--></button></div></div> `);
+    if (warning) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<div class="cinder-secret-value-field__warning">`);
+      warning($$renderer2);
+      $$renderer2.push(`<!----></div>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> `);
+    _visually_hidden_live_region($$renderer2, { message: copiedAnnouncement() });
+    $$renderer2.push(`<!----></div>`);
+  });
+}
+
+// src/components/status-dot/status-dot.svelte
+import * as $21 from "svelte/internal/server";
+function Status_dot($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const connectionStatusMap = {
+      connected: "online",
+      connecting: "warning",
+      disconnected: "offline",
+      error: "danger"
+    };
+    const connectionLabels = {
+      connected: "Connected",
+      connecting: "Connecting",
+      disconnected: "Disconnected",
+      error: "Error"
+    };
+    let {
+      status,
+      connectionState,
+      label,
+      live,
+      showLabel = true,
+      size = "md",
+      class: className,
+      "aria-label": ariaLabel,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const normalizedAriaLabel = $21.derived(() => ariaLabel?.trim() ? ariaLabel.trim() : undefined);
+    const resolvedStatus = $21.derived(() => status ?? (connectionState === undefined ? "neutral" : connectionStatusMap[connectionState]));
+    const resolvedLive = $21.derived(() => live ?? connectionState !== undefined);
+    const normalizedLabel = $21.derived(() => label?.trim() ? label.trim() : connectionState === undefined ? undefined : connectionLabels[connectionState]);
+    const hasVisibleLabel = $21.derived(() => showLabel && normalizedLabel() !== undefined);
+    const resolvedAriaLabel = $21.derived(() => normalizedAriaLabel() ?? normalizedLabel() ?? resolvedStatus());
+    const visibleLabelIsLiveDuplicate = $21.derived(() => resolvedLive() && normalizedLabel() !== undefined && resolvedAriaLabel() !== normalizedLabel());
+    const needsHiddenLiveLabel = $21.derived(() => resolvedLive() && (!hasVisibleLabel() || visibleLabelIsLiveDuplicate()));
+    $$renderer2.push(`<span${$21.attributes({
+      ...rest,
+      class: $21.clsx(classNames("cinder-status-dot", className)),
+      "data-cinder-status": resolvedStatus(),
+      "data-cinder-state": connectionState,
+      "data-cinder-size": size,
+      role: resolvedLive() ? "status" : "img",
+      "aria-live": resolvedLive() ? "polite" : undefined,
+      "aria-atomic": resolvedLive() ? "true" : undefined,
+      "aria-label": resolvedLive() ? undefined : resolvedAriaLabel()
+    })}><span class="cinder-status-dot__indicator" aria-hidden="true"></span> `);
+    if (hasVisibleLabel()) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<span class="cinder-status-dot__label"${$21.attr("aria-hidden", visibleLabelIsLiveDuplicate() ? "true" : undefined)}>${$21.escape(normalizedLabel())}</span>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--> `);
+    if (needsHiddenLiveLabel()) {
+      $$renderer2.push("<!--[0-->");
+      $$renderer2.push(`<span class="cinder-sr-only">${$21.escape(resolvedAriaLabel())}</span>`);
+    } else {
+      $$renderer2.push("<!--[-1-->");
+    }
+    $$renderer2.push(`<!--]--></span>`);
+  });
+}
+
+// src/components/approval-card/approval-card-state.ts
+function resolveEffectiveApprovalState(approvalState, expirationTimestamp, currentTime) {
+  if (approvalState !== "pending" || expirationTimestamp === undefined)
+    return approvalState;
+  return resolveComparisonTime(currentTime) >= expirationTimestamp ? "expired" : approvalState;
+}
+function isApprovalActionable(approvalState, expirationTimestamp, currentTime) {
+  if (approvalState !== "pending")
+    return false;
+  if (expirationTimestamp === undefined)
+    return true;
+  return resolveComparisonTime(currentTime) < expirationTimestamp;
+}
+function resolveComparisonTime(currentTime) {
+  return currentTime ?? Date.now();
+}
+
+// src/components/approval-card/approval-card.svelte
+function Approval_card($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    const generatedId = $22.props_id($$renderer2);
+    const ARGUMENTS_PREVIEW_MAX_CHARACTERS = 4096;
+    let {
+      tool,
+      sandbox,
+      operation,
+      env = [],
+      snapshotId,
+      policyVersion,
+      idempotencyKey,
+      expiresAt,
+      state: approvalState,
+      editableArgs = false,
+      onapprove,
+      onapprovewithedits,
+      ondeny,
+      onremember,
+      oncancel,
+      id,
+      class: customClassName,
+      $$slots,
+      $$events,
+      ...rest
+    } = $$props;
+    const rootId = $22.derived(() => id ?? generatedId);
+    const titleId = $22.derived(() => `${rootId()}-title`);
+    const descriptionId = $22.derived(() => `${rootId()}-description`);
+    const editDescriptionId = $22.derived(() => `${rootId()}-edit-description`);
+    const editErrorId = $22.derived(() => `${rootId()}-edit-error`);
+    let currentTime = undefined;
+    let editingArgumentsSeedKey = null;
+    let editedArgumentsDrafts = {};
+    let expirationTimer;
+    const expirationTimestamp = $22.derived(() => parseExpirationTimestamp(expiresAt));
+    const effectiveState = $22.derived(() => resolveEffectiveApprovalState(approvalState, expirationTimestamp(), currentTime));
+    const isActionable = $22.derived(() => isApprovalActionable(approvalState, expirationTimestamp(), currentTime));
+    const operationKindLabel = $22.derived(() => formatOperationKind(operation.kind));
+    const riskLabel = $22.derived(() => formatRisk(tool.risk));
+    const stateText = $22.derived(() => formatState(effectiveState()));
+    const stateDescription = $22.derived(() => isActionable() ? `${operationKindLabel()} approval is waiting for a decision.` : `No approval actions are available because this request is ${stateText().toLowerCase()}.`);
+    const expirationText = $22.derived(() => {
+      if (effectiveState() === "expired")
+        return "Expired";
+      if (approvalState !== "pending" || expirationTimestamp() === undefined || currentTime === undefined) {
+        return;
+      }
+      return `Expires in ${formatRemainingTime(expirationTimestamp() - currentTime)}`;
+    });
+    const hasArgumentsPreview = $22.derived(() => operation.argsPreview !== undefined);
+    const editableArgumentsValue = $22.derived(() => normalizeArgumentsPreviewValue(operation.argsPreview));
+    const argumentsPreview = $22.derived(() => prepareArgumentsPreview(editableArgumentsValue()));
+    const filesTouched = $22.derived(() => operation.filesTouched ?? []);
+    const filesTouchedLabel = $22.derived(() => `${filesTouched().length} file${filesTouched().length === 1 ? "" : "s"}`);
+    const environmentNames = $22.derived(() => sanitizeEnvironmentNames(env));
+    const currentEditedArgumentsText = $22.derived(() => formatEditableArguments(editableArgumentsValue()));
+    const currentEditedArgumentsSeedKey = $22.derived(() => `${idempotencyKey}\x00${currentEditedArgumentsText()}`);
+    const canEditArguments = $22.derived(() => editableArgs && hasArgumentsPreview());
+    const editingArguments = $22.derived(() => canEditArguments() && editingArgumentsSeedKey === currentEditedArgumentsSeedKey());
+    const editedArgumentsText = $22.derived(() => editedArgumentsDrafts[currentEditedArgumentsSeedKey()] ?? currentEditedArgumentsText());
+    const editParseResult = $22.derived(() => parseJsonText(editedArgumentsText()));
+    const canConfirmEditedApproval = $22.derived(() => canEditArguments() && editParseResult().ok && typeof onapprovewithedits === "function");
+    onDestroy2(clearExpirationTimer);
+    function clearExpirationTimer() {
+      if (expirationTimer !== undefined) {
+        clearTimeout(expirationTimer);
+        expirationTimer = undefined;
+      }
+    }
+    function parseExpirationTimestamp(value) {
+      if (!value)
+        return;
+      const timestamp = Date.parse(value);
+      return Number.isFinite(timestamp) ? timestamp : undefined;
+    }
+    function formatRemainingTime(milliseconds) {
+      const totalSeconds = Math.max(0, Math.ceil(milliseconds / 1000));
+      const hours = Math.floor(totalSeconds / 3600);
+      const minutes = Math.floor(totalSeconds % 3600 / 60);
+      const seconds = totalSeconds % 60;
+      if (hours > 0)
+        return `${hours}h ${minutes}m`;
+      if (minutes > 0)
+        return `${minutes}m ${seconds}s`;
+      return `${seconds}s`;
+    }
+    function formatRisk(risk) {
+      switch (risk) {
+        case "low":
+          return "Low risk";
+        case "medium":
+          return "Medium risk";
+        case "high":
+          return "High risk";
+      }
+    }
+    function riskBadgeVariant(risk) {
+      switch (risk) {
+        case "low":
+          return "success";
+        case "medium":
+          return "warning";
+        case "high":
+          return "danger";
+      }
+    }
+    function formatOperationKind(kind) {
+      switch (kind) {
+        case "command":
+          return "Command";
+        case "file-write":
+          return "File write";
+        case "patch":
+          return "Patch";
+        case "other":
+          return "Operation";
+      }
+    }
+    function formatState(approvalState2) {
+      switch (approvalState2) {
+        case "pending":
+          return "Pending";
+        case "approved":
+          return "Approved";
+        case "approved_with_edits":
+          return "Approved with edits";
+        case "denied":
+          return "Denied";
+        case "expired":
+          return "Expired";
+        case "cancelled":
+          return "Cancelled";
+      }
+    }
+    function stateDotStatus(approvalState2) {
+      switch (approvalState2) {
+        case "pending":
+          return "pending";
+        case "approved":
+        case "approved_with_edits":
+          return "success";
+        case "denied":
+          return "danger";
+        case "expired":
+          return "neutral";
+        case "cancelled":
+          return "offline";
+      }
+    }
+    function normalizeArgumentsPreviewValue(value) {
+      if (typeof value !== "string")
+        return value;
+      try {
+        return JSON.parse(value);
+      } catch {
+        return value;
+      }
+    }
+    function prepareArgumentsPreview(value) {
+      try {
+        const serialized = JSON.stringify(value);
+        if (typeof serialized !== "string" || serialized.length <= ARGUMENTS_PREVIEW_MAX_CHARACTERS) {
+          return {
+            value: typeof value === "string" ? serialized : value,
+            truncated: false
+          };
+        }
+        return {
+          value: {
+            notice: "Arguments preview truncated",
+            originalCharacters: serialized.length,
+            displayedCharacters: ARGUMENTS_PREVIEW_MAX_CHARACTERS,
+            excerpt: serialized.slice(0, ARGUMENTS_PREVIEW_MAX_CHARACTERS)
+          },
+          truncated: true
+        };
+      } catch {
+        return { value, truncated: false };
+      }
+    }
+    function formatEditableArguments(value) {
+      try {
+        const serialized = JSON.stringify(value, null, 2);
+        return serialized ?? "null";
+      } catch {
+        return "{}";
+      }
+    }
+    function parseJsonText(text) {
+      try {
+        return { ok: true, value: JSON.parse(text) };
+      } catch {
+        return { ok: false, message: "Edited arguments must be valid JSON." };
+      }
+    }
+    function sanitizeEnvironmentName(name) {
+      const [firstPart] = name.split("=");
+      return firstPart?.trim() ?? "";
+    }
+    function sanitizeEnvironmentNames(names) {
+      const seen = [];
+      const sanitizedNames = [];
+      for (const name of names) {
+        const sanitizedName = sanitizeEnvironmentName(name);
+        if (!sanitizedName || seen.includes(sanitizedName))
+          continue;
+        seen.push(sanitizedName);
+        sanitizedNames.push(sanitizedName);
+      }
+      return sanitizedNames;
+    }
+    function currentApprovalIsActionable() {
+      const comparisonTime = expirationTimestamp() === undefined ? currentTime : Date.now();
+      const actionable = isApprovalActionable(approvalState, expirationTimestamp(), comparisonTime);
+      if (!actionable && approvalState === "pending" && expirationTimestamp() !== undefined) {
+        currentTime = comparisonTime;
+      }
+      return actionable;
+    }
+    function beginEditingArguments() {
+      if (!currentApprovalIsActionable())
+        return;
+      if (!canEditArguments())
+        return;
+      if (!(currentEditedArgumentsSeedKey() in editedArgumentsDrafts)) {
+        editedArgumentsDrafts = {
+          ...editedArgumentsDrafts,
+          [currentEditedArgumentsSeedKey()]: currentEditedArgumentsText()
+        };
+      }
+      editingArgumentsSeedKey = currentEditedArgumentsSeedKey();
+    }
+    function handleEditedArgumentsInput(event) {
+      editedArgumentsDrafts = {
+        ...editedArgumentsDrafts,
+        [currentEditedArgumentsSeedKey()]: event.currentTarget.value
+      };
+    }
+    function handleApprove() {
+      if (!currentApprovalIsActionable())
+        return;
+      onapprove?.();
+    }
+    function handleApproveWithEdits() {
+      if (!currentApprovalIsActionable())
+        return;
+      if (!canEditArguments())
+        return;
+      if (!editParseResult().ok)
+        return;
+      onapprovewithedits?.(editParseResult().value);
+    }
+    function handleDeny() {
+      if (!currentApprovalIsActionable())
+        return;
+      ondeny?.();
+    }
+    function handleRemember() {
+      if (!currentApprovalIsActionable())
+        return;
+      onremember?.();
+    }
+    function handleCancel() {
+      if (!currentApprovalIsActionable())
+        return;
+      oncancel?.();
+    }
+    $$renderer2.push(`<section${$22.attributes({
+      ...rest,
+      id: rootId(),
+      class: $22.clsx(classNames("cinder-approval-card", customClassName)),
+      "aria-labelledby": titleId(),
+      "aria-describedby": descriptionId(),
+      "data-cinder-state": effectiveState(),
+      "data-cinder-risk": tool.risk
+    })}>`);
+    {
+      let header = function($$renderer3) {
+        $$renderer3.push(`<div class="cinder-approval-card__header"><div class="cinder-approval-card__title-group"><p class="cinder-approval-card__eyebrow">${$22.escape(operationKindLabel())} approval</p> <h3${$22.attr("id", titleId())} class="cinder-approval-card__title">Approval required for ${$22.escape(tool.name)}</h3> <p${$22.attr("id", descriptionId())} class="cinder-approval-card__description">${$22.escape(stateDescription())}</p></div> <div class="cinder-approval-card__badges" role="group" aria-label="Approval status">`);
+        Status_dot($$renderer3, { status: stateDotStatus(effectiveState()), label: stateText() });
+        $$renderer3.push(`<!----> `);
+        Badge($$renderer3, {
+          variant: riskBadgeVariant(tool.risk),
+          size: "sm",
+          children: ($$renderer4) => {
+            $$renderer4.push(`<!---->${$22.escape(riskLabel())}`);
+          },
+          $$slots: { default: true }
+        });
+        $$renderer3.push(`<!----> `);
+        if (expirationText()) {
+          $$renderer3.push("<!--[0-->");
+          Badge($$renderer3, {
+            variant: effectiveState() === "expired" ? "neutral" : "warning",
+            size: "sm",
+            children: ($$renderer4) => {
+              $$renderer4.push(`<!---->${$22.escape(expirationText())}`);
+            },
+            $$slots: { default: true }
+          });
+        } else {
+          $$renderer3.push("<!--[-1-->");
+        }
+        $$renderer3.push(`<!--]--></div></div>`);
+      };
+      Card($$renderer2, {
+        padding: "none",
+        class: "cinder-approval-card__surface",
+        header,
+        children: ($$renderer3) => {
+          $$renderer3.push(`<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>${$22.escape(policyVersion)}</dd></div> <div class="cinder-approval-card__metadata-item"><dt>Idempotency key</dt> <dd>${$22.escape(idempotencyKey)}</dd></div> `);
+          if (snapshotId) {
+            $$renderer3.push("<!--[0-->");
+            $$renderer3.push(`<div class="cinder-approval-card__metadata-item"><dt>Snapshot</dt> <dd>${$22.escape(snapshotId)}</dd></div>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+          }
+          $$renderer3.push(`<!--]--></dl> `);
+          if (sandbox) {
+            $$renderer3.push("<!--[0-->");
+            $$renderer3.push(`<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>${$22.escape(sandbox.provider)}</dd></div> <div class="cinder-approval-card__metadata-item"><dt>Name</dt> <dd>${$22.escape(sandbox.name)}</dd></div> <div class="cinder-approval-card__metadata-item"><dt>Working directory</dt> <dd>${$22.escape(sandbox.workingDir)}</dd></div></dl></section>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+          }
+          $$renderer3.push(`<!--]--> <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> `);
+          Badge($$renderer3, {
+            size: "sm",
+            mono: true,
+            children: ($$renderer4) => {
+              $$renderer4.push(`<!---->${$22.escape(operation.kind)}`);
+            },
+            $$slots: { default: true }
+          });
+          $$renderer3.push(`<!----></div> `);
+          if (operation.kind === "command" && operation.command) {
+            $$renderer3.push("<!--[0-->");
+            Code_block($$renderer3, { code: operation.command, language: "shell", highlight: false });
+          } else if (operation.kind === "patch" && operation.diff) {
+            $$renderer3.push("<!--[1-->");
+            Code_block($$renderer3, { code: operation.diff, language: "diff", highlight: false });
+          } else if (operation.kind === "file-write") {
+            $$renderer3.push("<!--[2-->");
+            $$renderer3.push(`<p class="cinder-approval-card__muted">Review the touched files and arguments before approving this file write.</p>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+            $$renderer3.push(`<p class="cinder-approval-card__muted">Review the arguments and metadata before approving this operation.</p>`);
+          }
+          $$renderer3.push(`<!--]--> `);
+          if (filesTouched().length > 0) {
+            $$renderer3.push("<!--[0-->");
+            $$renderer3.push(`<div class="cinder-approval-card__files"><div class="cinder-approval-card__section-heading"><h5 class="cinder-approval-card__subsection-title">Files touched</h5> `);
+            Badge($$renderer3, {
+              size: "sm",
+              children: ($$renderer4) => {
+                $$renderer4.push(`<!---->${$22.escape(filesTouchedLabel())}`);
+              },
+              $$slots: { default: true }
+            });
+            $$renderer3.push(`<!----></div> <ul class="cinder-approval-card__file-list"><!--[-->`);
+            const each_array = $22.ensure_array_like(filesTouched());
+            for (let fileIndex = 0, $$length = each_array.length;fileIndex < $$length; fileIndex++) {
+              let file = each_array[fileIndex];
+              $$renderer3.push(`<li>${$22.escape(file)}</li>`);
+            }
+            $$renderer3.push(`<!--]--></ul></div>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+          }
+          $$renderer3.push(`<!--]--></section> <section class="cinder-approval-card__section" aria-label="Arguments preview">`);
+          if (hasArgumentsPreview()) {
+            $$renderer3.push("<!--[0-->");
+            Payload_inspector($$renderer3, {
+              value: argumentsPreview().value,
+              truncated: argumentsPreview().truncated,
+              label: "Arguments preview"
+            });
+          } else {
+            $$renderer3.push("<!--[-1-->");
+            $$renderer3.push(`<p class="cinder-approval-card__muted">No arguments were provided.</p>`);
+          }
+          $$renderer3.push(`<!--]--></section> `);
+          if (environmentNames().length > 0) {
+            $$renderer3.push("<!--[0-->");
+            $$renderer3.push(`<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"><!--[-->`);
+            const each_array_1 = $22.ensure_array_like(environmentNames());
+            for (let environmentIndex = 0, $$length = each_array_1.length;environmentIndex < $$length; environmentIndex++) {
+              let environmentName = each_array_1[environmentIndex];
+              Secret_value_field($$renderer3, { value: environmentName, label: environmentName });
+            }
+            $$renderer3.push(`<!--]--></div></section>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+          }
+          $$renderer3.push(`<!--]--> `);
+          if (isActionable()) {
+            $$renderer3.push("<!--[0-->");
+            $$renderer3.push(`<section class="cinder-approval-card__section cinder-approval-card__actions-section">`);
+            Button_group($$renderer3, {
+              label: "Approval actions",
+              children: ($$renderer4) => {
+                Button($$renderer4, {
+                  type: "button",
+                  variant: "primary",
+                  onclick: handleApprove,
+                  disabled: !onapprove,
+                  children: ($$renderer5) => {
+                    $$renderer5.push(`<!---->Approve`);
+                  },
+                  $$slots: { default: true }
+                });
+                $$renderer4.push(`<!----> `);
+                if (canEditArguments()) {
+                  $$renderer4.push("<!--[0-->");
+                  Button($$renderer4, {
+                    type: "button",
+                    variant: "secondary",
+                    onclick: beginEditingArguments,
+                    disabled: !onapprovewithedits,
+                    children: ($$renderer5) => {
+                      $$renderer5.push(`<!---->Approve with edits`);
+                    },
+                    $$slots: { default: true }
+                  });
+                } else {
+                  $$renderer4.push("<!--[-1-->");
+                }
+                $$renderer4.push(`<!--]--> `);
+                Button($$renderer4, {
+                  type: "button",
+                  variant: "soft-danger",
+                  onclick: handleDeny,
+                  disabled: !ondeny,
+                  children: ($$renderer5) => {
+                    $$renderer5.push(`<!---->Deny`);
+                  },
+                  $$slots: { default: true }
+                });
+                $$renderer4.push(`<!----> `);
+                Button($$renderer4, {
+                  type: "button",
+                  variant: "soft",
+                  onclick: handleRemember,
+                  disabled: !onremember,
+                  children: ($$renderer5) => {
+                    $$renderer5.push(`<!---->Remember`);
+                  },
+                  $$slots: { default: true }
+                });
+                $$renderer4.push(`<!----> `);
+                Button($$renderer4, {
+                  type: "button",
+                  variant: "ghost",
+                  onclick: handleCancel,
+                  disabled: !oncancel,
+                  children: ($$renderer5) => {
+                    $$renderer5.push(`<!---->Cancel`);
+                  },
+                  $$slots: { default: true }
+                });
+                $$renderer4.push(`<!---->`);
+              },
+              $$slots: { default: true }
+            });
+            $$renderer3.push(`<!----> `);
+            if (editingArguments()) {
+              $$renderer3.push("<!--[0-->");
+              $$renderer3.push(`<div class="cinder-approval-card__editor"><label class="cinder-approval-card__editor-label"${$22.attr("for", `${rootId()}-edited-arguments`)}>Edited arguments JSON</label> <p${$22.attr("id", editDescriptionId())} class="cinder-approval-card__muted">Confirming parses this JSON and sends the parsed value to the approval callback.</p> <textarea${$22.attr("id", `${rootId()}-edited-arguments`)} class="cinder-approval-card__textarea" rows="8" spellcheck="false"${$22.attr("aria-describedby", editParseResult().ok ? editDescriptionId() : `${editDescriptionId()} ${editErrorId()}`)}${$22.attr("aria-invalid", editParseResult().ok ? undefined : "true")}>`);
+              const $$body = $22.escape(editedArgumentsText());
+              if ($$body) {
+                $$renderer3.push(`${$$body}`);
+              } else {}
+              $$renderer3.push(`</textarea> `);
+              if (!editParseResult().ok) {
+                $$renderer3.push("<!--[0-->");
+                $$renderer3.push(`<p${$22.attr("id", editErrorId())} class="cinder-approval-card__error" role="alert">${$22.escape(editParseResult().message)}</p>`);
+              } else {
+                $$renderer3.push("<!--[-1-->");
+              }
+              $$renderer3.push(`<!--]--> <div class="cinder-approval-card__editor-actions">`);
+              Button($$renderer3, {
+                type: "button",
+                variant: "primary",
+                onclick: handleApproveWithEdits,
+                disabled: !canConfirmEditedApproval(),
+                children: ($$renderer4) => {
+                  $$renderer4.push(`<!---->Confirm edited approval`);
+                },
+                $$slots: { default: true }
+              });
+              $$renderer3.push(`<!----></div></div>`);
+            } else {
+              $$renderer3.push("<!--[-1-->");
+            }
+            $$renderer3.push(`<!--]--></section>`);
+          } else {
+            $$renderer3.push("<!--[-1-->");
+            $$renderer3.push(`<p class="cinder-approval-card__readonly-summary">No approval actions are available for this request.</p>`);
+          }
+          $$renderer3.push(`<!--]--></div>`);
+        },
+        $$slots: { header: true, default: true }
+      });
+    }
+    $$renderer2.push(`<!----></section>`);
+  });
+}
+
+// src/components/approval-card/index.ts
+var approval_card_default = Approval_card;
+export {
+  approval_card_default as default,
+  Approval_card as ApprovalCard
+};
+
+//# debugId=5D2C2FA2098732CE64756E2164756E21