@svgrid/enterprise 3.1.7 → 3.1.9

package/dist/fields/palette.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Colors and icons the field editor offers: a bright set for checkbox,
+ * rating and button fields, the 40-color set for select options (ten hues in
+ * four strengths), and the icon set a checkbox or rating can use.
+ */
+/** Bright colors, one per hue. */
+export declare const BRIGHT: ReadonlyArray<{
+    value: string;
+    label: string;
+}>;
+/** The 40 select-option colors, row by strength, column by hue. */
+export declare const OPTION_COLORS: ReadonlyArray<{
+    value: string;
+    label: string;
+}>;
+/** The colors new options cycle through. */
+export declare const OPTION_CYCLE: string[];
+export declare const ICONS: {
+    readonly check: "M5 12.5l4.5 4.5L19 7.5";
+    readonly x: "M6 6l12 12M18 6 6 18";
+    readonly star: "M12 3.2l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17.2l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z";
+    readonly heart: "M12 20.3s-7.8-4.7-7.8-10.2A4.5 4.5 0 0 1 12 7.4a4.5 4.5 0 0 1 7.8 2.7c0 5.5-7.8 10.2-7.8 10.2z";
+    readonly thumbsUp: "M7 10v10H4V10zM7 10l4-7c1.4 0 2.3 1 2 2.4L12.4 9H19a2 2 0 0 1 2 2.3l-1.2 7A2 2 0 0 1 17.8 20H7";
+    readonly flag: "M5 21V4M5 4h11l-2 4 2 4H5";
+    readonly dot: "M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z";
+};
+export type IconName = keyof typeof ICONS;
+/** Icons a checkbox can use. */
+export declare const CHECKBOX_ICONS: {
+    value: "x" | "dot" | "check" | "flag" | "star" | "heart" | "thumbsUp";
+    label: string;
+    path: "M6 6l12 12M18 6 6 18" | "M5 12.5l4.5 4.5L19 7.5" | "M12 3.2l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17.2l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z" | "M12 20.3s-7.8-4.7-7.8-10.2A4.5 4.5 0 0 1 12 7.4a4.5 4.5 0 0 1 7.8 2.7c0 5.5-7.8 10.2-7.8 10.2z" | "M7 10v10H4V10zM7 10l4-7c1.4 0 2.3 1 2 2.4L12.4 9H19a2 2 0 0 1 2 2.3l-1.2 7A2 2 0 0 1 17.8 20H7" | "M5 21V4M5 4h11l-2 4 2 4H5" | "M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z";
+}[];
+/** Icons a rating can use. */
+export declare const RATING_ICONS: {
+    value: "x" | "dot" | "check" | "flag" | "star" | "heart" | "thumbsUp";
+    label: string;
+    path: "M6 6l12 12M18 6 6 18" | "M5 12.5l4.5 4.5L19 7.5" | "M12 3.2l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17.2l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z" | "M12 20.3s-7.8-4.7-7.8-10.2A4.5 4.5 0 0 1 12 7.4a4.5 4.5 0 0 1 7.8 2.7c0 5.5-7.8 10.2-7.8 10.2z" | "M7 10v10H4V10zM7 10l4-7c1.4 0 2.3 1 2 2.4L12.4 9H19a2 2 0 0 1 2 2.3l-1.2 7A2 2 0 0 1 17.8 20H7" | "M5 21V4M5 4h11l-2 4 2 4H5" | "M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z";
+}[];
+/** Icons that read as a stroke (check, x, flag) rather than a filled shape. */
+export declare const STROKE_ICONS: Set<"x" | "dot" | "check" | "flag" | "star" | "heart" | "thumbsUp">;
+/**
+ * Text color for a pill filled with `color`: near-black or white, whichever
+ * has more contrast on it. Colors that are not #rgb / #rrggbb get the theme's
+ * text color.
+ */
+export declare function textOn(color: string | undefined): string;

package/dist/fields/palette.js

@@ -0,0 +1,69 @@
+/**
+ * Colors and icons the field editor offers: a bright set for checkbox,
+ * rating and button fields, the 40-color set for select options (ten hues in
+ * four strengths), and the icon set a checkbox or rating can use.
+ */
+const HUES = ['blue', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'pink', 'purple', 'gray'];
+/** Bright colors, one per hue. */
+export const BRIGHT = [
+    { value: '#2d7ff9', label: 'Blue' },
+    { value: '#18bfff', label: 'Cyan' },
+    { value: '#20d9d2', label: 'Teal' },
+    { value: '#20c933', label: 'Green' },
+    { value: '#fcb400', label: 'Yellow' },
+    { value: '#ff6f2c', label: 'Orange' },
+    { value: '#f82b60', label: 'Red' },
+    { value: '#ff08c2', label: 'Pink' },
+    { value: '#8b46ff', label: 'Purple' },
+    { value: '#666666', label: 'Gray' },
+];
+// Per hue: lightest, light, bright, dark.
+const SHADES = {
+    blue: ['#cfdfff', '#9cc7ff', '#2d7ff9', '#2750ae'],
+    cyan: ['#d0f0fd', '#77d1f3', '#18bfff', '#0b76b7'],
+    teal: ['#c2f5e9', '#72ddc3', '#20d9d2', '#06a09b'],
+    green: ['#d1f7c4', '#93e088', '#20c933', '#338a17'],
+    yellow: ['#ffeab6', '#ffd66e', '#fcb400', '#b87503'],
+    orange: ['#fee2d5', '#ffa981', '#ff6f2c', '#d74d26'],
+    red: ['#ffdce5', '#ff9eb7', '#f82b60', '#ba1e45'],
+    pink: ['#ffdaf6', '#f99de2', '#ff08c2', '#b2158b'],
+    purple: ['#ede2fe', '#cdb0ff', '#8b46ff', '#6b1cb0'],
+    gray: ['#eeeeee', '#cccccc', '#666666', '#444444'],
+};
+const STRENGTH = ['lightest', 'light', 'bright', 'dark'];
+/** The 40 select-option colors, row by strength, column by hue. */
+export const OPTION_COLORS = STRENGTH.flatMap((s, i) => HUES.map((h) => ({ value: SHADES[h][i], label: `${h[0].toUpperCase()}${h.slice(1)}, ${s}` })));
+/** The colors new options cycle through. */
+export const OPTION_CYCLE = HUES.map((h) => SHADES[h][1]);
+// 24x24 path data. Filled icons (rating, checked checkbox) use them as fills.
+export const ICONS = {
+    check: 'M5 12.5l4.5 4.5L19 7.5',
+    x: 'M6 6l12 12M18 6 6 18',
+    star: 'M12 3.2l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17.2l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z',
+    heart: 'M12 20.3s-7.8-4.7-7.8-10.2A4.5 4.5 0 0 1 12 7.4a4.5 4.5 0 0 1 7.8 2.7c0 5.5-7.8 10.2-7.8 10.2z',
+    thumbsUp: 'M7 10v10H4V10zM7 10l4-7c1.4 0 2.3 1 2 2.4L12.4 9H19a2 2 0 0 1 2 2.3l-1.2 7A2 2 0 0 1 17.8 20H7',
+    flag: 'M5 21V4M5 4h11l-2 4 2 4H5',
+    dot: 'M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z',
+};
+const ICON_LABEL = { check: 'Check', x: 'Cross', star: 'Star', heart: 'Heart', thumbsUp: 'Thumbs up', flag: 'Flag', dot: 'Dot' };
+/** Icons a checkbox can use. */
+export const CHECKBOX_ICONS = ['check', 'x', 'star', 'heart', 'thumbsUp', 'flag', 'dot'].map((v) => ({ value: v, label: ICON_LABEL[v], path: ICONS[v] }));
+/** Icons a rating can use. */
+export const RATING_ICONS = ['star', 'heart', 'thumbsUp', 'flag', 'dot'].map((v) => ({ value: v, label: ICON_LABEL[v], path: ICONS[v] }));
+/** Icons that read as a stroke (check, x, flag) rather than a filled shape. */
+export const STROKE_ICONS = new Set(['check', 'x', 'flag', 'thumbsUp']);
+/**
+ * Text color for a pill filled with `color`: near-black or white, whichever
+ * has more contrast on it. Colors that are not #rgb / #rrggbb get the theme's
+ * text color.
+ */
+export function textOn(color) {
+    const m = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(color ?? '');
+    if (!m)
+        return 'var(--sg-fg, #0f172a)';
+    const hex = m[1].length === 3 ? [...m[1]].map((c) => c + c).join('') : m[1];
+    const [r, g, b] = [0, 2, 4].map((i) => parseInt(hex.slice(i, i + 2), 16) / 255).map((c) => (c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4));
+    const l = 0.2126 * r + 0.7152 * g + 0.0722 * b;
+    // #1d1f25 has a luminance of 0.014; white has 1.
+    return (l + 0.05) / 0.064 > 1.05 / (l + 0.05) ? '#1d1f25' : '#ffffff';
+}

package/dist/fields/record-delete.svelte.d.ts

@@ -0,0 +1,12 @@
+/**
+ * "Delete record?" asked by the record menus (a row's, a card's) before the
+ * record goes. The grid's header host (FieldsHeaderEnd) shows it for the grid
+ * the request names.
+ */
+export type DeleteRecordRequest = {
+    ctrl: unknown;
+    api: unknown;
+    row: unknown;
+};
+export declare const getDeleteRecordRequest: () => DeleteRecordRequest | null;
+export declare function askDeleteRecord(r: DeleteRecordRequest | null): void;

package/dist/fields/record-delete.svelte.js

@@ -0,0 +1,5 @@
+let request = $state.raw(null);
+export const getDeleteRecordRequest = () => request;
+export function askDeleteRecord(r) {
+    request = r;
+}

package/dist/fields/record-menu.d.ts

@@ -0,0 +1,9 @@
+/**
+ * The right-click menu on a record in a base's grid: expand it, add a record
+ * above or below it (in its group), duplicate it, copy and paste cells, and
+ * delete it. A record made here is a record as "+ Add row" makes one: its
+ * own id, the next autonumber, the created time, and `onRowAdd` fired, so a
+ * base with a database writes it.
+ */
+import type { ContextMenuItem } from '@svgrid/grid';
+export declare function recordMenu(getApi: () => any, getCtrl: () => any): ContextMenuItem[];

package/dist/fields/record-menu.js

@@ -0,0 +1,78 @@
+import { openRecord } from './editor-request.svelte.js';
+import { newRowValues, recordCopyValues } from './field-ops.js';
+import { askDeleteRecord } from './record-delete.svelte.js';
+// Glyphs on the menu's 16 x 16 grid.
+const ICONS = {
+    expand: { paths: [{ d: 'M9.5 2.5h4v4M13.5 2.5 9 7M6.5 13.5h-4v-4M2.5 13.5 7 9' }] },
+    above: { paths: [{ d: 'M2.5 9.5h11v4h-11zM8 2.5v5M5.5 5 8 2.5 10.5 5' }] },
+    below: { paths: [{ d: 'M2.5 2.5h11v4h-11zM8 8.5v5M5.5 11 8 13.5 10.5 11' }] },
+    duplicate: { paths: [{ d: 'M5.5 5.5h8v8h-8zM10.5 5.5v-3h-8v8h3M9.5 8v3M8 9.5h3' }] },
+    copy: { paths: [{ d: 'M5.5 5.5h8v8h-8zM10.5 5.5v-3h-8v8h3' }] },
+    paste: { paths: [{ d: 'M5.5 3h-2v10.5h9V3h-2M6 2h4v2.5H6zM6 8h4M6 10.5h4' }] },
+    comment: { paths: [{ d: 'M2.5 3.5h11v7.5H8l-3 2.5V11H2.5z' }] },
+    delete: { paths: [{ d: 'M2.5 4.5h11M6 4.5v-2h4v2M4 4.5l.7 9h6.6l.7-9M6.8 7v4.5M9.2 7v4.5' }] },
+};
+/** A list value (tags, links) is copied, not shared with the record it came from. */
+const copy = (v) => (Array.isArray(v) ? [...v] : v);
+export function recordMenu(getApi, getCtrl) {
+    const ctrl = () => getCtrl();
+    const editable = () => !!ctrl()?.editingEnabled;
+    const noRecord = (t) => !t.row;
+    const readOnly = (t) => !t.row || !editable();
+    /** Add `values` as a new record next to `t`'s record; `edit` starts on its first field (an empty record, not a copy). */
+    function add(t, values, offset, edit) {
+        const c = ctrl();
+        const api = getApi();
+        if (!c || !api || !t.row)
+            return;
+        const cfg = c.props.rowAdder;
+        const defaults = cfg && typeof cfg === 'object' && typeof cfg.defaults === 'function' ? cfg.defaults() : {};
+        const row = newRowValues(c, { ...defaults, ...values });
+        // The menu's row may be another object than the one the data holds: match by id too.
+        const id = t.row.id;
+        const at = c.internalData.findIndex((r) => r === t.row || (id != null && r?.id === id));
+        api.addRow(row, at < 0 ? 'bottom' : at + offset);
+        c.props.onRowAdd?.({ row });
+        // Sorting can put it anywhere: find it, show it, and start on its first field.
+        queueMicrotask(() => {
+            const index = c.allRows.findIndex((r) => r.original === row);
+            if (index < 0)
+                return;
+            api.scrollToRow(index);
+            if (edit)
+                for (const col of c.allColumns)
+                    if (api.startEditing(index, col.id))
+                        break;
+        });
+    }
+    /** The values that keep a new record in `t`'s groups. */
+    function groupValues(t) {
+        const c = ctrl();
+        const out = {};
+        const grouped = c?.grid?.getState?.().grouping ?? [];
+        for (const id of grouped) {
+            const def = c.internalColumns.find((d) => String(d.id ?? d.field) === id);
+            if (def?.field && !def.fieldFn)
+                out[def.field] = copy(t.row[def.field]);
+        }
+        return out;
+    }
+    function duplicate(t) {
+        const c = ctrl();
+        if (c && t.row)
+            add(t, recordCopyValues(c, t.row), 1, false);
+    }
+    return [
+        { key: 'expand', label: 'Expand record', icon: ICONS.expand, hidden: noRecord, action: (t) => openRecord({ ctrl: ctrl(), rowId: t.rowId }) },
+        { key: 'comment', label: 'Comment', icon: ICONS.comment, hidden: noRecord, action: (t) => openRecord({ ctrl: ctrl(), rowId: t.rowId, focus: 'comment' }) },
+        'separator',
+        { key: 'record_above', label: 'Insert record above', icon: ICONS.above, hidden: readOnly, action: (t) => add(t, groupValues(t), 0, true) },
+        { key: 'record_below', label: 'Insert record below', icon: ICONS.below, hidden: readOnly, action: (t) => add(t, groupValues(t), 1, true) },
+        { key: 'duplicate', label: 'Duplicate record', icon: ICONS.duplicate, hidden: readOnly, action: duplicate },
+        'separator',
+        { key: 'copy', icon: ICONS.copy },
+        { key: 'paste', icon: ICONS.paste, hidden: () => !editable() },
+        'separator',
+        { key: 'delete_record', label: 'Delete record', icon: ICONS.delete, hidden: readOnly, action: (t) => askDeleteRecord({ ctrl: ctrl(), api: getApi(), row: t.row }) },
+    ];
+}

package/dist/fields/registry.svelte.d.ts

@@ -0,0 +1,176 @@
+/**
+ * Field types: what a column IS (rating, URL, single select, attachment...),
+ * as opposed to how it is edited. A type fills in the column (editor, format,
+ * alignment) and can draw its own cell. Columns name one with `fieldType` and
+ * set its properties with `fieldProps`.
+ */
+import type { Component } from 'svelte';
+/** Props every field cell receives. `props` is the type's defaults merged with the column's `fieldProps`. */
+export type FieldCellProps<P = Record<string, unknown>> = {
+    ctrl: unknown;
+    row: {
+        id: string;
+        original: unknown;
+    };
+    column: {
+        id: string;
+        columnDef: Record<string, unknown>;
+    };
+    value: unknown;
+    props: P;
+};
+/**
+ * What a property's dynamic parts see: the grid, the draft's properties, every
+ * other column, and the field's own names (key, id, saved header, draft name),
+ * which its formula may not read.
+ */
+export type FieldEditorContext = {
+    ctrl: any;
+    props: Record<string, any>;
+    columns: ReadonlyArray<Record<string, any>>;
+    self?: ReadonlyArray<unknown>;
+};
+type Choices = ReadonlyArray<{
+    value: string;
+    label: string;
+}>;
+type Base = {
+    key: string;
+    label: string;
+    /** Show the property only when this says so (e.g. decimal places for decimals). */
+    visible?: (props: Record<string, any>) => boolean;
+    /** One line of help under the control. */
+    hint?: string;
+    /** Other properties to change along with this one (a number format sets its usual precision). */
+    alsoSets?: (value: unknown, props: Record<string, any>) => Record<string, unknown>;
+};
+/** One property the field editor shows for a type. */
+export type FieldPropertyDef = Base & ({
+    kind: 'number';
+    min?: number;
+    max?: number;
+} | {
+    kind: 'text';
+    placeholder?: string;
+} | {
+    kind: 'checkbox';
+} | {
+    kind: 'choice';
+    choices: Choices | ((ctx: FieldEditorContext) => Choices);
+}
+/** The same, drawn as a row of buttons. */
+ | {
+    kind: 'segmented';
+    choices: Choices;
+}
+/** A color from a palette (hex values). */
+ | {
+    kind: 'color';
+    palette: ReadonlyArray<{
+        value: string;
+        label: string;
+    }>;
+}
+/** An icon from a set (SVG path data per icon). */
+ | {
+    kind: 'icon';
+    icons: ReadonlyArray<{
+        value: string;
+        label: string;
+        path: string;
+    }>;
+}
+/** A list of select options with colors. */
+ | {
+    kind: 'options';
+}
+/** The value new rows get; the editor follows the field type. */
+ | {
+    kind: 'default';
+}
+/** A formula over the row's fields. */
+ | {
+    kind: 'formula';
+}
+/** Some of the grid's other columns. */
+ | {
+    kind: 'columns';
+});
+/** What a type is told when it fills in a column. */
+export type FieldFillContext = {
+    columns: ReadonlyArray<Record<string, any>>;
+};
+/** What a type is told when a row is added (row adder) or the field is created. */
+export type FieldRowContext = {
+    props: Record<string, any>;
+    field: string;
+    rows: ReadonlyArray<Record<string, unknown>>;
+};
+export type FieldTypeDef<P extends Record<string, unknown> = Record<string, unknown>> = {
+    /** The name columns use in `fieldType`. */
+    id: string;
+    /** Shown in the type picker. */
+    label: string;
+    /** One line under the picker when the type is chosen. */
+    description?: string;
+    /** An SVG path (24x24 viewBox) for the picker and the header. */
+    icon?: string;
+    /** Group in the type picker. */
+    group?: 'basic' | 'number' | 'date' | 'people' | 'computed' | 'relation';
+    /** Property values a column gets when its `fieldProps` leave them out. */
+    defaults?: P;
+    /**
+     * Fill in the column: editor, format, alignment. Keep what the column set
+     * itself (`def.editorType ?? ...`), so a column can still override a type.
+     * `ctx.columns` is every column, for types that refer to other fields.
+     */
+    fill?: (def: Record<string, unknown>, props: P, ctx: FieldFillContext) => Record<string, unknown>;
+    /** Draws the cell. Without one, the grid draws the filled-in column as usual. */
+    cell?: Component<FieldCellProps<P>>;
+    /** When `cell` draws (default: always). A percent field draws its own cell only as a bar. */
+    hasCell?: (props: P) => boolean;
+    /** What the field editor lets a user set for this type. */
+    properties?: ReadonlyArray<FieldPropertyDef>;
+    /** Column width a new field of this type starts with. */
+    width?: number;
+    /** The value a new row gets (a default, the next number, the current time). */
+    newRowValue?: (ctx: FieldRowContext) => unknown;
+    /** Values for every existing row when the field is created (autonumber, created time). */
+    onCreate?: (ctx: FieldRowContext) => unknown[] | null;
+    /**
+     * `false`: a duplicated record gets a new value from `newRowValue` instead
+     * of a copy (the field's `default` when the type has no `newRowValue`).
+     * For an id, a number or a stamp no two records should share.
+     */
+    copy?: false;
+    /**
+     * A type kept for columns that already name it, and edited as another: the
+     * field editor opens it as `type` with `props` on top of its own, and
+     * leaves it out of the type picker.
+     */
+    editAs?: {
+        type: string;
+        props: Record<string, unknown>;
+    };
+};
+/** Add or replace a field type. */
+export declare function registerFieldType<P extends Record<string, unknown>>(def: FieldTypeDef<P>): void;
+/** The type named `id`, or undefined. */
+export declare function getFieldType(id: unknown): FieldTypeDef<any> | undefined;
+/** Every registered type, in registration order. */
+export declare function listFieldTypes(): FieldTypeDef<any>[];
+/** A column's effective properties: the type's defaults, then its own `fieldProps`. */
+export declare function fieldPropsOf(def: {
+    fieldType?: unknown;
+    fieldProps?: Record<string, unknown>;
+}): Record<string, unknown>;
+/** The column as the grid should see it, filled in by its type. Unknown types pass through. */
+export declare function fillFieldColumn<T extends Record<string, unknown>>(def: T, columns?: ReadonlyArray<Record<string, any>>): T & Record<string, unknown>;
+/** The column as it was declared, before its type filled it in. */
+export declare function originalColumn<T extends object>(def: T): T;
+/** Whether this column's type draws the cell itself (else the grid draws the filled-in column). */
+export declare function typeDrawsCell(def: {
+    fieldType?: unknown;
+    fieldProps?: Record<string, unknown>;
+}): boolean;
+export {};

package/dist/fields/registry.svelte.js

@@ -0,0 +1,51 @@
+import { withSummary } from './summaries.js';
+let types = $state.raw({});
+/** Add or replace a field type. */
+export function registerFieldType(def) {
+    types = { ...types, [def.id]: def };
+}
+/** The type named `id`, or undefined. */
+export function getFieldType(id) {
+    return typeof id === 'string' ? types[id] : undefined;
+}
+/** Every registered type, in registration order. */
+export function listFieldTypes() {
+    return Object.values(types);
+}
+/** A column's effective properties: the type's defaults, then its own `fieldProps`. */
+export function fieldPropsOf(def) {
+    return { ...(getFieldType(def.fieldType)?.defaults ?? {}), ...(def.fieldProps ?? {}) };
+}
+// Each filled-in column -> the column it was filled from, so the field editor
+// can hand the app back exactly what it declared. Kept twice: in a WeakMap,
+// and on the filled column under a symbol, because the grid copies columns
+// (`{ ...col }` when it resolves a data type) and a copy is not in the map;
+// a spread carries symbol keys along, and JSON and Object.keys leave them out.
+const ORIGINAL = new WeakMap();
+const SOURCE = Symbol('svgrid.fieldSource');
+/** The column as the grid should see it, filled in by its type. Unknown types pass through. */
+export function fillFieldColumn(def, columns = []) {
+    const type = getFieldType(def.fieldType);
+    if (!type)
+        return def;
+    const source = originalColumn(def);
+    const props = fieldPropsOf(source);
+    // A type without `fill` takes the column as declared, and still gets the rest.
+    const filled = type.fill ? type.fill(source, props, { columns: columns.map((c) => originalColumn(c)) }) : { ...source };
+    // The footer summary the field keeps in `fieldProps.summary` (none until picked).
+    const out = withSummary(filled, props);
+    ORIGINAL.set(out, source);
+    out[SOURCE] = source;
+    return out;
+}
+/** The column as it was declared, before its type filled it in. */
+export function originalColumn(def) {
+    return def[SOURCE] ?? ORIGINAL.get(def) ?? def;
+}
+/** Whether this column's type draws the cell itself (else the grid draws the filled-in column). */
+export function typeDrawsCell(def) {
+    const type = getFieldType(def.fieldType);
+    if (!type?.cell)
+        return false;
+    return type.hasCell ? type.hasCell(fieldPropsOf(def)) : true;
+}

package/dist/fields/rich-text.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Rich text for long-text fields: **bold**, *italic*, `code`, [links](https://...)
+ * and "- " list lines. Parsed into plain parts that the cell renders as
+ * elements; nothing reaches the page as HTML, so the text cannot inject markup.
+ * Links keep http(s) and mailto only.
+ */
+export type RichPart = {
+    kind: 'text';
+    text: string;
+} | {
+    kind: 'b' | 'i' | 'code';
+    text: string;
+} | {
+    kind: 'a';
+    text: string;
+    href: string;
+};
+export type RichLine = {
+    bullet: boolean;
+    parts: RichPart[];
+};
+export declare function parseInline(text: string): RichPart[];
+export declare function parseRichText(value: unknown): RichLine[];

package/dist/fields/rich-text.js

@@ -0,0 +1,48 @@
+/**
+ * Rich text for long-text fields: **bold**, *italic*, `code`, [links](https://...)
+ * and "- " list lines. Parsed into plain parts that the cell renders as
+ * elements; nothing reaches the page as HTML, so the text cannot inject markup.
+ * Links keep http(s) and mailto only.
+ */
+const INLINE = /\*\*([^*]+)\*\*|\*([^*]+)\*|`([^`]+)`|\[([^\]]+)\]\(([^)\s]+)\)/g;
+function safeHref(href) {
+    try {
+        const u = new URL(href);
+        return u.protocol === 'http:' || u.protocol === 'https:' || u.protocol === 'mailto:' ? u.href : null;
+    }
+    catch {
+        return null;
+    }
+}
+export function parseInline(text) {
+    const out = [];
+    let last = 0;
+    for (const m of text.matchAll(INLINE)) {
+        if (m.index > last)
+            out.push({ kind: 'text', text: text.slice(last, m.index) });
+        if (m[1] != null)
+            out.push({ kind: 'b', text: m[1] });
+        else if (m[2] != null)
+            out.push({ kind: 'i', text: m[2] });
+        else if (m[3] != null)
+            out.push({ kind: 'code', text: m[3] });
+        else {
+            const href = safeHref(m[5]);
+            out.push(href ? { kind: 'a', text: m[4], href } : { kind: 'text', text: m[4] });
+        }
+        last = m.index + m[0].length;
+    }
+    if (last < text.length)
+        out.push({ kind: 'text', text: text.slice(last) });
+    return out;
+}
+export function parseRichText(value) {
+    const text = value == null ? '' : String(value);
+    return text
+        .split(/\r?\n/)
+        .filter((line) => line.trim() !== '')
+        .map((line) => {
+        const bullet = /^\s*[-*]\s+/.test(line);
+        return { bullet, parts: parseInline(bullet ? line.replace(/^\s*[-*]\s+/, '') : line) };
+    });
+}

package/dist/fields/row-color-choice.svelte.d.ts

@@ -0,0 +1,31 @@
+/**
+ * The status field a grid's rows are colored by when someone picks it from
+ * the column menu ("Color rows by this field"): it wins over the `rowColor`
+ * prop for that grid, and `onRowColorChange` reports it so the app can keep
+ * it. Held per grid, weakly, so a grid that unmounts takes its choice along.
+ * A view's colors are a choice too; a view with no color setting clears it.
+ */
+type Config = {
+    field?: string;
+    target?: 'header' | 'bar' | 'row';
+    rules?: ReadonlyArray<unknown>;
+};
+/** The choice made for this grid, `undefined` when none was made (the prop rules). */
+export declare function chosenRowColor(ctrl: object): Config | null | undefined;
+/** Color this grid's rows by `config` (null: no colors), and tell the app. */
+export declare function chooseRowColor(ctrl: {
+    props: {
+        onRowColorChange?: (c: Config | null) => void;
+    };
+}, config: Config | null): void;
+/**
+ * Drop this grid's choice, so the `rowColor` prop rules again; the app hears
+ * of it (with the prop's colors) only when a choice was in force.
+ */
+export declare function clearRowColorChoice(ctrl: {
+    props: {
+        rowColor?: Config | null;
+        onRowColorChange?: (c: Config | null) => void;
+    };
+}): void;
+export {};

package/dist/fields/row-color-choice.svelte.js

@@ -0,0 +1,25 @@
+const choices = new WeakMap();
+// The WeakMap is not reactive; reading the version makes the rows repaint.
+let version = $state(0);
+/** The choice made for this grid, `undefined` when none was made (the prop rules). */
+export function chosenRowColor(ctrl) {
+    void version;
+    return choices.has(ctrl) ? choices.get(ctrl) : undefined;
+}
+/** Color this grid's rows by `config` (null: no colors), and tell the app. */
+export function chooseRowColor(ctrl, config) {
+    choices.set(ctrl, config);
+    version += 1;
+    ctrl.props.onRowColorChange?.(config);
+}
+/**
+ * Drop this grid's choice, so the `rowColor` prop rules again; the app hears
+ * of it (with the prop's colors) only when a choice was in force.
+ */
+export function clearRowColorChoice(ctrl) {
+    if (!choices.has(ctrl))
+        return;
+    choices.delete(ctrl);
+    version += 1;
+    ctrl.props.onRowColorChange?.(ctrl.props.rowColor ?? null);
+}

package/dist/fields/row-colors.d.ts

@@ -0,0 +1,36 @@
+/**
+ * The `rowColor` prop: a color per row from a select field's option colors,
+ * or from the first matching rule. The grid asks for rendered rows only
+ * (registerGridExtension's rowMarkColor / rowMarkLabel), so this never walks
+ * the data. Where the color is painted is CSS keyed on the root class.
+ */
+type Rule = {
+    when: (row: unknown) => boolean;
+    color: string;
+    label?: string;
+};
+type Config = {
+    field?: string;
+    rules?: ReadonlyArray<Rule>;
+    target?: 'header' | 'bar' | 'row';
+};
+type Ctrl = {
+    props: {
+        rowColor?: Config | null;
+    };
+    allColumns?: ReadonlyArray<{
+        columnDef: Record<string, unknown>;
+    }>;
+};
+/** The colors in force: one picked from the column menu, else the `rowColor` prop. */
+export declare function rowColorOf(ctrl: Ctrl): Config | null | undefined;
+export declare function rowMarkColor(ctrl: Ctrl, row: unknown): string | null;
+export declare function rowMarkLabel(ctrl: Ctrl, row: unknown): string | null;
+export declare function rowColorRootClass(ctrl: Ctrl): string | null;
+/**
+ * Taller rows show more, as a table database does: from a 48px row height
+ * the root class names how many lines of text fit (2 to 6), and the fields
+ * styles wrap text and select pills to that and grow attachment thumbnails.
+ */
+export declare function tallRowClass(ctrl: Ctrl): string | null;
+export {};