@svgrid/grid 2.6.22 → 2.7.0

package/dist/index.d.ts

@@ -7,10 +7,12 @@ export { subscribeGrid, subscribeSvGrid } from './subscribe.js';
 export { default as SvGrid } from './SvGrid.svelte';
 export type { BoardConfig, BoardLane, BoardCardMoveEvent, BoardCardCommitEvent, BoardLayout, BoardSubtask, BoardComment, BoardMenuContext, BoardLaneMenuContext, BoardDrawerConfig } from './SvGrid.types.js';
 export { registerBoardView, getBoardView, hasBoardView } from './board-view.svelte.js';
+export type { SelectionBarAction, SelectionBarTarget, ContextMenuItem, ContextMenuTarget, } from './SvGrid.types.js';
 export * from './ai.js';
 export { registerExportProvider, getExportProvider, type GridExportProvider, type GridExportRunOptions, } from './export-provider.js';
 export type { SchedulerConfig, SchedulerDrawerConfig, SchedulerEventMoveEvent, SchedulerEventResizeEvent, SchedulerEventCommitEvent, SchedulerRangeSelection, SchedulerView, SchedulerResource, SchedulerCollisionMode, SchedulerException, SchedulerEditScope, SchedulerOccurrenceChangeEvent, } from './SvGrid.types.js';
 export { registerSchedulerView, getSchedulerView, hasSchedulerView } from './scheduler-view.svelte.js';
+export { registerSelectionBarView, getSelectionBarView, hasSelectionBarView } from './selection-bar-view.svelte.js';
 export type { ChartViewConfig } from './SvGrid.types.js';
 export { registerChartView, getChartView, hasChartView } from './chart-view.svelte.js';
 export { registerPivotEngine, getPivotEngine, hasPivotEngine, type PivotEngine, type GridPivotConfig, type GridPivotValue, type GridPivotRow, } from './pivot-view.svelte.js';
@@ -55,6 +57,7 @@ export { default as SvVisuallyHidden } from './SvVisuallyHidden.svelte';
 export { default as SvAspectRatio } from './SvAspectRatio.svelte';
 export { registerCellEditor, getCellEditor, hasCellEditor, unregisterCellEditor, registeredCellEditorTypes, defaultEditorProps, resolveEditorProps, type CellEditorContext, type CellEditorRegistration, } from './editor-registry.js';
 export { registerBuiltinEditors } from './builtin-editors.js';
+export { sanitizeHtml, renderMarkdown, htmlToText } from './sanitize-html.js';
 export { default as SvField } from './SvField.svelte';
 export { createListbox, toSelectedArray, toSelectedSet, type Listbox, type ListboxConfig, type ListboxValue, type ListboxRootProps, type OptionProps, } from './createListbox.svelte.js';
 export { createCombobox, type Combobox, type ComboboxConfig, type ComboboxValue } from './createCombobox.svelte.js';
@@ -152,6 +155,7 @@ export { default as SvAvatarGroup } from './SvAvatarGroup.svelte';
 export { default as SvCommand, type CommandItem } from './SvCommand.svelte';
 export { fuzzyScore, fuzzyMatch } from './fuzzy.js';
 export { default as SvRichText, type RichTextTool } from './SvRichText.svelte';
+export { default as SvRichCell } from './SvRichCell.svelte';
 export { default as SvCarousel } from './SvCarousel.svelte';
 export { default as SvTour, type TourStep } from './SvTour.svelte';
 export { default as SvPagination } from './SvPagination.svelte';

package/dist/index.js

@@ -15,6 +15,8 @@ export { registerBoardView, getBoardView, hasBoardView } from './board-view.svel
 export * from './ai.js';
 export { registerExportProvider, getExportProvider, } from './export-provider.js';
 export { registerSchedulerView, getSchedulerView, hasSchedulerView } from './scheduler-view.svelte.js';
+// Bulk-action bar over the row selection. Prop + types free, renderer Pro.
+export { registerSelectionBarView, getSelectionBarView, hasSelectionBarView } from './selection-bar-view.svelte.js';
 export { registerChartView, getChartView, hasChartView } from './chart-view.svelte.js';
 export { registerPivotEngine, getPivotEngine, hasPivotEngine, } from './pivot-view.svelte.js';
 // Pure scheduler layout/model helpers (framework-free, like recurrence/date-core).
@@ -73,6 +75,7 @@ export { default as SvAspectRatio } from './SvAspectRatio.svelte';
 // UI kit - custom cell-editor registry (register any component as a grid editor)
 export { registerCellEditor, getCellEditor, hasCellEditor, unregisterCellEditor, registeredCellEditorTypes, defaultEditorProps, resolveEditorProps, } from './editor-registry.js';
 export { registerBuiltinEditors } from './builtin-editors.js';
+export { sanitizeHtml, renderMarkdown, htmlToText } from './sanitize-html.js';
 // UI kit - shared field chrome (label + hint + error + direction wrapper)
 export { default as SvField } from './SvField.svelte';
 // UI kit - headless cores (state + prop-getters you render yourself, like createSvGrid)
@@ -187,6 +190,7 @@ export { default as SvAvatarGroup } from './SvAvatarGroup.svelte';
 export { default as SvCommand } from './SvCommand.svelte';
 export { fuzzyScore, fuzzyMatch } from './fuzzy.js';
 export { default as SvRichText } from './SvRichText.svelte';
+export { default as SvRichCell } from './SvRichCell.svelte';
 export { default as SvCarousel } from './SvCarousel.svelte';
 export { default as SvTour } from './SvTour.svelte';
 export { default as SvPagination } from './SvPagination.svelte';

package/dist/list-option.d.ts

@@ -7,6 +7,12 @@ export type ListOption = {
     group?: string;
     /** Optional color swatch (any CSS color) shown before the label. */
     color?: string;
+    /**
+     * Optional muted text pinned to the trailing edge of the row - a count, a
+     * shortcut, a unit. Not part of the label, so it does not affect matching
+     * or the accessible name.
+     */
+    hint?: string;
 };
 /**
  * Coerce a raw options array into well-formed ListOptions. A primitive item

package/dist/menus.js

@@ -249,19 +249,52 @@ export function createMenus(ctx) {
         }
         ctx.valueFilters = { ...ctx.valueFilters, [columnId]: new Set(next) };
     }
+    /**
+     * With a search query typed, "select all" means the RESULTS - the same thing
+     * it means in a spreadsheet. It used to mean the whole column regardless, so
+     * the standard flow (type a query, tick select-all, get just the matches)
+     * cleared the entire selection instead: `isAllFacetsChecked` saw every value
+     * ticked, read that as "on", and turned everything off.
+     */
     function isAllFacetsChecked(columnId) {
         const selected = ctx.valueFilters[columnId];
-        return !selected || selected.size >= ctx.columnMenuFacetValues.length;
+        const visible = ctx.columnMenuVisibleFacets;
+        const searching = visible.length !== ctx.columnMenuFacetValues.length;
+        if (!selected)
+            return true;
+        if (searching)
+            return visible.every((value) => selected.has(value));
+        return selected.size >= ctx.columnMenuFacetValues.length;
     }
     function toggleAllFacets(columnId) {
-        if (isAllFacetsChecked(columnId)) {
-            ctx.valueFilters = { ...ctx.valueFilters, [columnId]: new Set() };
+        const visible = ctx.columnMenuVisibleFacets;
+        const all = ctx.columnMenuFacetValues;
+        const searching = visible.length !== all.length;
+        const on = isAllFacetsChecked(columnId);
+        if (!searching) {
+            if (on) {
+                ctx.valueFilters = { ...ctx.valueFilters, [columnId]: new Set() };
+            }
+            else {
+                const copy = { ...ctx.valueFilters };
+                delete copy[columnId];
+                ctx.valueFilters = copy;
+            }
+            return;
         }
-        else {
-            const copy = { ...ctx.valueFilters };
-            delete copy[columnId];
-            ctx.valueFilters = copy;
+        // Searching: add or remove just the matches, leaving the rest of the
+        // selection alone. An absent entry means "everything", so it has to be
+        // materialized before a subtraction can mean anything.
+        const current = ctx.valueFilters[columnId]
+            ? new Set(ctx.valueFilters[columnId])
+            : new Set(all);
+        for (const value of visible) {
+            if (on)
+                current.delete(value);
+            else
+                current.add(value);
         }
+        ctx.valueFilters = { ...ctx.valueFilters, [columnId]: current };
     }
     function clearColumnFilter(columnId) {
         // `untrack`: read-modify-write on the filter maps. Keeps the method safe to

package/dist/sanitize-html.d.ts

@@ -0,0 +1,37 @@
+/**
+ * sanitize-html - a dependency-free HTML sanitizer and a small Markdown
+ * renderer, sized for what a grid cell needs to display.
+ *
+ * A rich-text cell has to paint markup that came from a user, which is the one
+ * place a data grid can hand an attacker script execution. Everything rendered
+ * through `SvRichCell` goes through `sanitizeHtml` first, and the allowlist is
+ * deliberately narrower than a general-purpose sanitizer: it covers the tags
+ * `SvRichText` can produce, plus links and images.
+ *
+ * The parse uses the platform parser where there is one (`DOMParser`, which
+ * neither executes scripts nor runs loaders on a detached document) and a
+ * conservative regex stripper during SSR, where there is no DOM. The SSR path
+ * is stricter by design: when in doubt it drops markup rather than passing it
+ * through, and the hydrated client re-sanitizes with the real parser anyway.
+ *
+ * This is not a general-purpose sanitizer for arbitrary third-party HTML. It is
+ * a narrow allowlist for cell content. To render something outside the
+ * allowlist, extend it explicitly rather than widening the defaults.
+ */
+/**
+ * Return `html` with everything outside the allowlist removed. Idempotent, so
+ * it is safe to call on already-sanitized markup.
+ */
+export declare function sanitizeHtml(html: string | null | undefined): string;
+/**
+ * Render a common Markdown subset to HTML: headings, bold, italic,
+ * strikethrough, inline code, links, images, and bullet / ordered lists.
+ *
+ * Deliberately not a full CommonMark implementation - a grid cell shows a line
+ * or two, and a complete parser is a dependency this package does not take. The
+ * output is sanitized, so a Markdown link cannot smuggle `javascript:`.
+ */
+export declare function renderMarkdown(markdown: string | null | undefined): string;
+/** Strip markup down to readable text, for exports, aria labels and tooltips
+ *  where a cell's HTML has to collapse to one plain string. */
+export declare function htmlToText(html: string | null | undefined): string;

package/dist/sanitize-html.js

@@ -0,0 +1,234 @@
+/**
+ * sanitize-html - a dependency-free HTML sanitizer and a small Markdown
+ * renderer, sized for what a grid cell needs to display.
+ *
+ * A rich-text cell has to paint markup that came from a user, which is the one
+ * place a data grid can hand an attacker script execution. Everything rendered
+ * through `SvRichCell` goes through `sanitizeHtml` first, and the allowlist is
+ * deliberately narrower than a general-purpose sanitizer: it covers the tags
+ * `SvRichText` can produce, plus links and images.
+ *
+ * The parse uses the platform parser where there is one (`DOMParser`, which
+ * neither executes scripts nor runs loaders on a detached document) and a
+ * conservative regex stripper during SSR, where there is no DOM. The SSR path
+ * is stricter by design: when in doubt it drops markup rather than passing it
+ * through, and the hydrated client re-sanitizes with the real parser anyway.
+ *
+ * This is not a general-purpose sanitizer for arbitrary third-party HTML. It is
+ * a narrow allowlist for cell content. To render something outside the
+ * allowlist, extend it explicitly rather than widening the defaults.
+ */
+/** Tags that survive sanitization. Everything else is unwrapped or dropped. */
+const ALLOWED_TAGS = new Set([
+    'a', 'b', 'blockquote', 'br', 'code', 'del', 'div', 'em', 'h1', 'h2', 'h3',
+    'h4', 'h5', 'h6', 'i', 'img', 'li', 'mark', 'ol', 'p', 'pre', 's', 'small',
+    'span', 'strong', 'sub', 'sup', 'u', 'ul',
+]);
+/** Tags whose whole subtree is removed rather than unwrapped. What sits inside
+ *  a <script> or <style> is code, so keeping its text would be worse than
+ *  losing it. */
+const DROP_SUBTREE = new Set([
+    'script', 'style', 'iframe', 'object', 'embed', 'noscript', 'template',
+    'svg', 'math', 'form', 'input', 'button', 'textarea', 'select', 'link',
+    'meta', 'base', 'title', 'head',
+]);
+/** Attributes allowed per tag. `*` applies to every allowed tag. A `style`
+ *  attribute is never allowed: it is the classic sanitizer hole (url(...)
+ *  payloads, position tricks that let a cell cover the page chrome), and cell
+ *  styling belongs to the column rather than to the data. */
+const ALLOWED_ATTRS = {
+    '*': new Set(['class', 'dir', 'lang', 'title']),
+    a: new Set(['href', 'target', 'rel']),
+    img: new Set(['src', 'alt', 'width', 'height']),
+    ol: new Set(['start']),
+};
+/** URL schemes a href/src may use. Anything else, `javascript:` and
+ *  `vbscript:` included, is dropped. `data:` is allowed only on an image src
+ *  and only for image media types, because `data:text/html` is a script
+ *  vector. */
+const SAFE_URL = /^(?:https?:|mailto:|tel:|\/|\.\/|\.\.\/|#)/i;
+const SAFE_IMG_DATA_URL = /^data:image\/(?:png|jpe?g|gif|webp|avif);base64,[a-z0-9+/=]*$/i;
+function isSafeUrl(value, tag, attr) {
+    // Strip control characters and whitespace first: "java\tscript:" and
+    // "java\nscript:" are both read as javascript: by browsers.
+    // Matching control characters is the whole point here, hence the disable.
+    // eslint-disable-next-line no-control-regex
+    const url = value.replace(/[\u0000-\u0020\u007f]/g, '');
+    if (tag === 'img' && attr === 'src' && SAFE_IMG_DATA_URL.test(url))
+        return true;
+    return SAFE_URL.test(url);
+}
+function attrAllowed(tag, attr) {
+    if (attr.startsWith('on'))
+        return false; // every event handler, in one rule
+    if (ALLOWED_ATTRS['*'].has(attr))
+        return true;
+    return ALLOWED_ATTRS[tag]?.has(attr) ?? false;
+}
+/** DOM path: walk the parsed tree and strip anything off the allowlist. */
+function sanitizeWithDom(html) {
+    const doc = new DOMParser().parseFromString(`<body>${html}</body>`, 'text/html');
+    const walk = (node) => {
+        // Snapshot the child list: the loop mutates it as it unwraps and removes.
+        for (const child of [...node.children]) {
+            const tag = child.tagName.toLowerCase();
+            if (DROP_SUBTREE.has(tag)) {
+                child.remove();
+                continue;
+            }
+            if (!ALLOWED_TAGS.has(tag)) {
+                // Unwrap rather than drop, so an unknown wrapper does not cost the user
+                // the text inside it.
+                walk(child);
+                child.replaceWith(...child.childNodes);
+                continue;
+            }
+            for (const attr of [...child.attributes]) {
+                const name = attr.name.toLowerCase();
+                if (!attrAllowed(tag, name)) {
+                    child.removeAttribute(attr.name);
+                    continue;
+                }
+                if ((name === 'href' || name === 'src') && !isSafeUrl(attr.value, tag, name)) {
+                    child.removeAttribute(attr.name);
+                }
+            }
+            // A link that opens a new tab gets rel="noopener", so the opened page
+            // cannot reach back through window.opener.
+            if (tag === 'a' && child.getAttribute('target')) {
+                child.setAttribute('rel', 'noopener noreferrer');
+            }
+            walk(child);
+        }
+    };
+    walk(doc.body);
+    return doc.body.innerHTML;
+}
+/**
+ * SSR path: no DOM, so drop dangerous subtrees outright and keep only
+ * allowlisted tags in their attribute-free form. Stricter than the DOM path on
+ * purpose - the client re-sanitizes on hydration, so the cost is a moment of
+ * plainer markup rather than a hole.
+ */
+function sanitizeWithoutDom(html) {
+    let out = html;
+    for (const tag of DROP_SUBTREE) {
+        out = out.replace(new RegExp(`<${tag}\\b[\\s\\S]*?</${tag}\\s*>`, 'gi'), '');
+        out = out.replace(new RegExp(`<${tag}\\b[^>]*/?>`, 'gi'), '');
+    }
+    return out.replace(/<\/?([a-z0-9-]+)([^>]*)>/gi, (match, rawTag, attrs) => {
+        const tag = rawTag.toLowerCase();
+        if (!ALLOWED_TAGS.has(tag))
+            return '';
+        if (match.startsWith('</'))
+            return `</${tag}>`;
+        return attrs.trim() ? `<${tag}>` : match;
+    });
+}
+/**
+ * Return `html` with everything outside the allowlist removed. Idempotent, so
+ * it is safe to call on already-sanitized markup.
+ */
+export function sanitizeHtml(html) {
+    const input = String(html ?? '');
+    if (!input)
+        return '';
+    if (!input.includes('<'))
+        return input; // no angle bracket, no markup to strip
+    return typeof DOMParser === 'undefined' ? sanitizeWithoutDom(input) : sanitizeWithDom(input);
+}
+/** Escape text so it embeds in HTML as literal characters. */
+function escapeHtml(text) {
+    return text
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;');
+}
+/** A sentinel that cannot occur in escaped input, used to park inline-code
+ *  spans while the emphasis and link passes run over the rest. */
+const MARK = '\u0000';
+/** Inline Markdown. Code is extracted first so backticks protect their
+ *  contents from the emphasis and link passes. */
+function renderInline(text) {
+    const code = [];
+    let out = escapeHtml(text).replace(/`([^`]+)`/g, (_m, c) => {
+        code.push(c);
+        return `${MARK}${code.length - 1}${MARK}`;
+    });
+    out = out
+        .replace(/!\[([^\]]*)\]\(([^)\s]+)\)/g, '<img src="$2" alt="$1">')
+        .replace(/\[([^\]]+)\]\(([^)\s]+)\)/g, '<a href="$2">$1</a>')
+        .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>')
+        .replace(/(^|[^*])\*([^*]+)\*/g, '$1<em>$2</em>')
+        .replace(/~~([^~]+)~~/g, '<del>$1</del>');
+    return out.replace(new RegExp(`${MARK}(\\d+)${MARK}`, 'g'), (_m, i) => `<code>${code[Number(i)]}</code>`);
+}
+/**
+ * Render a common Markdown subset to HTML: headings, bold, italic,
+ * strikethrough, inline code, links, images, and bullet / ordered lists.
+ *
+ * Deliberately not a full CommonMark implementation - a grid cell shows a line
+ * or two, and a complete parser is a dependency this package does not take. The
+ * output is sanitized, so a Markdown link cannot smuggle `javascript:`.
+ */
+export function renderMarkdown(markdown) {
+    const src = String(markdown ?? '');
+    if (!src)
+        return '';
+    const out = [];
+    let list = null;
+    const closeList = () => {
+        if (list)
+            out.push(`</${list}>`);
+        list = null;
+    };
+    for (const line of src.split(/\r?\n/)) {
+        const heading = line.match(/^(#{1,6})\s+(.*)$/);
+        const bullet = line.match(/^\s*[-*+]\s+(.*)$/);
+        const ordered = line.match(/^\s*\d+[.)]\s+(.*)$/);
+        if (heading) {
+            closeList();
+            const level = heading[1].length;
+            out.push(`<h${level}>${renderInline(heading[2])}</h${level}>`);
+        }
+        else if (bullet || ordered) {
+            const want = bullet ? 'ul' : 'ol';
+            if (list !== want) {
+                closeList();
+                out.push(`<${want}>`);
+                list = want;
+            }
+            out.push(`<li>${renderInline((bullet ?? ordered)[1])}</li>`);
+        }
+        else if (!line.trim()) {
+            closeList();
+        }
+        else {
+            closeList();
+            out.push(`<p>${renderInline(line)}</p>`);
+        }
+    }
+    closeList();
+    return sanitizeHtml(out.join(''));
+}
+/** Strip markup down to readable text, for exports, aria labels and tooltips
+ *  where a cell's HTML has to collapse to one plain string. */
+export function htmlToText(html) {
+    const clean = sanitizeHtml(html);
+    if (!clean)
+        return '';
+    const spaced = clean
+        .replace(/<\/(p|div|h[1-6]|li|blockquote|pre)>/gi, ' ')
+        .replace(/<br\s*\/?>/gi, ' ');
+    return spaced
+        .replace(/<[^>]*>/g, '')
+        .replace(/&nbsp;/gi, ' ')
+        .replace(/&lt;/gi, '<')
+        .replace(/&gt;/gi, '>')
+        .replace(/&quot;/gi, '"')
+        .replace(/&#39;/gi, "'")
+        .replace(/&amp;/gi, '&')
+        .replace(/\s+/g, ' ')
+        .trim();
+}

package/dist/selection-bar-view.svelte.d.ts

@@ -0,0 +1,25 @@
+/**
+ * selection-bar-view registry - the injection seam for the bulk-action bar that
+ * floats over the grid while rows are selected. `<SvGrid selectionBar={...}>`
+ * and its config types ship in the free grid, but the BAR itself is a paid
+ * feature in `@svgrid/enterprise`. This tiny reactive holder lets enterprise
+ * register the renderer at import time; the grid looks it up and mounts it, or
+ * shows an upsell placeholder when it is absent.
+ *
+ * Same shape as `scheduler-view` and `board-view`, deliberately: three seams
+ * that behave differently would be three things to learn.
+ *
+ * ```ts
+ * // in @svgrid/enterprise, at module load:
+ * import { registerSelectionBarView } from '@svgrid/grid'
+ * import SvGridSelectionBar from './SvGridSelectionBar.svelte'
+ * registerSelectionBarView(SvGridSelectionBar)
+ * ```
+ */
+import type { Component } from 'svelte';
+/** Register the component that renders the selection bar. Enterprise calls this. */
+export declare function registerSelectionBarView(component: Component<any>): void;
+/** The registered selection-bar renderer, or null when enterprise is not installed. */
+export declare function getSelectionBarView(): Component<any> | null;
+/** Whether a selection-bar renderer has been registered. */
+export declare function hasSelectionBarView(): boolean;

package/dist/selection-bar-view.svelte.js

@@ -0,0 +1,13 @@
+let renderer = $state(null);
+/** Register the component that renders the selection bar. Enterprise calls this. */
+export function registerSelectionBarView(component) {
+    renderer = component;
+}
+/** The registered selection-bar renderer, or null when enterprise is not installed. */
+export function getSelectionBarView() {
+    return renderer;
+}
+/** Whether a selection-bar renderer has been registered. */
+export function hasSelectionBarView() {
+    return renderer != null;
+}

package/dist/selection.d.ts

@@ -28,10 +28,11 @@ export declare function createSelection<TFeatures extends TableFeatures = TableF
         maxCol: number;
     }[];
     isInFillPreview: (rowIndex: number, colIndex: number) => boolean;
+    dragPreviewRect: () => any;
     findColumnById: (columnId: string) => any;
     onCellPointerDown: (rowIndex: number, colIndex: number, event: PointerEvent) => void;
     onCellPointerEnter: (rowIndex: number, colIndex: number) => void;
-    endDragSelection: () => void;
+    endDragSelection: (event?: PointerEvent) => void;
     onWindowPointerMove: (event: PointerEvent) => void;
     onCellClick: (rowIndex: number, colIndex: number) => void;
     emitCellDoubleClick: (rowIndex: number, colIndex: number) => void;