@lostgradient/cinder 0.3.0 → 0.4.1

package/dist/components/review-editor/index.js

@@ -211,7 +211,7 @@ function computeCoordsFromPlacement(_ref, placement, rtl) {
   }
   return coords;
 }
-async function detectOverflow(state5, options) {
+async function detectOverflow(state6, options) {
   var _await$platform$isEle;
   if (options === undefined) {
     options = {};
@@ -223,14 +223,14 @@ async function detectOverflow(state5, options) {
     rects,
     elements,
     strategy
-  } = state5;
+  } = state6;
   const {
     boundary = "clippingAncestors",
     rootBoundary = "viewport",
     elementContext = "floating",
     altBoundary = false,
     padding = 0
-  } = evaluate(options, state5);
+  } = evaluate(options, state6);
   const paddingObject = getPaddingObject(padding);
   const altContext = elementContext === "floating" ? "reference" : "floating";
   const element2 = elements[altBoundary ? altContext : elementContext];
@@ -314,19 +314,19 @@ function getRectsByLine(rects) {
   }
   return groups.map((rect) => rectToClientRect(getBoundingRect(rect)));
 }
-async function convertValueToCoords(state5, options) {
+async function convertValueToCoords(state6, options) {
   const {
     placement,
     platform,
     elements
-  } = state5;
+  } = state6;
   const rtl = await (platform.isRTL == null ? undefined : platform.isRTL(elements.floating));
   const side = getSide(placement);
   const alignment = getAlignment(placement);
   const isVertical = getSideAxis(placement) === "y";
   const mainAxisMulti = originSides.has(side) ? -1 : 1;
   const crossAxisMulti = rtl && isVertical ? -1 : 1;
-  const rawValue = evaluate(options, state5);
+  const rawValue = evaluate(options, state6);
   let {
     mainAxis,
     crossAxis,
@@ -440,7 +440,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
 }, arrow = (options) => ({
   name: "arrow",
   options,
-  async fn(state5) {
+  async fn(state6) {
     const {
       x,
       y,
@@ -449,11 +449,11 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
       platform,
       elements,
       middlewareData
-    } = state5;
+    } = state6;
     const {
       element: element2,
       padding = 0
-    } = evaluate(options, state5) || {};
+    } = evaluate(options, state6) || {};
     if (element2 == null) {
       return {};
     }
@@ -505,7 +505,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "autoPlacement",
     options,
-    async fn(state5) {
+    async fn(state6) {
       var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
       const {
         rects,
@@ -513,16 +513,16 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
         placement,
         platform,
         elements
-      } = state5;
+      } = state6;
       const {
         crossAxis = false,
         alignment,
         allowedPlacements = placements,
         autoAlignment = true,
         ...detectOverflowOptions
-      } = evaluate(options, state5);
+      } = evaluate(options, state6);
       const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
-      const overflow = await platform.detectOverflow(state5, detectOverflowOptions);
+      const overflow = await platform.detectOverflow(state6, detectOverflowOptions);
       const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? undefined : _middlewareData$autoP.index) || 0;
       const currentPlacement = placements$1[currentIndex];
       if (currentPlacement == null) {
@@ -580,7 +580,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "flip",
     options,
-    async fn(state5) {
+    async fn(state6) {
       var _middlewareData$arrow, _middlewareData$flip;
       const {
         placement,
@@ -589,7 +589,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
         initialPlacement,
         platform,
         elements
-      } = state5;
+      } = state6;
       const {
         mainAxis: checkMainAxis = true,
         crossAxis: checkCrossAxis = true,
@@ -598,7 +598,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
         fallbackAxisSideDirection = "none",
         flipAlignment = true,
         ...detectOverflowOptions
-      } = evaluate(options, state5);
+      } = evaluate(options, state6);
       if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
         return {};
       }
@@ -612,7 +612,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
         fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
       }
       const placements2 = [initialPlacement, ...fallbackPlacements];
-      const overflow = await platform.detectOverflow(state5, detectOverflowOptions);
+      const overflow = await platform.detectOverflow(state6, detectOverflowOptions);
       const overflows = [];
       let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? undefined : _middlewareData$flip.overflows) || [];
       if (checkMainAxis) {
@@ -684,18 +684,18 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "hide",
     options,
-    async fn(state5) {
+    async fn(state6) {
       const {
         rects,
         platform
-      } = state5;
+      } = state6;
       const {
         strategy = "referenceHidden",
         ...detectOverflowOptions
-      } = evaluate(options, state5);
+      } = evaluate(options, state6);
       switch (strategy) {
         case "referenceHidden": {
-          const overflow = await platform.detectOverflow(state5, {
+          const overflow = await platform.detectOverflow(state6, {
             ...detectOverflowOptions,
             elementContext: "reference"
           });
@@ -708,7 +708,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
           };
         }
         case "escaped": {
-          const overflow = await platform.detectOverflow(state5, {
+          const overflow = await platform.detectOverflow(state6, {
             ...detectOverflowOptions,
             altBoundary: true
           });
@@ -733,19 +733,19 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "inline",
     options,
-    async fn(state5) {
+    async fn(state6) {
       const {
         placement,
         elements,
         rects,
         platform,
         strategy
-      } = state5;
+      } = state6;
       const {
         padding = 2,
         x,
         y
-      } = evaluate(options, state5);
+      } = evaluate(options, state6);
       const nativeClientRects = Array.from(await (platform.getClientRects == null ? undefined : platform.getClientRects(elements.reference)) || []);
       const clientRects = getRectsByLine(nativeClientRects);
       const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
@@ -823,15 +823,15 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "offset",
     options,
-    async fn(state5) {
+    async fn(state6) {
       var _middlewareData$offse, _middlewareData$arrow;
       const {
         x,
         y,
         placement,
         middlewareData
-      } = state5;
-      const diffCoords = await convertValueToCoords(state5, options);
+      } = state6;
+      const diffCoords = await convertValueToCoords(state6, options);
       if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? undefined : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
         return {};
       }
@@ -852,13 +852,13 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "shift",
     options,
-    async fn(state5) {
+    async fn(state6) {
       const {
         x,
         y,
         placement,
         platform
-      } = state5;
+      } = state6;
       const {
         mainAxis: checkMainAxis = true,
         crossAxis: checkCrossAxis = false,
@@ -875,12 +875,12 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
           }
         },
         ...detectOverflowOptions
-      } = evaluate(options, state5);
+      } = evaluate(options, state6);
       const coords = {
         x,
         y
       };
-      const overflow = await platform.detectOverflow(state5, detectOverflowOptions);
+      const overflow = await platform.detectOverflow(state6, detectOverflowOptions);
       const crossAxis = getSideAxis(getSide(placement));
       const mainAxis = getOppositeAxis(crossAxis);
       let mainAxisCoord = coords[mainAxis];
@@ -900,7 +900,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
         crossAxisCoord = clamp(min2, crossAxisCoord, max2);
       }
       const limitedCoords = limiter.fn({
-        ...state5,
+        ...state6,
         [mainAxis]: mainAxisCoord,
         [crossAxis]: crossAxisCoord
       });
@@ -923,19 +923,19 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   }
   return {
     options,
-    fn(state5) {
+    fn(state6) {
       const {
         x,
         y,
         placement,
         rects,
         middlewareData
-      } = state5;
+      } = state6;
       const {
         offset: offset2 = 0,
         mainAxis: checkMainAxis = true,
         crossAxis: checkCrossAxis = true
-      } = evaluate(options, state5);
+      } = evaluate(options, state6);
       const coords = {
         x,
         y
@@ -944,7 +944,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
       const mainAxis = getOppositeAxis(crossAxis);
       let mainAxisCoord = coords[mainAxis];
       let crossAxisCoord = coords[crossAxis];
-      const rawOffset = evaluate(offset2, state5);
+      const rawOffset = evaluate(offset2, state6);
       const computedOffset = typeof rawOffset === "number" ? {
         mainAxis: rawOffset,
         crossAxis: 0
@@ -988,19 +988,19 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
   return {
     name: "size",
     options,
-    async fn(state5) {
+    async fn(state6) {
       var _state$middlewareData, _state$middlewareData2;
       const {
         placement,
         rects,
         platform,
         elements
-      } = state5;
+      } = state6;
       const {
         apply = () => {},
         ...detectOverflowOptions
-      } = evaluate(options, state5);
-      const overflow = await platform.detectOverflow(state5, detectOverflowOptions);
+      } = evaluate(options, state6);
+      const overflow = await platform.detectOverflow(state6, detectOverflowOptions);
       const side = getSide(placement);
       const alignment = getAlignment(placement);
       const isYAxis = getSideAxis(placement) === "y";
@@ -1021,13 +1021,13 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
       const maximumClippingWidth = width - overflow.left - overflow.right;
       const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
       const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
-      const noShift = !state5.middlewareData.shift;
+      const noShift = !state6.middlewareData.shift;
       let availableHeight = overflowAvailableHeight;
       let availableWidth = overflowAvailableWidth;
-      if ((_state$middlewareData = state5.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
+      if ((_state$middlewareData = state6.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
         availableWidth = maximumClippingWidth;
       }
-      if ((_state$middlewareData2 = state5.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
+      if ((_state$middlewareData2 = state6.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
         availableHeight = maximumClippingHeight;
       }
       if (noShift && !alignment) {
@@ -1042,7 +1042,7 @@ var MAX_RESET_COUNT = 50, computePosition = async (reference, floating, config)
         }
       }
       await apply({
-        ...state5,
+        ...state6,
         availableWidth,
         availableHeight
       });
@@ -2152,7 +2152,8 @@ function copyInheritedPortalAttributes(element, source, inheritAttributes, fallb
   dir: element.getAttribute("dir"),
   theme: element.getAttribute("data-cinder-theme")
 }) {
-  const inheritedDir = inheritAttributes && source ? source.closest("[dir]")?.getAttribute("dir") : null;
+  const preservesExplicitDirection = element.dataset["cinderExplicitDirection"] === "true";
+  const inheritedDir = inheritAttributes && source && !preservesExplicitDirection ? source.closest("[dir]")?.getAttribute("dir") : null;
   const nextDir = inheritedDir ?? fallbackAttributes.dir;
   if (nextDir) {
     element.setAttribute("dir", nextDir);
@@ -2519,17 +2520,21 @@ import * as $7 from "svelte/internal/client";
 import { createContext } from "svelte";
 
 // src/utilities/document-order.ts
+var DOCUMENT_POSITION_PRECEDING = 2;
+var DOCUMENT_POSITION_FOLLOWING = 4;
 function inDocumentOrder(items) {
-  return items.toSorted((a, b) => {
+  const sortedItems = [...items];
+  sortedItems.sort((a, b) => {
     if (a.node === b.node)
       return 0;
     const position = a.node.compareDocumentPosition(b.node);
-    if (position & Node.DOCUMENT_POSITION_FOLLOWING)
+    if (position & DOCUMENT_POSITION_FOLLOWING)
       return -1;
-    if (position & Node.DOCUMENT_POSITION_PRECEDING)
+    if (position & DOCUMENT_POSITION_PRECEDING)
       return 1;
     return 0;
   });
+  return sortedItems;
 }
 
 // src/utilities/roving-tabindex.ts
@@ -2828,7 +2833,11 @@ function Segment($$anchor, $$props) {
 // src/components/segmented-control/segmented-control.svelte
 import"svelte/internal/disclose-version";
 import * as $9 from "svelte/internal/client";
-var root4 = $9.from_html(`<div class="cinder-segmented-control-container"><span> </span> <div><!></div></div>`);
+import { untrack as untrack2 } from "svelte";
+import { SvelteSet } from "svelte/reactivity";
+var root_22 = $9.from_html(`<input type="hidden"/>`);
+var root_12 = $9.from_html(`<input type="hidden" disabled=""/> <!>`, 1);
+var root4 = $9.from_html(`<div class="cinder-segmented-control-container"><span> </span> <div><!></div> <!></div>`);
 function Segmented_control($$anchor, $$props) {
   $9.push($$props, true);
   let value = $9.prop($$props, "value", 15), hideLabel = $9.prop($$props, "hideLabel", 3, false), disabled = $9.prop($$props, "disabled", 3, false), size = $9.prop($$props, "size", 3, "md"), orientation = $9.prop($$props, "orientation", 3, "horizontal"), detached = $9.prop($$props, "detached", 3, false), fullWidth = $9.prop($$props, "fullWidth", 3, false), variant = $9.prop($$props, "variant", 3, "radiogroup"), selectionMode = $9.prop($$props, "selectionMode", 3, "single"), disallowEmptySelection = $9.prop($$props, "disallowEmptySelection", 3, true), rest = $9.rest_props($$props, [
@@ -2838,6 +2847,7 @@ function Segmented_control($$anchor, $$props) {
     "id",
     "value",
     "label",
+    "name",
     "hideLabel",
     "disabled",
     "size",
@@ -2852,6 +2862,10 @@ function Segmented_control($$anchor, $$props) {
     "onchange",
     "children"
   ]);
+  let resetInputElement = $9.state(null);
+  let resetSyncTimeout;
+  const initialSingleValue = untrack2(() => typeof value() === "string" ? value() : undefined);
+  const initialMultipleValues = untrack2(() => selectionMode() === "multiple" && value() instanceof SvelteSet ? Array.from(value()) : undefined);
   const controller = new SegmentedControlController({
     selectionMode: () => selectionMode(),
     variant: () => variant(),
@@ -2882,6 +2896,35 @@ function Segmented_control($$anchor, $$props) {
   setSegmentedControlContext(contextValue);
   const groupRole = $9.derived(() => selectionMode() === "multiple" ? "group" : variant() === "tablist" ? "tablist" : "radiogroup");
   const effectiveSize = $9.derived(() => $$props.density === "toolbar" ? "sm" : size());
+  const selectedValues = $9.derived(() => selectionMode() === "multiple" ? value() instanceof SvelteSet ? Array.from(value()) : [] : typeof value() === "string" ? [value()] : []);
+  function resetToInitialValue(event) {
+    if (resetSyncTimeout !== undefined)
+      clearTimeout(resetSyncTimeout);
+    resetSyncTimeout = setTimeout(() => {
+      resetSyncTimeout = undefined;
+      if (event.defaultPrevented)
+        return;
+      if (selectionMode() === "multiple") {
+        value(initialMultipleValues === undefined ? undefined : new SvelteSet(initialMultipleValues));
+        return;
+      }
+      value(initialSingleValue);
+    }, 0);
+  }
+  $9.user_effect(() => {
+    const input = $9.get(resetInputElement);
+    if (input === null)
+      return;
+    const form = input.form;
+    form?.addEventListener("reset", resetToInitialValue);
+    return () => {
+      form?.removeEventListener("reset", resetToInitialValue);
+      if (resetSyncTimeout !== undefined) {
+        clearTimeout(resetSyncTimeout);
+        resetSyncTimeout = undefined;
+      }
+    };
+  });
   var div = root4();
   var span = $9.child(div);
   var text = $9.child(span, true);
@@ -2908,6 +2951,30 @@ function Segmented_control($$anchor, $$props) {
   var node = $9.child(div_1);
   $9.snippet(node, () => $$props.children);
   $9.reset(div_1);
+  var node_1 = $9.sibling(div_1, 2);
+  {
+    var consequent = ($$anchor2) => {
+      var fragment = root_12();
+      var input_1 = $9.first_child(fragment);
+      $9.bind_this(input_1, ($$value) => $9.set(resetInputElement, $$value), () => $9.get(resetInputElement));
+      var node_2 = $9.sibling(input_1, 2);
+      $9.each(node_2, 16, () => $9.get(selectedValues), (selectedValue) => selectedValue, ($$anchor3, selectedValue) => {
+        var input_2 = root_22();
+        $9.remove_input_defaults(input_2);
+        $9.template_effect(() => {
+          $9.set_attribute(input_2, "name", $$props.name);
+          $9.set_value(input_2, selectedValue);
+          input_2.disabled = disabled();
+        });
+        $9.append($$anchor3, input_2);
+      });
+      $9.append($$anchor2, fragment);
+    };
+    $9.if(node_1, ($$render) => {
+      if ($$props.name)
+        $$render(consequent);
+    });
+  }
   $9.reset(div);
   $9.template_effect(($0) => {
     $9.set_attribute(span, "id", `${$$props.id}-label`);
@@ -2923,7 +2990,7 @@ function Segmented_control($$anchor, $$props) {
 // src/components/markdown-editor/editor-skeleton.svelte
 import"svelte/internal/disclose-version";
 import * as $10 from "svelte/internal/client";
-var root_12 = $10.from_html(`<div class="skeleton-line svelte-1h3fabh"></div>`);
+var root_13 = $10.from_html(`<div class="skeleton-line svelte-1h3fabh"></div>`);
 var root5 = $10.from_html(`<div><span class="sr-only svelte-1h3fabh">Loading editor...</span> <div class="skeleton-content svelte-1h3fabh"></div></div>`);
 function Editor_skeleton($$anchor, $$props) {
   $10.push($$props, true);
@@ -2947,7 +3014,7 @@ function Editor_skeleton($$anchor, $$props) {
   ], undefined, undefined, "svelte-1h3fabh");
   var div_1 = $10.sibling($10.child(div), 2);
   $10.each(div_1, 21, () => $10.get(lineWidths), $10.index, ($$anchor2, width) => {
-    var div_2 = root_12();
+    var div_2 = root_13();
     let styles;
     $10.template_effect(() => styles = $10.set_style(div_2, "", styles, { "--skeleton-line-width": `${$10.get(width) ?? ""}%` }));
     $10.append($$anchor2, div_2);
@@ -3432,7 +3499,7 @@ import {
 // src/components/toolbar/toolbar.svelte
 import"svelte/internal/disclose-version";
 import * as $27 from "svelte/internal/client";
-import { untrack as untrack3 } from "svelte";
+import { untrack as untrack4 } from "svelte";
 import { on } from "svelte/events";
 
 // src/utilities/use-mutation-observer.svelte.ts
@@ -3791,7 +3858,7 @@ function Toolbar($$anchor, $$props) {
   }
   function toolbarSetup(node) {
     rootElement = node;
-    syncToolbarItems(untrack3(() => $27.get(activeItem)));
+    syncToolbarItems(untrack4(() => $27.get(activeItem)));
     const cleanupKeyboardListener = on(node, "keydown", handleToolbarKeyDown, { capture: true });
     const cleanupFocusInListener = on(node, "focusin", handleToolbarFocusIn);
     const detachMutationObserver = useMutationObserver(() => {
@@ -4020,6 +4087,66 @@ function createAnchoredOverlay(options) {
   };
 }
 
+// src/_internal/overlay.ts
+var escapeStack = [];
+function pushEscapeHandler(handler) {
+  escapeStack.push(handler);
+  if (escapeStack.length === 1 && typeof window !== "undefined") {
+    window.addEventListener("keydown", onEscapeKeydown, { capture: true });
+  }
+  let released = false;
+  return () => {
+    if (released)
+      return;
+    released = true;
+    const index3 = escapeStack.lastIndexOf(handler);
+    if (index3 !== -1)
+      escapeStack.splice(index3, 1);
+    if (escapeStack.length === 0 && typeof window !== "undefined") {
+      window.removeEventListener("keydown", onEscapeKeydown, { capture: true });
+    }
+  };
+}
+function onEscapeKeydown(event) {
+  if (event.key !== "Escape")
+    return;
+  const handler = escapeStack.at(-1);
+  if (!handler)
+    return;
+  handler(event);
+}
+var scrollLockCount = 0;
+var originalBodyOverflow = null;
+function lockBodyScroll() {
+  if (typeof document === "undefined")
+    return () => {};
+  if (scrollLockCount === 0) {
+    originalBodyOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+  }
+  scrollLockCount += 1;
+  let released = false;
+  return () => {
+    if (released)
+      return;
+    released = true;
+    scrollLockCount = Math.max(0, scrollLockCount - 1);
+    if (scrollLockCount === 0) {
+      document.body.style.overflow = originalBodyOverflow ?? "";
+      originalBodyOverflow = null;
+    }
+  };
+}
+function captureFocus() {
+  if (typeof document === "undefined")
+    return null;
+  const active = document.activeElement;
+  if (active && active !== document.body && active instanceof HTMLElement) {
+    return active;
+  }
+  return null;
+}
+
 // src/components/tooltip/tooltip.svelte
 var root8 = $29.from_html(`<span role="presentation"><!> <span role="tooltip" class="cinder-tooltip"> </span></span>`);
 function Tooltip($$anchor, $$props) {
@@ -4044,23 +4171,42 @@ function Tooltip($$anchor, $$props) {
   ].join(", ");
   let visible = $29.state(false);
   let showTimer;
-  let hasPendingShow = $29.state(false);
+  let releasePendingEscapeListener;
   let wrapperElement = $29.state(undefined);
   let tooltipElement = $29.state(undefined);
   let anchorElement = $29.state(null);
-  function show() {
+  function releasePendingEscape() {
+    releasePendingEscapeListener?.();
+    releasePendingEscapeListener = undefined;
+  }
+  function clearPendingShow() {
     clearTimeout(showTimer);
-    $29.set(hasPendingShow, true);
+    showTimer = undefined;
+    releasePendingEscape();
+  }
+  function handlePendingEscapeKeydown(event2) {
+    if (event2.key !== "Escape")
+      return;
+    clearPendingShow();
+  }
+  function registerPendingEscape() {
+    releasePendingEscape();
+    document.addEventListener("keydown", handlePendingEscapeKeydown, { capture: true });
+    releasePendingEscapeListener = () => {
+      document.removeEventListener("keydown", handlePendingEscapeKeydown, { capture: true });
+    };
+  }
+  function show() {
+    clearPendingShow();
+    registerPendingEscape();
     showTimer = setTimeout(() => {
       showTimer = undefined;
-      $29.set(hasPendingShow, false);
+      releasePendingEscape();
       $29.set(visible, true);
     }, 100);
   }
   function hide3() {
-    clearTimeout(showTimer);
-    showTimer = undefined;
-    $29.set(hasPendingShow, false);
+    clearPendingShow();
     $29.set(visible, false);
   }
   function handleMouseEnter() {
@@ -4075,10 +4221,9 @@ function Tooltip($$anchor, $$props) {
   function handleFocusOut() {
     hide3();
   }
-  function handleKeydown(event2) {
-    if (event2.key === "Escape") {
-      hide3();
-    }
+  function handleEscape(event2 = undefined) {
+    hide3();
+    event2?.preventDefault();
   }
   function isFocusableCandidate2(element2) {
     if (element2.matches(":disabled"))
@@ -4139,13 +4284,15 @@ function Tooltip($$anchor, $$props) {
   });
   const isTooltipExposed = $29.derived(() => $29.get(visible) && anchoredOverlay.positionReady);
   $29.user_effect(() => {
-    if (!$29.get(visible) && !$29.get(hasPendingShow))
-      return;
-    document.addEventListener("keydown", handleKeydown);
     return () => {
-      document.removeEventListener("keydown", handleKeydown);
+      clearPendingShow();
     };
   });
+  $29.user_effect(() => {
+    if (!$29.get(visible))
+      return;
+    return pushEscapeHandler(handleEscape);
+  });
   var span = root8();
   var node = $29.child(span);
   $29.snippet(node, () => $$props.children);
@@ -4178,7 +4325,7 @@ function Tooltip($$anchor, $$props) {
 $29.delegate(["focusin", "focusout"]);
 
 // src/components/markdown-editor/editor-toolbar/toolbar-button.svelte
-var root_13 = $30.from_html(`<button><!></button>`);
+var root_14 = $30.from_html(`<button><!></button>`);
 function Toolbar_button($$anchor, $$props) {
   $30.push($$props, true);
   let toggle = $30.prop($$props, "toggle", 3, false), pressed = $30.prop($$props, "pressed", 3, false), disabled = $30.prop($$props, "disabled", 3, false), rest = $30.rest_props($$props, [
@@ -4201,7 +4348,7 @@ function Toolbar_button($$anchor, $$props) {
     },
     placement: "bottom",
     children: ($$anchor2, $$slotProps) => {
-      var button = root_13();
+      var button = root_14();
       $30.attribute_effect(button, ($0) => ({
         type: "button",
         class: $0,
@@ -4271,66 +4418,6 @@ function Check($$anchor, $$props) {
 import"svelte/internal/disclose-version";
 import * as $33 from "svelte/internal/client";
 
-// src/_internal/overlay.ts
-var escapeStack = [];
-function pushEscapeHandler(handler) {
-  escapeStack.push(handler);
-  if (escapeStack.length === 1 && typeof window !== "undefined") {
-    window.addEventListener("keydown", onEscapeKeydown, { capture: true });
-  }
-  let released = false;
-  return () => {
-    if (released)
-      return;
-    released = true;
-    const index3 = escapeStack.lastIndexOf(handler);
-    if (index3 !== -1)
-      escapeStack.splice(index3, 1);
-    if (escapeStack.length === 0 && typeof window !== "undefined") {
-      window.removeEventListener("keydown", onEscapeKeydown, { capture: true });
-    }
-  };
-}
-function onEscapeKeydown(event2) {
-  if (event2.key !== "Escape")
-    return;
-  const handler = escapeStack.at(-1);
-  if (!handler)
-    return;
-  handler(event2);
-}
-var scrollLockCount = 0;
-var originalBodyOverflow = null;
-function lockBodyScroll() {
-  if (typeof document === "undefined")
-    return () => {};
-  if (scrollLockCount === 0) {
-    originalBodyOverflow = document.body.style.overflow;
-    document.body.style.overflow = "hidden";
-  }
-  scrollLockCount += 1;
-  let released = false;
-  return () => {
-    if (released)
-      return;
-    released = true;
-    scrollLockCount = Math.max(0, scrollLockCount - 1);
-    if (scrollLockCount === 0) {
-      document.body.style.overflow = originalBodyOverflow ?? "";
-      originalBodyOverflow = null;
-    }
-  };
-}
-function captureFocus() {
-  if (typeof document === "undefined")
-    return null;
-  const active = document.activeElement;
-  if (active && active !== document.body && active instanceof HTMLElement) {
-    return active;
-  }
-  return null;
-}
-
 // src/utilities/attachments.ts
 function createBodyScrollLock() {
   return () => {
@@ -4338,6 +4425,10 @@ function createBodyScrollLock() {
     return release;
   };
 }
+function isInsideEventPath(event2, element2) {
+  const path = event2.composedPath();
+  return path.some((entry) => entry instanceof Node && element2.contains(entry));
+}
 function createClickOutside(options) {
   const { handler, enabled = true, eventType = "click", capture = true, ignoreRefs } = options;
   return (node) => {
@@ -4345,17 +4436,19 @@ function createClickOutside(options) {
       const isEnabled = typeof enabled === "function" ? enabled() : enabled;
       if (!isEnabled)
         return;
+      if (event2.type === "touchstart" && !event2.cancelable)
+        return;
       const target = event2.target;
       if (!(target instanceof Node)) {
         handler();
         return;
       }
-      if (node.contains(target))
+      if (isInsideEventPath(event2, node))
         return;
       if (ignoreRefs) {
         for (const ref of ignoreRefs) {
           const element2 = ref();
-          if (element2 && element2.contains(target))
+          if (element2 && isInsideEventPath(event2, element2))
             return;
         }
       }
@@ -4448,7 +4541,7 @@ var getDropdownSetOpen = getDropdownSetOpenStrict;
 // src/components/dropdown/dropdown.svelte
 var root_3 = $33.from_html(`<div class="cinder-dropdown__menu" popover="auto" role="menu"><!></div>`);
 var root_5 = $33.from_html(`<div class="cinder-dropdown__menu" role="menu"><!></div>`);
-var root_14 = $33.from_html(`<div class="cinder-dropdown__trigger" role="presentation"><!></div> <!>`, 1);
+var root_15 = $33.from_html(`<div class="cinder-dropdown__trigger" role="presentation"><!></div> <!>`, 1);
 var root10 = $33.from_html(`<div><!></div>`);
 function Dropdown($$anchor, $$props) {
   const generatedId = $33.props_id();
@@ -4582,7 +4675,7 @@ function Dropdown($$anchor, $$props) {
   var node = $33.child(div);
   {
     var consequent_5 = ($$anchor2) => {
-      var fragment = root_14();
+      var fragment = root_15();
       var div_1 = $33.first_child(fragment);
       var node_1 = $33.child(div_1);
       {
@@ -4682,7 +4775,7 @@ $33.delegate(["click"]);
 // src/components/dropdown-trigger/dropdown-trigger.svelte
 import"svelte/internal/disclose-version";
 import * as $34 from "svelte/internal/client";
-var root_22 = $34.from_svg(`<svg class="cinder-dropdown-trigger__caret" aria-hidden="true" focusable="false" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 8l4 4 4-4"></path></svg>`);
+var root_23 = $34.from_svg(`<svg class="cinder-dropdown-trigger__caret" aria-hidden="true" focusable="false" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 8l4 4 4-4"></path></svg>`);
 var root11 = $34.from_html(`<button><!> <!></button>`);
 function Dropdown_trigger($$anchor, $$props) {
   $34.push($$props, true);
@@ -4698,11 +4791,10 @@ function Dropdown_trigger($$anchor, $$props) {
   const context = getDropdownContext();
   const registerTrigger = getDropdownRegisterTrigger();
   const setOpen = getDropdownSetOpen();
-  let triggerElement = $34.state(null);
-  $34.user_effect(() => {
-    registerTrigger($34.get(triggerElement));
+  function attachTrigger(node) {
+    registerTrigger(node);
     return () => registerTrigger(null);
-  });
+  }
   function handleClick(event3) {
     if (typeof $$props.onclick === "function") {
       $$props.onclick(event3);
@@ -4723,32 +4815,32 @@ function Dropdown_trigger($$anchor, $$props) {
     onclick: handleClick,
     ...rest
   }), [() => classNames("cinder-dropdown-trigger", $$props.class)]);
-  var node = $34.child(button);
+  var node_1 = $34.child(button);
   {
     var consequent = ($$anchor2) => {
       var fragment = $34.comment();
-      var node_1 = $34.first_child(fragment);
-      $34.snippet(node_1, () => $$props.children);
+      var node_2 = $34.first_child(fragment);
+      $34.snippet(node_2, () => $$props.children);
       $34.append($$anchor2, fragment);
     };
-    $34.if(node, ($$render) => {
+    $34.if(node_1, ($$render) => {
       if ($$props.children)
         $$render(consequent);
     });
   }
-  var node_2 = $34.sibling(node, 2);
+  var node_3 = $34.sibling(node_1, 2);
   {
     var consequent_1 = ($$anchor2) => {
-      var svg = root_22();
+      var svg = root_23();
       $34.append($$anchor2, svg);
     };
-    $34.if(node_2, ($$render) => {
+    $34.if(node_3, ($$render) => {
       if (showCaret())
         $$render(consequent_1);
     });
   }
   $34.reset(button);
-  $34.bind_this(button, ($$value) => $34.set(triggerElement, $$value), () => $34.get(triggerElement));
+  $34.attach(button, () => attachTrigger);
   $34.append($$anchor, button);
   $34.pop();
 }
@@ -4757,23 +4849,281 @@ function Dropdown_trigger($$anchor, $$props) {
 import"svelte/internal/disclose-version";
 import * as $35 from "svelte/internal/client";
 import { tick } from "svelte";
-var root_15 = $35.from_html(`<div><!></div>`);
+
+// src/_internal/locale-context.ts
+import { createContext as createContext3 } from "svelte";
+
+// src/_internal/optional-context.ts
+function optionalContext(getStrict) {
+  return () => {
+    try {
+      return getStrict();
+    } catch {
+      return;
+    }
+  };
+}
+
+// src/_internal/locale-context.ts
+var [getLocaleContextStrict, setLocaleContextRaw] = createContext3();
+function setLocaleContext(context) {
+  setLocaleContextRaw(context);
+}
+var getLocaleContext = optionalContext(getLocaleContextStrict);
+
+// src/_internal/text-direction.ts
+function resolveTextDirection(element2, fallback) {
+  let currentElement = element2 ?? null;
+  let documentDirection;
+  let styledDirectionElement = null;
+  while (currentElement) {
+    const direction = currentElement.getAttribute("dir")?.toLowerCase();
+    if (direction === "rtl" || direction === "ltr") {
+      if (typeof getComputedStyle === "function" && styledDirectionElement) {
+        const styledDirection2 = getComputedStyle(styledDirectionElement).direction;
+        if (styledDirection2 === "rtl" || styledDirection2 === "ltr")
+          return styledDirection2;
+      }
+      if (currentElement === currentElement.ownerDocument.documentElement) {
+        documentDirection = direction;
+        break;
+      }
+      return direction;
+    }
+    if (direction === "auto" && typeof getComputedStyle === "function") {
+      const computedDirection2 = getComputedStyle(currentElement).direction;
+      if (computedDirection2 === "rtl" || computedDirection2 === "ltr")
+        return computedDirection2;
+    }
+    const styledDirection = currentElement.style.direction;
+    if (!styledDirectionElement && (styledDirection === "rtl" || styledDirection === "ltr")) {
+      styledDirectionElement = currentElement;
+    }
+    currentElement = currentElement.parentElement;
+  }
+  if (typeof getComputedStyle === "function" && styledDirectionElement) {
+    const direction = getComputedStyle(styledDirectionElement).direction;
+    if (direction === "rtl" || direction === "ltr")
+      return direction;
+  }
+  const computedDirection = readComputedTextDirection(element2);
+  const rootComputedDirection = readComputedTextDirection(element2?.ownerDocument.documentElement);
+  if (computedDirection && computedDirection !== rootComputedDirection)
+    return computedDirection;
+  if (computedDirection && fallback && computedDirection !== fallback && hasDirectionStylingHint(element2)) {
+    return computedDirection;
+  }
+  if (!fallback && computedDirection === "rtl")
+    return computedDirection;
+  if (fallback)
+    return fallback;
+  if (documentDirection)
+    return documentDirection;
+  return;
+}
+function readComputedTextDirection(element2) {
+  if (!element2 || typeof getComputedStyle !== "function")
+    return;
+  const direction = getComputedStyle(element2).direction;
+  return direction === "rtl" || direction === "ltr" ? direction : undefined;
+}
+function hasDirectionStylingHint(element2) {
+  let currentElement = element2?.parentElement;
+  while (currentElement && currentElement !== currentElement.ownerDocument.documentElement) {
+    if (currentElement.style.direction)
+      return true;
+    if (matchesDirectionStyleRule(currentElement))
+      return true;
+    currentElement = currentElement.parentElement;
+  }
+  return false;
+}
+function matchesDirectionStyleRule(element2) {
+  for (const sheet of Array.from(element2.ownerDocument.styleSheets)) {
+    let rules;
+    try {
+      rules = sheet.cssRules;
+    } catch {
+      continue;
+    }
+    if (matchesDirectionStyleRuleList(element2, rules))
+      return true;
+  }
+  return false;
+}
+function matchesDirectionStyleRuleList(element2, rules) {
+  for (const rule of Array.from(rules)) {
+    if (isCssStyleRule(rule)) {
+      if (!rule.style.direction) {
+        const nestedRules2 = readNestedCssRules(rule);
+        if (nestedRules2 && matchesDirectionStyleRuleList(element2, nestedRules2))
+          return true;
+        continue;
+      }
+      try {
+        if (element2.matches(rule.selectorText))
+          return true;
+      } catch {
+        continue;
+      }
+    }
+    const nestedRules = readNestedCssRules(rule);
+    if (nestedRules && isConditionalRuleActive(rule) && matchesDirectionStyleRuleList(element2, nestedRules)) {
+      return true;
+    }
+  }
+  return false;
+}
+function readNestedCssRules(rule) {
+  if (!("cssRules" in rule))
+    return;
+  try {
+    const nestedRules = Reflect.get(rule, "cssRules");
+    return isCssRuleCollection(nestedRules) ? nestedRules : undefined;
+  } catch {
+    return;
+  }
+}
+function isCssRuleCollection(value) {
+  if (typeof CSSRuleList !== "undefined" && value instanceof CSSRuleList)
+    return true;
+  return Array.isArray(value) && value.every(isCssRule);
+}
+function isCssRule(value) {
+  return typeof value === "object" && value !== null && typeof Reflect.get(value, "cssText") === "string" && typeof Reflect.get(value, "type") === "number";
+}
+function isCssStyleRule(rule) {
+  return typeof Reflect.get(rule, "selectorText") === "string" && typeof Reflect.get(rule, "style") === "object" && Reflect.get(rule, "style") !== null;
+}
+function isConditionalRuleActive(rule) {
+  const conditionText = Reflect.get(rule, "conditionText");
+  if (typeof conditionText !== "string" || !conditionText.trim())
+    return true;
+  if (isMediaRule(rule) && typeof matchMedia === "function") {
+    return matchMedia(conditionText).matches;
+  }
+  if (isSupportsRule(rule) && typeof CSS !== "undefined" && typeof CSS.supports === "function") {
+    return CSS.supports(conditionText);
+  }
+  return true;
+}
+function isMediaRule(rule) {
+  return typeof Reflect.get(rule, "media") === "object" && Reflect.get(rule, "media") !== null;
+}
+function isSupportsRule(rule) {
+  return rule.constructor.name === "CSSSupportsRule" || Reflect.get(rule, "type") === 12;
+}
+function observeTextDirection(element2, onChange) {
+  if (!element2 || typeof MutationObserver === "undefined")
+    return;
+  const observedElement = element2;
+  const observer = new MutationObserver((mutations) => {
+    if (mutations.some((mutation) => mutation.type === "attributes" && mutation.attributeName === "dir")) {
+      observeDirectionChain();
+    }
+    onChange();
+  });
+  function observeDirectionChain() {
+    observer.disconnect();
+    let currentElement = observedElement;
+    while (currentElement) {
+      const isAutoDirection = currentElement.getAttribute("dir")?.toLowerCase() === "auto";
+      observer.observe(currentElement, {
+        attributes: true,
+        attributeFilter: ["dir", "style", "class"],
+        childList: isAutoDirection,
+        characterData: isAutoDirection,
+        subtree: isAutoDirection
+      });
+      currentElement = currentElement.parentElement;
+    }
+  }
+  observeDirectionChain();
+  return () => observer.disconnect();
+}
+
+// src/utilities/typeahead.ts
+function isTypeaheadKey(event3) {
+  return event3.key.length === 1 && event3.key !== " " && !event3.ctrlKey && !event3.metaKey && !event3.altKey && !event3.isComposing;
+}
+function findTypeaheadMatch(candidates, prefix, currentIndex) {
+  if (candidates.length === 0)
+    return;
+  const normalizedPrefix = prefix.toLocaleLowerCase();
+  const startIndex = currentIndex < 0 ? -1 : currentIndex;
+  for (let offset3 = 1;offset3 <= candidates.length; offset3 += 1) {
+    const index3 = (startIndex + offset3) % candidates.length;
+    const candidate = candidates[index3];
+    if (!candidate || candidate.disabled)
+      continue;
+    if (candidate.label.toLocaleLowerCase().startsWith(normalizedPrefix)) {
+      return candidate.value;
+    }
+  }
+  return;
+}
+
+class TypeaheadBuffer {
+  #value = "";
+  #timer = null;
+  push(character) {
+    this.clearTimer();
+    this.#value += character.toLocaleLowerCase();
+    this.#timer = setTimeout(() => {
+      this.reset();
+    }, 500);
+    return this.#value;
+  }
+  reset() {
+    this.clearTimer();
+    this.#value = "";
+  }
+  clearTimer() {
+    if (this.#timer === null)
+      return;
+    clearTimeout(this.#timer);
+    this.#timer = null;
+  }
+}
+
+// src/components/dropdown-menu/dropdown-menu.svelte
+var root_16 = $35.from_html(`<div><!></div>`);
 function Dropdown_menu($$anchor, $$props) {
   $35.push($$props, true);
-  let rest = $35.rest_props($$props, ["$$slots", "$$events", "$$legacy", "class", "children"]);
+  let rest = $35.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "class",
+    "children",
+    "dir"
+  ]);
   const context = getDropdownContext();
   const registerMenu = getDropdownRegister();
   const setOpen = getDropdownSetOpen();
+  const localeContext = getLocaleContext();
+  let directionRevision = $35.state(0);
+  const resolvedDirection = $35.derived(() => {
+    $35.get(directionRevision);
+    if ($$props.dir === "auto") {
+      return resolveTextDirection(context.anchorElement, localeContext?.direction) ?? $$props.dir;
+    }
+    return $$props.dir ?? resolveTextDirection(context.anchorElement, localeContext?.direction);
+  });
+  const fallbackAnchorElement = $35.derived(() => context.fallbackAnchorElement === undefined ? context.anchorElement : context.fallbackAnchorElement);
   let menuElement = $35.state(null);
   let focusedFallbackOpen = false;
+  const typeaheadBuffer = new TypeaheadBuffer;
   const anchoredFallback = createAnchoredOverlay({
-    open: () => context.isOpen && !context.supportsPopover && Boolean(context.anchorElement),
-    anchor: () => context.anchorElement,
+    open: () => context.isOpen && !context.supportsPopover && Boolean($35.get(fallbackAnchorElement)),
+    anchor: () => $35.get(fallbackAnchorElement),
     panel: () => $35.get(menuElement),
     placement: () => context.fallbackPlacement ?? "bottom-end",
     offset: () => 4,
     widthMode: () => context.widthMode ?? "menu"
   });
+  const fallbackPositionStyle = $35.derived(() => context.fallbackPositionStyle ?? ($35.get(fallbackAnchorElement) ? anchoredFallback.positionStyle : undefined));
+  const fallbackPositionReady = $35.derived(() => context.fallbackPositionReady ?? ($35.get(fallbackAnchorElement) ? anchoredFallback.positionReady : undefined));
   const fallbackPortalAttachment = createPortalAttachment({
     target: () => typeof document === "undefined" ? null : document.body,
     source: () => context.anchorElement,
@@ -4784,6 +5134,20 @@ function Dropdown_menu($$anchor, $$props) {
     registerMenu($35.get(menuElement));
     return () => registerMenu(null);
   });
+  $35.user_effect(() => {
+    return () => typeaheadBuffer.reset();
+  });
+  $35.user_effect(() => {
+    if (!context.isOpen)
+      typeaheadBuffer.reset();
+  });
+  $35.user_effect(() => {
+    if ($$props.dir && $$props.dir !== "auto")
+      return;
+    return observeTextDirection(context.anchorElement, () => {
+      $35.set(directionRevision, $35.get(directionRevision) + 1);
+    });
+  });
   $35.user_effect(() => {
     if (context.supportsPopover || !context.isOpen) {
       focusedFallbackOpen = false;
@@ -4799,7 +5163,11 @@ function Dropdown_menu($$anchor, $$props) {
   function getOwnedMenuItems() {
     if (!$35.get(menuElement))
       return [];
-    return Array.from($35.get(menuElement).querySelectorAll('[role="menuitem"]:not([data-disabled])')).filter((item) => item.closest('[role="menu"]') === $35.get(menuElement));
+    return Array.from($35.get(menuElement).querySelectorAll([
+      '[role="menuitem"]:not([data-disabled])',
+      '[role="menuitemcheckbox"]:not([data-disabled])',
+      '[role="menuitemradio"]:not([data-disabled])'
+    ].join(", "))).filter((item) => item.closest('[role="menu"]') === $35.get(menuElement));
   }
   function focusMenuItem(index3) {
     const items = getOwnedMenuItems();
@@ -4842,6 +5210,16 @@ function Dropdown_menu($$anchor, $$props) {
       event3.preventDefault();
       event3.stopPropagation();
       focusMenuItem(itemsArray.length - 1);
+    } else if (isTypeaheadKey(event3)) {
+      event3.preventDefault();
+      event3.stopPropagation();
+      const match = findTypeaheadMatch(itemsArray.map((item, index3) => ({
+        value: index3,
+        label: item.textContent?.trim() ?? "",
+        disabled: item.hasAttribute("data-disabled")
+      })), typeaheadBuffer.push(event3.key), currentIndex);
+      if (match !== undefined)
+        focusMenuItem(match);
     }
   }
   function handleToggle(event3) {
@@ -4857,19 +5235,21 @@ function Dropdown_menu($$anchor, $$props) {
   var node = $35.first_child(fragment);
   {
     var consequent_1 = ($$anchor2) => {
-      var div = root_15();
+      var div = root_16();
       $35.attribute_effect(div, ($0) => ({
         id: context.menuId,
         popover: context.supportsPopover ? "auto" : undefined,
         class: $0,
-        style: context.supportsPopover ? `position-anchor: --${context.menuId};` : context.anchorElement ? anchoredFallback.positionStyle : undefined,
+        style: context.supportsPopover ? `position-anchor: --${context.menuId};` : $35.get(fallbackPositionStyle),
         role: "menu",
         "aria-orientation": "vertical",
-        "data-cinder-position-ready": !context.supportsPopover && context.anchorElement ? anchoredFallback.positionReady : undefined,
+        "data-cinder-position-ready": !context.supportsPopover && $35.get(fallbackPositionReady) !== undefined ? $35.get(fallbackPositionReady) : undefined,
         tabindex: -1,
         onkeydown: handleKeydown,
         ontoggle: context.supportsPopover ? handleToggle : undefined,
-        ...rest
+        ...rest,
+        dir: $35.get(resolvedDirection),
+        "data-cinder-explicit-direction": $35.get(resolvedDirection) ? "true" : undefined
       }), [
         () => classNames("cinder-_floating-surface", "cinder-dropdown-menu", $$props.class)
       ]);
@@ -4889,6 +5269,7 @@ function Dropdown_menu($$anchor, $$props) {
       $35.reset(div);
       $35.bind_this(div, ($$value) => $35.set(menuElement, $$value), () => $35.get(menuElement));
       $35.attach(div, () => fallbackPortalAttachment);
+      $35.template_effect(() => div.dir = div.dir);
       $35.append($$anchor2, div);
     };
     $35.if(node, ($$render) => {
@@ -4903,15 +5284,17 @@ function Dropdown_menu($$anchor, $$props) {
 // src/components/dropdown-item/dropdown-item.svelte
 import"svelte/internal/disclose-version";
 import * as $36 from "svelte/internal/client";
-var root_16 = $36.from_html(`<a><!></a>`);
+var root_17 = $36.from_html(`<a><!></a>`);
 var root_32 = $36.from_html(`<button><!></button>`);
 function Dropdown_item($$anchor, $$props) {
   $36.push($$props, true);
-  let variant = $36.prop($$props, "variant", 3, "default"), inset = $36.prop($$props, "inset", 3, false), closeOnSelect = $36.prop($$props, "closeOnSelect", 3, true), rest = $36.rest_props($$props, [
+  let variant = $36.prop($$props, "variant", 3, "default"), itemRole = $36.prop($$props, "itemRole", 3, "menuitem"), checked = $36.prop($$props, "checked", 3, false), inset = $36.prop($$props, "inset", 3, false), closeOnSelect = $36.prop($$props, "closeOnSelect", 3, true), rest = $36.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
     "variant",
+    "itemRole",
+    "checked",
     "inset",
     "disabled",
     "closeOnSelect",
@@ -4953,18 +5336,20 @@ function Dropdown_item($$anchor, $$props) {
       return;
     event3.currentTarget.click();
   }
-  const anchorAttributes = rest;
-  const buttonAttributes = rest;
+  const anchorAttributes = $36.derived(() => rest);
+  const buttonAttributes = $36.derived(() => rest);
   const buttonType = $36.derived(() => $$props.type ?? "button");
+  const ariaChecked = $36.derived(() => itemRole() === "menuitemcheckbox" || itemRole() === "menuitemradio" ? checked() : undefined);
   var fragment = $36.comment();
   var node = $36.first_child(fragment);
   {
     var consequent_1 = ($$anchor2) => {
-      var a = root_16();
+      var a = root_17();
       $36.attribute_effect(a, () => ({
-        ...anchorAttributes,
+        ...$36.get(anchorAttributes),
         href: $$props.href,
-        role: "menuitem",
+        role: itemRole(),
+        "aria-checked": $36.get(ariaChecked),
         class: $36.get(sharedClass),
         "data-cinder-variant": variant(),
         tabindex: -1,
@@ -4992,9 +5377,10 @@ function Dropdown_item($$anchor, $$props) {
     var alternate = ($$anchor2) => {
       var button = root_32();
       $36.attribute_effect(button, () => ({
-        ...buttonAttributes,
+        ...$36.get(buttonAttributes),
         type: $36.get(buttonType),
-        role: "menuitem",
+        role: itemRole(),
+        "aria-checked": $36.get(ariaChecked),
         class: $36.get(sharedClass),
         "data-cinder-variant": variant(),
         tabindex: -1,
@@ -5031,9 +5417,9 @@ function Dropdown_item($$anchor, $$props) {
 }
 
 // src/components/markdown-editor/editor-toolbar/toolbar-dropdown.svelte
-var root_23 = $37.from_html(`<!> <span class="toolbar-dropdown-label svelte-1v28aut"> </span>`, 1);
+var root_24 = $37.from_html(`<!> <span class="toolbar-dropdown-label svelte-1v28aut"> </span>`, 1);
 var root_6 = $37.from_html(`<!> <span class="dropdown-item-label svelte-1v28aut"> </span> <!>`, 1);
-var root_17 = $37.from_html(`<!> <!>`, 1);
+var root_18 = $37.from_html(`<!> <!>`, 1);
 function Toolbar_dropdown($$anchor, $$props) {
   $37.push($$props, true);
   let disabled = $37.prop($$props, "disabled", 3, false);
@@ -5046,7 +5432,7 @@ function Toolbar_dropdown($$anchor, $$props) {
       return $$props.id;
     },
     children: ($$anchor2, $$slotProps) => {
-      var fragment_1 = root_17();
+      var fragment_1 = root_18();
       var node = $37.first_child(fragment_1);
       {
         let $0 = $37.derived(() => classNames("toolbar-dropdown-trigger", $$props.class));
@@ -5062,7 +5448,7 @@ function Toolbar_dropdown($$anchor, $$props) {
             return $37.get($1);
           },
           children: ($$anchor3, $$slotProps2) => {
-            var fragment_2 = root_23();
+            var fragment_2 = root_24();
             var node_1 = $37.first_child(fragment_2);
             {
               var consequent = ($$anchor4) => {
@@ -5101,6 +5487,10 @@ function Toolbar_dropdown($$anchor, $$props) {
                 get "data-active"() {
                   return $37.get($0);
                 },
+                itemRole: "menuitemradio",
+                get checked() {
+                  return $37.get(isActive);
+                },
                 children: ($$anchor5, $$slotProps3) => {
                   var fragment_6 = root_6();
                   var node_5 = $37.first_child(fragment_6);
@@ -5139,11 +5529,11 @@ function Toolbar_dropdown($$anchor, $$props) {
 }
 
 // src/components/markdown-editor/editor-toolbar/editor-toolbar.svelte
-var root_24 = $38.from_html(`<div class="toolbar-spacer svelte-1m9m099"></div> <!>`, 1);
-var root_18 = $38.from_html(`<div class="toolbar-group svelte-1m9m099" role="group" aria-label="History"><!> <!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Block type"><!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Text formatting"><!> <!> <!> <!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Links"><!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Lists"><!> <!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Block operations"><!></div> <!>`, 1);
+var root_25 = $38.from_html(`<div class="toolbar-spacer svelte-1m9m099"></div> <!>`, 1);
+var root_19 = $38.from_html(`<div class="toolbar-group svelte-1m9m099" role="group" aria-label="History"><!> <!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Block type"><!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Text formatting"><!> <!> <!> <!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Links"><!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Lists"><!> <!></div> <!> <div class="toolbar-group svelte-1m9m099" role="group" aria-label="Block operations"><!></div> <!>`, 1);
 function Editor_toolbar($$anchor, $$props) {
   $38.push($$props, true);
-  let canUndo = $38.prop($$props, "canUndo", 3, false), canRedo = $38.prop($$props, "canRedo", 3, false), disabled = $38.prop($$props, "disabled", 3, false), rest = $38.rest_props($$props, [
+  let canUndo = $38.prop($$props, "canUndo", 3, false), canRedo = $38.prop($$props, "canRedo", 3, false), disabled = $38.prop($$props, "disabled", 3, false), linkPopoverOpen = $38.prop($$props, "linkPopoverOpen", 3, false), rest = $38.rest_props($$props, [
     "$$slots",
     "$$events",
     "$$legacy",
@@ -5155,6 +5545,7 @@ function Editor_toolbar($$anchor, $$props) {
     "canUndo",
     "canRedo",
     "disabled",
+    "linkPopoverOpen",
     "onLinkClick",
     "onUndo",
     "onRedo",
@@ -5260,7 +5651,7 @@ function Editor_toolbar($$anchor, $$props) {
       }
     }, () => rest, {
       children: ($$anchor2, $$slotProps) => {
-        var fragment_1 = root_18();
+        var fragment_1 = root_19();
         var div = $38.first_child(fragment_1);
         var node = $38.child(div);
         {
@@ -5430,9 +5821,9 @@ function Editor_toolbar($$anchor, $$props) {
             get shortcut() {
               return $38.get($02);
             },
-            toggle: true,
-            get pressed() {
-              return $$props.activeMarks.link;
+            "aria-haspopup": "dialog",
+            get "aria-expanded"() {
+              return linkPopoverOpen();
             },
             get disabled() {
               return disabled();
@@ -5522,7 +5913,7 @@ function Editor_toolbar($$anchor, $$props) {
         var node_16 = $38.sibling(div_5, 2);
         {
           var consequent = ($$anchor3) => {
-            var fragment_2 = root_24();
+            var fragment_2 = root_25();
             var node_17 = $38.sibling($38.first_child(fragment_2), 2);
             $38.snippet(node_17, () => $$props.actions);
             $38.append($$anchor3, fragment_2);
@@ -5542,26 +5933,27 @@ function Editor_toolbar($$anchor, $$props) {
 // src/components/markdown-editor/editor-toolbar/link-popover.svelte
 import"svelte/internal/disclose-version";
 import * as $43 from "svelte/internal/client";
+import { tick as tick2 } from "svelte";
 
 // src/components/button/button.svelte
 import"svelte/internal/disclose-version";
 import * as $39 from "svelte/internal/client";
-var root_25 = $39.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
+var root_26 = $39.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
 var root_4 = $39.from_html(`<span class="cinder-sr-only"> </span>`);
 var root_52 = $39.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
 var root_33 = $39.from_html(`<!> <!>`, 1);
 var root_8 = $39.from_html(`<span class="cinder-button__icon" aria-hidden="true"><!></span>`);
-var root_19 = $39.from_html(`<!> <!> <!>`, 1);
+var root_110 = $39.from_html(`<!> <!> <!>`, 1);
 var root_9 = $39.from_html(`<a><!></a>`);
 var root_10 = $39.from_html(`<button><!></button>`);
 function Button($$anchor, $$props) {
   $39.push($$props, true);
   const buttonContent = ($$anchor2) => {
-    var fragment = root_19();
+    var fragment = root_110();
     var node = $39.first_child(fragment);
     {
       var consequent = ($$anchor3) => {
-        var span = root_25();
+        var span = root_26();
         var node_1 = $39.child(span);
         $39.snippet(node_1, () => $$props.leadingIcon);
         $39.reset(span);
@@ -5808,57 +6200,54 @@ function resolveFieldControl(input) {
 }
 
 // src/_internal/form-field-context.ts
-import { createContext as createContext3 } from "svelte";
-
-// src/_internal/optional-context.ts
-function optionalContext(getStrict) {
-  return () => {
-    try {
-      return getStrict();
-    } catch {
-      return;
-    }
-  };
-}
-
-// src/_internal/form-field-context.ts
-var [getFormFieldContextStrict, setFormFieldContextRaw] = createContext3();
+import { createContext as createContext4 } from "svelte";
+var [getFormFieldContextStrict, setFormFieldContextRaw] = createContext4();
 function setFormFieldContext(context) {
   setFormFieldContextRaw(context);
 }
 var getFormFieldContext = optionalContext(getFormFieldContextStrict);
 
+// src/utilities/value-change.ts
+function commitValue(proposed, onValueChange, setValue) {
+  const committed = onValueChange?.(proposed) ?? proposed;
+  setValue(committed);
+  return committed;
+}
+
 // src/components/input/input.svelte
 var calendarIcon = ($$anchor) => {
-  var svg = root_110();
+  var svg = root_111();
   $40.append($$anchor, svg);
 };
-var root_110 = $40.from_svg(`<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>`);
-var root_26 = $40.from_html(`<input/>`);
-var root_34 = $40.from_html(`<label class="cinder-input-field__label"> </label>`);
-var root_53 = $40.from_html(`<span class="cinder-input-group__leading cinder-_truncate"><!></span>`);
-var root_62 = $40.from_html(`<span class="cinder-input-group__trailing cinder-_truncate"><!></span>`);
-var root_7 = $40.from_html(`<span class="cinder-input-group__trailing cinder-input-group__date-icon cinder-_truncate" aria-hidden="true"><!></span>`);
-var root_42 = $40.from_html(`<div class="cinder-input-group"><!> <!> <!></div>`);
-var root_92 = $40.from_html(`<p class="cinder-input-field__description"> </p>`);
-var root_102 = $40.from_html(`<p class="cinder-input-field__error" aria-live="polite"> </p>`);
+var root_111 = $40.from_svg(`<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>`);
+var root_27 = $40.from_html(`<input/>`);
+var root_42 = $40.from_html(`<span class="cinder-_required-marker" aria-hidden="true">*</span>`);
+var root_34 = $40.from_html(`<label class="cinder-input-field__label"> <!></label>`);
+var root_62 = $40.from_html(`<span class="cinder-input-group__leading cinder-_truncate"><!></span>`);
+var root_7 = $40.from_html(`<span class="cinder-input-group__trailing cinder-_truncate"><!></span>`);
+var root_82 = $40.from_html(`<span class="cinder-input-group__trailing cinder-input-group__date-icon cinder-_truncate" aria-hidden="true"><!></span>`);
+var root_53 = $40.from_html(`<div class="cinder-input-group"><!> <!> <!></div>`);
+var root_102 = $40.from_html(`<p class="cinder-input-field__description"> </p>`);
+var root_11 = $40.from_html(`<p class="cinder-input-field__error" aria-live="polite"> </p>`);
 var root12 = $40.from_html(`<div class="cinder-input-field"><!> <!> <!> <!></div>`);
 function Input($$anchor, $$props) {
   $40.push($$props, true);
   const inputElement = ($$anchor2) => {
-    var input = root_26();
+    var input = root_27();
     $40.attribute_effect(input, ($0) => ({
       id: $$props.id,
       type: type(),
+      ...rest,
       disabled: $40.get(resolvedDisabled),
       required: $40.get(resolvedRequired),
+      value: value(),
+      oninput: handleInput,
       class: $0,
       "data-cinder-native-date": $40.get(rendersNativeDateIcon) ? "" : undefined,
       "aria-invalid": $40.get(resolvedAriaInvalid),
-      "aria-describedby": $40.get(describedBy),
-      ...rest
+      "aria-describedby": $40.get(describedBy)
     }), [() => classNames("cinder-input", $$props.class)], undefined, undefined, undefined, true);
-    $40.bind_value(input, value);
+    $40.bind_this(input, ($$value) => $40.set(inputNode, $$value), () => $40.get(inputNode));
     $40.append($$anchor2, input);
   };
   let value = $40.prop($$props, "value", 15, ""), type = $40.prop($$props, "type", 3, "text"), leadingInteractive = $40.prop($$props, "leadingInteractive", 3, false), trailingInteractive = $40.prop($$props, "trailingInteractive", 3, false), rest = $40.rest_props($$props, [
@@ -5867,6 +6256,7 @@ function Input($$anchor, $$props) {
     "$$legacy",
     "id",
     "value",
+    "onValueChange",
     "label",
     "description",
     "error",
@@ -5878,7 +6268,9 @@ function Input($$anchor, $$props) {
     "trailing",
     "leadingInteractive",
     "trailingInteractive",
-    "aria-describedby"
+    "aria-describedby",
+    "aria-invalid",
+    "oninput"
   ]);
   const context = getFormFieldContext();
   $40.user_effect(() => {
@@ -5886,83 +6278,134 @@ function Input($$anchor, $$props) {
       devWarn(`[cinder/Input] id mismatch: Input id="${$$props.id}" but wrapping FormField expects controlId="${context.controlId}". Set the same id on both.`);
     }
   });
-  const defaultDescriptionId = $40.derived(() => describeId($$props.id, !!$$props.description));
-  const defaultErrorId = $40.derived(() => errorId($$props.id, !!$$props.error));
-  const ownDescriptionId = $40.derived(() => $$props.description && $40.get(defaultDescriptionId) === context?.descriptionId ? `${$$props.id}-input-description` : $40.get(defaultDescriptionId));
-  const ownErrorId = $40.derived(() => $$props.error && $40.get(defaultErrorId) === context?.errorId ? `${$$props.id}-input-error` : $40.get(defaultErrorId));
-  const resolvedDescriptionId = $40.derived(() => $40.get(ownDescriptionId) ?? context?.descriptionId);
-  const resolvedErrorId = $40.derived(() => $40.get(ownErrorId) ?? context?.errorId);
-  const describedBy = $40.derived(() => composeDescribedBy($40.get(resolvedDescriptionId), $40.get(resolvedErrorId), $$props["aria-describedby"]));
-  const resolvedAriaInvalid = $40.derived(() => $$props.error ? ariaInvalid(true) : context?.invalid ?? rest["aria-invalid"] ?? ariaInvalid(false));
-  const resolvedRequired = $40.derived(() => $$props.required ?? context?.required ?? false);
-  const resolvedDisabled = $40.derived(() => $$props.disabled ?? context?.disabled ?? false);
+  const field = $40.derived(() => resolveFieldControl({
+    id: $$props.id,
+    generatedId: $$props.id,
+    context,
+    hasDescription: !!$$props.description,
+    hasError: !!$$props.error,
+    localIdNamespace: "input",
+    consumerDescribedBy: $$props["aria-describedby"],
+    consumerInvalid: $$props["aria-invalid"],
+    required: $$props.required,
+    disabled: $$props.disabled
+  }));
+  const ownDescriptionId = $40.derived(() => $40.get(field).ownDescriptionId);
+  const ownErrorId = $40.derived(() => $40.get(field).ownErrorId);
+  const describedBy = $40.derived(() => $40.get(field).describedBy);
+  const resolvedAriaInvalid = $40.derived(() => $40.get(field).ariaInvalid);
+  const resolvedRequired = $40.derived(() => $40.get(field).required);
+  const resolvedDisabled = $40.derived(() => $40.get(field).disabled);
   const isNativeDateInput = $40.derived(() => type() === "date");
   const rendersNativeDateIcon = $40.derived(() => $40.get(isNativeDateInput) && !$$props.trailing);
   const hasTrailing = $40.derived(() => !!$$props.trailing || $40.get(isNativeDateInput));
   const hasGroupWrapper = $40.derived(() => !!$$props.leading || $40.get(hasTrailing));
-  const isInvalid = $40.derived(() => $40.get(resolvedAriaInvalid) === "true" || $40.get(resolvedAriaInvalid) === true);
+  const isInvalid = $40.derived(() => $40.get(resolvedAriaInvalid) === "true");
+  let inputNode = $40.state(undefined);
+  let resetSyncTimeout;
+  function syncValueAfterFormReset() {
+    if (resetSyncTimeout !== undefined)
+      clearTimeout(resetSyncTimeout);
+    resetSyncTimeout = setTimeout(() => {
+      resetSyncTimeout = undefined;
+      if ($40.get(inputNode))
+        value($40.get(inputNode).value);
+    }, 0);
+  }
+  $40.user_effect(() => {
+    const form = $40.get(inputNode)?.form;
+    if (!form)
+      return;
+    form.addEventListener("reset", syncValueAfterFormReset);
+    return () => {
+      form.removeEventListener("reset", syncValueAfterFormReset);
+      if (resetSyncTimeout !== undefined) {
+        clearTimeout(resetSyncTimeout);
+        resetSyncTimeout = undefined;
+      }
+    };
+  });
+  function handleInput(event3) {
+    const target = event3.currentTarget;
+    const committed = commitValue(target.value, $$props.onValueChange, (next) => {
+      value(next);
+    });
+    target.value = committed;
+    $$props.oninput?.(event3);
+  }
   var div = root12();
   var node = $40.child(div);
   {
-    var consequent = ($$anchor2) => {
+    var consequent_1 = ($$anchor2) => {
       var label_1 = root_34();
-      var text2 = $40.child(label_1, true);
+      var text2 = $40.child(label_1);
+      var node_1 = $40.sibling(text2);
+      {
+        var consequent = ($$anchor3) => {
+          var span = root_42();
+          $40.append($$anchor3, span);
+        };
+        $40.if(node_1, ($$render) => {
+          if ($40.get(resolvedRequired))
+            $$render(consequent);
+        });
+      }
       $40.reset(label_1);
       $40.template_effect(() => {
         $40.set_attribute(label_1, "for", $$props.id);
         $40.set_attribute(label_1, "data-disabled", $40.get(resolvedDisabled) || undefined);
-        $40.set_text(text2, $$props.label);
+        $40.set_text(text2, `${$$props.label ?? ""} `);
       });
       $40.append($$anchor2, label_1);
     };
     $40.if(node, ($$render) => {
       if ($$props.label)
-        $$render(consequent);
+        $$render(consequent_1);
     });
   }
-  var node_1 = $40.sibling(node, 2);
+  var node_2 = $40.sibling(node, 2);
   {
-    var consequent_4 = ($$anchor2) => {
-      var div_1 = root_42();
-      var node_2 = $40.child(div_1);
-      {
-        var consequent_1 = ($$anchor3) => {
-          var span = root_53();
-          var node_3 = $40.child(span);
-          $40.snippet(node_3, () => $$props.leading);
-          $40.reset(span);
-          $40.template_effect(() => $40.set_attribute(span, "aria-hidden", leadingInteractive() ? undefined : "true"));
-          $40.append($$anchor3, span);
-        };
-        $40.if(node_2, ($$render) => {
-          if ($$props.leading)
-            $$render(consequent_1);
-        });
-      }
-      var node_4 = $40.sibling(node_2, 2);
-      inputElement(node_4);
-      var node_5 = $40.sibling(node_4, 2);
+    var consequent_5 = ($$anchor2) => {
+      var div_1 = root_53();
+      var node_3 = $40.child(div_1);
       {
         var consequent_2 = ($$anchor3) => {
           var span_1 = root_62();
-          var node_6 = $40.child(span_1);
-          $40.snippet(node_6, () => $$props.trailing);
+          var node_4 = $40.child(span_1);
+          $40.snippet(node_4, () => $$props.leading);
           $40.reset(span_1);
-          $40.template_effect(() => $40.set_attribute(span_1, "aria-hidden", trailingInteractive() ? undefined : "true"));
+          $40.template_effect(() => $40.set_attribute(span_1, "aria-hidden", leadingInteractive() ? undefined : "true"));
           $40.append($$anchor3, span_1);
         };
+        $40.if(node_3, ($$render) => {
+          if ($$props.leading)
+            $$render(consequent_2);
+        });
+      }
+      var node_5 = $40.sibling(node_3, 2);
+      inputElement(node_5);
+      var node_6 = $40.sibling(node_5, 2);
+      {
         var consequent_3 = ($$anchor3) => {
           var span_2 = root_7();
           var node_7 = $40.child(span_2);
-          calendarIcon(node_7);
+          $40.snippet(node_7, () => $$props.trailing);
           $40.reset(span_2);
+          $40.template_effect(() => $40.set_attribute(span_2, "aria-hidden", trailingInteractive() ? undefined : "true"));
           $40.append($$anchor3, span_2);
         };
-        $40.if(node_5, ($$render) => {
+        var consequent_4 = ($$anchor3) => {
+          var span_3 = root_82();
+          var node_8 = $40.child(span_3);
+          calendarIcon(node_8);
+          $40.reset(span_3);
+          $40.append($$anchor3, span_3);
+        };
+        $40.if(node_6, ($$render) => {
           if ($$props.trailing)
-            $$render(consequent_2);
+            $$render(consequent_3);
           else if ($40.get(rendersNativeDateIcon))
-            $$render(consequent_3, 1);
+            $$render(consequent_4, 1);
         });
       }
       $40.reset(div_1);
@@ -5978,17 +6421,17 @@ function Input($$anchor, $$props) {
     var alternate = ($$anchor2) => {
       inputElement($$anchor2);
     };
-    $40.if(node_1, ($$render) => {
+    $40.if(node_2, ($$render) => {
       if ($40.get(hasGroupWrapper))
-        $$render(consequent_4);
+        $$render(consequent_5);
       else
         $$render(alternate, -1);
     });
   }
-  var node_8 = $40.sibling(node_1, 2);
+  var node_9 = $40.sibling(node_2, 2);
   {
-    var consequent_5 = ($$anchor2) => {
-      var p = root_92();
+    var consequent_6 = ($$anchor2) => {
+      var p = root_102();
       var text_1 = $40.child(p, true);
       $40.reset(p);
       $40.template_effect(() => {
@@ -5997,15 +6440,15 @@ function Input($$anchor, $$props) {
       });
       $40.append($$anchor2, p);
     };
-    $40.if(node_8, ($$render) => {
+    $40.if(node_9, ($$render) => {
       if ($$props.description)
-        $$render(consequent_5);
+        $$render(consequent_6);
     });
   }
-  var node_9 = $40.sibling(node_8, 2);
+  var node_10 = $40.sibling(node_9, 2);
   {
-    var consequent_6 = ($$anchor2) => {
-      var p_1 = root_102();
+    var consequent_7 = ($$anchor2) => {
+      var p_1 = root_11();
       var text_2 = $40.child(p_1, true);
       $40.reset(p_1);
       $40.template_effect(() => {
@@ -6014,9 +6457,9 @@ function Input($$anchor, $$props) {
       });
       $40.append($$anchor2, p_1);
     };
-    $40.if(node_9, ($$render) => {
+    $40.if(node_10, ($$render) => {
       if ($$props.error)
-        $$render(consequent_6);
+        $$render(consequent_7);
     });
   }
   $40.reset(div);
@@ -6101,6 +6544,21 @@ function Link_popover($$anchor, $$props) {
   });
   let url = $43.state($43.proxy(initialUrl()));
   let text3 = $43.state($43.proxy(initialText()));
+  let initialFocusApplied = false;
+  $43.user_effect(() => {
+    if (initialFocusApplied)
+      return;
+    if (!$43.get(popoverElement))
+      return;
+    if (anchorElement() && !anchoredOverlay.positionReady)
+      return;
+    tick2().then(() => {
+      if (initialFocusApplied)
+        return;
+      document.getElementById(`${$$props.id}-url`)?.focus();
+      initialFocusApplied = true;
+    });
+  });
   const ALLOWED_PROTOCOLS = [
     "http:",
     "https:",
@@ -6319,8 +6777,8 @@ var root_54 = $44.from_html(`<div class="toolbar-actions svelte-1mxvqjb"><!></di
 var root_72 = $44.from_html(`<!> <!>`, 1);
 var root_63 = $44.from_html(`<div class="toolbar-mode-toggle svelte-1mxvqjb"><!></div>`);
 var root_36 = $44.from_html(`<div class="editor-toolbar-wrapper svelte-1mxvqjb"><!> <!> <!> <!></div>`);
-var root_11 = $44.from_html(`<div class="cinder-markdown-content prose markdown-editor surface svelte-1mxvqjb" role="application" tabindex="0"></div>`);
-var root_122 = $44.from_html(`<textarea class="markdown-editor surface source-mode svelte-1mxvqjb"></textarea>`);
+var root_112 = $44.from_html(`<div class="cinder-markdown-content prose markdown-editor surface svelte-1mxvqjb" role="application" tabindex="0"></div>`);
+var root_122 = $44.from_html(`<textarea class="markdown-editor surface source-mode svelte-1mxvqjb" aria-multiline="true"></textarea>`);
 var root14 = $44.from_html(`<div><!> <!> <!></div>`);
 function Markdown_editor($$anchor, $$props) {
   $44.push($$props, true);
@@ -6339,10 +6797,10 @@ function Markdown_editor($$anchor, $$props) {
     "showToolbar",
     "class",
     "onchange",
-    "onReady",
+    "onready",
     "onmodechange",
-    "onSelectionChange",
-    "onCommentShortcut",
+    "onselectionchange",
+    "oncommentshortcut",
     "plugins",
     "placeholderCompletion",
     "placeholderDecoration",
@@ -6549,7 +7007,7 @@ function Markdown_editor($$anchor, $$props) {
     $44.set(linkPopoverAnchorElement, null);
     $44.get(editorState)?.focus();
   }
-  function handleLinkInsert(url, text4) {
+  function handleLinkInsert(url, text4 = undefined) {
     if (!$44.get(editorContext))
       return;
     if (text4) {
@@ -6593,12 +7051,12 @@ function Markdown_editor($$anchor, $$props) {
     getPlugins: () => plugins(),
     getPlaceholderCompletion: () => $$props.placeholderCompletion,
     getPlaceholderDecoration: () => $$props.placeholderDecoration,
-    onReady: (state12) => {
-      $44.set(editorState, state12, true);
+    onready: (state13) => {
+      $44.set(editorState, state13, true);
       $44.set(isInitializing, false);
-      $$props.onReady?.();
+      $$props.onready?.();
     },
-    onChange: (markdown) => {
+    onchange: (markdown) => {
       isInternalUpdate = true;
       value(markdown);
       $$props.onchange?.(markdown);
@@ -6607,16 +7065,16 @@ function Markdown_editor($$anchor, $$props) {
         isInternalUpdate = false;
       });
     },
-    onSelectionChange: (selection) => {
+    onselectionchange: (selection) => {
       $44.update(selectionVersion);
-      $$props.onSelectionChange?.(selection);
+      $$props.onselectionchange?.(selection);
     },
-    onLinkShortcut: () => {
+    onlinkshortcut: () => {
       $44.set(capturedLinkRange, $44.get(lastKnownLinkRange), true);
       $44.set(linkPopoverAnchorElement, resolveLinkPopoverAnchor(), true);
       $44.set(linkPopoverOpen, true);
     },
-    onCommentShortcut: () => $$props.onCommentShortcut?.()
+    oncommentshortcut: () => $$props.oncommentshortcut?.()
   });
   let previousMode = mode();
   $44.user_effect(() => {
@@ -6808,6 +7266,9 @@ function Markdown_editor($$anchor, $$props) {
               get canRedo() {
                 return $44.get(canRedo);
               },
+              get linkPopoverOpen() {
+                return $44.get(linkPopoverOpen);
+              },
               get disabled() {
                 return $44.get($1);
               },
@@ -6912,7 +7373,7 @@ function Markdown_editor($$anchor, $$props) {
       var node_13 = $44.first_child(fragment_3);
       {
         var consequent_5 = ($$anchor3) => {
-          var div_5 = root_11();
+          var div_5 = root_112();
           let styles;
           $44.attach(div_5, () => editorAttachment);
           $44.template_effect(() => {
@@ -7112,13 +7573,13 @@ function Trash_2($$anchor, $$props) {
   }));
 }
 // src/components/review-editor/comment-list.svelte
-var root_27 = $47.from_html(`<span class="comment-edited svelte-11dydst">(edited)</span>`);
+var root_28 = $47.from_html(`<span class="comment-edited svelte-11dydst">(edited)</span>`);
 var root_37 = $47.from_html(`<div class="comment-edit svelte-11dydst"><label class="sr-only svelte-11dydst">Edit comment</label> <textarea class="comment-edit-textarea svelte-11dydst"></textarea> <div class="comment-edit-actions svelte-11dydst"><!> <!></div></div>`);
 var root_64 = $47.from_html(`<div class="comment-body svelte-11dydst"> </div>`);
-var root_82 = $47.from_html(`<button type="button" class="comment-action svelte-11dydst" aria-label="Edit comment" title="Edit comment"><!></button>`);
-var root_93 = $47.from_html(`<button type="button" class="comment-action comment-action-danger svelte-11dydst" aria-label="Delete comment" title="Delete comment"><!></button>`);
+var root_83 = $47.from_html(`<button type="button" class="comment-action svelte-11dydst" aria-label="Edit comment" title="Edit comment"><!></button>`);
+var root_92 = $47.from_html(`<button type="button" class="comment-action comment-action-danger svelte-11dydst" aria-label="Delete comment" title="Delete comment"><!></button>`);
 var root_73 = $47.from_html(`<div class="comment-actions svelte-11dydst"><!> <!></div>`);
-var root_111 = $47.from_html(`<article class="comment svelte-11dydst"><header class="comment-header svelte-11dydst"><div class="comment-author svelte-11dydst"><div class="comment-avatar svelte-11dydst" aria-hidden="true"> </div> <span class="comment-author-name svelte-11dydst"> </span></div> <div class="comment-meta svelte-11dydst"><time class="comment-time svelte-11dydst"> </time> <!></div></header> <!> <!></article>`);
+var root_113 = $47.from_html(`<article class="comment svelte-11dydst"><header class="comment-header svelte-11dydst"><div class="comment-author svelte-11dydst"><div class="comment-avatar svelte-11dydst" aria-hidden="true"> </div> <span class="comment-author-name svelte-11dydst"> </span></div> <div class="comment-meta svelte-11dydst"><time class="comment-time svelte-11dydst"> </time> <!></div></header> <!> <!></article>`);
 var root_103 = $47.from_html(`<p class="comment-list-empty svelte-11dydst">No comments yet.</p>`);
 var root15 = $47.from_html(`<div><!> <!></div>`);
 function Comment_list($$anchor, $$props) {
@@ -7158,7 +7619,7 @@ function Comment_list($$anchor, $$props) {
   var div = root15();
   var node = $47.child(div);
   $47.each(node, 17, () => $47.get(visibleComments), (comment29) => comment29.id, ($$anchor2, comment29) => {
-    var article = root_111();
+    var article = root_113();
     var header = $47.child(article);
     var div_1 = $47.child(header);
     var div_2 = $47.child(div_1);
@@ -7175,7 +7636,7 @@ function Comment_list($$anchor, $$props) {
     var node_1 = $47.sibling(time, 2);
     {
       var consequent = ($$anchor3) => {
-        var span_1 = root_27();
+        var span_1 = root_28();
         $47.template_effect(() => $47.set_attribute(span_1, "title", `Edited ${$47.get(comment29).editedAt}`));
         $47.append($$anchor3, span_1);
       };
@@ -7256,7 +7717,7 @@ function Comment_list($$anchor, $$props) {
         var node_6 = $47.child(div_7);
         {
           var consequent_2 = ($$anchor4) => {
-            var button = root_82();
+            var button = root_83();
             var node_7 = $47.child(button);
             Pencil(node_7, { class: "icon-sm" });
             $47.reset(button);
@@ -7272,7 +7733,7 @@ function Comment_list($$anchor, $$props) {
         var node_8 = $47.sibling(node_6, 2);
         {
           var consequent_3 = ($$anchor4) => {
-            var button_1 = root_93();
+            var button_1 = root_92();
             var node_9 = $47.child(button_1);
             Trash_2(node_9, { class: "icon-sm" });
             $47.reset(button_1);
@@ -7328,7 +7789,7 @@ $47.delegate(["keydown", "click"]);
 // src/components/review-editor/comment-composer.svelte
 import"svelte/internal/disclose-version";
 import * as $48 from "svelte/internal/client";
-var root_28 = $48.from_html(`<p class="comment-composer-error svelte-uu92gn" role="alert"> </p>`);
+var root_29 = $48.from_html(`<p class="comment-composer-error svelte-uu92gn" role="alert"> </p>`);
 var root16 = $48.from_html(`<form><label class="sr-only svelte-uu92gn">Comment</label> <div class="comment-composer-textarea-container svelte-uu92gn"><textarea></textarea> <div class="comment-composer-inline-submit svelte-uu92gn"><!></div></div> <!> <div class="comment-composer-footer svelte-uu92gn"><span class="comment-composer-hint svelte-uu92gn"><kbd class="svelte-uu92gn"> </kbd><kbd class="svelte-uu92gn">↵</kbd> to submit</span> <div class="comment-composer-actions svelte-uu92gn"><!></div></div></form>`);
 function Comment_composer($$anchor, $$props) {
   $48.push($$props, true);
@@ -7452,7 +7913,7 @@ function Comment_composer($$anchor, $$props) {
   var node_1 = $48.sibling(div, 2);
   {
     var consequent = ($$anchor2) => {
-      var p = root_28();
+      var p = root_29();
       var text_1 = $48.child(p, true);
       $48.reset(p);
       $48.template_effect(() => {
@@ -7553,8 +8014,8 @@ function File_text($$anchor, $$props) {
   }));
 }
 // src/components/review-editor/thread-popover.svelte
-var root_112 = $50.from_html(`<span class="thread-popover-document-label svelte-jqotwh"><!> Document comment</span>`);
-var root_29 = $50.from_html(`<span class="thread-popover-quote svelte-jqotwh"> </span>`);
+var root_115 = $50.from_html(`<span class="thread-popover-document-label svelte-jqotwh"><!> Document comment</span>`);
+var root_210 = $50.from_html(`<span class="thread-popover-quote svelte-jqotwh"> </span>`);
 var root_55 = $50.from_html(`<div class="thread-popover-composer svelte-jqotwh"><!></div>`);
 var root17 = $50.from_html(`<div role="dialog" aria-modal="true" tabindex="-1"><header class="thread-popover-header svelte-jqotwh"><div class="thread-popover-title-row svelte-jqotwh"><h2 class="thread-popover-title svelte-jqotwh"><!></h2> <div class="thread-popover-header-actions svelte-jqotwh"><!> <button type="button" class="thread-popover-close svelte-jqotwh" aria-label="Close"><!></button></div></div></header> <div class="thread-popover-content svelte-jqotwh"><!></div> <!></div>`);
 function Thread_popover($$anchor, $$props) {
@@ -7619,7 +8080,7 @@ function Thread_popover($$anchor, $$props) {
   var node = $50.child(h2);
   {
     var consequent = ($$anchor2) => {
-      var span = root_112();
+      var span = root_115();
       var node_1 = $50.child(span);
       File_text(node_1, { class: "icon-xs" });
       $50.next();
@@ -7627,7 +8088,7 @@ function Thread_popover($$anchor, $$props) {
       $50.append($$anchor2, span);
     };
     var alternate = ($$anchor2) => {
-      var span_1 = root_29();
+      var span_1 = root_210();
       var text6 = $50.child(span_1);
       $50.reset(span_1);
       $50.template_effect(() => {
@@ -7738,8 +8199,8 @@ $50.delegate(["keydown", "click"]);
 // src/components/review-editor/live-region.svelte
 import"svelte/internal/disclose-version";
 import * as $51 from "svelte/internal/client";
-var root_113 = $51.from_html(`<div role="status" aria-live="polite" aria-atomic="true"> </div>`);
-var root_210 = $51.from_html(`<div role="alert" aria-live="assertive" aria-atomic="true"> </div>`);
+var root_116 = $51.from_html(`<div role="status" aria-live="polite" aria-atomic="true"> </div>`);
+var root_211 = $51.from_html(`<div role="alert" aria-live="assertive" aria-atomic="true"> </div>`);
 function Live_region($$anchor, $$props) {
   $51.push($$props, true);
   let message = $51.state("");
@@ -7783,7 +8244,7 @@ function Live_region($$anchor, $$props) {
   var node = $51.first_child(fragment);
   {
     var consequent = ($$anchor2) => {
-      var div = root_113();
+      var div = root_116();
       var text_1 = $51.child(div, true);
       $51.reset(div);
       $51.template_effect(($0) => {
@@ -7793,7 +8254,7 @@ function Live_region($$anchor, $$props) {
       $51.append($$anchor2, div);
     };
     var alternate = ($$anchor2) => {
-      var div_1 = root_210();
+      var div_1 = root_211();
       var text_2 = $51.child(div_1, true);
       $51.reset(div_1);
       $51.template_effect(($0) => {
@@ -8011,7 +8472,7 @@ function Message_square($$anchor, $$props) {
 }
 // src/components/review-editor/export-actions.svelte
 var root_38 = $57.from_html(`<!> <span class="cinder-sr-only">Copy</span>`, 1);
-var root_94 = $57.from_html(`<span class="copied-label svelte-1cj1bq5">Copied!</span>`);
+var root_93 = $57.from_html(`<span class="copied-label svelte-1cj1bq5">Copied!</span>`);
 var root_65 = $57.from_html(`<!> <span> </span> <!>`, 1);
 var root_132 = $57.from_html(`<span class="copied-label svelte-1cj1bq5">Copied!</span>`);
 var root_104 = $57.from_html(`<!> <span> </span> <!>`, 1);
@@ -8022,7 +8483,7 @@ var root_192 = $57.from_html(`<!> <span> </span> <!>`, 1);
 var root_262 = $57.from_html(`<span class="copied-label svelte-1cj1bq5">Copied!</span>`);
 var root_232 = $57.from_html(`<!> <span> </span> <!>`, 1);
 var root_44 = $57.from_html(`<!> <!> <!> <!> <!>`, 1);
-var root_211 = $57.from_html(`<!> <!>`, 1);
+var root_212 = $57.from_html(`<!> <!>`, 1);
 var root18 = $57.from_html(`<div><div class="cinder-sr-only" aria-live="polite" aria-atomic="true"><!></div> <!></div>`);
 function Export_actions($$anchor, $$props) {
   $57.push($$props, true);
@@ -8080,7 +8541,7 @@ function Export_actions($$anchor, $$props) {
       return $$props.id;
     },
     children: ($$anchor2, $$slotProps) => {
-      var fragment_1 = root_211();
+      var fragment_1 = root_212();
       var node_2 = $57.first_child(fragment_1);
       Dropdown_trigger(node_2, {
         class: "export-trigger",
@@ -8127,7 +8588,7 @@ function Export_actions($$anchor, $$props) {
                   var node_7 = $57.sibling(span, 2);
                   {
                     var consequent_2 = ($$anchor6) => {
-                      var span_1 = root_94();
+                      var span_1 = root_93();
                       $57.append($$anchor6, span_1);
                     };
                     $57.if(node_7, ($$render) => {
@@ -8383,7 +8844,7 @@ function Plus($$anchor, $$props) {
 }
 // src/components/review-editor/comment-sidebar.svelte
 import { getVisibleComments, isDocumentAnchor as isDocumentAnchor2 } from "@lostgradient/cinder/commentary/comments";
-var root_95 = $60.from_html(`<!> Clear all comments`, 1);
+var root_94 = $60.from_html(`<!> Clear all comments`, 1);
 var root_66 = $60.from_html(`<!> <!>`, 1);
 var root_105 = $60.from_html(`<div class="confirm-clear svelte-1g8l8sh" role="alertdialog"><p class="confirm-message svelte-1g8l8sh"> </p> <div class="confirm-actions svelte-1g8l8sh"><!> <!></div></div>`);
 var root_133 = $60.from_html(`<div class="document-comment-composer svelte-1g8l8sh"><div class="document-comment-header svelte-1g8l8sh"><!> <span>Document comment</span></div> <!></div>`);
@@ -8518,7 +8979,7 @@ function Comment_sidebar($$anchor, $$props) {
                 variant: "danger",
                 onclick: handleClearAllClick,
                 children: ($$anchor5, $$slotProps3) => {
-                  var fragment_8 = root_95();
+                  var fragment_8 = root_94();
                   var node_6 = $60.first_child(fragment_8);
                   Trash_2(node_6, { class: "icon-sm" });
                   $60.next();
@@ -8687,15 +9148,16 @@ $60.delegate(["click"]);
 // src/components/review-editor/front-matter-fields.svelte
 import"svelte/internal/disclose-version";
 import * as $63 from "svelte/internal/client";
-import { untrack as untrack4 } from "svelte";
+import { untrack as untrack5 } from "svelte";
 import { parseFrontMatter as parseFrontMatter2, validateFrontMatter as validateFrontMatter2 } from "@lostgradient/cinder/markdown/pipeline";
 
 // src/components/checkbox/checkbox.svelte
 import"svelte/internal/disclose-version";
 import * as $61 from "svelte/internal/client";
-var root_114 = $61.from_html(`<label class="cinder-checkbox-field__label"> </label>`);
-var root_212 = $61.from_html(`<p class="cinder-checkbox-field__description"> </p>`);
-var root_39 = $61.from_html(`<p class="cinder-checkbox-field__error" aria-live="polite"> </p>`);
+var root_213 = $61.from_html(`<span class="cinder-_required-marker" aria-hidden="true">*</span>`);
+var root_117 = $61.from_html(`<label class="cinder-checkbox-field__label"> <!></label>`);
+var root_39 = $61.from_html(`<p class="cinder-checkbox-field__description"> </p>`);
+var root_45 = $61.from_html(`<p class="cinder-checkbox-field__error" aria-live="polite"> </p>`);
 var root20 = $61.from_html(`<div class="cinder-checkbox-field"><div class="cinder-checkbox-row"><span class="cinder-checkbox-field__control"><input/> <span class="cinder-checkbox-field__indicator" aria-hidden="true"></span></span> <!></div> <!> <!></div>`);
 function Checkbox($$anchor, $$props) {
   const generatedId = $61.props_id();
@@ -8706,6 +9168,7 @@ function Checkbox($$anchor, $$props) {
     "$$legacy",
     "id",
     "checked",
+    "onValueChange",
     "indeterminate",
     "label",
     "description",
@@ -8714,7 +9177,8 @@ function Checkbox($$anchor, $$props) {
     "required",
     "class",
     "aria-describedby",
-    "aria-invalid"
+    "aria-invalid",
+    "onchange"
   ]);
   const context = getFormFieldContext();
   const field = $61.derived(() => resolveFieldControl({
@@ -8740,6 +9204,40 @@ function Checkbox($$anchor, $$props) {
       $61.get(inputElement).indeterminate = indeterminate() && !checked();
     }
   });
+  let resetSyncTimeout;
+  function syncCheckedAfterFormReset() {
+    if (resetSyncTimeout !== undefined)
+      clearTimeout(resetSyncTimeout);
+    resetSyncTimeout = setTimeout(() => {
+      resetSyncTimeout = undefined;
+      if (!$61.get(inputElement))
+        return;
+      checked($61.get(inputElement).checked);
+      $61.get(inputElement).indeterminate = indeterminate() && !$61.get(inputElement).checked;
+    }, 0);
+  }
+  $61.user_effect(() => {
+    const form = $61.get(inputElement)?.form;
+    if (!form)
+      return;
+    form.addEventListener("reset", syncCheckedAfterFormReset);
+    return () => {
+      form.removeEventListener("reset", syncCheckedAfterFormReset);
+      if (resetSyncTimeout !== undefined) {
+        clearTimeout(resetSyncTimeout);
+        resetSyncTimeout = undefined;
+      }
+    };
+  });
+  function handleChange(event4) {
+    const target = event4.currentTarget;
+    const committed = commitValue(target.checked, $$props.onValueChange, (next9) => {
+      checked(next9);
+    });
+    target.checked = committed;
+    target.indeterminate = indeterminate() && !committed;
+    $$props.onchange?.(event4);
+  }
   var div = root20();
   var div_1 = $61.child(div);
   var span = $61.child(div_1);
@@ -8747,39 +9245,52 @@ function Checkbox($$anchor, $$props) {
   $61.attribute_effect(input, ($0) => ({
     id: $61.get(field).id,
     type: "checkbox",
+    ...rest,
     disabled: $61.get(field).disabled,
     required: $61.get(field).required,
+    checked: checked(),
+    onchange: handleChange,
     class: $0,
     "aria-invalid": $61.get(field).ariaInvalid,
-    "aria-describedby": $61.get(field).describedBy,
-    ...rest
+    "aria-describedby": $61.get(field).describedBy
   }), [() => classNames("cinder-checkbox", $$props.class)], undefined, undefined, undefined, true);
   $61.bind_this(input, ($$value) => $61.set(inputElement, $$value), () => $61.get(inputElement));
   $61.next(2);
   $61.reset(span);
   var node = $61.sibling(span, 2);
   {
-    var consequent = ($$anchor2) => {
-      var label_1 = root_114();
-      var text8 = $61.child(label_1, true);
+    var consequent_1 = ($$anchor2) => {
+      var label_1 = root_117();
+      var text8 = $61.child(label_1);
+      var node_1 = $61.sibling(text8);
+      {
+        var consequent = ($$anchor3) => {
+          var span_1 = root_213();
+          $61.append($$anchor3, span_1);
+        };
+        $61.if(node_1, ($$render) => {
+          if ($61.get(field).required)
+            $$render(consequent);
+        });
+      }
       $61.reset(label_1);
       $61.template_effect(() => {
         $61.set_attribute(label_1, "for", $61.get(field).id);
         $61.set_attribute(label_1, "data-disabled", $61.get(field).disabled || undefined);
-        $61.set_text(text8, $$props.label);
+        $61.set_text(text8, `${$$props.label ?? ""} `);
       });
       $61.append($$anchor2, label_1);
     };
     $61.if(node, ($$render) => {
       if ($$props.label)
-        $$render(consequent);
+        $$render(consequent_1);
     });
   }
   $61.reset(div_1);
-  var node_1 = $61.sibling(div_1, 2);
+  var node_2 = $61.sibling(div_1, 2);
   {
-    var consequent_1 = ($$anchor2) => {
-      var p = root_212();
+    var consequent_2 = ($$anchor2) => {
+      var p = root_39();
       var text_1 = $61.child(p, true);
       $61.reset(p);
       $61.template_effect(() => {
@@ -8788,15 +9299,15 @@ function Checkbox($$anchor, $$props) {
       });
       $61.append($$anchor2, p);
     };
-    $61.if(node_1, ($$render) => {
+    $61.if(node_2, ($$render) => {
       if ($$props.description)
-        $$render(consequent_1);
+        $$render(consequent_2);
     });
   }
-  var node_2 = $61.sibling(node_1, 2);
+  var node_3 = $61.sibling(node_2, 2);
   {
-    var consequent_2 = ($$anchor2) => {
-      var p_1 = root_39();
+    var consequent_3 = ($$anchor2) => {
+      var p_1 = root_45();
       var text_2 = $61.child(p_1, true);
       $61.reset(p_1);
       $61.template_effect(() => {
@@ -8805,13 +9316,12 @@ function Checkbox($$anchor, $$props) {
       });
       $61.append($$anchor2, p_1);
     };
-    $61.if(node_2, ($$render) => {
+    $61.if(node_3, ($$render) => {
       if ($$props.error)
-        $$render(consequent_2);
+        $$render(consequent_3);
     });
   }
   $61.reset(div);
-  $61.bind_checked(input, checked);
   $61.append($$anchor, div);
   $61.pop();
 }
@@ -8836,10 +9346,11 @@ function resolveMaximumLength(value) {
 }
 
 // src/components/textarea/textarea.svelte
-var root_115 = $62.from_html(`<label class="cinder-textarea-label"> </label>`);
-var root_213 = $62.from_html(`<p class="cinder-textarea-description"> </p>`);
-var root_310 = $62.from_html(`<output class="cinder-textarea-count" aria-live="polite" aria-atomic="true"> </output>`);
-var root_45 = $62.from_html(`<p class="cinder-textarea-error" aria-live="polite"> </p>`);
+var root_214 = $62.from_html(`<span class="cinder-_required-marker" aria-hidden="true">*</span>`);
+var root_118 = $62.from_html(`<label class="cinder-textarea-label"> <!></label>`);
+var root_310 = $62.from_html(`<p class="cinder-textarea-description"> </p>`);
+var root_46 = $62.from_html(`<output class="cinder-textarea-count" aria-live="polite" aria-atomic="true"> </output>`);
+var root_56 = $62.from_html(`<p class="cinder-textarea-error" aria-live="polite"> </p>`);
 var root21 = $62.from_html(`<div class="cinder-textarea-field"><!> <textarea></textarea> <!> <!> <!></div>`);
 function Textarea($$anchor, $$props) {
   $62.push($$props, true);
@@ -8882,19 +9393,31 @@ function Textarea($$anchor, $$props) {
   var div = root21();
   var node = $62.child(div);
   {
-    var consequent = ($$anchor2) => {
-      var label_1 = root_115();
-      var text8 = $62.child(label_1, true);
+    var consequent_1 = ($$anchor2) => {
+      var label_1 = root_118();
+      var text8 = $62.child(label_1);
+      var node_1 = $62.sibling(text8);
+      {
+        var consequent = ($$anchor3) => {
+          var span = root_214();
+          $62.append($$anchor3, span);
+        };
+        $62.if(node_1, ($$render) => {
+          if ($62.get(field).required)
+            $$render(consequent);
+        });
+      }
       $62.reset(label_1);
       $62.template_effect(() => {
         $62.set_attribute(label_1, "for", $$props.id);
-        $62.set_text(text8, $$props.label);
+        $62.set_attribute(label_1, "data-disabled", $62.get(field).disabled || undefined);
+        $62.set_text(text8, `${$$props.label ?? ""} `);
       });
       $62.append($$anchor2, label_1);
     };
     $62.if(node, ($$render) => {
       if ($$props.label)
-        $$render(consequent);
+        $$render(consequent_1);
     });
   }
   var textarea = $62.sibling(node, 2);
@@ -8912,10 +9435,10 @@ function Textarea($$anchor, $$props) {
   }), [
     () => classNames("cinder-_input-frame", "cinder-textarea", $$props.class)
   ]);
-  var node_1 = $62.sibling(textarea, 2);
+  var node_2 = $62.sibling(textarea, 2);
   {
-    var consequent_1 = ($$anchor2) => {
-      var p = root_213();
+    var consequent_2 = ($$anchor2) => {
+      var p = root_310();
       var text_1 = $62.child(p, true);
       $62.reset(p);
       $62.template_effect(() => {
@@ -8924,15 +9447,15 @@ function Textarea($$anchor, $$props) {
       });
       $62.append($$anchor2, p);
     };
-    $62.if(node_1, ($$render) => {
+    $62.if(node_2, ($$render) => {
       if ($$props.description)
-        $$render(consequent_1);
+        $$render(consequent_2);
     });
   }
-  var node_2 = $62.sibling(node_1, 2);
+  var node_3 = $62.sibling(node_2, 2);
   {
-    var consequent_2 = ($$anchor2) => {
-      var output = root_310();
+    var consequent_3 = ($$anchor2) => {
+      var output = root_46();
       var text_2 = $62.child(output);
       $62.reset(output);
       $62.template_effect(() => {
@@ -8942,15 +9465,15 @@ function Textarea($$anchor, $$props) {
       });
       $62.append($$anchor2, output);
     };
-    $62.if(node_2, ($$render) => {
+    $62.if(node_3, ($$render) => {
       if ($62.get(countId))
-        $$render(consequent_2);
+        $$render(consequent_3);
     });
   }
-  var node_3 = $62.sibling(node_2, 2);
+  var node_4 = $62.sibling(node_3, 2);
   {
-    var consequent_3 = ($$anchor2) => {
-      var p_1 = root_45();
+    var consequent_4 = ($$anchor2) => {
+      var p_1 = root_56();
       var text_3 = $62.child(p_1, true);
       $62.reset(p_1);
       $62.template_effect(() => {
@@ -8959,9 +9482,9 @@ function Textarea($$anchor, $$props) {
       });
       $62.append($$anchor2, p_1);
     };
-    $62.if(node_3, ($$render) => {
+    $62.if(node_4, ($$render) => {
       if ($$props.error)
-        $$render(consequent_3);
+        $$render(consequent_4);
     });
   }
   $62.reset(div);
@@ -8988,16 +9511,16 @@ function parseReviewEditorFrontMatter(markdown) {
     bodyOffset
   };
 }
-function reviewStateToMarkdown(state19) {
-  if (parseReviewEditorFrontMatter(state19.content).hasFrontMatter)
-    return state19.content;
-  if (state19.frontMatterRaw == null && state19.frontMatter == null)
-    return state19.content;
-  if (state19.frontMatterRaw === undefined)
-    return state19.content;
-  return stringifyFrontMatter(state19.frontMatter ?? null, state19.content, {
-    originalRaw: state19.frontMatterRaw,
-    originalData: state19.frontMatter ?? null,
+function reviewStateToMarkdown(state20) {
+  if (parseReviewEditorFrontMatter(state20.content).hasFrontMatter)
+    return state20.content;
+  if (state20.frontMatterRaw == null && state20.frontMatter == null)
+    return state20.content;
+  if (state20.frontMatterRaw === undefined)
+    return state20.content;
+  return stringifyFrontMatter(state20.frontMatter ?? null, state20.content, {
+    originalRaw: state20.frontMatterRaw,
+    originalData: state20.frontMatter ?? null,
     preserveEmptyFrontMatter: true
   });
 }
@@ -9130,8 +9653,8 @@ function textOffsetToLineColumn(documentText, offset3, fallback) {
 }
 
 // src/components/review-editor/front-matter-fields.svelte
-var root_214 = $63.from_html(`<div class="review-editor-front-matter__field"><!></div>`);
-var root_96 = $63.from_html(`<p class="review-editor-front-matter__empty">No front matter fields.</p>`);
+var root_215 = $63.from_html(`<div class="review-editor-front-matter__field"><!></div>`);
+var root_95 = $63.from_html(`<p class="review-editor-front-matter__empty">No front matter fields.</p>`);
 var root22 = $63.from_html(`<section class="review-editor-front-matter"><div class="review-editor-front-matter__header"><h3 class="review-editor-front-matter__title">Front matter</h3></div> <div class="review-editor-front-matter__body"><!></div></section>`);
 function Front_matter_fields($$anchor, $$props) {
   $63.push($$props, true);
@@ -9139,7 +9662,7 @@ function Front_matter_fields($$anchor, $$props) {
   const entries = $63.derived(() => Object.entries($$props.data ?? {}));
   const hasParsedFields = $63.derived(() => $$props.data !== null && $63.get(entries).length > 0);
   const shouldShowRawYaml = $63.derived(() => !$63.get(hasParsedFields) && $$props.raw !== null);
-  let rawDraft = $63.state($63.proxy(untrack4(() => $$props.raw) ?? ""));
+  let rawDraft = $63.state($63.proxy(untrack5(() => $$props.raw) ?? ""));
   let rawError = $63.state(undefined);
   let lastRaw = $63.state(null);
   let complexDrafts = $63.state($63.proxy({}));
@@ -9224,7 +9747,7 @@ ${rawValue}
         var $$array = $63.derived(() => $63.to_array($63.get($$item), 2));
         let name = () => $63.get($$array)[0];
         let fieldValue = () => $63.get($$array)[1];
-        var div_2 = root_214();
+        var div_2 = root_215();
         var node_2 = $63.child(div_2);
         {
           var consequent = ($$anchor4) => {
@@ -9386,7 +9909,7 @@ ${rawValue}
       }
     };
     var alternate_1 = ($$anchor2) => {
-      var p = root_96();
+      var p = root_95();
       $63.append($$anchor2, p);
     };
     $63.if(node, ($$render) => {
@@ -9415,9 +9938,46 @@ import * as $67 from "svelte/internal/client";
 // src/components/badge/badge.svelte
 import"svelte/internal/disclose-version";
 import * as $64 from "svelte/internal/client";
+var root_311 = $64.from_svg(`<path></path>`);
+var root_216 = $64.from_svg(`<svg class="icon-sm" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></svg>`);
+var root_119 = $64.from_html(`<!> <!>`, 1);
 var root23 = $64.from_html(`<span><!></span>`);
 function Badge($$anchor, $$props) {
   $64.push($$props, true);
+  const subscriptionStateConfigurations = {
+    active: { variant: "success", label: "Active" },
+    trialing: { variant: "info", label: "Trialing" },
+    "past-due": { variant: "warning", label: "Past due" },
+    canceled: { variant: "neutral", label: "Canceled" },
+    expired: { variant: "danger", label: "Expired" },
+    refunded: { variant: "neutral", label: "Refunded" }
+  };
+  const subscriptionStateIconPaths = {
+    active: ["M21.801 10A10 10 0 1 1 17 3.335", "m9 11 3 3L22 4"],
+    trialing: ["M12 6v6l4 2", "M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"],
+    "past-due": [
+      "m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z",
+      "M12 9v4",
+      "M12 17h.01"
+    ],
+    canceled: [
+      "M15 9 9 15",
+      "M9 9l6 6",
+      "M22 12A10 10 0 1 1 12 2a10 10 0 0 1 10 10Z"
+    ],
+    expired: [
+      "M8 2v4",
+      "M16 2v4",
+      "M21 13V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h8",
+      "M3 10h18",
+      "m17 14-5-5",
+      "m12 14 5 5"
+    ],
+    refunded: [
+      "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
+      "M3 3v5h5"
+    ]
+  };
   let variant = $64.prop($$props, "variant", 3, "neutral"), size3 = $64.prop($$props, "size", 3, "md"), mono = $64.prop($$props, "mono", 3, false), rest = $64.rest_props($$props, [
     "$$slots",
     "$$events",
@@ -9425,19 +9985,78 @@ function Badge($$anchor, $$props) {
     "variant",
     "size",
     "mono",
+    "subscriptionState",
     "class",
     "children"
   ]);
+  const subscriptionStateConfiguration = $64.derived(() => $$props.subscriptionState === undefined ? undefined : subscriptionStateConfigurations[$$props.subscriptionState]);
+  const resolvedVariant = $64.derived(() => $64.get(subscriptionStateConfiguration)?.variant ?? variant());
+  const resolvedSubscriptionIconPaths = $64.derived(() => $$props.subscriptionState === undefined ? undefined : subscriptionStateIconPaths[$$props.subscriptionState]);
   var span = root23();
   $64.attribute_effect(span, ($0) => ({
     class: $0,
-    "data-cinder-variant": variant(),
+    "data-cinder-variant": $64.get(resolvedVariant),
     "data-cinder-size": size3(),
     "data-cinder-mono": mono() ? "" : undefined,
+    "data-cinder-subscription-state": $$props.subscriptionState,
     ...rest
   }), [() => classNames("cinder-badge", $$props.class)]);
   var node = $64.child(span);
-  $64.snippet(node, () => $$props.children ?? $64.noop);
+  {
+    var consequent_2 = ($$anchor2) => {
+      var fragment = root_119();
+      var node_1 = $64.first_child(fragment);
+      {
+        var consequent = ($$anchor3) => {
+          var svg = root_216();
+          $64.each(svg, 20, () => $64.get(resolvedSubscriptionIconPaths), (iconPath) => iconPath, ($$anchor4, iconPath) => {
+            var path = root_311();
+            $64.template_effect(() => $64.set_attribute(path, "d", iconPath));
+            $64.append($$anchor4, path);
+          });
+          $64.reset(svg);
+          $64.append($$anchor3, svg);
+        };
+        $64.if(node_1, ($$render) => {
+          if ($64.get(resolvedSubscriptionIconPaths))
+            $$render(consequent);
+        });
+      }
+      var node_2 = $64.sibling(node_1, 2);
+      {
+        var consequent_1 = ($$anchor3) => {
+          var fragment_1 = $64.comment();
+          var node_3 = $64.first_child(fragment_1);
+          $64.snippet(node_3, () => $$props.children);
+          $64.append($$anchor3, fragment_1);
+        };
+        var alternate = ($$anchor3) => {
+          var text9 = $64.text();
+          $64.template_effect(() => $64.set_text(text9, $64.get(subscriptionStateConfiguration).label));
+          $64.append($$anchor3, text9);
+        };
+        $64.if(node_2, ($$render) => {
+          if ($$props.children)
+            $$render(consequent_1);
+          else
+            $$render(alternate, -1);
+        });
+      }
+      $64.append($$anchor2, fragment);
+    };
+    var alternate_1 = ($$anchor2) => {
+      var fragment_3 = $64.comment();
+      var node_4 = $64.first_child(fragment_3);
+      $64.snippet(node_4, () => $$props.children ?? $64.noop);
+      $64.append($$anchor2, fragment_3);
+    };
+    $64.if(node, ($$render) => {
+      if ($64.get(subscriptionStateConfiguration))
+        $$render(consequent_2);
+      else
+        $$render(alternate_1, -1);
+    });
+  }
   $64.reset(span);
   $64.append($$anchor, span);
   $64.pop();
@@ -9446,14 +10065,14 @@ function Badge($$anchor, $$props) {
 // src/components/diff-statistics/diff-statistics.svelte
 import"svelte/internal/disclose-version";
 import * as $65 from "svelte/internal/client";
-var root_311 = $65.from_html(`<span class="cinder-diff-statistics__label">added</span>`);
-var root_215 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--added"><span class="cinder-diff-statistics__prefix" aria-hidden="true">+</span> <span class="cinder-diff-statistics__value"> </span> <!></span>`);
-var root_56 = $65.from_html(`<span class="cinder-diff-statistics__label">removed</span>`);
-var root_46 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--removed"><span class="cinder-diff-statistics__prefix" aria-hidden="true">-</span> <span class="cinder-diff-statistics__value"> </span> <!></span>`);
+var root_312 = $65.from_html(`<span class="cinder-diff-statistics__label">added</span>`);
+var root_217 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--added"><span class="cinder-diff-statistics__prefix" aria-hidden="true">+</span> <span class="cinder-diff-statistics__value"> </span> <!></span>`);
+var root_57 = $65.from_html(`<span class="cinder-diff-statistics__label">removed</span>`);
+var root_47 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--removed"><span class="cinder-diff-statistics__prefix" aria-hidden="true">-</span> <span class="cinder-diff-statistics__value"> </span> <!></span>`);
 var root_74 = $65.from_html(`<span class="cinder-diff-statistics__label">modified</span>`);
 var root_67 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--modified"><span class="cinder-diff-statistics__prefix" aria-hidden="true">~</span> <span class="cinder-diff-statistics__value"> </span> <!></span>`);
-var root_116 = $65.from_html(`<!> <!> <!>`, 1);
-var root_83 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--none">No changes</span>`);
+var root_120 = $65.from_html(`<!> <!> <!>`, 1);
+var root_84 = $65.from_html(`<span class="cinder-diff-statistics__stat cinder-diff-statistics__stat--none">No changes</span>`);
 var root24 = $65.from_html(`<div><!></div>`);
 function Diff_statistics($$anchor, $$props) {
   $65.push($$props, true);
@@ -9493,18 +10112,18 @@ function Diff_statistics($$anchor, $$props) {
   var node = $65.child(div);
   {
     var consequent_6 = ($$anchor2) => {
-      var fragment = root_116();
+      var fragment = root_120();
       var node_1 = $65.first_child(fragment);
       {
         var consequent_1 = ($$anchor3) => {
-          var span = root_215();
+          var span = root_217();
           var span_1 = $65.sibling($65.child(span), 2);
-          var text8 = $65.child(span_1, true);
+          var text9 = $65.child(span_1, true);
           $65.reset(span_1);
           var node_2 = $65.sibling(span_1, 2);
           {
             var consequent = ($$anchor4) => {
-              var span_2 = root_311();
+              var span_2 = root_312();
               $65.append($$anchor4, span_2);
             };
             $65.if(node_2, ($$render) => {
@@ -9515,7 +10134,7 @@ function Diff_statistics($$anchor, $$props) {
           $65.reset(span);
           $65.template_effect(() => {
             $65.set_attribute(span, "aria-label", $65.get(addedLabel));
-            $65.set_text(text8, $$props.added);
+            $65.set_text(text9, $$props.added);
           });
           $65.append($$anchor3, span);
         };
@@ -9527,14 +10146,14 @@ function Diff_statistics($$anchor, $$props) {
       var node_3 = $65.sibling(node_1, 2);
       {
         var consequent_3 = ($$anchor3) => {
-          var span_3 = root_46();
+          var span_3 = root_47();
           var span_4 = $65.sibling($65.child(span_3), 2);
           var text_1 = $65.child(span_4, true);
           $65.reset(span_4);
           var node_4 = $65.sibling(span_4, 2);
           {
             var consequent_2 = ($$anchor4) => {
-              var span_5 = root_56();
+              var span_5 = root_57();
               $65.append($$anchor4, span_5);
             };
             $65.if(node_4, ($$render) => {
@@ -9587,7 +10206,7 @@ function Diff_statistics($$anchor, $$props) {
       $65.append($$anchor2, fragment);
     };
     var alternate = ($$anchor2) => {
-      var span_9 = root_83();
+      var span_9 = root_84();
       $65.append($$anchor2, span_9);
     };
     $65.if(node, ($$render) => {
@@ -9629,13 +10248,13 @@ function Rotate_ccw($$anchor, $$props) {
   }));
 }
 // src/components/review-editor/review-editor-controls.svelte
-var root_47 = $67.from_html(`<!> <!>`, 1);
-var root_117 = $67.from_html(`<!> <!>`, 1);
-var root_118 = $67.from_html(`<!> <!> <!>`, 1);
+var root_48 = $67.from_html(`<!> <!>`, 1);
+var root_121 = $67.from_html(`<!> <!>`, 1);
+var root_114 = $67.from_html(`<!> <!> <!>`, 1);
 var root_106 = $67.from_html(`<div class="controls-separator svelte-161pl7w" aria-hidden="true"></div> <!>`, 1);
-var root_163 = $67.from_html(`<!> <span class="sr-only">Revert All</span>`, 1);
+var root_163 = $67.from_html(`<!> <span class="cinder-sr-only">Revert All</span>`, 1);
 var root_174 = $67.from_html(`<!> <!>`, 1);
-var root25 = $67.from_html(`<div role="toolbar" aria-label="Review editor controls"><div class="controls-leading svelte-161pl7w"><!> <!> <!></div> <div class="controls-trailing svelte-161pl7w"><!> <div class="comments-toggle-wrapper svelte-161pl7w"><!></div> <!></div></div> <div role="status" aria-live="polite" aria-atomic="true" class="comments-count-announcer sr-only"> </div>`, 1);
+var root25 = $67.from_html(`<div role="toolbar" aria-label="Review editor controls"><div class="controls-leading svelte-161pl7w"><!> <!> <!></div> <div class="controls-trailing svelte-161pl7w"><!> <div class="comments-toggle-wrapper svelte-161pl7w"><!></div> <!></div></div> <div role="status" aria-live="polite" aria-atomic="true" class="comments-count-announcer cinder-sr-only"> </div>`, 1);
 function Review_editor_controls($$anchor, $$props) {
   $67.push($$props, true);
   let showDiffTabs = $67.prop($$props, "showDiffTabs", 3, true), diffViewMode = $67.prop($$props, "diffViewMode", 15, "unified"), hasContentChanges = $67.prop($$props, "hasContentChanges", 3, false), readonly = $67.prop($$props, "readonly", 3, false), commentCount = $67.prop($$props, "commentCount", 3, 0), sidebarOpen = $67.prop($$props, "sidebarOpen", 3, false);
@@ -9673,7 +10292,7 @@ function Review_editor_controls($$anchor, $$props) {
     },
     onchange: handleViewChange,
     children: ($$anchor2, $$slotProps) => {
-      var fragment_1 = root_117();
+      var fragment_1 = root_121();
       var node_1 = $67.first_child(fragment_1);
       {
         const leading = ($$anchor3) => {
@@ -9688,8 +10307,8 @@ function Review_editor_controls($$anchor, $$props) {
           leading,
           children: ($$anchor3, $$slotProps2) => {
             $67.next();
-            var text9 = $67.text("Editor");
-            $67.append($$anchor3, text9);
+            var text10 = $67.text("Editor");
+            $67.append($$anchor3, text10);
           },
           $$slots: { leading: true, default: true }
         });
@@ -9697,7 +10316,7 @@ function Review_editor_controls($$anchor, $$props) {
       var node_2 = $67.sibling(node_1, 2);
       {
         var consequent = ($$anchor3) => {
-          var fragment_3 = root_47();
+          var fragment_3 = root_48();
           var node_3 = $67.first_child(fragment_3);
           {
             const leading = ($$anchor4) => {
@@ -9793,7 +10412,7 @@ function Review_editor_controls($$anchor, $$props) {
           diffViewMode($$value);
         },
         children: ($$anchor3, $$slotProps) => {
-          var fragment_8 = root_118();
+          var fragment_8 = root_114();
           var node_8 = $67.first_child(fragment_8);
           Segment(node_8, {
             value: "unified",
@@ -9967,8 +10586,8 @@ import"svelte/internal/disclose-version";
 import * as $68 from "svelte/internal/client";
 
 // src/_internal/surface-context.ts
-import { createContext as createContext4 } from "svelte";
-var [getSurfaceContextStrict, setSurfaceContextRaw] = createContext4();
+import { createContext as createContext5 } from "svelte";
+var [getSurfaceContextStrict, setSurfaceContextRaw] = createContext5();
 function setSurfaceContext(context) {
   setSurfaceContextRaw(context);
 }
@@ -10290,7 +10909,7 @@ function Front_matter_header($$anchor, $$props) {
   var node_1 = $72.sibling(span, 2);
   File_text(node_1, { class: "icon-sm" });
   var span_1 = $72.sibling(node_1, 2);
-  var text10 = $72.child(span_1, true);
+  var text11 = $72.child(span_1, true);
   $72.reset(span_1);
   var node_2 = $72.sibling(span_1, 2);
   {
@@ -10317,7 +10936,7 @@ function Front_matter_header($$anchor, $$props) {
     });
   }
   $72.reset(button);
-  $72.template_effect(() => $72.set_text(text10, label()));
+  $72.template_effect(() => $72.set_text(text11, label()));
   $72.append($$anchor, button);
   $72.pop();
 }
@@ -10325,10 +10944,10 @@ function Front_matter_header($$anchor, $$props) {
 // src/components/diff-viewer/diff-line.svelte
 import"svelte/internal/disclose-version";
 import * as $73 from "svelte/internal/client";
-var root_216 = $73.from_html(`<div><span class="diff-gutter svelte-hc3elb"></span> <span class="diff-text svelte-hc3elb"> </span></div>`);
-var root_48 = $73.from_html(`<button type="button"><span class="diff-gutter svelte-hc3elb">+</span> <span class="diff-text svelte-hc3elb"> </span></button>`);
-var root_57 = $73.from_html(`<div><span class="diff-gutter svelte-hc3elb">+</span> <span class="diff-text svelte-hc3elb"> </span></div>`);
-var root_84 = $73.from_html(`<del class="svelte-hc3elb"> </del>`);
+var root_218 = $73.from_html(`<div><span class="diff-gutter svelte-hc3elb"></span> <span class="diff-text svelte-hc3elb"> </span></div>`);
+var root_49 = $73.from_html(`<button type="button"><span class="diff-gutter svelte-hc3elb">+</span> <span class="diff-text svelte-hc3elb"> </span></button>`);
+var root_58 = $73.from_html(`<div><span class="diff-gutter svelte-hc3elb">+</span> <span class="diff-text svelte-hc3elb"> </span></div>`);
+var root_85 = $73.from_html(`<del class="svelte-hc3elb"> </del>`);
 var root_75 = $73.from_html(`<button type="button"><span class="diff-gutter svelte-hc3elb"> </span> <span class="diff-text svelte-hc3elb"><!></span></button>`);
 var root_1110 = $73.from_html(`<del class="svelte-hc3elb"> </del>`);
 var root_107 = $73.from_html(`<div><span class="diff-gutter svelte-hc3elb"> </span> <span class="diff-text svelte-hc3elb"><!></span></div>`);
@@ -10357,6 +10976,11 @@ function Diff_line($$anchor, $$props) {
     return true;
   });
   const isInteractive = $73.derived(() => $$props.diff.type !== "same" && $$props.onselect !== undefined);
+  const accessibleLineLabel = $73.derived(() => {
+    const text12 = $$props.diff.type === "modified" ? $$props.viewMode === "original" ? $$props.diff.oldText : $$props.viewMode === "final" ? $$props.diff.newText : `${$$props.diff.oldText} changed to ${$$props.diff.newText}` : $$props.diff.text;
+    const typeLabel = $$props.diff.type === "added" ? "Added line" : $$props.diff.type === "removed" ? "Removed line" : "Modified line";
+    return `${typeLabel}: ${text12 || "blank line"}`;
+  });
   var fragment = $73.comment();
   var node = $73.first_child(fragment);
   {
@@ -10365,14 +10989,14 @@ function Diff_line($$anchor, $$props) {
       var node_1 = $73.first_child(fragment_1);
       {
         var consequent = ($$anchor3) => {
-          var div = root_216();
+          var div = root_218();
           var span = $73.sibling($73.child(div), 2);
-          var text11 = $73.child(span, true);
+          var text_1 = $73.child(span, true);
           $73.reset(span);
           $73.reset(div);
           $73.template_effect(($0) => {
             $73.set_class(div, 1, $0, "svelte-hc3elb");
-            $73.set_text(text11, $$props.diff.text || " ");
+            $73.set_text(text_1, $$props.diff.text || " ");
           }, [() => $73.clsx(classNames("diff-line", $$props.class))]);
           $73.append($$anchor3, div);
         };
@@ -10381,15 +11005,16 @@ function Diff_line($$anchor, $$props) {
           var node_2 = $73.first_child(fragment_2);
           {
             var consequent_1 = ($$anchor4) => {
-              var button = root_48();
+              var button = root_49();
               var span_1 = $73.sibling($73.child(button), 2);
-              var text_1 = $73.child(span_1, true);
+              var text_2 = $73.child(span_1, true);
               $73.reset(span_1);
               $73.reset(button);
               $73.template_effect(($0) => {
                 $73.set_class(button, 1, $0, "svelte-hc3elb");
                 $73.set_attribute(button, "data-selected", selected());
-                $73.set_text(text_1, $$props.diff.text || " ");
+                $73.set_attribute(button, "aria-label", $73.get(accessibleLineLabel));
+                $73.set_text(text_2, $$props.diff.text || " ");
               }, [
                 () => $73.clsx(classNames("diff-line diff-line-added", $$props.class))
               ]);
@@ -10399,15 +11024,15 @@ function Diff_line($$anchor, $$props) {
               $73.append($$anchor4, button);
             };
             var alternate = ($$anchor4) => {
-              var div_1 = root_57();
+              var div_1 = root_58();
               var span_2 = $73.sibling($73.child(div_1), 2);
-              var text_2 = $73.child(span_2, true);
+              var text_3 = $73.child(span_2, true);
               $73.reset(span_2);
               $73.reset(div_1);
               $73.template_effect(($0) => {
                 $73.set_class(div_1, 1, $0, "svelte-hc3elb");
                 $73.set_attribute(div_1, "data-selected", selected());
-                $73.set_text(text_2, $$props.diff.text || " ");
+                $73.set_text(text_3, $$props.diff.text || " ");
               }, [
                 () => $73.clsx(classNames("diff-line diff-line-added", $$props.class))
               ]);
@@ -10430,22 +11055,22 @@ function Diff_line($$anchor, $$props) {
             var consequent_4 = ($$anchor4) => {
               var button_1 = root_75();
               var span_3 = $73.child(button_1);
-              var text_3 = $73.child(span_3, true);
+              var text_4 = $73.child(span_3, true);
               $73.reset(span_3);
               var span_4 = $73.sibling(span_3, 2);
               var node_4 = $73.child(span_4);
               {
                 var consequent_3 = ($$anchor5) => {
-                  var del = root_84();
-                  var text_4 = $73.child(del, true);
+                  var del = root_85();
+                  var text_5 = $73.child(del, true);
                   $73.reset(del);
-                  $73.template_effect(() => $73.set_text(text_4, $$props.diff.text || " "));
+                  $73.template_effect(() => $73.set_text(text_5, $$props.diff.text || " "));
                   $73.append($$anchor5, del);
                 };
                 var alternate_1 = ($$anchor5) => {
-                  var text_5 = $73.text();
-                  $73.template_effect(() => $73.set_text(text_5, $$props.diff.text || " "));
-                  $73.append($$anchor5, text_5);
+                  var text_6 = $73.text();
+                  $73.template_effect(() => $73.set_text(text_6, $$props.diff.text || " "));
+                  $73.append($$anchor5, text_6);
                 };
                 $73.if(node_4, ($$render) => {
                   if ($73.get(showStrikethrough))
@@ -10459,7 +11084,8 @@ function Diff_line($$anchor, $$props) {
               $73.template_effect(($0) => {
                 $73.set_class(button_1, 1, $0, "svelte-hc3elb");
                 $73.set_attribute(button_1, "data-selected", selected());
-                $73.set_text(text_3, $73.get(showStrikethrough) ? "-" : "");
+                $73.set_attribute(button_1, "aria-label", $73.get(accessibleLineLabel));
+                $73.set_text(text_4, $73.get(showStrikethrough) ? "-" : "");
               }, [
                 () => $73.clsx(classNames("diff-line", $73.get(showStrikethrough) ? "diff-line-removed" : "diff-line-removed-original", $$props.class))
               ]);
@@ -10471,22 +11097,22 @@ function Diff_line($$anchor, $$props) {
             var alternate_3 = ($$anchor4) => {
               var div_2 = root_107();
               var span_5 = $73.child(div_2);
-              var text_6 = $73.child(span_5, true);
+              var text_7 = $73.child(span_5, true);
               $73.reset(span_5);
               var span_6 = $73.sibling(span_5, 2);
               var node_5 = $73.child(span_6);
               {
                 var consequent_5 = ($$anchor5) => {
                   var del_1 = root_1110();
-                  var text_7 = $73.child(del_1, true);
+                  var text_8 = $73.child(del_1, true);
                   $73.reset(del_1);
-                  $73.template_effect(() => $73.set_text(text_7, $$props.diff.text || " "));
+                  $73.template_effect(() => $73.set_text(text_8, $$props.diff.text || " "));
                   $73.append($$anchor5, del_1);
                 };
                 var alternate_2 = ($$anchor5) => {
-                  var text_8 = $73.text();
-                  $73.template_effect(() => $73.set_text(text_8, $$props.diff.text || " "));
-                  $73.append($$anchor5, text_8);
+                  var text_9 = $73.text();
+                  $73.template_effect(() => $73.set_text(text_9, $$props.diff.text || " "));
+                  $73.append($$anchor5, text_9);
                 };
                 $73.if(node_5, ($$render) => {
                   if ($73.get(showStrikethrough))
@@ -10500,7 +11126,7 @@ function Diff_line($$anchor, $$props) {
               $73.template_effect(($0) => {
                 $73.set_class(div_2, 1, $0, "svelte-hc3elb");
                 $73.set_attribute(div_2, "data-selected", selected());
-                $73.set_text(text_6, $73.get(showStrikethrough) ? "-" : "");
+                $73.set_text(text_7, $73.get(showStrikethrough) ? "-" : "");
               }, [
                 () => $73.clsx(classNames("diff-line", $73.get(showStrikethrough) ? "diff-line-removed" : "diff-line-removed-original", $$props.class))
               ]);
@@ -10544,23 +11170,23 @@ function Diff_line($$anchor, $$props) {
                         {
                           var consequent_8 = ($$anchor8) => {
                             var span_9 = root_193();
-                            var text_9 = $73.child(span_9, true);
+                            var text_10 = $73.child(span_9, true);
                             $73.reset(span_9);
-                            $73.template_effect(() => $73.set_text(text_9, $73.get(wordChange).text));
+                            $73.template_effect(() => $73.set_text(text_10, $73.get(wordChange).text));
                             $73.append($$anchor8, span_9);
                           };
                           var consequent_9 = ($$anchor8) => {
                             var del_2 = root_20();
-                            var text_10 = $73.child(del_2, true);
+                            var text_11 = $73.child(del_2, true);
                             $73.reset(del_2);
-                            $73.template_effect(() => $73.set_text(text_10, $73.get(wordChange).text));
+                            $73.template_effect(() => $73.set_text(text_11, $73.get(wordChange).text));
                             $73.append($$anchor8, del_2);
                           };
                           var consequent_10 = ($$anchor8) => {
                             var ins = root_21();
-                            var text_11 = $73.child(ins, true);
+                            var text_12 = $73.child(ins, true);
                             $73.reset(ins);
-                            $73.template_effect(() => $73.set_text(text_11, $73.get(wordChange).text));
+                            $73.template_effect(() => $73.set_text(text_12, $73.get(wordChange).text));
                             $73.append($$anchor8, ins);
                           };
                           $73.if(node_10, ($$render) => {
@@ -10587,9 +11213,9 @@ function Diff_line($$anchor, $$props) {
                   $73.append($$anchor5, fragment_7);
                 };
                 var alternate_5 = ($$anchor5) => {
-                  var text_12 = $73.text();
-                  $73.template_effect(() => $73.set_text(text_12, $73.get(displayText) || " "));
-                  $73.append($$anchor5, text_12);
+                  var text_13 = $73.text();
+                  $73.template_effect(() => $73.set_text(text_13, $73.get(displayText) || " "));
+                  $73.append($$anchor5, text_13);
                 };
                 $73.if(node_7, ($$render) => {
                   if ($$props.viewMode === "unified")
@@ -10603,6 +11229,7 @@ function Diff_line($$anchor, $$props) {
               $73.template_effect(($0) => {
                 $73.set_class(button_2, 1, $0, "svelte-hc3elb");
                 $73.set_attribute(button_2, "data-selected", selected());
+                $73.set_attribute(button_2, "aria-label", $73.get(accessibleLineLabel));
               }, [
                 () => $73.clsx(classNames("diff-line", $73.get(lineClass), $$props.class))
               ]);
@@ -10634,23 +11261,23 @@ function Diff_line($$anchor, $$props) {
                         {
                           var consequent_14 = ($$anchor8) => {
                             var span_12 = root_282();
-                            var text_13 = $73.child(span_12, true);
+                            var text_14 = $73.child(span_12, true);
                             $73.reset(span_12);
-                            $73.template_effect(() => $73.set_text(text_13, $73.get(wordChange).text));
+                            $73.template_effect(() => $73.set_text(text_14, $73.get(wordChange).text));
                             $73.append($$anchor8, span_12);
                           };
                           var consequent_15 = ($$anchor8) => {
                             var del_3 = root_292();
-                            var text_14 = $73.child(del_3, true);
+                            var text_15 = $73.child(del_3, true);
                             $73.reset(del_3);
-                            $73.template_effect(() => $73.set_text(text_14, $73.get(wordChange).text));
+                            $73.template_effect(() => $73.set_text(text_15, $73.get(wordChange).text));
                             $73.append($$anchor8, del_3);
                           };
                           var consequent_16 = ($$anchor8) => {
                             var ins_1 = root_30();
-                            var text_15 = $73.child(ins_1, true);
+                            var text_16 = $73.child(ins_1, true);
                             $73.reset(ins_1);
-                            $73.template_effect(() => $73.set_text(text_15, $73.get(wordChange).text));
+                            $73.template_effect(() => $73.set_text(text_16, $73.get(wordChange).text));
                             $73.append($$anchor8, ins_1);
                           };
                           $73.if(node_14, ($$render) => {
@@ -10677,9 +11304,9 @@ function Diff_line($$anchor, $$props) {
                   $73.append($$anchor5, fragment_11);
                 };
                 var alternate_7 = ($$anchor5) => {
-                  var text_16 = $73.text();
-                  $73.template_effect(() => $73.set_text(text_16, $73.get(displayText) || " "));
-                  $73.append($$anchor5, text_16);
+                  var text_17 = $73.text();
+                  $73.template_effect(() => $73.set_text(text_17, $73.get(displayText) || " "));
+                  $73.append($$anchor5, text_17);
                 };
                 $73.if(node_11, ($$render) => {
                   if ($$props.viewMode === "unified")
@@ -10731,7 +11358,7 @@ function Diff_line($$anchor, $$props) {
 $73.delegate(["click"]);
 
 // src/components/diff-viewer/diff-front-matter.svelte
-var root_119 = $74.from_html(`<div class="front-matter-content svelte-113383m"></div>`);
+var root_123 = $74.from_html(`<div class="front-matter-content svelte-113383m"></div>`);
 var root28 = $74.from_html(`<div><!> <!></div>`);
 function Diff_front_matter($$anchor, $$props) {
   $74.push($$props, true);
@@ -10778,7 +11405,7 @@ function Diff_front_matter($$anchor, $$props) {
   var node_1 = $74.sibling(node, 2);
   {
     var consequent = ($$anchor2) => {
-      var div_1 = root_119();
+      var div_1 = root_123();
       $74.each(div_1, 23, () => $$props.diffs, (lineDiff, idx) => `fm-${idx}:${lineDiff.type}:${lineDiff.type === "modified" ? lineDiff.newText : lineDiff.text}`, ($$anchor3, lineDiff) => {
         Diff_line($$anchor3, {
           get diff() {
@@ -10836,9 +11463,9 @@ function Kbd($$anchor, $$props) {
       $75.append($$anchor2, fragment);
     };
     var alternate = ($$anchor2) => {
-      var text12 = $75.text();
-      $75.template_effect(() => $75.set_text(text12, $$props.label));
-      $75.append($$anchor2, text12);
+      var text13 = $75.text();
+      $75.template_effect(() => $75.set_text(text13, $$props.label));
+      $75.append($$anchor2, text13);
     };
     $75.if(node, ($$render) => {
       if ($$props.children)
@@ -10868,10 +11495,10 @@ function Spinner($$anchor, $$props) {
     "data-cinder-size": size3()
   }), [() => classNames("cinder-spinner", $$props.class)]);
   var span_1 = $76.child(span);
-  var text12 = $76.child(span_1, true);
+  var text13 = $76.child(span_1, true);
   $76.reset(span_1);
   $76.reset(span);
-  $76.template_effect(() => $76.set_text(text12, label()));
+  $76.template_effect(() => $76.set_text(text13, label()));
   $76.append($$anchor, span);
   $76.pop();
 }
@@ -10928,11 +11555,11 @@ function Refresh_cw($$anchor, $$props) {
   }));
 }
 // src/components/diff-viewer/diff-toolbar.svelte
-var root_121 = $79.from_html(`<!> <!> <!>`, 1);
-var root_1111 = $79.from_html(`<span class="no-changes svelte-1p8ursg">No changes</span>`);
+var root_125 = $79.from_html(`<!> <!> <!>`, 1);
+var root_1112 = $79.from_html(`<span class="no-changes svelte-1p8ursg">No changes</span>`);
 var root_176 = $79.from_html(`<!> Revert All`, 1);
 var root_194 = $79.from_html(`<!> Compute Diff`, 1);
-var root_217 = $79.from_html(`<div class="navigation svelte-1p8ursg"><!> <span class="change-counter svelte-1p8ursg"> </span> <!></div> <div class="shortcuts svelte-1p8ursg"><!> <!></div>`, 1);
+var root_219 = $79.from_html(`<div class="navigation svelte-1p8ursg"><!> <span class="change-counter svelte-1p8ursg"> </span> <!></div> <div class="shortcuts svelte-1p8ursg"><!> <!></div>`, 1);
 var root_242 = $79.from_html(`<span class="front-matter-only-hint svelte-1p8ursg">Front matter only</span>`);
 var root31 = $79.from_html(`<div><div class="toolbar-left svelte-1p8ursg"><!> <div class="stats svelte-1p8ursg"><!> <!> <!> <!> <!> <!></div></div> <div class="toolbar-right svelte-1p8ursg"><!> <!> <!> <!></div></div>`);
 function Diff_toolbar($$anchor, $$props) {
@@ -10975,14 +11602,14 @@ function Diff_toolbar($$anchor, $$props) {
       viewMode($$value);
     },
     children: ($$anchor2, $$slotProps) => {
-      var fragment = root_121();
+      var fragment = root_125();
       var node_1 = $79.first_child(fragment);
       Segment(node_1, {
         value: "unified",
         children: ($$anchor3, $$slotProps2) => {
           $79.next();
-          var text13 = $79.text("Unified");
-          $79.append($$anchor3, text13);
+          var text14 = $79.text("Unified");
+          $79.append($$anchor3, text14);
         },
         $$slots: { default: true }
       });
@@ -11077,7 +11704,7 @@ function Diff_toolbar($$anchor, $$props) {
   var node_7 = $79.sibling(node_6, 2);
   {
     var consequent_3 = ($$anchor2) => {
-      var span = root_1111();
+      var span = root_1112();
       $79.append($$anchor2, span);
     };
     $79.if(node_7, ($$render) => {
@@ -11189,7 +11816,7 @@ function Diff_toolbar($$anchor, $$props) {
       var node_17 = $79.first_child(fragment_14);
       {
         var consequent_9 = ($$anchor3) => {
-          var fragment_15 = root_217();
+          var fragment_15 = root_219();
           var div_4 = $79.first_child(fragment_15);
           var node_18 = $79.child(div_4);
           Button(node_18, {
@@ -11270,10 +11897,10 @@ function Diff_toolbar($$anchor, $$props) {
 // src/components/diff-viewer/diff-viewer.svelte
 var root_76 = $80.from_html(`<span class="compute-time svelte-1fvc2en"> </span>`);
 var root_68 = $80.from_html(`<div class="diff-warning svelte-1fvc2en" role="status"> <!></div>`);
-var root_1112 = $80.from_html(`<!> Revert`, 1);
+var root_1113 = $80.from_html(`<!> Revert`, 1);
 var root_108 = $80.from_html(`<div class="hunk-header svelte-1fvc2en"><span class="hunk-range svelte-1fvc2en"> </span> <!></div>`);
-var root_97 = $80.from_html(`<!> <!>`, 1);
-var root_123 = $80.from_html(`<!> <!> <div class="diff-content svelte-1fvc2en"><!> <!></div>`, 1);
+var root_96 = $80.from_html(`<!> <!>`, 1);
+var root_126 = $80.from_html(`<!> <!> <div class="diff-content svelte-1fvc2en"><!> <!></div>`, 1);
 function Diff_viewer($$anchor, $$props) {
   const instanceId = $80.props_id();
   $80.push($$props, true);
@@ -11435,7 +12062,7 @@ ${match[1] ?? ""}
         return $80.get($1);
       },
       children: ($$anchor2, $$slotProps) => {
-        var fragment_1 = root_123();
+        var fragment_1 = root_126();
         var node = $80.first_child(fragment_1);
         {
           var consequent = ($$anchor3) => {
@@ -11510,8 +12137,8 @@ ${match[1] ?? ""}
         {
           var consequent_3 = ($$anchor3) => {
             var div = root_68();
-            var text13 = $80.child(div);
-            var node_5 = $80.sibling(text13);
+            var text14 = $80.child(div);
+            var node_5 = $80.sibling(text14);
             {
               var consequent_2 = ($$anchor4) => {
                 var span = root_76();
@@ -11526,7 +12153,7 @@ ${match[1] ?? ""}
               });
             }
             $80.reset(div);
-            $80.template_effect(() => $80.set_text(text13, `${$80.get(diffState).warning ?? ""} `));
+            $80.template_effect(() => $80.set_text(text14, `${$80.get(diffState).warning ?? ""} `));
             $80.append($$anchor3, div);
           };
           $80.if(node_4, ($$render) => {
@@ -11573,7 +12200,7 @@ ${match[1] ?? ""}
         $80.each(node_7, 17, () => $80.get(lineDiffs), $80.index, ($$anchor3, lineDiff, idx) => {
           const isSelected = $80.derived(() => $80.get(selectedLineIndex) === idx);
           const hunkAtLine = $80.derived(() => $80.get(hunkStartMap).get(idx));
-          var fragment_7 = root_97();
+          var fragment_7 = root_96();
           var node_8 = $80.first_child(fragment_7);
           {
             var consequent_5 = ($$anchor4) => {
@@ -11589,7 +12216,7 @@ ${match[1] ?? ""}
                 onclick: () => handleRevertHunk($80.get(hunkAtLine)),
                 "aria-label": "Revert this change",
                 children: ($$anchor5, $$slotProps2) => {
-                  var fragment_8 = root_1112();
+                  var fragment_8 = root_1113();
                   var node_10 = $80.first_child(fragment_8);
                   Rotate_ccw(node_10, { class: "icon-xs" });
                   $80.next();
@@ -11634,9 +12261,9 @@ ${match[1] ?? ""}
 // src/components/selection-popover/selection-popover.svelte
 import"svelte/internal/disclose-version";
 import * as $81 from "svelte/internal/client";
-import { tick as tick2 } from "svelte";
-var root_125 = $81.from_html(`<div class="cinder-selection-popover__form"><textarea class="cinder-selection-popover__textarea" aria-label="Comment text" placeholder="Add a comment..."></textarea> <div class="cinder-selection-popover__actions"><button type="button" class="cinder-selection-popover__cancel" aria-label="Cancel"><svg class="cinder-selection-popover__icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></button> <button type="button" class="cinder-selection-popover__submit" aria-label="Submit comment" title="Submit comment"><svg class="cinder-selection-popover__icon" aria-hidden="true" viewBox="0 0 24 24"><path d="m22 2-7 20-4-9-9-4Z"></path><path d="M22 2 11 13"></path></svg></button></div></div>`);
-var root_218 = $81.from_html(`<button type="button" class="cinder-selection-popover__button" aria-label="Add comment" title="Add comment to selection"><svg class="cinder-selection-popover__icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M21 15a4 4 0 0 1-4 4H7l-4 4V7a4 4 0 0 1 4-4h6"></path><path d="M19 3v6"></path><path d="M16 6h6"></path></svg></button>`);
+import { tick as tick3 } from "svelte";
+var root_127 = $81.from_html(`<div class="cinder-selection-popover__form"><textarea class="cinder-selection-popover__textarea" aria-label="Comment text" placeholder="Add a comment..."></textarea> <div class="cinder-selection-popover__actions"><button type="button" class="cinder-selection-popover__cancel" aria-label="Cancel"><svg class="cinder-selection-popover__icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></button> <button type="button" class="cinder-selection-popover__submit" aria-label="Submit comment" title="Submit comment"><svg class="cinder-selection-popover__icon" aria-hidden="true" viewBox="0 0 24 24"><path d="m22 2-7 20-4-9-9-4Z"></path><path d="M22 2 11 13"></path></svg></button></div></div>`);
+var root_220 = $81.from_html(`<button type="button" class="cinder-selection-popover__button" aria-label="Add comment" title="Add comment to selection"><svg class="cinder-selection-popover__icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M21 15a4 4 0 0 1-4 4H7l-4 4V7a4 4 0 0 1 4-4h6"></path><path d="M19 3v6"></path><path d="M16 6h6"></path></svg></button>`);
 var root32 = $81.from_html(`<div><!></div>`);
 function Selection_popover($$anchor, $$props) {
   $81.push($$props, true);
@@ -11707,7 +12334,7 @@ function Selection_popover($$anchor, $$props) {
     rememberFocus();
     $81.set(expanded, true);
     $$props.onexpand?.();
-    tick2().then(() => $81.get(textareaElement)?.focus());
+    tick3().then(() => $81.get(textareaElement)?.focus());
   }
   function handleCancel() {
     $81.set(expanded, false);
@@ -11782,7 +12409,7 @@ function Selection_popover($$anchor, $$props) {
   var node = $81.child(div);
   {
     var consequent = ($$anchor2) => {
-      var div_1 = root_125();
+      var div_1 = root_127();
       var textarea = $81.child(div_1);
       $81.remove_textarea_child(textarea);
       $81.set_attribute(textarea, "rows", 2);
@@ -11800,7 +12427,7 @@ function Selection_popover($$anchor, $$props) {
       $81.append($$anchor2, div_1);
     };
     var alternate = ($$anchor2) => {
-      var button_2 = root_218();
+      var button_2 = root_220();
       $81.delegated("click", button_2, handleExpand);
       $81.append($$anchor2, button_2);
     };
@@ -11827,10 +12454,10 @@ import {
   generateUnifiedDiff,
   generateCommentsExport
 } from "@lostgradient/cinder/commentary/export";
-var root_220 = $82.from_html(`<input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/>`, 1);
-var root_312 = $82.from_html(`<div class="review-editor-view-panel svelte-1rnat08" role="tabpanel" aria-label="Editor view"><!> <!></div>`);
-var root_58 = $82.from_html(`<div class="review-editor-view-panel svelte-1rnat08" role="tabpanel" aria-label="Diff view"><!></div>`);
-var root_85 = $82.from_html(`<div class="summary-view svelte-1rnat08" role="region" aria-label="Review summary"><div class="summary-empty svelte-1rnat08"><p class="svelte-1rnat08">No changes or comments to summarize.</p> <p class="summary-hint svelte-1rnat08">Edit the document or add comments to generate a summary.</p></div></div>`);
+var root_223 = $82.from_html(`<input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/> <input type="hidden" class="svelte-1rnat08"/>`, 1);
+var root_313 = $82.from_html(`<div class="review-editor-view-panel svelte-1rnat08" role="tabpanel" aria-label="Editor view"><!> <!></div>`);
+var root_59 = $82.from_html(`<div class="review-editor-view-panel svelte-1rnat08" role="tabpanel" aria-label="Diff view"><!></div>`);
+var root_86 = $82.from_html(`<div class="summary-view svelte-1rnat08" role="region" aria-label="Review summary"><div class="summary-empty svelte-1rnat08"><p class="svelte-1rnat08">No changes or comments to summarize.</p> <p class="summary-hint svelte-1rnat08">Edit the document or add comments to generate a summary.</p></div></div>`);
 var root_69 = $82.from_html(`<div class="review-editor-view-panel svelte-1rnat08" role="tabpanel" aria-label="Summary view"><!></div>`);
 var root33 = $82.from_html(`<div data-testid="review-editor"><!> <!> <!> <div class="review-editor-main svelte-1rnat08"><!></div> <!> <!> <!></div>`);
 function Review_editor_impl($$anchor, $$props) {
@@ -12084,13 +12711,13 @@ function Review_editor_impl($$anchor, $$props) {
     if (!contentEquals2(currentMarkdown, expectedMarkdown)) {
       return;
     }
-    const state25 = $82.get(pendingState);
+    const state26 = $82.get(pendingState);
     $82.set(pendingState, null);
     const { doc } = view.state;
     const documentText = doc.textBetween(0, doc.content.size, `
 `);
     const reanchoredThreads = [];
-    for (const persistedThread of state25.threads) {
+    for (const persistedThread of state26.threads) {
       const bodyPersistedAnchor = documentPersistedAnchorToBodyAnchor(persistedThread.anchor, pendingDocument.bodyOffset);
       const result = reanchorQuote(documentText, bodyPersistedAnchor);
       if (!result.found) {
@@ -12328,13 +12955,13 @@ function Review_editor_impl($$anchor, $$props) {
       updatedAt: new Date().toISOString()
     };
   }
-  function setState(state25) {
-    const nextValue = reviewStateToMarkdown(state25);
+  function setState(state26) {
+    const nextValue = reviewStateToMarkdown(state26);
     value(nextValue);
-    if (state25.original !== undefined) {
-      original(state25.original);
+    if (state26.original !== undefined) {
+      original(state26.original);
     }
-    $82.set(pendingState, { ...state25, content: nextValue }, true);
+    $82.set(pendingState, { ...state26, content: nextValue }, true);
     attemptReanchoring();
   }
   function getView() {
@@ -12343,10 +12970,10 @@ function Review_editor_impl($$anchor, $$props) {
   function getEditor() {
     return $82.get(editorRef)?.getEditor() ?? null;
   }
-  function exportMarkdownSummary(options) {
+  function exportMarkdownSummary(options = undefined) {
     return generateMarkdownSummary(getState(), options);
   }
-  function exportUnifiedDiff(options) {
+  function exportUnifiedDiff(options = undefined) {
     return generateUnifiedDiff(getState(), options);
   }
   function handleExportContent() {
@@ -12549,8 +13176,8 @@ function Review_editor_impl($$anchor, $$props) {
     if (mode() === "readonly")
       return;
     const thread = threads().find((t) => t.id === threadId);
-    const comment50 = thread?.comments.find((c) => c.id === commentId);
-    if (!comment50 || comment50.deletedAt)
+    const comment51 = thread?.comments.find((c) => c.id === commentId);
+    if (!comment51 || comment51.deletedAt)
       return;
     const mentions = extractMentions(body);
     $$props.oncommentupdate?.({
@@ -12564,8 +13191,8 @@ function Review_editor_impl($$anchor, $$props) {
     if (mode() === "readonly")
       return;
     const thread = threads().find((t) => t.id === threadId);
-    const comment50 = thread?.comments.find((c) => c.id === commentId);
-    if (!comment50 || soft && comment50.deletedAt)
+    const comment51 = thread?.comments.find((c) => c.id === commentId);
+    if (!comment51 || soft && comment51.deletedAt)
       return;
     $$props.oncommentdelete?.({ threadId, commentId, soft });
     announce("Comment deleted");
@@ -12667,7 +13294,7 @@ function Review_editor_impl($$anchor, $$props) {
   var node_2 = $82.sibling(node_1, 2);
   {
     var consequent = ($$anchor2) => {
-      var fragment_1 = root_220();
+      var fragment_1 = root_223();
       var input = $82.first_child(fragment_1);
       $82.remove_input_defaults(input);
       var input_1 = $82.sibling(input, 2);
@@ -12764,7 +13391,7 @@ function Review_editor_impl($$anchor, $$props) {
   var node_4 = $82.child(div_1);
   {
     var consequent_2 = ($$anchor2) => {
-      var div_2 = root_312();
+      var div_2 = root_313();
       var node_5 = $82.child(div_2);
       {
         var consequent_1 = ($$anchor3) => {
@@ -12816,12 +13443,12 @@ function Review_editor_impl($$anchor, $$props) {
             return snapshotMode();
           },
           onchange: handleEditorBodyChange,
-          onReady: () => {
+          onready: () => {
             if (!$82.get(editorViewReady)) {
               $82.set(editorViewReady, true);
             }
           },
-          onSelectionChange: handleSelectionChange
+          onselectionchange: handleSelectionChange
         }), ($$value) => $82.set(editorRef, $$value, true), () => $82.get(editorRef));
       }
       $82.reset(div_2);
@@ -12829,7 +13456,7 @@ function Review_editor_impl($$anchor, $$props) {
       $82.append($$anchor2, div_2);
     };
     var consequent_3 = ($$anchor2) => {
-      var div_3 = root_58();
+      var div_3 = root_59();
       var node_7 = $82.child(div_3);
       {
         const toolbar = ($$anchor3) => {};
@@ -12876,7 +13503,7 @@ function Review_editor_impl($$anchor, $$props) {
           });
         };
         var alternate = ($$anchor3) => {
-          var div_5 = root_85();
+          var div_5 = root_86();
           $82.append($$anchor3, div_5);
         };
         $82.if(node_8, ($$render) => {
@@ -13066,7 +13693,7 @@ function createReviewEditorState(options) {
   });
   const summaryContent = $84.derived(() => {
     const threads = getThreads();
-    const state26 = {
+    const state27 = {
       schemaVersion: 4,
       content: getValue(),
       original: getOriginal() || undefined,
@@ -13085,7 +13712,7 @@ function createReviewEditorState(options) {
       })),
       updatedAt: ""
     };
-    const result = generateMarkdownSummary2(state26);
+    const result = generateMarkdownSummary2(state27);
     return result.markdown.replace(/^# Review Summary\n+/, "");
   });
   return {
@@ -13383,8 +14010,8 @@ function createThreadManager(options) {
     if (getMode() === "readonly")
       return;
     const thread = getThreads().find((t) => t.id === threadId);
-    const comment50 = thread?.comments.find((c) => c.id === commentId);
-    if (!comment50 || comment50.deletedAt)
+    const comment51 = thread?.comments.find((c) => c.id === commentId);
+    if (!comment51 || comment51.deletedAt)
       return;
     const mentions = extractMentions2(body);
     oncommentupdate?.({
@@ -13398,8 +14025,8 @@ function createThreadManager(options) {
     if (getMode() === "readonly")
       return;
     const thread = getThreads().find((t) => t.id === threadId);
-    const comment50 = thread?.comments.find((c) => c.id === commentId);
-    if (!comment50 || soft && comment50.deletedAt)
+    const comment51 = thread?.comments.find((c) => c.id === commentId);
+    if (!comment51 || soft && comment51.deletedAt)
       return;
     oncommentdelete?.({ threadId, commentId, soft });
     announce("Comment deleted");
@@ -13727,13 +14354,13 @@ function createAnchorManager(options) {
     if (!contentEquals3(currentMarkdown, expectedMarkdown)) {
       return;
     }
-    const state29 = $87.get(pendingState);
+    const state30 = $87.get(pendingState);
     $87.set(pendingState, null);
     const { doc } = view.state;
     const documentText = doc.textBetween(0, doc.content.size, `
 `);
     const reanchoredThreads = [];
-    for (const persistedThread of state29.threads) {
+    for (const persistedThread of state30.threads) {
       const result = reanchorQuote2(documentText, persistedThread.anchor);
       if (!result.found) {
         onthreaddelete?.({ threadId: persistedThread.id });
@@ -13776,8 +14403,8 @@ function createAnchorManager(options) {
     get pendingState() {
       return $87.get(pendingState);
     },
-    setPendingState(state29) {
-      $87.set(pendingState, state29, true);
+    setPendingState(state30) {
+      $87.set(pendingState, state30, true);
     },
     attemptReanchoring,
     syncThreadsToPlugin,
@@ -13806,17 +14433,17 @@ import {
   generateMarkdownSummary as generateMarkdownSummary3,
   generateUnifiedDiff as generateUnifiedDiff2
 } from "@lostgradient/cinder/commentary/export";
-function buildFormData(state29) {
+function buildFormData(state30) {
   return {
-    original: state29.original ?? "",
-    current: state29.content,
-    comments: JSON.stringify(state29.threads),
-    diff: generateUnifiedDiff2(state29).diff,
-    summary: generateMarkdownSummary3(state29).markdown
+    original: state30.original ?? "",
+    current: state30.content,
+    comments: JSON.stringify(state30.threads),
+    diff: generateUnifiedDiff2(state30).diff,
+    summary: generateMarkdownSummary3(state30).markdown
   };
 }
 function buildFormDataFromValues(original, current, threads) {
-  const state29 = {
+  const state30 = {
     schemaVersion: 4,
     content: current,
     original,
@@ -13835,19 +14462,19 @@ function buildFormDataFromValues(original, current, threads) {
     })),
     updatedAt: new Date().toISOString()
   };
-  return buildFormData(state29);
+  return buildFormData(state30);
 }
-function exportMarkdownSummary(state29, options) {
-  return generateMarkdownSummary3(state29, options);
+function exportMarkdownSummary(state30, options) {
+  return generateMarkdownSummary3(state30, options);
 }
-function exportUnifiedDiff(state29, options) {
-  return generateUnifiedDiff2(state29, options);
+function exportUnifiedDiff(state30, options) {
+  return generateUnifiedDiff2(state30, options);
 }
-function exportCommentsMarkdown(state29) {
-  return generateCommentsExport2(state29).markdown;
+function exportCommentsMarkdown(state30) {
+  return generateCommentsExport2(state30).markdown;
 }
-function getSummaryContentWithoutHeading(state29) {
-  const result = generateMarkdownSummary3(state29);
+function getSummaryContentWithoutHeading(state30) {
+  const result = generateMarkdownSummary3(state30);
   return result.markdown.replace(/^# Review Summary\n+/, "");
 }
 
@@ -13873,4 +14500,4 @@ export {
   Comment_composer as CommentComposer
 };
 
-//# debugId=98E7D0D8AC4117DE64756E2164756E21
+//# debugId=AF8E91713FB767A464756E2164756E21