@almadar/ui 6.8.0 → 6.9.0

package/dist/components/index.cjs

@@ -1774,7 +1774,7 @@ var init_Button = __esm({
       secondary: [
         "bg-transparent text-accent",
         "border border-accent",
-        "hover:bg-accent hover:text-white hover:border-accent",
+        "hover:bg-accent hover:text-accent-foreground hover:border-accent",
         "active:scale-[var(--active-scale)]"
       ].join(" "),
       ghost: [
@@ -4225,8 +4225,17 @@ var init_Typography = __esm({
             weight && weightStyles[weight],
             size && typographySizeStyles[size],
             align && `text-${align}`,
-            truncate && "truncate overflow-hidden text-ellipsis",
-            overflow && overflowStyles2[overflow],
+            // `min-w-0` rides along with truncate/wrap/clamp: a flex or grid
+            // item's default `min-width: auto` refuses to shrink below its
+            // content's intrinsic width, so ellipsis/wrap silently does nothing
+            // in the single most common placement (a row next to a fixed-width
+            // control) unless the item can also shrink to zero. (Spelled out as
+            // just "truncate", not "truncate overflow-hidden text-ellipsis" —
+            // tailwind-merge treats those as the same conflict group and drops
+            // "truncate" as the earlier-declared class, silently losing its
+            // `white-space: nowrap`.)
+            truncate && "truncate min-w-0",
+            overflow && cn(overflowStyles2[overflow], overflow !== "visible" && "min-w-0"),
             className
           ),
           style
@@ -13401,6 +13410,12 @@ var init_EmptyState = __esm({
 });
 
 // lib/editorMotions.ts
+function isEditorMotion(value) {
+  return EDITOR_MOTION_SET.has(value);
+}
+function isEditorOperator(value) {
+  return EDITOR_OPERATOR_SET.has(value);
+}
 function clamp(value, min, max) {
   return Math.max(min, Math.min(max, value));
 }
@@ -13468,6 +13483,30 @@ function prevParagraphBoundary(lines, fromLineIdx) {
   }
   return 0;
 }
+function matchBracket(text, pos) {
+  const ch = text[pos];
+  const partner = ch !== void 0 ? BRACKET_PARTNER[ch] : void 0;
+  if (partner === void 0) return null;
+  let depth = 1;
+  if (OPEN_BRACKETS.has(ch)) {
+    for (let i = pos + 1; i < text.length; i++) {
+      if (text[i] === ch) depth++;
+      else if (text[i] === partner) {
+        depth--;
+        if (depth === 0) return i;
+      }
+    }
+  } else {
+    for (let i = pos - 1; i >= 0; i--) {
+      if (text[i] === ch) depth++;
+      else if (text[i] === partner) {
+        depth--;
+        if (depth === 0) return i;
+      }
+    }
+  }
+  return null;
+}
 function applyMotion(text, caret, motion, count) {
   const n = Math.max(1, count);
   const lines = computeLines(text);
@@ -13529,6 +13568,20 @@ function applyMotion(text, caret, motion, count) {
       }
       return pos;
     }
+    case "match-bracket": {
+      const chAtCaret = text[caret];
+      if (chAtCaret !== void 0 && BRACKET_PARTNER[chAtCaret] !== void 0) {
+        const target = matchBracket(text, caret);
+        return target === null ? caret : target;
+      }
+      for (let i = caret; i < line.end; i++) {
+        if (BRACKET_PARTNER[text[i]] !== void 0) {
+          const target = matchBracket(text, i);
+          return target === null ? caret : target;
+        }
+      }
+      return caret;
+    }
     case "line":
     case "selection":
       return caret;
@@ -13556,8 +13609,8 @@ function motionRange(text, caret, motion, count, selection) {
   const newCaret = applyMotion(text, caret, motion, count);
   let start = Math.min(caret, newCaret);
   let end = Math.max(caret, newCaret);
-  if (motion === "word-end" || motion === "line-end") {
-    end = Math.min(Math.max(start, newCaret) + 1, text.length);
+  if ((motion === "word-end" || motion === "line-end" || motion === "match-bracket") && newCaret !== caret) {
+    end = Math.min(Math.max(caret, newCaret) + 1, text.length);
   } else if (motion === "word-forward" && newCaret > caret) {
     const startLine = lineIndexAt(lines, caret);
     const endLine = lineIndexAt(lines, newCaret);
@@ -13567,17 +13620,198 @@ function motionRange(text, caret, motion, count, selection) {
   }
   return [start, end];
 }
-function applyOperator(text, range, operator, register) {
-  const start = clamp(range[0], 0, text.length);
-  const end = clamp(range[1], start, text.length);
-  const removed = text.slice(start, end);
-  if (operator === "yank") {
-    return { text, caret: start, register: removed };
+function toggleCase(s) {
+  return s.replace(/[a-zA-Z]/g, (c) => c === c.toUpperCase() ? c.toLowerCase() : c.toUpperCase());
+}
+function applyJoin(text, caret, count, register, registerLinewise) {
+  const lines = computeLines(text);
+  const startIdx = lineIndexAt(lines, caret);
+  const n = Math.max(2, count);
+  const endIdx = clamp(startIdx + n - 1, 0, lines.length - 1);
+  if (endIdx <= startIdx) {
+    return { text, caret, register, registerLinewise };
+  }
+  const joinCaret = lines[startIdx].end;
+  let joined = text.slice(lines[startIdx].start, lines[startIdx].end);
+  for (let i = startIdx + 1; i <= endIdx; i++) {
+    const raw = text.slice(lines[i].start, lines[i].end);
+    joined += " " + raw.replace(/^[ \t]+/, "");
+  }
+  const newText = text.slice(0, lines[startIdx].start) + joined + text.slice(lines[endIdx].end);
+  return { text: newText, caret: joinCaret, register, registerLinewise };
+}
+function applyIndent(text, start, end, operator, register, registerLinewise) {
+  const lines = computeLines(text);
+  const startLineIdx = lineIndexAt(lines, start);
+  const lastTouchedPos = end > start ? end - 1 : start;
+  const endLineIdx = lineIndexAt(lines, lastTouchedPos);
+  let result = text;
+  for (let i = endLineIdx; i >= startLineIdx; i--) {
+    const lineStart = lines[i].start;
+    if (operator === "indent") {
+      result = result.slice(0, lineStart) + INDENT_UNIT + result.slice(lineStart);
+    } else if (result[lineStart] === "	") {
+      result = result.slice(0, lineStart) + result.slice(lineStart + 1);
+    } else {
+      let removeCount = 0;
+      while (removeCount < INDENT_UNIT.length && result[lineStart + removeCount] === " ") removeCount++;
+      result = result.slice(0, lineStart) + result.slice(lineStart + removeCount);
+    }
   }
-  return { text: text.slice(0, start) + text.slice(end), caret: start, register: removed };
+  const newLines = computeLines(result);
+  const caret = firstNonBlank(result, newLines[startLineIdx]);
+  return { text: result, caret, register, registerLinewise };
 }
+function applyPut(text, caret, operator, register, registerLinewise, count) {
+  if (register.length === 0) {
+    return { text, caret, register, registerLinewise };
+  }
+  const content = register.repeat(count);
+  const lines = computeLines(text);
+  const line = lines[lineIndexAt(lines, caret)];
+  if (registerLinewise) {
+    if (operator === "put-before") {
+      const insertPos3 = line.start;
+      return {
+        text: text.slice(0, insertPos3) + content + text.slice(insertPos3),
+        caret: insertPos3,
+        register,
+        registerLinewise
+      };
+    }
+    const nextLineIdx = lineIndexAt(lines, caret) + 1;
+    if (nextLineIdx < lines.length) {
+      const insertPos3 = lines[nextLineIdx].start;
+      return {
+        text: text.slice(0, insertPos3) + content + text.slice(insertPos3),
+        caret: insertPos3,
+        register,
+        registerLinewise
+      };
+    }
+    const insertPos2 = text.length;
+    return {
+      text: text.slice(0, insertPos2) + "\n" + content,
+      caret: insertPos2 + 1,
+      register,
+      registerLinewise
+    };
+  }
+  const insertPos = operator === "put-before" ? clamp(caret, 0, text.length) : clamp(caret + 1, line.start, line.end);
+  return {
+    text: text.slice(0, insertPos) + content + text.slice(insertPos),
+    caret: insertPos + content.length - 1,
+    register,
+    registerLinewise
+  };
+}
+function applyOperator(input) {
+  const { text, caret, operator, motion, register, registerLinewise } = input;
+  const count = Math.max(1, input.count);
+  const start = clamp(input.range[0], 0, text.length);
+  const end = clamp(input.range[1], start, text.length);
+  switch (operator) {
+    case "yank":
+      return { text, caret: start, register: text.slice(start, end), registerLinewise: motion === "line" };
+    case "delete":
+    case "replace": {
+      const removed = text.slice(start, end);
+      return {
+        text: text.slice(0, start) + text.slice(end),
+        caret: start,
+        register: removed,
+        registerLinewise: motion === "line"
+      };
+    }
+    case "change": {
+      if (motion === "line") {
+        const hasTrailingNewline = end > start && text[end - 1] === "\n";
+        const removeEnd = hasTrailingNewline ? end - 1 : end;
+        const removed2 = text.slice(start, removeEnd);
+        return {
+          text: text.slice(0, start) + text.slice(removeEnd),
+          caret: start,
+          register: removed2,
+          registerLinewise: true
+        };
+      }
+      const removed = text.slice(start, end);
+      return {
+        text: text.slice(0, start) + text.slice(end),
+        caret: start,
+        register: removed,
+        registerLinewise: false
+      };
+    }
+    case "put":
+    case "put-before":
+      return applyPut(text, caret, operator, register, registerLinewise, count);
+    case "join":
+      return applyJoin(text, caret, count, register, registerLinewise);
+    case "toggle-case": {
+      const toggled = toggleCase(text.slice(start, end));
+      return { text: text.slice(0, start) + toggled + text.slice(end), caret: end, register, registerLinewise };
+    }
+    case "indent":
+    case "dedent":
+      return applyIndent(text, start, end, operator, register, registerLinewise);
+    case "undo":
+    case "redo":
+      return { text, caret, register, registerLinewise };
+    default: {
+      const _exhaustive = operator;
+      return _exhaustive;
+    }
+  }
+}
+var EDITOR_MOTIONS, EDITOR_OPERATORS, EDITOR_MOTION_SET, EDITOR_OPERATOR_SET, INDENT_UNIT, BRACKET_PARTNER, OPEN_BRACKETS;
 var init_editorMotions = __esm({
   "lib/editorMotions.ts"() {
+    EDITOR_MOTIONS = [
+      "left",
+      "right",
+      "up",
+      "down",
+      "word-forward",
+      "word-back",
+      "word-end",
+      "line-start",
+      "line-end",
+      "first-nonblank",
+      "doc-start",
+      "doc-end",
+      "paragraph-forward",
+      "paragraph-back",
+      "line",
+      "selection",
+      "match-bracket"
+    ];
+    EDITOR_OPERATORS = [
+      "delete",
+      "yank",
+      "change",
+      "put",
+      "put-before",
+      "undo",
+      "redo",
+      "join",
+      "toggle-case",
+      "indent",
+      "dedent",
+      "replace"
+    ];
+    EDITOR_MOTION_SET = new Set(EDITOR_MOTIONS);
+    EDITOR_OPERATOR_SET = new Set(EDITOR_OPERATORS);
+    INDENT_UNIT = "  ";
+    BRACKET_PARTNER = {
+      "(": ")",
+      ")": "(",
+      "[": "]",
+      "]": "[",
+      "{": "}",
+      "}": "{"
+    };
+    OPEN_BRACKETS = /* @__PURE__ */ new Set(["(", "[", "{"]);
   }
 });
 function isMotionPayload(payload) {
@@ -13592,14 +13826,103 @@ function isInsertTextPayload(payload) {
 function isSetModePayload(payload) {
   return !!payload && typeof payload.editorId === "string" && typeof payload.mode === "string" && typeof payload.caret === "string";
 }
+function typedDelta(prev, next) {
+  const maxPrefix = Math.min(prev.length, next.length);
+  let prefixLen = 0;
+  while (prefixLen < maxPrefix && prev[prefixLen] === next[prefixLen]) prefixLen++;
+  const maxSuffix = Math.min(prev.length - prefixLen, next.length - prefixLen);
+  let suffixLen = 0;
+  while (suffixLen < maxSuffix && prev[prev.length - 1 - suffixLen] === next[next.length - 1 - suffixLen]) {
+    suffixLen++;
+  }
+  const removed = prev.slice(prefixLen, prev.length - suffixLen);
+  const inserted = next.slice(prefixLen, next.length - suffixLen);
+  return removed + inserted;
+}
 function useEditorCapabilities(args) {
   const [caretMode, setCaretMode] = React79.useState("bar");
   const registerRef = React79.useRef("");
+  const registerLinewiseRef = React79.useRef(false);
+  const pastRef = React79.useRef([]);
+  const futureRef = React79.useRef([]);
+  const openTypingStepRef = React79.useRef(false);
+  const insertSessionOpenRef = React79.useRef(false);
+  const closeOpenTypingStep = React79.useCallback(() => {
+    openTypingStepRef.current = false;
+  }, []);
+  const pushHistoryStep = React79.useCallback(
+    (text, caret) => {
+      closeOpenTypingStep();
+      pastRef.current.push({ text, caret });
+      futureRef.current = [];
+    },
+    [closeOpenTypingStep]
+  );
+  const recordKeystroke = React79.useCallback(
+    (prevText, prevCaret, nextText) => {
+      if (!openTypingStepRef.current) {
+        pastRef.current.push({ text: prevText, caret: prevCaret });
+        futureRef.current = [];
+        openTypingStepRef.current = true;
+      }
+      if (!insertSessionOpenRef.current && /\s/.test(typedDelta(prevText, nextText))) {
+        openTypingStepRef.current = false;
+      }
+    },
+    []
+  );
+  const performUndo = React79.useCallback(
+    (count) => {
+      const ta = args.textareaRef.current;
+      if (!ta) return;
+      closeOpenTypingStep();
+      let moved = false;
+      for (let i = 0; i < Math.max(1, count) && pastRef.current.length > 0; i++) {
+        const prev = pastRef.current.pop();
+        futureRef.current.push({ text: ta.value, caret: ta.selectionStart });
+        ta.value = prev.text;
+        ta.setSelectionRange(prev.caret, prev.caret);
+        moved = true;
+      }
+      if (moved) args.applyChange(ta.value, "capability");
+    },
+    [args, closeOpenTypingStep]
+  );
+  const performRedo = React79.useCallback(
+    (count) => {
+      const ta = args.textareaRef.current;
+      if (!ta) return;
+      closeOpenTypingStep();
+      let moved = false;
+      for (let i = 0; i < Math.max(1, count) && futureRef.current.length > 0; i++) {
+        const next = futureRef.current.pop();
+        pastRef.current.push({ text: ta.value, caret: ta.selectionStart });
+        ta.value = next.text;
+        ta.setSelectionRange(next.caret, next.caret);
+        moved = true;
+      }
+      if (moved) args.applyChange(ta.value, "capability");
+    },
+    [args, closeOpenTypingStep]
+  );
+  const undo = React79.useCallback(() => performUndo(1), [performUndo]);
+  const redo = React79.useCallback(() => performRedo(1), [performRedo]);
+  const wasFocusedRef = React79.useRef(args.focused);
+  React79.useEffect(() => {
+    if (wasFocusedRef.current && !args.focused) {
+      setCaretMode("bar");
+    }
+    wasFocusedRef.current = args.focused;
+  }, [args.focused]);
   useEventListener(`UI:${args.events.onMotion}`, (evt) => {
     if (!args.editorId || !isMotionPayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    const { motion, count } = evt.payload;
+    if (!isEditorMotion(motion)) {
+      console.warn(`useEditorCapabilities: ignoring MOTION with unknown motion "${motion}"`);
+      return;
+    }
     const ta = args.textareaRef.current;
     if (!ta) return;
-    const { motion, count } = evt.payload;
     const newCaret = applyMotion(ta.value, ta.selectionStart, motion, count);
     if (ta.selectionStart !== ta.selectionEnd) {
       ta.setSelectionRange(ta.selectionStart, newCaret);
@@ -13609,32 +13932,63 @@ function useEditorCapabilities(args) {
   });
   useEventListener(`UI:${args.events.onOperate}`, (evt) => {
     if (!args.editorId || !isOperatePayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    const { operator, motion, count } = evt.payload;
+    if (!isEditorOperator(operator)) {
+      console.warn(`useEditorCapabilities: ignoring OPERATE with unknown operator "${operator}"`);
+      return;
+    }
+    if (!isEditorMotion(motion)) {
+      console.warn(`useEditorCapabilities: ignoring OPERATE with unknown motion "${motion}"`);
+      return;
+    }
     const ta = args.textareaRef.current;
     if (!ta) return;
-    const { operator, motion, count } = evt.payload;
+    if (operator === "undo") {
+      performUndo(count);
+      return;
+    }
+    if (operator === "redo") {
+      performRedo(count);
+      return;
+    }
+    pushHistoryStep(ta.value, ta.selectionStart);
     const selection = motion === "selection" ? [ta.selectionStart, ta.selectionEnd] : void 0;
     const range = motionRange(ta.value, ta.selectionStart, motion, count, selection);
-    const result = applyOperator(ta.value, range, operator, registerRef.current);
+    const result = applyOperator({
+      text: ta.value,
+      caret: ta.selectionStart,
+      range,
+      operator,
+      motion,
+      count,
+      register: registerRef.current,
+      registerLinewise: registerLinewiseRef.current
+    });
     registerRef.current = result.register;
+    registerLinewiseRef.current = result.registerLinewise;
     if (operator === "yank") {
-      ta.setSelectionRange(range[0], range[0]);
+      ta.setSelectionRange(result.caret, result.caret);
     } else {
-      ta.setRangeText("", range[0], range[1], "end");
+      ta.value = result.text;
+      ta.setSelectionRange(result.caret, result.caret);
     }
-    args.applyChange(ta.value);
+    args.applyChange(ta.value, "capability");
   });
   useEventListener(`UI:${args.events.onInsertText}`, (evt) => {
     if (!args.editorId || !isInsertTextPayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
     const ta = args.textareaRef.current;
     if (!ta) return;
+    pushHistoryStep(ta.value, ta.selectionStart);
     ta.setRangeText(evt.payload.text, ta.selectionStart, ta.selectionEnd, "end");
-    args.applyChange(ta.value);
+    args.applyChange(ta.value, "capability");
   });
   useEventListener(`UI:${args.events.onSetMode}`, (evt) => {
     if (!args.editorId || !isSetModePayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    closeOpenTypingStep();
+    insertSessionOpenRef.current = evt.payload.mode === "INSERT";
     setCaretMode(evt.payload.caret);
   });
-  return { caretMode };
+  return { caretMode, recordKeystroke, undo, redo };
 }
 var init_useEditorCapabilities = __esm({
   "components/core/molecules/markdown/useEditorCapabilities.ts"() {
@@ -14053,9 +14407,23 @@ var init_CodeBlock = __esm({
           "paragraph-forward",
           "paragraph-back",
           "line",
-          "selection"
+          "selection",
+          "match-bracket"
         ],
-        operators = ["delete", "yank", "change"]
+        operators = [
+          "delete",
+          "yank",
+          "change",
+          "put",
+          "put-before",
+          "undo",
+          "redo",
+          "join",
+          "toggle-case",
+          "indent",
+          "dedent",
+          "replace"
+        ]
       }) => {
         const code = typeof rawCode === "string" ? rawCode : String(rawCode ?? "");
         const activeStyle = resolveHighlightStyle(language);
@@ -14089,6 +14457,12 @@ var init_CodeBlock = __esm({
         const lastPropCodeRef = React79.useRef(code);
         const editableTextareaRef = React79.useRef(null);
         const editableOverlayRef = React79.useRef(null);
+        const [isFocused, setIsFocused] = React79.useState(false);
+        const prevCaretRef = React79.useRef(0);
+        const [caretIndex, setCaretIndex] = React79.useState(0);
+        const caretMirrorRef = React79.useRef(null);
+        const caretMarkerRef = React79.useRef(null);
+        const [caretGeometry, setCaretGeometry] = React79.useState(null);
         React79.useEffect(() => {
           if (code !== lastPropCodeRef.current) {
             lastPropCodeRef.current = code;
@@ -14104,23 +14478,77 @@ var init_CodeBlock = __esm({
             ov.scrollLeft = ta.scrollLeft;
           }
         }, []);
-        const handleEditableChange = React79.useCallback((v) => {
+        const handleEditableChange = React79.useCallback((v, _origin) => {
           lastPropCodeRef.current = v;
           setEditableValue(v);
+          const ta = editableTextareaRef.current;
+          if (ta) setCaretIndex(ta.selectionStart);
           onChange?.(v);
         }, [onChange]);
-        const { caretMode } = useEditorCapabilities({
+        const { caretMode, recordKeystroke, undo, redo } = useEditorCapabilities({
           editorId: editable ? editorId : void 0,
           textareaRef: editableTextareaRef,
           events: { onMotion, onOperate, onInsertText, onSetMode },
+          focused: isFocused,
           applyChange: handleEditableChange
         });
-        const [caretIndex, setCaretIndex] = React79.useState(0);
-        const caretRowCol = React79.useMemo(() => {
-          const before = editableValue.slice(0, Math.min(caretIndex, editableValue.length));
-          const lines = before.split("\n");
-          return { row: lines.length - 1, col: lines[lines.length - 1].length };
-        }, [editableValue, caretIndex]);
+        const handleEditableKeyDown = React79.useCallback(
+          (e) => {
+            const ta = editableTextareaRef.current;
+            if (ta) prevCaretRef.current = ta.selectionStart;
+            const mod = e.metaKey || e.ctrlKey;
+            if (!mod) return;
+            const key = e.key.toLowerCase();
+            if (key === "z" && !e.shiftKey) {
+              e.preventDefault();
+              undo();
+            } else if (key === "z" && e.shiftKey || key === "y") {
+              e.preventDefault();
+              redo();
+            }
+          },
+          [undo, redo]
+        );
+        const showBlockCaret = isFocused && caretMode !== "bar";
+        React79.useLayoutEffect(() => {
+          if (!showBlockCaret) return;
+          const ta = editableTextareaRef.current;
+          const mirror = caretMirrorRef.current;
+          const marker = caretMarkerRef.current;
+          if (!ta || !mirror || !marker) return;
+          const computed = window.getComputedStyle(ta);
+          const MIRRORED_PROPS = [
+            "font-family",
+            "font-size",
+            "font-weight",
+            "font-style",
+            "letter-spacing",
+            "line-height",
+            "padding-top",
+            "padding-right",
+            "padding-bottom",
+            "padding-left",
+            "border-top-width",
+            "border-right-width",
+            "border-bottom-width",
+            "border-left-width",
+            "box-sizing",
+            "width",
+            "white-space",
+            "word-break",
+            "overflow-wrap",
+            "tab-size"
+          ];
+          for (const prop of MIRRORED_PROPS) {
+            mirror.style.setProperty(prop, computed.getPropertyValue(prop));
+          }
+          const lineHeight = parseFloat(computed.getPropertyValue("line-height"));
+          setCaretGeometry({
+            top: marker.offsetTop,
+            left: marker.offsetLeft,
+            lineHeight: Number.isFinite(lineHeight) ? lineHeight : 0
+          });
+        }, [showBlockCaret, editableValue, caretIndex]);
         const errorLineProps = React79.useMemo(() => buildLineProps(errorLines), [errorLines]);
         const viewerLineProps = React79.useMemo(
           () => buildLineProps(errorLines, "px-4 py-0.5 hover:bg-muted/50"),
@@ -14644,11 +15072,24 @@ var init_CodeBlock = __esm({
                     {
                       ref: editableTextareaRef,
                       defaultValue: code,
-                      onChange: (e) => handleEditableChange(e.target.value),
+                      onChange: (e) => {
+                        const next = e.target.value;
+                        recordKeystroke(editableValue, prevCaretRef.current, next);
+                        handleEditableChange(next, "keystroke");
+                      },
                       onScroll: handleEditableScroll,
                       onSelect: (e) => setCaretIndex(e.currentTarget.selectionStart),
-                      onFocus: editorId ? () => eventBus.emit(`UI:${onEditorFocus}`, { editorId }) : void 0,
-                      onBlur: editorId ? () => eventBus.emit(`UI:${onEditorBlur}`, { editorId }) : void 0,
+                      onKeyUp: (e) => setCaretIndex(e.currentTarget.selectionStart),
+                      onClick: (e) => setCaretIndex(e.currentTarget.selectionStart),
+                      onKeyDown: handleEditableKeyDown,
+                      onFocus: () => {
+                        setIsFocused(true);
+                        if (editorId) eventBus.emit(`UI:${onEditorFocus}`, { editorId });
+                      },
+                      onBlur: () => {
+                        setIsFocused(false);
+                        if (editorId) eventBus.emit(`UI:${onEditorBlur}`, { editorId });
+                      },
                       spellCheck: false,
                       style: {
                         position: "absolute",
@@ -14675,16 +15116,39 @@ var init_CodeBlock = __esm({
                     },
                     editableTextareaKey
                   ),
-                  caretMode !== "bar" && /* @__PURE__ */ jsxRuntime.jsx(
+                  showBlockCaret && /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      ref: caretMirrorRef,
+                      "aria-hidden": true,
+                      "data-testid": "editor-caret-mirror",
+                      style: {
+                        position: "absolute",
+                        top: 0,
+                        left: 0,
+                        padding: "1rem",
+                        margin: 0,
+                        border: "none",
+                        visibility: "hidden",
+                        pointerEvents: "none"
+                      },
+                      children: [
+                        editableValue.slice(0, caretIndex),
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { ref: caretMarkerRef, "data-testid": "editor-caret-marker", children: "\u200B" })
+                      ]
+                    }
+                  ),
+                  showBlockCaret && caretGeometry && /* @__PURE__ */ jsxRuntime.jsx(
                     "span",
                     {
                       "aria-hidden": true,
+                      "data-testid": "editor-caret",
                       style: {
                         position: "absolute",
-                        top: `calc(1rem + ${caretRowCol.row * 19.5}px)`,
-                        left: `calc(1rem + ${caretRowCol.col}ch)`,
+                        top: caretGeometry.top,
+                        left: caretGeometry.left,
                         width: "1ch",
-                        height: caretMode === "block" ? "19.5px" : "2px",
+                        height: caretMode === "block" ? caretGeometry.lineHeight || "1.2em" : "2px",
                         backgroundColor: caretMode === "block" ? "rgba(230, 230, 230, 0.5)" : void 0,
                         borderBottom: caretMode === "underline" ? "2px solid #e6e6e6" : void 0,
                         pointerEvents: "none"
@@ -19400,6 +19864,10 @@ var init_projector = __esm({
 });
 
 // lib/drawable/hitTest.ts
+function shapeDrawnItem(n) {
+  if (n.shape !== "rect") return { pos: n.position, id: n.id };
+  return { pos: n.position, id: n.id, anchor: n.anchor, width: n.width, height: n.height, rotation: n.rotate };
+}
 function collectDrawnItems(nodes) {
   const out = [];
   for (const n of nodes) {
@@ -19408,6 +19876,8 @@ function collectDrawnItems(nodes) {
         if (isValidScenePos(n.position)) out.push({ pos: n.position, id: n.id, anchor: n.anchor, width: n.width, height: n.height, rotation: n.rotation });
         break;
       case "draw-shape":
+        if (isValidScenePos(n.position)) out.push(shapeDrawnItem(n));
+        break;
       case "draw-text":
       case "draw-group":
       case "draw-mesh":
@@ -19419,6 +19889,10 @@ function collectDrawnItems(nodes) {
         }
         break;
       case "draw-shape-layer":
+        for (const it of n.items) {
+          if (isValidScenePos(it.position)) out.push(shapeDrawnItem(it));
+        }
+        break;
       case "draw-text-layer":
         for (const it of n.items) {
           if (isValidScenePos(it.position)) out.push({ pos: it.position, id: it.id });
@@ -24210,6 +24684,7 @@ function SubMenu({
               item.onClick?.();
             },
             "aria-disabled": item.disabled || void 0,
+            title: item.title,
             "data-testid": item.event ? `action-${item.event}` : void 0,
             className: cn(
               "w-full flex items-center gap-3 px-4 py-2 text-start",
@@ -24258,6 +24733,7 @@ function MenuItemRow({
         as: "button",
         onClick: () => onItemClick({ ...item, id: itemId }, itemId),
         "aria-disabled": item.disabled || void 0,
+        title: item.title,
         onMouseEnter: (e) => {
           if (hasSubMenu) openSubMenu(itemId, e.currentTarget);
         },
@@ -34722,13 +35198,13 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect72, useRef: useRef70, useCallback: useCallback109, useState: useState110 } = React79__namespace.default;
+      const { useEffect: useEffect73, useRef: useRef70, useCallback: useCallback110, useState: useState110 } = React79__namespace.default;
       const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
       const { useEventBus: useEventBus2 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
       function MapUpdater({ centerLat, centerLng, zoom }) {
         const map = useMap();
         const prevRef = useRef70({ centerLat, centerLng, zoom });
-        useEffect72(() => {
+        useEffect73(() => {
           const prev = prevRef.current;
           if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
             map.setView([centerLat, centerLng], zoom);
@@ -34739,7 +35215,7 @@ var init_MapView = __esm({
       }
       function MapClickHandler({ onMapClick }) {
         const map = useMap();
-        useEffect72(() => {
+        useEffect73(() => {
           if (!onMapClick) return;
           const handler = (e) => {
             onMapClick(e.latlng.lat, e.latlng.lng);
@@ -34768,7 +35244,7 @@ var init_MapView = __esm({
       }) {
         const eventBus = useEventBus2();
         const [clickedPosition, setClickedPosition] = useState110(null);
-        const handleMapClick = useCallback109((lat, lng) => {
+        const handleMapClick = useCallback110((lat, lng) => {
           if (showClickedPin) {
             setClickedPosition({ lat, lng });
           }
@@ -34777,7 +35253,7 @@ var init_MapView = __esm({
             eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
           }
         }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
-        const handleMarkerClick = useCallback109((marker) => {
+        const handleMarkerClick = useCallback110((marker) => {
           onMarkerClick?.(marker);
           if (markerClickEvent) {
             eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -44609,7 +45085,10 @@ var init_FloatingToolbar = __esm({
     positionClasses = {
       "bottom-center": "bottom-6 left-1/2 -translate-x-1/2",
       "bottom-left": "bottom-6 left-6",
-      "bottom-right": "bottom-6 right-6"
+      "bottom-right": "bottom-6 right-6",
+      "top-center": "top-6 left-1/2 -translate-x-1/2",
+      "top-left": "top-6 left-6",
+      "top-right": "top-6 right-6"
     };
     exports.FloatingToolbar = ({
       items,
@@ -52395,6 +52874,7 @@ var init_component_registry_generated = __esm({
       "TrendIndicator": exports.TrendIndicator,
       "TypewriterText": exports.TypewriterText,
       "Typography": exports.Typography,
+      "UISlotComponent": UISlotComponent,
       "UISlotRenderer": UISlotRenderer,
       "UploadDropZone": exports.UploadDropZone,
       "VStack": exports.VStack,
@@ -52700,6 +53180,7 @@ function UISlotComponentInner({
   const contained = React79.useContext(SlotContainedContext);
   const schemaCtx = providers.useEntitySchemaOptional();
   const rawContent = slots[slot];
+  const regionClassName = fallback !== void 0 ? cn("contents", className) : className;
   const binding = providers.useEntityBindingSnapshot(rawContent?.sourceTrait);
   const content = React79.useMemo(() => {
     if (!rawContent) return rawContent;
@@ -52748,7 +53229,7 @@ function UISlotComponentInner({
         exports.Box,
         {
           id: `slot-${slot}`,
-          className: cn("ui-slot", `ui-slot-${slot}`, className),
+          className: cn("ui-slot", `ui-slot-${slot}`, regionClassName),
           "data-testid": `ui-slot-${slot}`,
           "data-slot-mode": "fallback",
           children: fallback
@@ -52783,7 +53264,7 @@ function UISlotComponentInner({
       exports.Box,
       {
         id: `slot-${slot}-fallback`,
-        className: cn("ui-slot", `ui-slot-${slot}-fallback`, className),
+        className: cn("ui-slot", `ui-slot-${slot}-fallback`, regionClassName),
         "data-testid": `ui-slot-${slot}-fallback`,
         "data-slot-mode": "append",
         children: fallback
@@ -52815,7 +53296,7 @@ function UISlotComponentInner({
     exports.Box,
     {
       id: `slot-${slot}`,
-      className: cn("ui-slot", `ui-slot-${slot}`, className),
+      className: cn("ui-slot", `ui-slot-${slot}`, regionClassName),
       "data-pattern": content.pattern,
       "data-source-trait": content.sourceTrait,
       "data-testid": `ui-slot-${slot}`,
@@ -54641,6 +55122,33 @@ init_useEventBus();
 
 // hooks/useKeyboardRouter.ts
 init_useEventBus();
+function mergeCaptureTables(tables) {
+  const merged = {};
+  for (const table of tables) {
+    for (const [target, entry] of Object.entries(table)) {
+      const current = merged[target];
+      if (!current) {
+        merged[target] = { mode: entry.mode, keys: new Set(entry.keys) };
+        continue;
+      }
+      for (const key of entry.keys) current.keys.add(key);
+      if (current.mode === "any" || entry.mode === "any") current.mode = "any";
+      else if (current.mode !== entry.mode) {
+        current.mode = Array.from(/* @__PURE__ */ new Set([...current.mode.split("|"), entry.mode])).sort().join("|");
+      }
+    }
+  }
+  return merged;
+}
+function keyChord(event) {
+  const parts = [];
+  if (event.ctrlKey) parts.push("Control");
+  if (event.altKey) parts.push("Alt");
+  if (event.shiftKey) parts.push("Shift");
+  if (event.metaKey) parts.push("Meta");
+  parts.push(event.key);
+  return parts.join("+");
+}
 function useKeyboardRouter(options) {
   const {
     captureTable,
@@ -54677,7 +55185,7 @@ function useKeyboardRouter(options) {
       if (event.isComposing) return;
       const target = focusedEditorIdRef.current ?? "shell";
       const entry = captureTableRef.current[target];
-      const captured = entry !== void 0 && (entry.mode === "any" || entry.keys.has(event.key));
+      const captured = entry !== void 0 && (entry.keys.has(event.key) || entry.keys.has(keyChord(event)));
       if (captured) {
         event.preventDefault();
       }
@@ -56142,9 +56650,11 @@ exports.getCurrentFrame = getCurrentFrame;
 exports.getTileDimensions = getTileDimensions;
 exports.inferDirection = inferDirection;
 exports.isoToScreen = isoToScreen;
+exports.keyChord = keyChord;
 exports.makeAsset = makeAsset;
 exports.makeAssetMap = makeAssetMap;
 exports.mapBookData = mapBookData;
+exports.mergeCaptureTables = mergeCaptureTables;
 exports.meshSphere = meshSphere;
 exports.num = num;
 exports.objAvailableActions = objAvailableActions;