@coffer-org/web-ui 4.0.0

package/dist/layout.js

@@ -0,0 +1,323 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment } from 'react';
+import { useTranslation } from 'react-i18next';
+import { hasValue, hasChildren, isNamedField, isPseudo, isStorageGroup } from '@coffer-org/sdk/fields';
+import { fieldLayout, elementKind, resolveRenderer, resolveFieldSpan } from "./registry.js";
+import { visibleOptions } from '@coffer-org/sdk/condition';
+import { fieldOptions } from "./lib/format.js";
+import { withScopeValues, ParentValuesProvider } from "./render/field-scope.js";
+import { parseJSON } from "./lib/json.js";
+import { FlowRow, FlowCtx } from "./render/widgets/flow-row.js";
+import { STACK, LAYOUT_STACK, GroupTitle, Rail, groupIcon } from "./render/chrome.js";
+import { focusInPopup } from "./render/field-frame.js";
+import { FieldAddressProvider } from "./render/field-address.js";
+import { SlotProvider } from "./render/slot.js";
+import { withChildWidth } from "./render/field-width.js";
+import Markdown from "./Markdown.js";
+function blockCommit(values, setValue) {
+    let last = values;
+    return (next) => {
+        const merged = next;
+        let result = undefined;
+        for (const k of Object.keys(merged)) {
+            if (merged[k] !== last[k])
+                result = setValue(k, merged[k]);
+        }
+        if (result instanceof Promise) {
+            void result.then((err) => {
+                if (!err)
+                    last = merged;
+            });
+        }
+        else {
+            last = merged;
+        }
+        return result;
+    };
+}
+function InfoBlock({ text }) {
+    return _jsx(Markdown, { value: text });
+}
+function renderElementBridge(it, { bridge, t }) {
+    if (hasValue(it) && it.key !== undefined) {
+        const key = it.key;
+        if (bridge.isHidden(key))
+            return null;
+        const r = resolveRenderer({ kind: elementKind(it) });
+        if (!r) {
+            console.warn(`[LayoutRenderer] no renderer for kind '${elementKind(it)}'`);
+            return null;
+        }
+        const field = withScopeValues(it.type, bridge.values);
+        const derive = field.derived;
+        const value = bridge.getValue(key);
+        const keep = field.hints['multiple'] === true
+            ? Array.isArray(value)
+                ? value.map(String)
+                : parseJSON(value, []).map(String)
+            : typeof value === 'string'
+                ? value
+                : undefined;
+        const resolvedOptions = fieldOptions(field);
+        const selectOptions = resolvedOptions.length
+            ? visibleOptions(resolvedOptions, bridge.values ?? {}, keep)
+            : undefined;
+        const node = (_jsx("div", { onBlur: (e) => {
+                if (!focusInPopup(e.relatedTarget))
+                    bridge.touch(key);
+            }, children: _jsx(FieldAddressProvider, { fieldKey: key, children: _jsx(SlotProvider, { field: it, value: value, commit: derive ? undefined : (v) => bridge.setValue(key, v), isHidden: bridge.isHidden, mode: derive ? 'view' : bridge.mode, children: _jsx(r.Page, { el: it, field: field, fieldKey: key, value: value, error: bridge.error(key), mode: derive ? 'view' : bridge.mode, label: field.label ? t(field.label) : undefined, required: bridge.requiredOf(key), recordCtx: bridge.recordCtx, selectOptions: selectOptions }) }) }) }));
+        const span = resolveFieldSpan(field);
+        return { node, layout: fieldLayout(field), span };
+    }
+    if (hasValue(it)) {
+        const r = resolveRenderer({ kind: elementKind(it) });
+        if (!r) {
+            console.warn(`[LayoutRenderer] no renderer for static kind '${elementKind(it)}'`);
+            return null;
+        }
+        const field = it.type;
+        const staticValue = typeof it.value === 'function' ? undefined : it.value;
+        const node = (_jsx(SlotProvider, { field: it, value: staticValue, children: _jsx(r.Page, { el: it, field: field, value: staticValue, mode: "view", label: field.label ? t(field.label) : undefined, recordCtx: bridge.recordCtx }) }));
+        const span = resolveFieldSpan(field);
+        return { node, layout: fieldLayout(field), span };
+    }
+    if (it.el === 'divider') {
+        return null;
+    }
+    if (it.el === 'info') {
+        return null;
+    }
+    if (it.el === 'button') {
+        const r = resolveRenderer({ kind: 'button' });
+        if (!r)
+            return null;
+        const node = _jsx(r.Page, { el: it, value: undefined, mode: bridge.mode, recordCtx: bridge.recordCtx });
+        return { node, layout: 'scalar', span: 3 };
+    }
+    return null;
+}
+function collect(items, ctx, bridgeCtx, display = 'wrap') {
+    const out = [];
+    let buffer = [];
+    let staticIdx = 0;
+    const flush = () => {
+        if (buffer.length) {
+            out.push({ kind: 'flow', items: buffer, scroll: display === 'scroll' });
+            buffer = [];
+        }
+    };
+    for (const it of items) {
+        if (bridgeCtx) {
+            if (isPseudo(it) && it.el === 'divider') {
+                flush();
+                out.push({ kind: 'divider', label: it.label });
+                continue;
+            }
+            if (isPseudo(it) && it.el === 'info') {
+                flush();
+                out.push({ kind: 'block', node: _jsx(InfoNode, { textKey: it.text }) });
+                continue;
+            }
+            if (!hasChildren(it)) {
+                const result = renderElementBridge(it, bridgeCtx);
+                if (result == null)
+                    continue;
+                if (result.layout === 'block') {
+                    flush();
+                    out.push({ kind: 'block', node: result.node });
+                }
+                else {
+                    const itemKey = hasValue(it) && it.key !== undefined ? it.key : `static-${staticIdx++}`;
+                    buffer.push({
+                        key: itemKey,
+                        span: result.span,
+                        node: _jsx(Fragment, { children: result.node }, itemKey),
+                    });
+                }
+                continue;
+            }
+            continue;
+        }
+        if (isNamedField(it)) {
+            const node = ctx.renderField(it.key, it.type);
+            if (node == null)
+                continue;
+            if (fieldLayout(it.type) === 'block') {
+                flush();
+                out.push({ kind: 'block', node });
+            }
+            else {
+                const span = resolveFieldSpan(it.type);
+                buffer.push({ key: it.key, span, node: _jsx(Fragment, { children: node }, it.key) });
+            }
+        }
+        else if (isPseudo(it) && it.el === 'divider') {
+            flush();
+            out.push({ kind: 'divider', label: it.label });
+        }
+        else if (isPseudo(it) && it.el === 'info') {
+            flush();
+            out.push({ kind: 'block', node: _jsx(InfoNode, { textKey: it.text }) });
+        }
+    }
+    flush();
+    return out;
+}
+function InfoNode({ textKey }) {
+    const { t } = useTranslation();
+    return _jsx(InfoBlock, { text: t(textKey) });
+}
+function collapseDividers(nodes) {
+    const isPlainDivider = (n) => n.kind === 'divider' && !n.label;
+    const out = [];
+    for (const n of nodes) {
+        if (isPlainDivider(n)) {
+            if (!out.length)
+                continue;
+            if (isPlainDivider(out[out.length - 1]))
+                continue;
+        }
+        out.push(n);
+    }
+    while (out.length && isPlainDivider(out[out.length - 1]))
+        out.pop();
+    return out;
+}
+export function SectionShell({ label, icon, labelAfter, children, rail = true, tone = 'group', }) {
+    const body = _jsx("div", { className: `flex flex-col min-w-0 ${STACK}`, children: children });
+    return (_jsxs("section", { className: `flex flex-col min-w-0 ${STACK}`, children: [label && _jsx(GroupTitle, { label: label, icon: icon, actions: labelAfter, tone: tone }), rail && label ? _jsx(Rail, { children: body }) : body] }));
+}
+function GroupSection({ group, children }) {
+    const { t } = useTranslation();
+    return (_jsx(SectionShell, { label: group.label ? t(group.label) : undefined, icon: groupIcon(group), children: children }));
+}
+function RowSection({ group, children }) {
+    const { t } = useTranslation();
+    return (_jsxs("div", { className: "flex flex-col gap-1 min-w-0", children: [group.label && _jsx("span", { className: "text-xs text-muted", children: t(group.label) }), children] }));
+}
+function SheetSection({ group, renderCell, }) {
+    const { t } = useTranslation();
+    const rows = group.fields.map((el) => (hasChildren(el) ? el.fields : [el]));
+    const N = Math.max(1, ...rows.map((r) => r.length));
+    let visible = false;
+    const slots = [];
+    rows.forEach((row, ri) => {
+        for (let ci = 0; ci < N; ci++) {
+            const cell = row[ci];
+            const node = cell ? renderCell(cell) : null;
+            if (node)
+                visible = true;
+            slots.push(_jsx("div", { className: "min-w-0", children: node }, `${ri}-${ci}`));
+        }
+    });
+    if (!visible)
+        return null;
+    return (_jsx(FlowCtx.Provider, { value: true, children: _jsx(SectionShell, { label: group.label ? t(group.label) : undefined, icon: groupIcon(group), children: _jsx("div", { className: "overflow-x-auto", children: _jsx("div", { className: "grid gap-x-4 gap-y-2 items-start", style: { gridTemplateColumns: `repeat(${N}, max-content)` }, children: slots }) }) }) }));
+}
+function renderNodes(nodes, keyPrefix) {
+    const visible = nodes.filter((n) => n.kind !== 'divider' || n.label);
+    if (!visible.length)
+        return null;
+    return nodes.map((n, i) => {
+        const key = `${keyPrefix}-${i}`;
+        switch (n.kind) {
+            case 'flow':
+                return _jsx(FlowRow, { items: n.items, scroll: n.scroll }, key);
+            case 'block':
+                return _jsx(Fragment, { children: n.node }, key);
+            case 'group':
+                return _jsx(Fragment, { children: n.node }, key);
+            case 'divider':
+                return renderDivider(n.label, key);
+        }
+    });
+}
+export function LabelledDivider({ label }) {
+    const { t } = useTranslation();
+    return (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "shrink-0 text-xs uppercase tracking-wider text-muted", children: t(label) }), _jsx("div", { className: "flex-1 border-t border-border" })] }));
+}
+function renderDivider(label, key) {
+    return label ? _jsx(LabelledDivider, { label: label }, key) : _jsx("hr", { className: "border-border" }, key);
+}
+function renderGroupNode(it, ctx, bridgeCtx) {
+    if (bridgeCtx) {
+        if (isStorageGroup(it)) {
+            const key = it.key;
+            const gVal = bridgeCtx.bridge.getValue(key);
+            if (bridgeCtx.bridge.isHidden(key))
+                return null;
+            const r = resolveRenderer({ kind: elementKind(it) });
+            if (!r) {
+                console.warn(`[LayoutRenderer] no renderer for storage group kind '${elementKind(it)}'`);
+                return null;
+            }
+            return (_jsx(SlotProvider, { field: it, value: gVal, commit: (v) => bridgeCtx.bridge.setValue(key, v), isHidden: bridgeCtx.bridge.isHidden, mode: bridgeCtx.bridge.mode, children: _jsx(r.Page, { el: it, value: gVal, error: bridgeCtx.bridge.error(key), mode: bridgeCtx.bridge.mode, recordCtx: bridgeCtx.bridge.recordCtx }) }));
+        }
+        if (it.display === 'sheet') {
+            return (_jsx(SheetSection, { group: it, renderCell: (cell) => hasChildren(cell) ? null : (renderElementBridge(cell, bridgeCtx)?.node ?? null) }));
+        }
+        if (it.kind !== undefined) {
+            const r = resolveRenderer({ kind: it.kind });
+            if (r) {
+                return (_jsx(FlowCtx.Provider, { value: true, children: withChildWidth(r.childWidth, _jsx(SlotProvider, { field: it, value: bridgeCtx.bridge.values, commit: blockCommit(bridgeCtx.bridge.values, bridgeCtx.bridge.setValue), isHidden: bridgeCtx.bridge.isHidden, mode: bridgeCtx.bridge.mode, children: _jsx(r.Page, { el: it, value: undefined, mode: bridgeCtx.bridge.mode, recordCtx: bridgeCtx.bridge.recordCtx }) })) }));
+            }
+        }
+        const innerNodes = collapseDividers(collect(it.fields, ctx, bridgeCtx, it.display === 'scroll' ? 'scroll' : 'wrap'));
+        const inner = renderNodes(innerNodes, 'g');
+        if (!inner)
+            return null;
+        if (it.display === 'scroll') {
+            return _jsx(RowSection, { group: it, children: inner });
+        }
+        const r = resolveRenderer({ kind: 'group' });
+        if (r) {
+            return (_jsx(SlotProvider, { field: it, value: undefined, children: _jsx(r.Page, { el: it, value: undefined, mode: bridgeCtx.bridge.mode, recordCtx: bridgeCtx.bridge.recordCtx, children: inner }) }));
+        }
+        return _jsx(GroupSection, { group: it, children: inner });
+    }
+    if (isStorageGroup(it)) {
+        return ctx.renderGroup?.(it.key, it) ?? null;
+    }
+    if (it.display === 'sheet') {
+        return (_jsx(SheetSection, { group: it, renderCell: (cell) => (isNamedField(cell) ? ctx.renderField(cell.key, cell.type) : null) }));
+    }
+    if (it.kind !== undefined) {
+        const r = resolveRenderer({ kind: it.kind });
+        if (r) {
+            return (_jsx(FlowCtx.Provider, { value: true, children: withChildWidth(r.childWidth, _jsx(SlotProvider, { field: it, value: ctx.values, commit: ctx.setValue ? blockCommit(ctx.values ?? {}, ctx.setValue) : undefined, isHidden: ctx.isHidden, mode: ctx.mode, children: _jsx(r.Page, { el: it, value: undefined, mode: ctx.mode ?? 'view', recordCtx: { library: '', shelf: '', recordId: null } }) })) }));
+        }
+    }
+    const inner = renderNodes(collapseDividers(collect(it.fields, ctx, undefined, it.display === 'scroll' ? 'scroll' : 'wrap')), 'g');
+    if (!inner)
+        return null;
+    return it.display === 'scroll' ? (_jsx(RowSection, { group: it, children: inner })) : (_jsx(GroupSection, { group: it, children: inner }));
+}
+export function LayoutRenderer({ items, ctx }) {
+    const { t } = useTranslation();
+    const bridgeCtx = ctx.bridge ? { bridge: ctx.bridge, t } : undefined;
+    const nodes = [];
+    let buffer = [];
+    const flushRun = () => {
+        if (buffer.length) {
+            nodes.push(...collect(buffer, ctx, bridgeCtx));
+            buffer = [];
+        }
+    };
+    for (const it of items) {
+        if (hasChildren(it)) {
+            flushRun();
+            const node = renderGroupNode(it, ctx, bridgeCtx);
+            if (node)
+                nodes.push({ kind: 'group', node });
+        }
+        else {
+            buffer.push(it);
+        }
+    }
+    flushRun();
+    const collapsed = collapseDividers(nodes);
+    const rendered = renderNodes(collapsed, 'l');
+    if (rendered == null)
+        return null;
+    return (_jsx(ParentValuesProvider, { values: ctx.bridge?.values, children: _jsx("div", { className: `@container flex flex-col min-w-0 ${LAYOUT_STACK}`, children: rendered }) }));
+}

package/dist/lib/cat-color.d.ts

@@ -0,0 +1 @@
+export declare function catColor(key: string): string;

package/dist/lib/cat-color.js

@@ -0,0 +1,7 @@
+const CAT_COUNT = 8;
+export function catColor(key) {
+    let h = 0;
+    for (let i = 0; i < key.length; i++)
+        h = (h * 31 + key.charCodeAt(i)) | 0;
+    return `var(--cat-${(Math.abs(h) % CAT_COUNT) + 1})`;
+}

package/dist/lib/compose-refs.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+type PossibleRef<T> = React.Ref<T> | undefined;
+declare function composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
+declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
+export { composeRefs, useComposedRefs };

package/dist/lib/compose-refs.js

@@ -0,0 +1,38 @@
+import * as React from 'react';
+function setRef(ref, value) {
+    if (typeof ref === 'function') {
+        return ref(value);
+    }
+    if (ref !== null && ref !== undefined) {
+        ref.current = value;
+    }
+}
+function composeRefs(...refs) {
+    return (node) => {
+        let hasCleanup = false;
+        const cleanups = refs.map((ref) => {
+            const cleanup = setRef(ref, node);
+            if (!hasCleanup && typeof cleanup === 'function') {
+                hasCleanup = true;
+            }
+            return cleanup;
+        });
+        if (hasCleanup) {
+            return () => {
+                for (let i = 0; i < cleanups.length; i++) {
+                    const cleanup = cleanups[i];
+                    if (typeof cleanup === 'function') {
+                        cleanup();
+                    }
+                    else {
+                        setRef(refs[i], null);
+                    }
+                }
+            };
+        }
+    };
+}
+function useComposedRefs(...refs) {
+    return React.useCallback(composeRefs(...refs), refs);
+}
+export { composeRefs, useComposedRefs };

package/dist/lib/date-format.d.ts

@@ -0,0 +1,9 @@
+export declare function isoToDate(iso: string): Date | undefined;
+export declare function dateToIso(d: Date): string;
+export declare function isoToDisplay(iso: string): string;
+export declare function isoDateTimeToDisplay(iso: string): string;
+export declare function splitDateTime(iso: string): {
+    date: string;
+    time: string;
+};
+export declare function joinDateTime(date: string, time: string): string;

package/dist/lib/date-format.js

@@ -0,0 +1,31 @@
+import { format, parse, isValid } from 'date-fns';
+export function isoToDate(iso) {
+    if (!iso)
+        return undefined;
+    const d = parse(iso.slice(0, 10), 'yyyy-MM-dd', new Date());
+    return isValid(d) ? d : undefined;
+}
+export function dateToIso(d) {
+    return format(d, 'yyyy-MM-dd');
+}
+export function isoToDisplay(iso) {
+    const d = isoToDate(iso);
+    return d ? format(d, 'dd.MM.yyyy') : '';
+}
+export function isoDateTimeToDisplay(iso) {
+    if (!iso)
+        return '';
+    const datePart = isoToDisplay(iso.slice(0, 10));
+    if (!datePart)
+        return '';
+    const time = iso.slice(11, 16);
+    return time ? `${datePart} ${time}` : datePart;
+}
+export function splitDateTime(iso) {
+    return { date: iso.slice(0, 10), time: iso.slice(11, 16) };
+}
+export function joinDateTime(date, time) {
+    if (!date)
+        return '';
+    return time ? `${date}T${time}` : date;
+}

package/dist/lib/format.d.ts

@@ -0,0 +1,14 @@
+import type { FieldMeta, OptionItem } from '@coffer-org/sdk/fields';
+type TFn = (key: string, opts?: Record<string, unknown>) => string;
+export declare function formatDuration(secs: number, t: TFn): string;
+export declare function asBool(v: unknown): boolean;
+type OptionsCarrier = Pick<FieldMeta, 'options'> & {
+    hints?: FieldMeta['hints'];
+};
+export declare function fieldOptions(field: OptionsCarrier): OptionItem[];
+export declare function optionLabel(t: TFn, field: OptionsCarrier, value: unknown): string;
+export declare function sortedCountryOptions(t: TFn): {
+    code: string;
+    name: string;
+}[];
+export {};

package/dist/lib/format.js

@@ -0,0 +1,34 @@
+import { COUNTRIES } from '@coffer-org/sdk/countries';
+import { getOptionList } from "../schema-registry.js";
+export function formatDuration(secs, t) {
+    const d = Math.floor(secs / 86400);
+    const h = Math.floor((secs % 86400) / 3600);
+    const m = Math.floor((secs % 3600) / 60);
+    const s = secs % 60;
+    const parts = [];
+    if (d)
+        parts.push(`${d} ${t('form.days')}`);
+    if (h)
+        parts.push(`${h} ${t('form.hours')}`);
+    if (m)
+        parts.push(`${m} ${t('form.minutes')}`);
+    if (s)
+        parts.push(`${s} ${t('form.seconds')}`);
+    return parts.length ? parts.join(' ') : `0 ${t('form.seconds')}`;
+}
+export function asBool(v) {
+    return v === true || v === 1 || v === '1' || v === 'true';
+}
+export function fieldOptions(field) {
+    if (field.options?.length)
+        return field.options;
+    const src = field.hints?.['source'];
+    return src ? getOptionList(src) : [];
+}
+export function optionLabel(t, field, value) {
+    const key = fieldOptions(field).find((o) => o.value === String(value))?.title;
+    return key ? t(key) : String(value ?? '');
+}
+export function sortedCountryOptions(t) {
+    return COUNTRIES.map((c) => ({ code: c.code, name: t(`core.countries.${c.code}`) })).sort((a, b) => a.name.localeCompare(b.name));
+}

package/dist/lib/json.d.ts

@@ -0,0 +1 @@
+export declare function parseJSON<T>(v: unknown, fallback: T): T;

package/dist/lib/json.js

@@ -0,0 +1,12 @@
+export function parseJSON(v, fallback) {
+    if (v === null || v === undefined || v === '')
+        return fallback;
+    if (typeof v === 'object')
+        return v;
+    try {
+        return JSON.parse(String(v));
+    }
+    catch {
+        return fallback;
+    }
+}

package/dist/lib/multi-value.d.ts

@@ -0,0 +1,3 @@
+import type { FieldMeta } from '@coffer-org/sdk/fields';
+export declare function parseTagValues(v: unknown): string[];
+export declare function isMultiValued(f: Pick<FieldMeta, 'kind' | 'hints'>): boolean;

package/dist/lib/multi-value.js

@@ -0,0 +1,22 @@
+export function parseTagValues(v) {
+    if (v === null || v === undefined || v === '')
+        return [];
+    if (Array.isArray(v))
+        return v.map(String).filter(Boolean);
+    if (typeof v === 'string') {
+        if (v.startsWith('[')) {
+            try {
+                const parsed = JSON.parse(v);
+                if (Array.isArray(parsed))
+                    return parsed.map(String).filter(Boolean);
+            }
+            catch {
+            }
+        }
+        return v ? [v] : [];
+    }
+    return [String(v)];
+}
+export function isMultiValued(f) {
+    return f.kind === 'tags' || f.hints?.['multiple'] === true;
+}

package/dist/lib/record-option.d.ts

@@ -0,0 +1,7 @@
+import type { ShelfDef } from '@coffer-org/sdk/shelf';
+import type { OptionIcon } from '@coffer-org/sdk/fields';
+export declare function recordOption(m: ShelfDef, row: Record<string, unknown>): {
+    icon?: OptionIcon;
+    title: string;
+    subtitle?: string;
+};

package/dist/lib/record-option.js

@@ -0,0 +1,52 @@
+import { inlineText, inlineImageKey, fieldEntries, isImageKind } from '@coffer-org/sdk/shelf';
+import { mediaUrl } from "../host-services.js";
+function firstImageName(value) {
+    if (typeof value !== 'string' || !value)
+        return undefined;
+    try {
+        const p = JSON.parse(value);
+        const first = Array.isArray(p) ? p[0] : p;
+        if (first && typeof first === 'object' && typeof first.name === 'string')
+            return first.name;
+        if (typeof first === 'string')
+            return first;
+        return undefined;
+    }
+    catch {
+        return value;
+    }
+}
+function kindOf(m, key) {
+    for (const [k, meta] of fieldEntries(m.fields))
+        if (k === key)
+            return meta.kind;
+    return undefined;
+}
+function iconFrom(m, key, row) {
+    const kind = kindOf(m, key);
+    if (kind && isImageKind(kind)) {
+        const name = firstImageName(row[key]);
+        return name ? { kind: 'image', value: mediaUrl(name) } : undefined;
+    }
+    return undefined;
+}
+export function recordOption(m, row) {
+    const sel = m.views?.select;
+    if (sel) {
+        const titleKeys = Array.isArray(sel.title) ? sel.title : [sel.title];
+        return {
+            icon: sel.icon ? iconFrom(m, sel.icon, row) : undefined,
+            title: titleKeys
+                .map((k) => String(row[k] ?? ''))
+                .filter(Boolean)
+                .join(' '),
+            subtitle: sel.subtitle ? String(row[sel.subtitle] ?? '') || undefined : undefined,
+        };
+    }
+    const imgKey = inlineImageKey(m);
+    const imgName = imgKey ? firstImageName(row[imgKey]) : undefined;
+    return {
+        icon: imgName ? { kind: 'image', value: mediaUrl(imgName) } : undefined,
+        title: inlineText(m, row),
+    };
+}

package/dist/lib/use-record-labels.d.ts

@@ -0,0 +1,14 @@
+export type LoadState = 'loading' | 'idle' | 'error';
+export declare function clearRecordByIdCache(): void;
+export interface RecordLabels {
+    rows: {
+        id: string;
+        label: string;
+    }[];
+    labelMap: Map<string, string>;
+    records: Record<string, unknown>[];
+    recordMap: Map<string, Record<string, unknown>>;
+    loadState: LoadState;
+}
+export declare function useRecordLabels(library: string, shelf: string, displayKey?: string, filter?: Record<string, string>): RecordLabels;
+export declare function useRecordsByIds(library: string, shelf: string, ids: string[]): Map<string, Record<string, unknown>>;