@bendyline/squisq-editor-react 2.3.1 → 2.3.3

package/dist/{chunk-TRCKHRBS.js → chunk-QN3Q64LV.js}

@@ -75,6 +75,9 @@ var EXT_TO_LANGUAGE = {
 };
 var MARKDOWN_MODE_LANGUAGES = /* @__PURE__ */ new Set(["markdown", "plaintext"]);
 var IMAGE_MODE_LANGUAGES = /* @__PURE__ */ new Set(["image"]);
+var MONACO_LANGUAGE_ALIASES = {
+  jsonc: "json"
+};
 function extractExtension(fileName) {
   const trimmed = fileName.trim();
   if (!trimmed) return null;
@@ -93,7 +96,8 @@ function detectLanguageFromFileName(fileName) {
   return EXT_TO_LANGUAGE[ext] ?? null;
 }
 function resolveFileKind(fileName, language) {
-  const resolvedLanguage = language ?? (fileName ? detectLanguageFromFileName(fileName) : null);
+  const requestedLanguage = language ?? (fileName ? detectLanguageFromFileName(fileName) : null);
+  const resolvedLanguage = requestedLanguage ? MONACO_LANGUAGE_ALIASES[requestedLanguage.toLowerCase()] ?? requestedLanguage : null;
   if (!resolvedLanguage) {
     return { mode: "markdown", language: "markdown" };
   }
@@ -2679,7 +2683,7 @@ var TEMPLATE_ENTRIES = [
   {
     name: "sectionHeader",
     label: "Section Header",
-    description: "A clean section break with a prominent title and optional subtitle.",
+    description: "A clean section break with a prominent title and optional background image.",
     icon: /* @__PURE__ */ jsxs5(TemplateIcon, { children: [
       /* @__PURE__ */ jsx8("rect", { x: 4, y: 4, width: 3, height: 32, rx: 1, fill: FA }),
       /* @__PURE__ */ jsx8("rect", { x: 11, y: 8, width: 36, height: 6, rx: 1, fill: F2 }),
@@ -2687,6 +2691,18 @@ var TEMPLATE_ENTRIES = [
       /* @__PURE__ */ jsx8("rect", { x: 11, y: 24, width: 20, height: 2.5, rx: 1, fill: F1, opacity: 0.7 })
     ] })
   },
+  {
+    name: "content",
+    label: "Content",
+    description: "Shows a heading and the complete body in a loss-averse content-first layout.",
+    icon: /* @__PURE__ */ jsxs5(TemplateIcon, { children: [
+      /* @__PURE__ */ jsx8("rect", { x: 7, y: 7, width: 34, height: 5, rx: 1, fill: FA }),
+      /* @__PURE__ */ jsx8("rect", { x: 7, y: 17, width: 42, height: 2.5, rx: 1, fill: F2 }),
+      /* @__PURE__ */ jsx8("rect", { x: 7, y: 22, width: 38, height: 2.5, rx: 1, fill: F1 }),
+      /* @__PURE__ */ jsx8("rect", { x: 7, y: 27, width: 41, height: 2.5, rx: 1, fill: F1 }),
+      /* @__PURE__ */ jsx8("rect", { x: 7, y: 32, width: 30, height: 2.5, rx: 1, fill: F1, opacity: 0.7 })
+    ] })
+  },
   {
     name: "statHighlight",
     label: "Stat Highlight",
@@ -8423,6 +8439,14 @@ var CODE_SNIPPET_LANGUAGES = [
     monacoLanguage: "json",
     starter: '{\n  "key": "value"\n}'
   },
+  {
+    fenceLanguage: "jsonc",
+    label: "JSONC",
+    // Monaco exposes JSON-with-comments through its `json` language service;
+    // it does not register a separate rich-service `jsonc` language id.
+    monacoLanguage: "json",
+    starter: '{\n  // Comments are allowed.\n  "key": "value"\n}'
+  },
   {
     fenceLanguage: "html",
     label: "HTML",
@@ -8540,7 +8564,7 @@ var SPECIAL_FENCE_LANGUAGES = /* @__PURE__ */ new Set([
   "timeline",
   "mermaid"
 ]);
-var MONACO_LANGUAGE_ALIASES = {
+var MONACO_LANGUAGE_ALIASES2 = {
   c: "c",
   "c++": "cpp",
   "c#": "csharp",
@@ -8550,6 +8574,7 @@ var MONACO_LANGUAGE_ALIASES = {
   htm: "html",
   js: "javascript",
   jsx: "javascript",
+  jsonc: "json",
   md: "markdown",
   py: "python",
   rb: "ruby",
@@ -8570,7 +8595,7 @@ function isCodeSnippetFenceLanguage(language) {
 function monacoLanguageForFence(language) {
   const token = codeSnippetFenceLanguageToken(language);
   const catalogEntry = BY_FENCE_LANGUAGE.get(token);
-  return (catalogEntry?.monacoLanguage ?? MONACO_LANGUAGE_ALIASES[token] ?? token) || "plaintext";
+  return (catalogEntry?.monacoLanguage ?? MONACO_LANGUAGE_ALIASES2[token] ?? token) || "plaintext";
 }
 function codeSnippetLanguageLabel(language) {
   const token = codeSnippetFenceLanguageToken(language);
@@ -16653,9 +16678,19 @@ function ManagerContent({
 import { createPortal as createPortal8 } from "react-dom";
 
 // src/mediaEntries.ts
+var IMAGE_EDIT_STATE_FILENAME = "state.json";
+function pathSegments(path) {
+  return path.split(/[\\/]+/).filter(Boolean);
+}
 function isVisibleMediaEntry(entry) {
-  const basename = entry.name.slice(entry.name.lastIndexOf("/") + 1);
-  return basename.toLowerCase() !== ".gitignore";
+  const segments = pathSegments(entry.name);
+  const lowerSegments = segments.map((segment) => segment.toLowerCase());
+  const basename = lowerSegments[lowerSegments.length - 1] ?? "";
+  if (basename === ".gitignore") return false;
+  if (lowerSegments.includes(".versions")) return false;
+  const parent = lowerSegments[lowerSegments.length - 2] ?? "";
+  const isImageEditState = basename === IMAGE_EDIT_STATE_FILENAME && (lowerSegments.includes(".imageedits") || parent.endsWith("_files"));
+  return !isImageEditState;
 }
 function filterVisibleMediaEntries(entries) {
   return entries.filter(isVisibleMediaEntry);
@@ -17111,6 +17146,16 @@ function markPreviewRanges(ranges, selectedIndex) {
   return marks;
 }
 
+// src/platformShortcuts.ts
+function resolvePlatform(explicitPlatform) {
+  if (explicitPlatform !== void 0) return explicitPlatform;
+  if (typeof navigator === "undefined") return "";
+  return navigator.platform;
+}
+function platformShortcut(key, platform) {
+  return /Mac|iPhone|iPad|iPod/i.test(resolvePlatform(platform)) ? `\u2318${key}` : `Ctrl+${key}`;
+}
+
 // src/toolbar/toolbarButtons.tsx
 import { jsx as jsx38 } from "react/jsx-runtime";
 var BUTTONS = [
@@ -17500,9 +17545,9 @@ function insertLayoutBlock(editor) {
 // src/Toolbar.tsx
 import { Fragment as Fragment13, jsx as jsx39, jsxs as jsxs29 } from "react/jsx-runtime";
 var VIEWS = [
-  { id: "wysiwyg", label: "Write", shortcut: "\u23181" },
-  { id: "raw", label: "Source", shortcut: "\u23182" },
-  { id: "preview", label: "Use", shortcut: "\u23183" }
+  { id: "wysiwyg", label: "Write", shortcutKey: "1" },
+  { id: "raw", label: "Source", shortcutKey: "2" },
+  { id: "preview", label: "Use", shortcutKey: "3" }
 ];
 var BLOCK_META_KEYS = new Set(Object.keys(KNOWN_BLOCK_META_KEYS));
 function findBlockBySourceLine(blocks, lineNumber) {
@@ -18716,7 +18761,7 @@ ${TASK_LIST_MARKDOWN}
                 }
                 setActiveView(view.id);
               },
-              "data-tooltip": `${viewLabel} (${view.shortcut})`,
+              "data-tooltip": `${viewLabel} (${platformShortcut(view.shortcutKey)})`,
               children: [
                 /* @__PURE__ */ jsx39(
                   "span",
@@ -25431,8 +25476,24 @@ function useCodeSnippetData(editor, blockId) {
   }, [editor, blockId, version]);
 }
 
+// src/codeSnippet/codeSnippetSizing.ts
+var CODE_SNIPPET_HEADER_HEIGHT = 34;
+var CODE_SNIPPET_LINE_HEIGHT = 20;
+var CODE_SNIPPET_VERTICAL_PADDING = 20;
+var CODE_SNIPPET_SHELL_BORDER = 2;
+var CODE_SNIPPET_EXTRA_LINES = 1;
+function codeSnippetAutoHeight(source) {
+  const sourceLineCount = source.split("\n").length;
+  return CODE_SNIPPET_SHELL_BORDER + CODE_SNIPPET_HEADER_HEIGHT + CODE_SNIPPET_VERTICAL_PADDING + (sourceLineCount + CODE_SNIPPET_EXTRA_LINES) * CODE_SNIPPET_LINE_HEIGHT;
+}
+
 // src/codeSnippet/CodeSnippetWidget.tsx
 import { jsx as jsx47, jsxs as jsxs36 } from "react/jsx-runtime";
+var nextCodeSnippetModelInstanceId = 0;
+function allocateCodeSnippetModelInstanceId() {
+  nextCodeSnippetModelInstanceId += 1;
+  return nextCodeSnippetModelInstanceId;
+}
 function schemeFromHost(host) {
   return host?.closest("[data-theme]")?.dataset.theme === "dark" ? "dark" : "light";
 }
@@ -25471,6 +25532,7 @@ function CodeSnippetWidget({
   const { ready } = useMonacoLoader();
   const colorScheme = useHostColorScheme(host);
   const editable = useEditorEditable(editor);
+  const [modelInstanceId] = useState39(allocateCodeSnippetModelInstanceId);
   const handleChange = useCallback34(
     (value) => {
       if (!editable) return;
@@ -25489,37 +25551,46 @@ function CodeSnippetWidget({
     /[^a-z0-9_-]/g,
     "-"
   );
-  return /* @__PURE__ */ jsxs36("div", { className: "squisq-code-snippet-shell", "data-language": data.fenceLanguage, children: [
-    /* @__PURE__ */ jsx47("div", { className: "squisq-code-snippet-header", children: /* @__PURE__ */ jsxs36("span", { className: "squisq-code-snippet-title", children: [
-      /* @__PURE__ */ jsx47(Icon, { icon: "fa-solid fa-file-code" }),
-      /* @__PURE__ */ jsx47("span", { children: data.label })
-    ] }) }),
-    /* @__PURE__ */ jsx47("div", { className: "squisq-code-snippet-editor", "aria-label": `${data.label} code editor`, children: ready ? /* @__PURE__ */ jsx47(
-      Ft,
-      {
-        path: `inmemory://squisq/code-snippet/${blockId}.${modelSuffix || "txt"}`,
-        language: data.monacoLanguage,
-        theme: colorScheme === "dark" ? "vs-dark" : "vs",
-        value: data.source,
-        onChange: handleChange,
-        onMount: handleMount,
-        options: {
-          automaticLayout: true,
-          contextmenu: true,
-          folding: true,
-          fontSize: 13,
-          lineNumbers: "on",
-          minimap: { enabled: false },
-          padding: { top: 10, bottom: 10 },
-          readOnly: !editable,
-          renderLineHighlight: "line",
-          scrollBeyondLastLine: false,
-          tabSize: 2,
-          wordWrap: "off"
-        }
-      }
-    ) : /* @__PURE__ */ jsx47("div", { className: "squisq-code-snippet-loading", children: "Loading code editor\u2026" }) })
-  ] });
+  return /* @__PURE__ */ jsxs36(
+    "div",
+    {
+      className: "squisq-code-snippet-shell",
+      "data-language": data.fenceLanguage,
+      style: { height: codeSnippetAutoHeight(data.source) },
+      children: [
+        /* @__PURE__ */ jsx47("div", { className: "squisq-code-snippet-header", children: /* @__PURE__ */ jsxs36("span", { className: "squisq-code-snippet-title", children: [
+          /* @__PURE__ */ jsx47(Icon, { icon: "fa-solid fa-file-code" }),
+          /* @__PURE__ */ jsx47("span", { children: data.label })
+        ] }) }),
+        /* @__PURE__ */ jsx47("div", { className: "squisq-code-snippet-editor", "aria-label": `${data.label} code editor`, children: ready ? /* @__PURE__ */ jsx47(
+          Ft,
+          {
+            path: `inmemory://squisq/code-snippet/${modelInstanceId}/${blockId}.${modelSuffix || "txt"}`,
+            language: data.monacoLanguage,
+            theme: colorScheme === "dark" ? "vs-dark" : "vs",
+            value: data.source,
+            onChange: handleChange,
+            onMount: handleMount,
+            options: {
+              automaticLayout: true,
+              contextmenu: true,
+              folding: true,
+              fontSize: 13,
+              lineHeight: CODE_SNIPPET_LINE_HEIGHT,
+              lineNumbers: "on",
+              minimap: { enabled: false },
+              padding: { top: 10, bottom: 10 },
+              readOnly: !editable,
+              renderLineHighlight: "line",
+              scrollBeyondLastLine: false,
+              tabSize: 2,
+              wordWrap: "off"
+            }
+          }
+        ) : /* @__PURE__ */ jsx47("div", { className: "squisq-code-snippet-loading", children: "Loading code editor\u2026" }) })
+      ]
+    }
+  );
 }
 
 // src/codeSnippet/CodeSnippetExtension.ts
@@ -29945,6 +30016,7 @@ function InlinePreviewGutter({
     });
   }, [items, connectorTops]);
   const isEmpty2 = items.length === 0;
+  if (isEmpty2) return null;
   const totalWidth = width + connectorWidth;
   const gutterStyle = {
     position: "relative",
@@ -30035,14 +30107,7 @@ function InlinePreviewGutter({
             })
           }
         ),
-        isEmpty2 ? /* @__PURE__ */ jsx55(
-          "div",
-          {
-            className: "squisq-inline-preview-empty",
-            style: { position: "absolute", top: 12, left: connectorWidth + 12, right: 12 },
-            children: /* @__PURE__ */ jsx55("p", { children: "Tag a heading with a template to see a preview here." })
-          }
-        ) : /* @__PURE__ */ jsx55(MediaContext3.Provider, { value: mediaProvider ?? null, children: items.map((item) => {
+        /* @__PURE__ */ jsx55(MediaContext3.Provider, { value: mediaProvider ?? null, children: items.map((item) => {
           const top = positions.get(item.id);
           const hidden = top == null;
           return /* @__PURE__ */ jsxs42(
@@ -32450,7 +32515,12 @@ function preparePopupDocument(popup, source, title) {
 function presentationTitle(docTitle) {
   return typeof docTitle === "string" && docTitle.trim() ? `${docTitle.trim()} - Presentation` : "Squisq Presentation";
 }
-function PresentationModeProvider({ rootRef, children }) {
+function PresentationModeProvider({
+  rootRef,
+  children,
+  allowWindow = true,
+  allowFullscreen = true
+}) {
   const { activeView, colorScheme, doc } = useEditorContext();
   const popupNameId = useId14().replace(/[^a-zA-Z0-9_-]/g, "");
   const [selectedTarget, setSelectedTarget] = useState55("control");
@@ -32464,6 +32534,14 @@ function PresentationModeProvider({ rootRef, children }) {
   const popupRef = useRef46(null);
   const popupCleanupRef = useRef46(null);
   const fullscreenSupported = typeof document !== "undefined" && typeof document.documentElement.requestFullscreen === "function";
+  const availableTargets = useMemo41(
+    () => [
+      "control",
+      ...allowWindow ? ["window"] : [],
+      ...allowFullscreen ? ["fullscreen"] : []
+    ],
+    [allowFullscreen, allowWindow]
+  );
   const releasePopup = useCallback45((closeWindow) => {
     const popup = popupRef.current;
     popupCleanupRef.current?.();
@@ -32515,6 +32593,7 @@ function PresentationModeProvider({ rootRef, children }) {
       return;
     }
     if (selectedTarget === "fullscreen") {
+      if (!allowFullscreen) return;
       if (typeof root.requestFullscreen !== "function") {
         setError("Browser full screen is not available here.");
         return;
@@ -32527,6 +32606,7 @@ function PresentationModeProvider({ rootRef, children }) {
       }
       return;
     }
+    if (!allowWindow) return;
     let popup = null;
     try {
       const screenWidth = window.screen?.availWidth || POPUP_WIDTH;
@@ -32567,15 +32647,29 @@ function PresentationModeProvider({ rootRef, children }) {
       else if (popup && !popup.closed) popup.close();
       setError("The presentation window was blocked. Allow pop-ups and try again.");
     }
-  }, [doc?.frontmatter?.title, popupNameId, releasePopup, rootRef, selectedTarget]);
+  }, [
+    allowFullscreen,
+    allowWindow,
+    doc?.frontmatter?.title,
+    popupNameId,
+    releasePopup,
+    rootRef,
+    selectedTarget
+  ]);
   const selectTarget = useCallback45(
     (target) => {
+      if (!availableTargets.includes(target)) return;
       if (target === selectedTarget) return;
       setSelectedTarget(target);
       if (activeTargetRef.current !== null) void stop();
     },
-    [selectedTarget, stop]
+    [availableTargets, selectedTarget, stop]
   );
+  useEffect45(() => {
+    if (availableTargets.includes(selectedTarget)) return;
+    setSelectedTarget("control");
+    if (activeTargetRef.current !== null) void stop();
+  }, [availableTargets, selectedTarget, stop]);
   useEffect45(() => {
     const root = rootRef.current;
     const ownerDocument = root?.ownerDocument;
@@ -32643,12 +32737,22 @@ function PresentationModeProvider({ rootRef, children }) {
       selectedTarget,
       activeTarget,
       popupRoot,
+      availableTargets,
       fullscreenSupported,
       selectTarget,
       start,
       stop
     }),
-    [selectedTarget, activeTarget, popupRoot, fullscreenSupported, selectTarget, start, stop]
+    [
+      selectedTarget,
+      activeTarget,
+      popupRoot,
+      availableTargets,
+      fullscreenSupported,
+      selectTarget,
+      start,
+      stop
+    ]
   );
   const exitButton = activeTarget ? /* @__PURE__ */ jsxs47(
     "button",
@@ -32699,13 +32803,22 @@ var MENU_WIDTH = 340;
 var MENU_MARGIN = 8;
 var MENU_GAP = 4;
 function PresentationModeControl() {
-  const { selectedTarget, activeTarget, fullscreenSupported, selectTarget, start, stop } = usePresentationMode();
+  const {
+    selectedTarget,
+    activeTarget,
+    availableTargets,
+    fullscreenSupported,
+    selectTarget,
+    start,
+    stop
+  } = usePresentationMode();
   const { colorScheme } = useEditorContext();
   const triggerRef = useRef46(null);
   const menuRef = useRef46(null);
   const [open, setOpen] = useState55(false);
   const [anchor, setAnchor] = useState55(null);
-  const selected = PRESENTATION_OPTIONS.find((option) => option.target === selectedTarget) ?? PRESENTATION_OPTIONS[0];
+  const options = PRESENTATION_OPTIONS.filter((option) => availableTargets.includes(option.target));
+  const selected = options.find((option) => option.target === selectedTarget) ?? PRESENTATION_OPTIONS[0];
   const updatePosition = useCallback45(() => {
     const trigger = triggerRef.current;
     if (!trigger) return;
@@ -32770,7 +32883,7 @@ function PresentationModeControl() {
         children: /* @__PURE__ */ jsx63(Icon, { icon: "fa-solid fa-display" })
       }
     ),
-    /* @__PURE__ */ jsx63(
+    options.length > 1 && /* @__PURE__ */ jsx63(
       "button",
       {
         ref: triggerRef,
@@ -32817,7 +32930,7 @@ function PresentationModeControl() {
             const nextIndex = event.key === "Home" ? 0 : event.key === "End" ? items.length - 1 : event.key === "ArrowUp" ? (currentIndex - 1 + items.length) % items.length : (currentIndex + 1) % items.length;
             items[nextIndex]?.focus();
           },
-          children: PRESENTATION_OPTIONS.map((option) => {
+          children: options.map((option) => {
             const isSelected = option.target === selectedTarget;
             const disabled = option.target === "fullscreen" && !fullscreenSupported;
             return /* @__PURE__ */ jsxs47(
@@ -34372,6 +34485,7 @@ function EditorShell({
   articleId = "untitled",
   basePath = "/",
   onChange,
+  onLinkClick,
   colorScheme = "light",
   className,
   height = "100vh",
@@ -34390,6 +34504,9 @@ function EditorShell({
   toolbarSlotRight,
   statusBarSlotRight,
   showPlayTab = true,
+  allowPresentationWindow = true,
+  allowPresentationFullscreen = true,
+  allowPrint = true,
   submitOnEnter,
   codeContext,
   fullWidth = false,
@@ -34470,6 +34587,7 @@ function EditorShell({
         {
           basePath,
           onChange,
+          onLinkClick,
           className,
           height,
           minHeight,
@@ -34483,6 +34601,9 @@ function EditorShell({
           toolbarSlotRight,
           statusBarSlotRight,
           showPlayTab,
+          allowPresentationWindow,
+          allowPresentationFullscreen,
+          allowPrint,
           submitOnEnter,
           codeContext,
           fullWidth,
@@ -34505,24 +34626,35 @@ function EditorShell({
     }
   ) });
 }
-function UseModeToolbarControls() {
+function UseModeToolbarControls({ allowPrint }) {
   const printMode = usePrintMode();
   if (printMode.active) return /* @__PURE__ */ jsx71(PrintPreviewToolbar, {});
   return /* @__PURE__ */ jsxs53(Fragment21, { children: [
     /* @__PURE__ */ jsx71(PreviewToolbarControls, {}),
     /* @__PURE__ */ jsx71(PresentationModeControl, {}),
-    /* @__PURE__ */ jsx71(PrintModeControl, {})
+    allowPrint && /* @__PURE__ */ jsx71(PrintModeControl, {})
   ] });
 }
 function UseModeProviders({
   rootRef,
-  children
+  children,
+  allowPresentationWindow,
+  allowPresentationFullscreen
 }) {
-  return /* @__PURE__ */ jsx71(PresentationModeProvider, { rootRef, children: /* @__PURE__ */ jsx71(PrintModeProvider, { rootRef, children }) });
+  return /* @__PURE__ */ jsx71(
+    PresentationModeProvider,
+    {
+      rootRef,
+      allowWindow: allowPresentationWindow,
+      allowFullscreen: allowPresentationFullscreen,
+      children: /* @__PURE__ */ jsx71(PrintModeProvider, { rootRef, children })
+    }
+  );
 }
 function EditorShellInner({
   basePath,
   onChange,
+  onLinkClick,
   className,
   height,
   minHeight,
@@ -34536,6 +34668,9 @@ function EditorShellInner({
   toolbarSlotRight,
   statusBarSlotRight,
   showPlayTab,
+  allowPresentationWindow,
+  allowPresentationFullscreen,
+  allowPrint,
   submitOnEnter,
   codeContext,
   fullWidth,
@@ -34723,14 +34858,51 @@ ${snippet}` : snippet);
     },
     [showPlayTab]
   );
+  const handleShellLinkClick = useCallback50(
+    (event) => {
+      if (!onLinkClick || event.button !== 0) return;
+      const anchor = event.target.closest?.("a[href]");
+      if (!anchor || !event.currentTarget.contains(anchor)) return;
+      const href = anchor.getAttribute("href");
+      if (!href || onLinkClick(href) === false) return;
+      event.preventDefault();
+      event.stopPropagation();
+    },
+    [onLinkClick]
+  );
+  const handleShellLinkMouseOver = useCallback50(
+    (event) => {
+      if (!onLinkClick) return;
+      const anchor = event.target.closest?.("a[href]");
+      if (!anchor || !event.currentTarget.contains(anchor)) return;
+      const href = anchor.getAttribute("href");
+      if (!href || anchor.hasAttribute("title") && !anchor.hasAttribute("data-squisq-link-title")) {
+        return;
+      }
+      anchor.setAttribute("title", href);
+      anchor.setAttribute("data-squisq-link-title", "true");
+    },
+    [onLinkClick]
+  );
+  const handleShellLinkMouseOut = useCallback50((event) => {
+    const anchor = event.target.closest?.("a[data-squisq-link-title]");
+    if (!anchor || !event.currentTarget.contains(anchor)) return;
+    if (event.relatedTarget instanceof Node && anchor.contains(event.relatedTarget)) return;
+    anchor.removeAttribute("title");
+    anchor.removeAttribute("data-squisq-link-title");
+  }, []);
   const autoGrow = minHeight !== void 0 || maxHeight !== void 0;
   return /* @__PURE__ */ jsxs53(
     "div",
     {
       ref: shellRef,
       onKeyDown: handleShellKeyDown,
+      onClickCapture: handleShellLinkClick,
+      onMouseOverCapture: handleShellLinkMouseOver,
+      onMouseOutCapture: handleShellLinkMouseOut,
       className: `squisq-editor-shell ${className || ""}`,
       "data-theme": colorScheme,
+      "data-link-handler": onLinkClick ? "true" : void 0,
       "data-full-width": fullWidth ? "true" : void 0,
       "data-thin-margins": thinMargins ? "true" : void 0,
       "data-outline-visible": isMarkdownMode && outlineVisible ? "true" : void 0,
@@ -34757,109 +34929,126 @@ ${snippet}` : snippet);
       },
       ...containerProps,
       children: [
-        /* @__PURE__ */ jsx71(CustomThemeProvider, { docThemes, onDocThemesChange, children: /* @__PURE__ */ jsx71(PreviewSettingsProvider, { doc, themeOverride, children: /* @__PURE__ */ jsxs53(UseModeProviders, { rootRef: shellRef, children: [
-          isImageMode ? (toolbarSlotLeft || toolbarSlotRight) && /* @__PURE__ */ jsxs53("div", { className: "squisq-editor-header squisq-editor-header--image", children: [
-            toolbarSlotLeft,
-            /* @__PURE__ */ jsx71("div", { style: { flex: 1 } }),
-            toolbarSlotRight
-          ] }) : /* @__PURE__ */ jsx71("div", { className: "squisq-editor-header", children: /* @__PURE__ */ jsx71(
-            Toolbar,
-            {
-              showFiles,
-              fileCount: mediaCount,
-              onToggleFiles: !isCodeMode && filesToggleEnabled ? handleToggleFiles : void 0,
-              slotLeft: toolbarSlotLeft,
-              slotAfterTabs: !isCodeMode && isPreview && /* @__PURE__ */ jsx71(UseModeToolbarControls, {}),
-              slotAfterActions: toolbarSlotAfterActions,
-              slotRight: toolbarSlotRight,
-              showPlayTab
-            }
-          ) }),
-          /* @__PURE__ */ jsxs53(
-            "div",
-            {
-              className: "squisq-editor-content",
-              style: {
-                flex: autoGrow ? "1 1 auto" : 1,
-                overflowY: autoGrow ? "auto" : "hidden",
-                overflowX: "hidden",
-                minHeight: 0,
-                position: "relative",
-                display: "flex"
-              },
-              children: [
-                /* @__PURE__ */ jsxs53(
-                  "div",
-                  {
-                    style: {
-                      flex: autoGrow ? "1 1 auto" : 1,
-                      overflow: autoGrow ? "visible" : "hidden",
-                      minHeight: 0,
-                      position: "relative"
-                    },
-                    children: [
-                      isImageMode && imageSrc && (imageMode === "edit" && imageEditorContainer ? /* @__PURE__ */ jsx71(
-                        ImageEditor,
-                        {
-                          filesContainer: imageEditorContainer,
-                          initialSrc: imageSrc,
-                          allowVersioning,
-                          versioningAutoSaveIdleMs,
-                          onExport: onImageExport,
-                          surface: colorScheme === "dark" ? DARK_SURFACE : LIGHT_SURFACE
-                        }
-                      ) : /* @__PURE__ */ jsx71(ImageViewer, { src: imageSrc, alt: imageAlt, theme: colorScheme })),
-                      !isImageMode && activeView === "raw" && /* @__PURE__ */ jsxs53("div", { className: "squisq-editor-with-gutter", children: [
-                        isMarkdownMode && outlineVisible && /* @__PURE__ */ jsx71(OutlinePanel, { width: outlineWidth, readOnly }, "outline"),
-                        isCardMode ? /* @__PURE__ */ jsx71(
-                          BlockCardView,
-                          {
-                            blockCount,
-                            activeBlockKey,
-                            onPrev: prevBlock,
-                            onNext: nextBlock,
-                            onAdd: addBlock,
-                            children: /* @__PURE__ */ jsx71("div", { className: "squisq-raw-editor-container", children: /* @__PURE__ */ jsx71(
+        /* @__PURE__ */ jsx71(CustomThemeProvider, { docThemes, onDocThemesChange, children: /* @__PURE__ */ jsx71(PreviewSettingsProvider, { doc, themeOverride, children: /* @__PURE__ */ jsxs53(
+          UseModeProviders,
+          {
+            rootRef: shellRef,
+            allowPresentationWindow,
+            allowPresentationFullscreen,
+            children: [
+              isImageMode ? (toolbarSlotLeft || toolbarSlotRight) && /* @__PURE__ */ jsxs53("div", { className: "squisq-editor-header squisq-editor-header--image", children: [
+                toolbarSlotLeft,
+                /* @__PURE__ */ jsx71("div", { style: { flex: 1 } }),
+                toolbarSlotRight
+              ] }) : /* @__PURE__ */ jsx71("div", { className: "squisq-editor-header", children: /* @__PURE__ */ jsx71(
+                Toolbar,
+                {
+                  showFiles,
+                  fileCount: mediaCount,
+                  onToggleFiles: !isCodeMode && filesToggleEnabled ? handleToggleFiles : void 0,
+                  slotLeft: toolbarSlotLeft,
+                  slotAfterTabs: !isCodeMode && isPreview && /* @__PURE__ */ jsx71(UseModeToolbarControls, { allowPrint }),
+                  slotAfterActions: toolbarSlotAfterActions,
+                  slotRight: toolbarSlotRight,
+                  showPlayTab
+                }
+              ) }),
+              /* @__PURE__ */ jsxs53(
+                "div",
+                {
+                  className: "squisq-editor-content",
+                  style: {
+                    flex: autoGrow ? "1 1 auto" : 1,
+                    overflowY: autoGrow ? "auto" : "hidden",
+                    overflowX: "hidden",
+                    minHeight: 0,
+                    position: "relative",
+                    display: "flex"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxs53(
+                      "div",
+                      {
+                        style: {
+                          flex: autoGrow ? "1 1 auto" : 1,
+                          overflow: autoGrow ? "visible" : "hidden",
+                          minHeight: 0,
+                          position: "relative"
+                        },
+                        children: [
+                          isImageMode && imageSrc && (imageMode === "edit" && imageEditorContainer ? /* @__PURE__ */ jsx71(
+                            ImageEditor,
+                            {
+                              filesContainer: imageEditorContainer,
+                              initialSrc: imageSrc,
+                              allowVersioning,
+                              versioningAutoSaveIdleMs,
+                              onExport: onImageExport,
+                              surface: colorScheme === "dark" ? DARK_SURFACE : LIGHT_SURFACE
+                            }
+                          ) : /* @__PURE__ */ jsx71(ImageViewer, { src: imageSrc, alt: imageAlt, theme: colorScheme })),
+                          !isImageMode && activeView === "raw" && /* @__PURE__ */ jsxs53("div", { className: "squisq-editor-with-gutter", children: [
+                            isMarkdownMode && outlineVisible && /* @__PURE__ */ jsx71(OutlinePanel, { width: outlineWidth, readOnly }, "outline"),
+                            isCardMode ? /* @__PURE__ */ jsx71(
+                              BlockCardView,
+                              {
+                                blockCount,
+                                activeBlockKey,
+                                onPrev: prevBlock,
+                                onNext: nextBlock,
+                                onAdd: addBlock,
+                                children: /* @__PURE__ */ jsx71("div", { className: "squisq-raw-editor-container", children: /* @__PURE__ */ jsx71(
+                                  RawEditor,
+                                  {
+                                    monacoTheme: colorScheme === "dark" ? "vs-dark" : "vs",
+                                    submitOnEnter,
+                                    readOnly
+                                  }
+                                ) }, "raw-editor")
+                              },
+                              "raw-card"
+                            ) : /* @__PURE__ */ jsx71("div", { className: "squisq-raw-editor-container", children: /* @__PURE__ */ jsx71(
                               RawEditor,
                               {
                                 monacoTheme: colorScheme === "dark" ? "vs-dark" : "vs",
                                 submitOnEnter,
                                 readOnly
                               }
-                            ) }, "raw-editor")
-                          },
-                          "raw-card"
-                        ) : /* @__PURE__ */ jsx71("div", { className: "squisq-raw-editor-container", children: /* @__PURE__ */ jsx71(
-                          RawEditor,
-                          {
-                            monacoTheme: colorScheme === "dark" ? "vs-dark" : "vs",
-                            submitOnEnter,
-                            readOnly
-                          }
-                        ) }, "raw-editor"),
-                        isCodeMode && codeContext && /* @__PURE__ */ jsx71(CodeContextZones, { options: codeContext }, "code-context"),
-                        isMarkdownMode && isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(BlockPreviewPanel, { basePath }, "block-preview"),
-                        isMarkdownMode && !isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(
-                          InlinePreviewGutter,
-                          {
-                            width: inlinePreviewWidth,
-                            basePath,
-                            mediaProvider
-                          },
-                          "inline"
-                        )
-                      ] }, "raw-shell"),
-                      isMarkdownMode && activeView === "wysiwyg" && /* @__PURE__ */ jsxs53("div", { className: "squisq-editor-with-gutter", children: [
-                        outlineVisible && /* @__PURE__ */ jsx71(OutlinePanel, { width: outlineWidth, readOnly }, "outline"),
-                        isCardMode ? /* @__PURE__ */ jsx71(
-                          BlockCardView,
-                          {
-                            blockCount,
-                            activeBlockKey,
-                            onPrev: prevBlock,
-                            onNext: nextBlock,
-                            onAdd: addBlock,
-                            children: /* @__PURE__ */ jsx71(
+                            ) }, "raw-editor"),
+                            isCodeMode && codeContext && /* @__PURE__ */ jsx71(CodeContextZones, { options: codeContext }, "code-context"),
+                            isMarkdownMode && isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(BlockPreviewPanel, { basePath }, "block-preview"),
+                            isMarkdownMode && !isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(
+                              InlinePreviewGutter,
+                              {
+                                width: inlinePreviewWidth,
+                                basePath,
+                                mediaProvider
+                              },
+                              "inline"
+                            )
+                          ] }, "raw-shell"),
+                          isMarkdownMode && activeView === "wysiwyg" && /* @__PURE__ */ jsxs53("div", { className: "squisq-editor-with-gutter", children: [
+                            outlineVisible && /* @__PURE__ */ jsx71(OutlinePanel, { width: outlineWidth, readOnly }, "outline"),
+                            isCardMode ? /* @__PURE__ */ jsx71(
+                              BlockCardView,
+                              {
+                                blockCount,
+                                activeBlockKey,
+                                onPrev: prevBlock,
+                                onNext: nextBlock,
+                                onAdd: addBlock,
+                                children: /* @__PURE__ */ jsx71(
+                                  WysiwygEditor,
+                                  {
+                                    submitOnEnter,
+                                    placeholder,
+                                    readOnly
+                                  },
+                                  "wysiwyg-editor"
+                                )
+                              },
+                              "wysiwyg-card"
+                            ) : /* @__PURE__ */ jsx71(
                               WysiwygEditor,
                               {
                                 submitOnEnter,
@@ -34867,60 +35056,51 @@ ${snippet}` : snippet);
                                 readOnly
                               },
                               "wysiwyg-editor"
+                            ),
+                            isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(BlockPreviewPanel, { basePath }, "block-preview"),
+                            !isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(
+                              InlinePreviewGutter,
+                              {
+                                width: inlinePreviewWidth,
+                                basePath,
+                                mediaProvider
+                              },
+                              "inline"
                             )
-                          },
-                          "wysiwyg-card"
-                        ) : /* @__PURE__ */ jsx71(
-                          WysiwygEditor,
-                          {
-                            submitOnEnter,
-                            placeholder,
-                            readOnly
-                          },
-                          "wysiwyg-editor"
-                        ),
-                        isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(BlockPreviewPanel, { basePath }, "block-preview"),
-                        !isCardMode && inlinePreviewVisible && /* @__PURE__ */ jsx71(
-                          InlinePreviewGutter,
-                          {
-                            width: inlinePreviewWidth,
-                            basePath,
-                            mediaProvider
-                          },
-                          "inline"
-                        )
-                      ] }, "wysiwyg-shell"),
-                      isMarkdownMode && isPreview && /* @__PURE__ */ jsx71(PreviewPanel, { basePath, workspaceContainer })
-                    ]
-                  }
-                ),
-                isMarkdownMode && showFiles && /* @__PURE__ */ jsx71(
-                  MediaBin,
-                  {
-                    mediaProvider,
-                    isDark,
-                    refreshKey: mediaListRefreshKey,
-                    usedMediaPaths,
-                    onMediaUploaded: handleMediaUploaded,
-                    onMediaRemoved: handleMediaRemoved,
-                    onCountChange: setMediaCount
-                  }
-                ),
-                isMarkdownMode && /* @__PURE__ */ jsx71(ThemeDesignerDock, {}),
-                isMarkdownMode && isDragging && !(activeView === "wysiwyg" && dragContentType === "media") && /* @__PURE__ */ jsx71(
-                  DropZoneOverlay,
-                  {
-                    dragContentType,
-                    zoneProps,
-                    hasMediaProvider: mediaProvider !== null
-                  }
-                )
-              ]
-            }
-          ),
-          isTimelineMode && /* @__PURE__ */ jsx71(TimelineTrack, {}),
-          statusBarVisible && !isImageMode && /* @__PURE__ */ jsx71(StatusBar, { slotRight: statusBarSlotRight })
-        ] }) }) }),
+                          ] }, "wysiwyg-shell"),
+                          isMarkdownMode && isPreview && /* @__PURE__ */ jsx71(PreviewPanel, { basePath, workspaceContainer })
+                        ]
+                      }
+                    ),
+                    isMarkdownMode && showFiles && /* @__PURE__ */ jsx71(
+                      MediaBin,
+                      {
+                        mediaProvider,
+                        isDark,
+                        refreshKey: mediaListRefreshKey,
+                        usedMediaPaths,
+                        onMediaUploaded: handleMediaUploaded,
+                        onMediaRemoved: handleMediaRemoved,
+                        onCountChange: setMediaCount
+                      }
+                    ),
+                    isMarkdownMode && /* @__PURE__ */ jsx71(ThemeDesignerDock, {}),
+                    isMarkdownMode && isDragging && !(activeView === "wysiwyg" && dragContentType === "media") && /* @__PURE__ */ jsx71(
+                      DropZoneOverlay,
+                      {
+                        dragContentType,
+                        zoneProps,
+                        hasMediaProvider: mediaProvider !== null
+                      }
+                    )
+                  ]
+                }
+              ),
+              isTimelineMode && /* @__PURE__ */ jsx71(TimelineTrack, {}),
+              statusBarVisible && !isImageMode && /* @__PURE__ */ jsx71(StatusBar, { slotRight: statusBarSlotRight })
+            ]
+          }
+        ) }) }),
         /* @__PURE__ */ jsx71(TooltipLayer, {}),
         imageEditTarget !== null && mediaProvider && /* @__PURE__ */ jsx71(
           ImageEditModal,
@@ -35125,6 +35305,7 @@ export {
   DEFAULT_MERMAID_DIAGRAM_TYPE,
   mermaidDiagramMarkdown,
   MermaidDiagramTypeThumbnail,
+  platformShortcut,
   Toolbar,
   StatusBar,
   RawEditor,