@threadlabs/looma 0.22.12 → 0.22.14

package/editor/chunks/extensions.js

@@ -7,6 +7,7 @@ import { dropCursor } from "@tiptap/pm/dropcursor";
 import { gapCursor } from "@tiptap/pm/gapcursor";
 import { createLowlight } from "lowlight";
 import { DOMParser, Node as Node$2, Slice } from "@tiptap/pm/model";
+import { Mapping } from "@tiptap/pm/transform";
 import MarkdownIt from "markdown-it";
 import { CellSelection, TableMap, addColumn, addColumnAfter, addColumnBefore, addRow, addRowAfter, addRowBefore, cellAround, columnResizing, deleteCellSelection, deleteColumn, deleteRow, deleteTable, fixTables, goToNextCell, mergeCells, moveTableColumn, moveTableRow, setCellAttr, splitCell, tableEditing, toggleHeader, toggleHeaderCell } from "@tiptap/pm/tables";
 //#region src/editor/extensions/active-block.ts
@@ -6198,6 +6199,57 @@ function createLoomaMentionExtension(options = {}) {
 	});
 }
 //#endregion
+//#region src/editor/extensions/relative-links.ts
+/** Keep other origins and non-web schemes intact; same-origin links retain path, query, and fragment. */
+function siteRelativeHref(href, baseUrl) {
+	if (!/^(https?:\/\/|\/\/)/i.test(href.trim())) return href;
+	try {
+		const base = new URL(baseUrl);
+		const url = new URL(href, base);
+		if (!/^https?:$/.test(base.protocol) || url.origin !== base.origin || url.username || url.password) return href;
+		return `${url.pathname}${url.search}${url.hash}`;
+	} catch {
+		return href;
+	}
+}
+/** Normalize newly created links in the same transaction batch, including paste rules and the picker.
+* @contract Existing document links are preserved until replaced; undo/redo keeps the original editing step.
+* @ownership The editor owns normalization; callers supply a site URL rather than a host callback.
+*/
+function createSiteRelativeLinks(baseUrl) {
+	const key = new PluginKey("looma-site-relative-links");
+	return Extension.create({
+		name: "loomaSiteRelativeLinks",
+		addProseMirrorPlugins() {
+			const editor = this.editor;
+			return [new Plugin({
+				key,
+				appendTransaction(transactions, oldState, newState) {
+					if (!editor.isEditable || !transactions.some((transaction) => transaction.docChanged) || transactions.some((transaction) => transaction.getMeta(key))) return null;
+					const mapping = new Mapping();
+					for (const transaction of transactions) mapping.appendMapping(transaction.mapping);
+					const inverse = mapping.invert();
+					const tr = newState.tr;
+					newState.doc.descendants((node, position) => {
+						if (!node.isText) return;
+						const mark = node.marks.find((candidate) => candidate.type.name === "link");
+						if (!mark || typeof mark.attrs.href !== "string") return;
+						const href = siteRelativeHref(mark.attrs.href, baseUrl);
+						if (href === mark.attrs.href) return;
+						const before = inverse.mapResult(position, 1);
+						if ((before.deleted ? null : oldState.doc.nodeAt(before.pos)?.marks.find((candidate) => candidate.type.name === "link"))?.attrs.href === mark.attrs.href) return;
+						tr.addMark(position, position + node.nodeSize, mark.type.create({
+							...mark.attrs,
+							href
+						}));
+					});
+					return tr.docChanged ? tr.setMeta(key, true) : null;
+				}
+			})];
+		}
+	});
+}
+//#endregion
 //#region ../../node_modules/.pnpm/dompurify@3.4.15/node_modules/dompurify/dist/purify.es.mjs
 /*! @license DOMPurify 3.4.15 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.4.15/LICENSE */
 function _arrayLikeToArray(r, a) {
@@ -9290,7 +9342,7 @@ function getLoomaTableExtensions() {
 * the code and explicit language stay in the document schema.
 */
 function getDefaultEditorExtensions(options = {}) {
-	const { placeholder = "Type “/” for commands, or start writing…", linkOpenOnClick = false, imageInline = false, mention = createLoomaMentionExtension(), disableHighlight = false, codeLanguages, codeLowlight, codeBlockNodeView } = options;
+	const { placeholder = "Type “/” for commands, or start writing…", linkOpenOnClick = false, linkBaseUrl, imageInline = false, mention = createLoomaMentionExtension(), disableHighlight = false, codeLanguages, codeLowlight, codeBlockNodeView } = options;
 	const codeBlock = LoomaCodeBlock.configure({ lowlight: codeLowlight ?? createLowlight(codeLanguages) });
 	return [
 		Document,
@@ -9325,6 +9377,7 @@ function getDefaultEditorExtensions(options = {}) {
 				target: "_blank"
 			}
 		}),
+		...linkBaseUrl ? [createSiteRelativeLinks(linkBaseUrl)] : [],
 		Image.configure({ inline: imageInline }),
 		(disableHighlight ? StoredOnlyHighlight : Highlight).configure({ multicolor: false }),
 		Code,
@@ -9778,13 +9831,14 @@ var CALLOUT_COMMANDS = [
 ];
 /**
 * Builds Looma's default command policy as fresh objects for one editor.
-* The image command delegates asset selection because Looma does not own upload,
-* persistence, or media-library concerns.
+* Image and link commands delegate their picker because Looma does not own
+* upload, persistence, or destination search. Link appears only when a picker
+* callback is supplied, so a headless default inventory has no dead action.
 *
 * @ownership Returned command objects belong to the caller and are recreated
 * per call so one editor cannot mutate another editor's command inventory.
 */
-function getDefaultSlashCommands(onOpenImagePicker, onOpenChipEditor) {
+function getDefaultSlashCommands(onOpenImagePicker, onOpenChipEditor, onOpenLinkEditor) {
 	return [
 		{
 			title: "Text",
@@ -9950,6 +10004,20 @@ function getDefaultSlashCommands(onOpenImagePicker, onOpenChipEditor) {
 				editor.chain().focus().deleteRange(range).setHorizontalRule().run();
 			}
 		},
+		...onOpenLinkEditor ? [{
+			title: "Link",
+			description: "Link to a destination or URL",
+			icon: "link",
+			keywords: [
+				"link",
+				"url",
+				"website"
+			],
+			command: ({ editor, range }) => {
+				editor.chain().focus().deleteRange(range).run();
+				onOpenLinkEditor();
+			}
+		}] : [],
 		{
 			title: "Image",
 			description: "Upload an image",
@@ -10081,10 +10149,11 @@ var LoomaSlashCommand = Extension.create({
 function createLoomaSlashCommandExtension(options = {}) {
 	const onOpenImagePicker = options.onOpenImagePicker;
 	const onOpenChipEditor = options.onOpenChipEditor;
+	const onOpenLinkEditor = options.onOpenLinkEditor;
 	return LoomaSlashCommand.configure({
 		...options,
-		commands: options.commands ?? getDefaultSlashCommands(onOpenImagePicker, onOpenChipEditor)
+		commands: options.commands ?? getDefaultSlashCommands(onOpenImagePicker, onOpenChipEditor, onOpenLinkEditor)
 	});
 }
 //#endregion
-export { LOOMA_CALLOUT_TONES as A, DEFAULT_MENTION_RESULT_LIMIT as C, LOOMA_CHIP_COLORS as D, normalizeMentionResultLimit as E, LoomaActiveBlock as F, LoomaActiveBlockPluginKey as I, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS as M, LOOMA_ACTIVE_BLOCK_CLASS as N, LoomaChip as O, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS as P, createLoomaMentionExtension as S, filterLoomaMentionItems as T, getActiveTableCellBackground as _, handleTableAction as a, LoomaSmartPaste as b, normalizeActiveTableColumnWidths as c, getDefaultEditorExtensions as d, getLoomaTableExtensions as f, getActiveTableCellAlignment as g, LoomaTableHeader as h, getActiveTableUiState as i, LoomaCallout as j, normalizeLoomaChipColor as k, shouldShowTextFormattingToolbar as l, LoomaTableCell as m, createLoomaSlashCommandExtension as n, handleTableOverlayAction as o, LoomaTable as p, getDefaultSlashCommands as r, insertTableAtRange as s, LoomaSlashCommand as t, LoomaTableKit as u, setActiveTableCellAlignment as v, MAX_MENTION_RESULT_LIMIT as w, LoomaMentionSuggestionPluginKey as x, setActiveTableCellBackground as y };
+export { LoomaChip as A, LoomaMentionSuggestionPluginKey as C, filterLoomaMentionItems as D, MAX_MENTION_RESULT_LIMIT as E, LOOMA_ACTIVE_BLOCK_CLASS as F, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS as I, LoomaActiveBlock as L, LOOMA_CALLOUT_TONES as M, LoomaCallout as N, normalizeMentionResultLimit as O, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS as P, LoomaActiveBlockPluginKey as R, siteRelativeHref as S, DEFAULT_MENTION_RESULT_LIMIT as T, getActiveTableCellBackground as _, handleTableAction as a, LoomaSmartPaste as b, normalizeActiveTableColumnWidths as c, getDefaultEditorExtensions as d, getLoomaTableExtensions as f, getActiveTableCellAlignment as g, LoomaTableHeader as h, getActiveTableUiState as i, normalizeLoomaChipColor as j, LOOMA_CHIP_COLORS as k, shouldShowTextFormattingToolbar as l, LoomaTableCell as m, createLoomaSlashCommandExtension as n, handleTableOverlayAction as o, LoomaTable as p, getDefaultSlashCommands as r, insertTableAtRange as s, LoomaSlashCommand as t, LoomaTableKit as u, setActiveTableCellAlignment as v, createLoomaMentionExtension as w, createSiteRelativeLinks as x, setActiveTableCellBackground as y };

package/editor/extensions/index.d.ts

@@ -15,3 +15,4 @@ export { getActiveTableUiState, handleTableAction, handleTableOverlayAction, ins
 export { LoomaTable, getActiveTableCellAlignment, getActiveTableCellBackground, LoomaTableCell, LoomaTableHeader, setActiveTableCellAlignment, setActiveTableCellBackground, TABLE_CELL_BACKGROUND_PRESETS, type TableCellAlignment, type TableCellBackground, } from "./table-formatting.js";
 export { createLoomaMentionExtension, DEFAULT_MENTION_RESULT_LIMIT, filterLoomaMentionItems, LoomaMentionSuggestionPluginKey, MAX_MENTION_RESULT_LIMIT, normalizeMentionResultLimit, type LoomaMentionItem, type LoomaMentionMenuSnapshot, type LoomaMentionOptions, type LoomaMentionProvider, type LoomaMentionProviderContext, } from "./mention.js";
 export { createLoomaSlashCommandExtension, getDefaultSlashCommands, LoomaSlashCommand, type LoomaSlashCommand as LoomaSlashCommandItem, type LoomaSlashCommandContext, type LoomaSlashCommandOptions, type LoomaSlashMenuSnapshot, } from "./slash-command.js";
+export { siteRelativeHref, createSiteRelativeLinks } from "./relative-links.js";

package/editor/extensions/index.js

@@ -1,3 +1,3 @@
 import { n as TABLE_CELL_BACKGROUND_PRESETS } from "../chunks/table-backgrounds.js";
-import { A as LOOMA_CALLOUT_TONES, C as DEFAULT_MENTION_RESULT_LIMIT, D as LOOMA_CHIP_COLORS, E as normalizeMentionResultLimit, F as LoomaActiveBlock, I as LoomaActiveBlockPluginKey, M as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, N as LOOMA_ACTIVE_BLOCK_CLASS, O as LoomaChip, P as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, S as createLoomaMentionExtension, T as filterLoomaMentionItems, _ as getActiveTableCellBackground, a as handleTableAction, b as LoomaSmartPaste, c as normalizeActiveTableColumnWidths, d as getDefaultEditorExtensions, f as getLoomaTableExtensions, g as getActiveTableCellAlignment, h as LoomaTableHeader, i as getActiveTableUiState, j as LoomaCallout, k as normalizeLoomaChipColor, l as shouldShowTextFormattingToolbar, m as LoomaTableCell, n as createLoomaSlashCommandExtension, o as handleTableOverlayAction, p as LoomaTable, r as getDefaultSlashCommands, s as insertTableAtRange, t as LoomaSlashCommand, u as LoomaTableKit, v as setActiveTableCellAlignment, w as MAX_MENTION_RESULT_LIMIT, x as LoomaMentionSuggestionPluginKey, y as setActiveTableCellBackground } from "../chunks/extensions.js";
-export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaMentionSuggestionPluginKey, LoomaSlashCommand, LoomaSmartPaste, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, filterLoomaMentionItems, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, handleTableAction, handleTableOverlayAction, insertTableAtRange, normalizeActiveTableColumnWidths, normalizeLoomaChipColor, normalizeMentionResultLimit, setActiveTableCellAlignment, setActiveTableCellBackground, shouldShowTextFormattingToolbar };
+import { A as LoomaChip, C as LoomaMentionSuggestionPluginKey, D as filterLoomaMentionItems, E as MAX_MENTION_RESULT_LIMIT, F as LOOMA_ACTIVE_BLOCK_CLASS, I as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, L as LoomaActiveBlock, M as LOOMA_CALLOUT_TONES, N as LoomaCallout, O as normalizeMentionResultLimit, P as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, R as LoomaActiveBlockPluginKey, S as siteRelativeHref, T as DEFAULT_MENTION_RESULT_LIMIT, _ as getActiveTableCellBackground, a as handleTableAction, b as LoomaSmartPaste, c as normalizeActiveTableColumnWidths, d as getDefaultEditorExtensions, f as getLoomaTableExtensions, g as getActiveTableCellAlignment, h as LoomaTableHeader, i as getActiveTableUiState, j as normalizeLoomaChipColor, k as LOOMA_CHIP_COLORS, l as shouldShowTextFormattingToolbar, m as LoomaTableCell, n as createLoomaSlashCommandExtension, o as handleTableOverlayAction, p as LoomaTable, r as getDefaultSlashCommands, s as insertTableAtRange, t as LoomaSlashCommand, u as LoomaTableKit, v as setActiveTableCellAlignment, w as createLoomaMentionExtension, x as createSiteRelativeLinks, y as setActiveTableCellBackground } from "../chunks/extensions.js";
+export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaMentionSuggestionPluginKey, LoomaSlashCommand, LoomaSmartPaste, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, createSiteRelativeLinks, filterLoomaMentionItems, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, handleTableAction, handleTableOverlayAction, insertTableAtRange, normalizeActiveTableColumnWidths, normalizeLoomaChipColor, normalizeMentionResultLimit, setActiveTableCellAlignment, setActiveTableCellBackground, shouldShowTextFormattingToolbar, siteRelativeHref };

package/editor/extensions/preset.d.ts

@@ -16,6 +16,8 @@ export interface DefaultEditorExtensionsOptions {
     placeholder?: string;
     /** Passed to Tiptap Link; defaults false to keep editing clicks in the editor. */
     linkOpenOnClick?: boolean;
+    /** Site origin whose newly inserted links become relative, across paste and editor commands. */
+    linkBaseUrl?: string;
     /** Passed to Tiptap Image; block images are the default document policy. */
     imageInline?: boolean;
     /** Custom mention extension, the Looma default, or false to omit mentions. */

package/editor/extensions/relative-links.d.ts

@@ -0,0 +1,8 @@
+import { Extension } from '@tiptap/core';
+/** Keep other origins and non-web schemes intact; same-origin links retain path, query, and fragment. */
+export declare function siteRelativeHref(href: string, baseUrl: string): string;
+/** Normalize newly created links in the same transaction batch, including paste rules and the picker.
+ * @contract Existing document links are preserved until replaced; undo/redo keeps the original editing step.
+ * @ownership The editor owns normalization; callers supply a site URL rather than a host callback.
+ */
+export declare function createSiteRelativeLinks(baseUrl: string): Extension<any, any>;

package/editor/extensions/slash-command.d.ts

@@ -49,16 +49,18 @@ export interface LoomaSlashCommandOptions {
     onStateChange?: (state: LoomaSlashMenuSnapshot) => void;
     onOpenImagePicker?: () => void;
     onOpenChipEditor?: (editor: Editor, position: number) => void;
+    onOpenLinkEditor?: () => void;
 }
 /**
  * Builds Looma's default command policy as fresh objects for one editor.
- * The image command delegates asset selection because Looma does not own upload,
- * persistence, or media-library concerns.
+ * Image and link commands delegate their picker because Looma does not own
+ * upload, persistence, or destination search. Link appears only when a picker
+ * callback is supplied, so a headless default inventory has no dead action.
  *
  * @ownership Returned command objects belong to the caller and are recreated
  * per call so one editor cannot mutate another editor's command inventory.
  */
-export declare function getDefaultSlashCommands(onOpenImagePicker?: () => void, onOpenChipEditor?: (editor: Editor, position: number) => void): LoomaSlashCommand[];
+export declare function getDefaultSlashCommands(onOpenImagePicker?: () => void, onOpenChipEditor?: (editor: Editor, position: number) => void, onOpenLinkEditor?: () => void): LoomaSlashCommand[];
 /**
  * Framework-neutral slash-command extension used by the turnkey editor.
  * Consumers embedding Looma into their own Tiptap instance can configure the

package/editor/icons.d.ts

@@ -7,6 +7,10 @@ export declare const LOOMA_ICONS: {
     'arrow-left': IconNode;
     bold: IconNode;
     'book-user': IconNode;
+    search: IconNode;
+    'external-link': IconNode;
+    pencil: IconNode;
+    unlink: IconNode;
     braces: IconNode;
     calculator: IconNode;
     check: IconNode;

package/editor/index.js

@@ -1,7 +1,7 @@
 import { n as TABLE_CELL_BACKGROUND_PRESETS, t as TABLE_CELL_BACKGROUND_OPTIONS } from "./chunks/table-backgrounds.js";
 import { n as resolveTableCellAt, t as measureTableOverlayGeometry } from "./chunks/ui.js";
-import { A as LOOMA_CALLOUT_TONES, C as DEFAULT_MENTION_RESULT_LIMIT, D as LOOMA_CHIP_COLORS, E as normalizeMentionResultLimit, F as LoomaActiveBlock, I as LoomaActiveBlockPluginKey, M as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, N as LOOMA_ACTIVE_BLOCK_CLASS, O as LoomaChip, P as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, S as createLoomaMentionExtension, T as filterLoomaMentionItems, _ as getActiveTableCellBackground, a as handleTableAction, b as LoomaSmartPaste, c as normalizeActiveTableColumnWidths, d as getDefaultEditorExtensions, f as getLoomaTableExtensions, g as getActiveTableCellAlignment, h as LoomaTableHeader, i as getActiveTableUiState, j as LoomaCallout, k as normalizeLoomaChipColor, l as shouldShowTextFormattingToolbar, m as LoomaTableCell, n as createLoomaSlashCommandExtension, o as handleTableOverlayAction, p as LoomaTable, r as getDefaultSlashCommands, s as insertTableAtRange, t as LoomaSlashCommand, u as LoomaTableKit, v as setActiveTableCellAlignment, w as MAX_MENTION_RESULT_LIMIT, x as LoomaMentionSuggestionPluginKey, y as setActiveTableCellBackground } from "./chunks/extensions.js";
-import { AlignCenter, AlignLeft, AlignRight, ArrowLeft, Bold, BookUser, Braces, Calculator, Check, ChevronDown, ChevronLeft, ChevronRight, CircleCheck, CircleDot, CircleQuestionMark, CircleX, CodeXml, Columns3, CreditCard, Ellipsis, Eraser, FileText, Folder, GripHorizontal, GripVertical, Heading1, Heading2, Heading3, Highlighter, Image, Info, Italic, LayoutDashboard, Link, List, ListOrdered, ListTodo, LoaderCircle, Merge, Minus, NotebookPen, PaintBucket, PanelBottom, PanelLeft, PanelRight, PanelTop, Pilcrow, Plus, Quote, Receipt, Redo2, Rows3, Settings, Split, Strikethrough, Table2, Tag, Trash2, TriangleAlert, Truck, Underline, Undo2, UserRound, Users, X } from "lucide";
+import { A as LoomaChip, C as LoomaMentionSuggestionPluginKey, D as filterLoomaMentionItems, E as MAX_MENTION_RESULT_LIMIT, F as LOOMA_ACTIVE_BLOCK_CLASS, I as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, L as LoomaActiveBlock, M as LOOMA_CALLOUT_TONES, N as LoomaCallout, O as normalizeMentionResultLimit, P as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, R as LoomaActiveBlockPluginKey, S as siteRelativeHref, T as DEFAULT_MENTION_RESULT_LIMIT, _ as getActiveTableCellBackground, a as handleTableAction, b as LoomaSmartPaste, c as normalizeActiveTableColumnWidths, d as getDefaultEditorExtensions, f as getLoomaTableExtensions, g as getActiveTableCellAlignment, h as LoomaTableHeader, i as getActiveTableUiState, j as normalizeLoomaChipColor, k as LOOMA_CHIP_COLORS, l as shouldShowTextFormattingToolbar, m as LoomaTableCell, n as createLoomaSlashCommandExtension, o as handleTableOverlayAction, p as LoomaTable, r as getDefaultSlashCommands, s as insertTableAtRange, t as LoomaSlashCommand, u as LoomaTableKit, v as setActiveTableCellAlignment, w as createLoomaMentionExtension, x as createSiteRelativeLinks, y as setActiveTableCellBackground } from "./chunks/extensions.js";
+import { AlignCenter, AlignLeft, AlignRight, ArrowLeft, Bold, BookUser, Braces, Calculator, Check, ChevronDown, ChevronLeft, ChevronRight, CircleCheck, CircleDot, CircleQuestionMark, CircleX, CodeXml, Columns3, CreditCard, Ellipsis, Eraser, ExternalLink, FileText, Folder, GripHorizontal, GripVertical, Heading1, Heading2, Heading3, Highlighter, Image, Info, Italic, LayoutDashboard, Link, List, ListOrdered, ListTodo, LoaderCircle, Merge, Minus, NotebookPen, PaintBucket, PanelBottom, PanelLeft, PanelRight, PanelTop, Pencil, Pilcrow, Plus, Quote, Receipt, Redo2, Rows3, Search, Settings, Split, Strikethrough, Table2, Tag, Trash2, TriangleAlert, Truck, Underline, Undo2, Unlink, UserRound, Users, X } from "lucide";
 //#region src/editor/icons.ts
 /** The opinionated Lucide set used by Looma's shipped interaction surfaces. */
 var LOOMA_ICONS = {
@@ -11,6 +11,10 @@ var LOOMA_ICONS = {
 	"arrow-left": ArrowLeft,
 	bold: Bold,
 	"book-user": BookUser,
+	"search": Search,
+	"external-link": ExternalLink,
+	"pencil": Pencil,
+	"unlink": Unlink,
 	braces: Braces,
 	calculator: Calculator,
 	check: Check,
@@ -114,4 +118,4 @@ function getVisualViewportRect(owner = window) {
 	};
 }
 //#endregion
-export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LOOMA_ICONS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaMentionSuggestionPluginKey, LoomaSlashCommand, LoomaSmartPaste, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_OPTIONS, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, filterLoomaMentionItems, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, getVisualViewportRect, handleTableAction, handleTableOverlayAction, insertTableAtRange, loomaIconMarkup, measureTableOverlayGeometry, normalizeActiveTableColumnWidths, normalizeLoomaChipColor, normalizeMentionResultLimit, resolveTableCellAt, setActiveTableCellAlignment, setActiveTableCellBackground, shouldShowTextFormattingToolbar };
+export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LOOMA_ICONS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaMentionSuggestionPluginKey, LoomaSlashCommand, LoomaSmartPaste, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_OPTIONS, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, createSiteRelativeLinks, filterLoomaMentionItems, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, getVisualViewportRect, handleTableAction, handleTableOverlayAction, insertTableAtRange, loomaIconMarkup, measureTableOverlayGeometry, normalizeActiveTableColumnWidths, normalizeLoomaChipColor, normalizeMentionResultLimit, resolveTableCellAt, setActiveTableCellAlignment, setActiveTableCellBackground, shouldShowTextFormattingToolbar, siteRelativeHref };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threadlabs/looma",
-  "version": "0.22.12",
+  "version": "0.22.14",
   "type": "module",
   "description": "Looma components as HTML, Vue, and plain DOM, with design tokens.",
   "license": "MIT",

package/styles/ui-card.css

@@ -15,6 +15,10 @@
       color: var(--ui-text-primary);
     }
 
+    :scope[data-ui-card-state~="padding=xs"] {
+      gap: var(--ui-space-1);
+      padding: var(--ui-space-2);
+    }
     :scope[data-ui-card-state~="padding=sm"] {
       gap: var(--ui-space-2);
       padding: var(--ui-space-3);
@@ -40,6 +44,19 @@
       background: var(--ui-danger-soft);
     }
 
+    :scope[data-ui-card-state~="size=sm"] {
+      inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
+      max-inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
+    }
+    :scope[data-ui-card-state~="size=md"] {
+      inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
+      max-inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
+    }
+    :scope[data-ui-card-state~="size=lg"] {
+      inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
+      max-inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
+    }
+
     /* A component that sets its display still honours the hidden attribute on its root. */
     :scope[hidden] {
       display: none;

package/styles/ui-input-group.css

@@ -139,6 +139,15 @@
       border-inline-start: 1px solid var(--ui-border-divider);
     }
 
+    :scope[data-ui-input-group-state~="prefixKind=icon"] {
+      --_ui-default-input-padding-inline-start: var(--ui-space-2);
+    }
+    :scope[data-ui-input-group-state~="prefixKind=icon"] .affix:first-child {
+      padding-inline-end: 0;
+      border-inline-end: 0;
+      background: transparent;
+    }
+
     /* Centred rather than padded above and below: the group is exactly a lone Input's height, so a
        small button sits inside it with the difference split evenly, and the field keeps its height. */
     .action {

package/styles/ui-input.css

@@ -64,6 +64,7 @@
       margin: 0;
       padding: var(--ui-space-2) var(--ui-space-3);
       appearance: none;
+      padding-inline-start: var(--_ui-default-input-padding-inline-start, var(--ui-space-3));
       border: var(--ui-input-border-width, var(--_ui-default-input-border-width, 1px)) solid
         var(--ui-input-border, var(--_ui-default-input-border, var(--ui-control-border, var(--ui-border-strong))));
       border-radius: var(--ui-input-radius, var(--_ui-default-input-radius, var(--ui-field-radius, var(--ui-radius-md))));

package/styles/ui-popover.css

@@ -92,6 +92,19 @@
       }
     }
 
+    :scope[data-ui-popover-state~="size=sm"] {
+      inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
+      max-inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
+    }
+    :scope[data-ui-popover-state~="size=md"] {
+      inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
+      max-inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
+    }
+    :scope[data-ui-popover-state~="size=lg"] {
+      inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
+      max-inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
+    }
+
     :scope[hidden] {
       display: none;
     }

package/styles/ui-scroll-area.css

@@ -37,6 +37,16 @@
       --_ui-scroll-fade-inline: to left;
     }
 
+    :scope[data-ui-scroll-area-state~="size=sm"] {
+      max-block-size: 9.375rem;
+    }
+    :scope[data-ui-scroll-area-state~="size=md"] {
+      max-block-size: 20rem;
+    }
+    :scope[data-ui-scroll-area-state~="size=lg"] {
+      max-block-size: 30rem;
+    }
+
     /* A component that sets its display still honours the hidden attribute on its root. */
     :scope[hidden] {
       display: none;

package/styles/ui-search-result-row.css

@@ -53,6 +53,15 @@
       transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);
     }
 
+    :scope[data-ui-search-result-row-state~="density=compact"] {
+      min-block-size: var(--ui-search-result-row-min-height, 3.125rem);
+      padding-block: var(--ui-search-result-row-padding-block, var(--ui-space-1));
+      padding-inline: var(--ui-search-result-row-padding-inline, var(--ui-space-2));
+      gap: var(--ui-search-result-row-gap, var(--ui-space-2));
+      align-items: center;
+      font-family: var(--ui-font-family-sans, sans-serif);
+    }
+
     :scope:hover:enabled {
       background: var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%));
     }

package/styles/ui-stack.css

@@ -17,6 +17,9 @@
       margin: 0;
     }
 
+    :scope[data-ui-stack-state~="gap=none"] {
+      --_layout-gap: 0px;
+    }
     :scope[data-ui-stack-state~="gap=xs"] {
       --_layout-gap: var(--ui-space-2);
     }

package/styles/ui-text.css

@@ -91,6 +91,14 @@
       text-align: center;
     }
 
+    :scope[data-ui-text-state~="font=sans"] {
+      font-family: var(--ui-font-family-sans, sans-serif);
+    }
+
+    :scope[data-ui-text-state~="wrap=anywhere"] {
+      overflow-wrap: anywhere;
+    }
+
     /* A component that sets its display still honours the hidden attribute on its root. */
     :scope[hidden] {
       display: none;

package/vanilla/UiCard.d.ts

@@ -7,7 +7,8 @@ export interface UiCardElement extends HTMLElement {
 }
 export interface UiCardProps {
   as?: "div" | "section" | "article" | "aside" | null;
-  padding?: "sm" | "md" | "lg" | null;
+  padding?: "xs" | "sm" | "md" | "lg" | null;
+  size?: "content" | "sm" | "md" | "lg" | null;
   tone?: "neutral" | "danger" | null;
   variant?: "outlined" | "subtle" | "elevated" | null;
   attributes?: Readonly<Record<string, string | number | boolean | null | undefined>>;

package/vanilla/UiCard.js

@@ -2,7 +2,7 @@
 import { componentRootIndex, manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import "../styles/ui-card.css";
 
-const definition = {...{"contract":{"tag":"ui-card","props":{"as":{"type":{"kind":"terminal","name":"keyword"},"values":["div","section","article","aside"],"required":false,"target":{"attribute":"as"},"default":"div"},"padding":{"type":{"kind":"terminal","name":"keyword"},"values":["sm","md","lg"],"required":false,"target":{"attribute":"padding"},"default":"md"},"tone":{"type":{"kind":"terminal","name":"keyword"},"values":["neutral","danger"],"required":false,"target":{"attribute":"tone"},"default":"neutral"},"variant":{"type":{"kind":"terminal","name":"keyword"},"values":["outlined","subtle","elevated"],"required":false,"target":{"attribute":"variant"},"default":"outlined"}}},"template":{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"section","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"when","test":"as = 'section'","testPlan":{"source":"as = 'section'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"section"}},"dependencies":["as"]}}},{"kind":"element","name":"article","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"when","test":"as = 'article'","testPlan":{"source":"as = 'article'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"article"}},"dependencies":["as"]}}},{"kind":"element","name":"aside","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"when","test":"as = 'aside'","testPlan":{"source":"as = 'aside'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"aside"}},"dependencies":["as"]}}},{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"else"}}],"flow":{"kind":"match"}},"declarations":[],"root":{"kind":"native","element":"div","choices":["section","article","aside","div"]}},source:{file:import.meta.url},css:""};
+const definition = {...{"contract":{"tag":"ui-card","props":{"as":{"type":{"kind":"terminal","name":"keyword"},"values":["div","section","article","aside"],"required":false,"target":{"attribute":"as"},"default":"div"},"padding":{"type":{"kind":"terminal","name":"keyword"},"values":["xs","sm","md","lg"],"required":false,"target":{"attribute":"padding"},"default":"md"},"size":{"type":{"kind":"terminal","name":"keyword"},"values":["content","sm","md","lg"],"required":false,"target":{"attribute":"size"},"default":"content"},"tone":{"type":{"kind":"terminal","name":"keyword"},"values":["neutral","danger"],"required":false,"target":{"attribute":"tone"},"default":"neutral"},"variant":{"type":{"kind":"terminal","name":"keyword"},"values":["outlined","subtle","elevated"],"required":false,"target":{"attribute":"variant"},"default":"outlined"}}},"template":{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"section","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"when","test":"as = 'section'","testPlan":{"source":"as = 'section'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"section"}},"dependencies":["as"]}}},{"kind":"element","name":"article","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"when","test":"as = 'article'","testPlan":{"source":"as = 'article'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"article"}},"dependencies":["as"]}}},{"kind":"element","name":"aside","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"when","test":"as = 'aside'","testPlan":{"source":"as = 'aside'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"aside"}},"dependencies":["as"]}}},{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}],"flow":{"kind":"else"}}],"flow":{"kind":"match"}},"declarations":[],"root":{"kind":"native","element":"div","choices":["section","article","aside","div"]}},source:{file:import.meta.url},css:""};
 
 export function createUiCard(options = {}) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;