@fieldia/designer 0.0.0-stage → 0.12.0

package/src/lib/templates.mjs

@@ -0,0 +1,186 @@
+import { checkPage, validatePage } from '@fieldia/core';
+import { kindById } from './kinds.mjs';
+import { DESIGNER_WORDS } from './designer-words.mjs';
+import { en } from './locales/en/index.mjs';
+import { Refusal } from './refusal.mjs';
+const ask = (name, kind, label, more = {}) => ({ name, kind, label, ...more });
+const valueOf = (words) => words.toLowerCase().replace(/[^a-z0-9]+/g, '_').replace(/^_+|_+$/g, '');
+/** Options in the designer's words, valued by the English ones: a template's answers are stored the same in every language. */
+const choices = (english, said) => english.map((label, i) => ({ value: valueOf(label), label: said[i] ?? label }));
+/** A template's page: its groups — a survey's pages, a screen's sections — and their questions, each made as its kind makes it. */
+function made(kind, id, title, description, groups, words, language) {
+    const fields = {};
+    const nodes = (asks) => asks.map((a) => {
+        const k = kindById(a.kind);
+        const field = { ...k.field(a.label, words), ...(a.field ?? {}) };
+        if (a.required)
+            field.required = true;
+        if (a.help)
+            field.help = a.help;
+        if (a.choices && field.type === 'selection')
+            field.options = a.choices;
+        fields[a.name] = field;
+        return { type: 'field', id: `q-${a.name.replace(/_/g, '-')}`, field: a.name, ...(k.widget ? { widget: k.widget } : {}), ...(a.look ? { options: a.look } : {}), ...(a.colspan ? { colspan: a.colspan } : {}) };
+    });
+    const layout = kind === 'survey'
+        ? { type: 'wizard', id: 'steps', children: groups.map(([label, asks], i) => ({ type: 'step', id: `step-${i + 1}`, label, children: nodes(asks) })) }
+        : { type: 'sections', id: 'sections', children: groups.map(([label, asks], i) => ({ type: 'section', id: `section-${i + 1}`, title: label, columns: 2, children: nodes(asks) })) };
+    const data = kind === 'survey' ? { kind: 'responses' } : { kind: 'record', model: id.replace(/-/g, '.') };
+    // Written in another language than English: the page says so, and its form speaks it.
+    return { id, title, description, page: { fieldia: '0.1', id, title, description, ...(language ? { language } : {}), data, fields, layout } };
+}
+/** Fieldia's surveys to start from, in the designer's language. */
+export function surveyTemplates(locale = 'en') {
+    const words = DESIGNER_WORDS[locale];
+    const language = locale === 'en' ? undefined : locale;
+    const { feedback, event, job } = words.templates;
+    const english = en.templates;
+    return [
+        made('survey', 'feedback', feedback.title, feedback.description, [
+            [
+                feedback.page,
+                [
+                    ask('overall', 'rating', feedback.overall, { required: true }),
+                    ask('liked', 'paragraph', feedback.liked),
+                    ask('better', 'paragraph', feedback.better),
+                    ask('recommend', 'scale', feedback.recommend, { look: { startLabel: feedback.notLikely, endLabel: feedback.veryLikely } }),
+                    ask('email', 'email', feedback.email, { help: feedback.emailHelp }),
+                ],
+            ],
+        ], words, language),
+        made('survey', 'event-registration', event.title, event.description, [
+            [
+                event.aboutYou,
+                [
+                    ask('full_name', 'short-answer', event.fullName, { required: true }),
+                    ask('email', 'email', event.email, { required: true }),
+                    ask('phone', 'phone', event.phone),
+                    ask('organisation', 'short-answer', event.organisation),
+                ],
+            ],
+            [
+                event.yourPlace,
+                [
+                    ask('sessions', 'checkboxes', event.sessions, { required: true, choices: choices(english.event.sessionChoices, event.sessionChoices) }),
+                    ask('diet', 'dropdown', event.diet, { choices: choices(english.event.dietChoices, event.dietChoices) }),
+                    ask('notes', 'paragraph', event.notes),
+                ],
+            ],
+        ], words, language),
+        made('survey', 'job-application', job.title, job.description, [
+            [
+                job.theRole,
+                [
+                    ask('role', 'dropdown', job.role, { required: true, choices: choices(english.job.roleChoices, job.roleChoices) }),
+                    ask('cv', 'file', job.cv, { required: true }),
+                    ask('experience', 'number', job.experience),
+                    ask('start', 'date', job.start),
+                    ask('why', 'paragraph', job.why),
+                ],
+            ],
+            [
+                job.aboutYou,
+                [
+                    ask('full_name', 'short-answer', job.fullName, { required: true }),
+                    ask('email', 'email', job.email, { required: true }),
+                    ask('phone', 'phone', job.phone),
+                    ask('profile', 'short-answer', job.profile),
+                ],
+            ],
+        ], words, language),
+    ];
+}
+/** Fieldia's screens to start from, in the designer's language. */
+export function screenTemplates(locale = 'en') {
+    const words = DESIGNER_WORDS[locale];
+    const language = locale === 'en' ? undefined : locale;
+    const { contact, order } = words.templates;
+    return [
+        made('screen', 'contact', contact.title, contact.description, [
+            [
+                contact.contact,
+                [
+                    ask('name', 'short-answer', contact.name, { required: true }),
+                    ask('company', 'short-answer', contact.company),
+                    ask('email', 'email', contact.email),
+                    ask('phone', 'phone', contact.phone),
+                    ask('website', 'website', contact.website),
+                ],
+            ],
+            [contact.notes, [ask('notes', 'paragraph', contact.notes, { colspan: 2 })]],
+        ], words, language),
+        made('screen', 'order-request', order.title, order.description, [
+            [
+                order.order,
+                [
+                    ask('customer', 'short-answer', order.customer, { required: true }),
+                    ask('status', 'status', order.status),
+                    ask('ordered_on', 'date', order.orderedOn, { required: true }),
+                    ask('deliver_by', 'date', order.deliverBy),
+                ],
+            ],
+            [
+                order.lines,
+                [
+                    ask('lines', 'lines', order.items, {
+                        colspan: 2,
+                        field: { fields: { name: { type: 'char', label: order.lineDescription }, quantity: { type: 'float', label: order.quantity }, price: { type: 'float', label: order.unitPrice } } },
+                    }),
+                    ask('total', 'amount', order.total),
+                    ask('notes', 'paragraph', order.notes),
+                ],
+            ],
+        ], words, language),
+    ];
+}
+/** Fieldia's templates in English, as they always were. */
+export const SURVEY_TEMPLATES = surveyTemplates('en');
+export const SCREEN_TEMPLATES = screenTemplates('en');
+/** The templates for a page: Fieldia's for a survey or a screen, then the app's that are made the same way. */
+export function templatesFor(page, app = [], locale = 'en') {
+    const survey = page.layout.type === 'wizard';
+    const own = locale === 'en' ? (survey ? SURVEY_TEMPLATES : SCREEN_TEMPLATES) : survey ? surveyTemplates(locale) : screenTemplates(locale);
+    return [...own, ...app.filter((t) => (t.page.layout.type === 'wizard') === survey)];
+}
+/** Whether a page has nothing of its own yet: a survey's empty pages, or a screen's empty sections. A sheet and a list start with a field, so they never are. */
+export function isBlank(page) {
+    const layout = page.layout;
+    if (layout.type !== 'wizard' && layout.type !== 'sections')
+        return false;
+    if (Object.keys(page.fields).length)
+        return false;
+    return layout.children.every((c) => (c.type === 'step' || c.type === 'section') && !c.children?.length);
+}
+/**
+ * Make `draft` the page `next`, keeping its id and where its answers go: a
+ * survey takes only a survey, a screen only a screen. Refused, saying why,
+ * for what is not a page the designer can open.
+ */
+export function replaceWith(draft, next) {
+    if (pageProblem(draft, next))
+        throw new Refusal((w) => pageProblem(draft, next, w));
+    const checked = checkPage(next);
+    const { id, data } = draft;
+    for (const key of Object.keys(draft))
+        delete draft[key];
+    Object.assign(draft, JSON.parse(JSON.stringify(checked.page)), { id, data });
+}
+/** Why `next` cannot take the place of `page`, in words, or null when it can: it must be a page, made the way `page` is. */
+export function pageProblem(page, next, words = en) {
+    const w = words.templates;
+    // The format's own words (from @fieldia/core): as it writes them.
+    const issues = (found) => found.map((i) => `${i.path}: ${i.message}`).join('; ');
+    const checked = checkPage(next);
+    if (!checked.ok)
+        return w.notAPage(issues(checked.issues));
+    const full = validatePage(next);
+    if (!full.ok)
+        return w.notAPage(issues(full.issues));
+    const survey = page.layout.type === 'wizard';
+    if (survey && checked.page.layout.type !== 'wizard')
+        return w.surveyNotScreen;
+    if (!survey && checked.page.layout.type === 'wizard')
+        return w.screenNotSurvey;
+    return null;
+}
+//# sourceMappingURL=templates.mjs.map

package/src/lib/templates.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"templates.mjs","sourceRoot":"","sources":["../../../../../libs/designer/src/lib/templates.ts"],"names":[],"mappings":"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"}

package/src/lib/toolbox.d.mts

@@ -0,0 +1,49 @@
+import type { ElementFactory } from './chrome.mjs';
+import type { ModelField, QuestionKind } from './designer.mjs';
+import type { DesignerWords } from './designer-words.mjs';
+/**
+ * The toolbox: every kind of field as an icon and a short name, in groups
+ * that fold, with a search — Quantia's toolbox, for forms. The model's fields
+ * come first when there is a model. A tile clicked is added; a tile pressed
+ * is handed to the canvas, which carries it if the pointer moves.
+ *
+ * A tile names what it adds: `kind:<id>`, `model:<field name>` or `layout:section` / `layout:tabs`;
+ * in Advanced, the layout tiles are `block:<kind>` — groups, tabs and the blocks between fields.
+ * `form:saved`, under More, places one of the app's saved forms: the editor asks which.
+ */
+export interface ToolboxOptions {
+    el: ElementFactory;
+    doc: Document;
+    /** The kinds it offers: a survey's, or a screen's. */
+    kinds: readonly QuestionKind[];
+    /** Sections and tabs, for a screen. */
+    layout?: boolean;
+    /** The designer's words. */
+    words: DesignerWords;
+    /** “A saved form”, for a screen: shown while the designer can place one (`update`'s `forms`). */
+    forms?: boolean;
+    onPick(spec: string): void;
+    onPress?(spec: string, event: PointerEvent, tile: HTMLElement): void;
+}
+export interface ToolboxHandle {
+    element: HTMLElement;
+    /** The model's fields still to place, whether tabs can be added, whether new fields can be — a list shows only what the model has — and whether it is Advanced. */
+    update(state: {
+        modelFields: ModelField[];
+        tabs: boolean;
+        kinds?: boolean;
+        advanced?: boolean;
+        forms?: boolean;
+    }): void;
+}
+/** The kinds in the order and groups the toolbox shows them. */
+export declare const TOOLBOX_GROUPS: readonly [string, readonly string[]][];
+/**
+ * The groups for these kinds: Fieldia's, then the app's own — each of its
+ * kinds under the group it names, "Your kinds" unless it names one; a group
+ * Fieldia has takes it at its end.
+ */
+export declare function toolboxGroups(kinds: readonly QuestionKind[]): [string, string[]][];
+/** A toolbox group's title in the designer's words: Fieldia's by their key, an app's as the app named it. */
+export declare function groupName(words: DesignerWords, key: string): string;
+export declare function toolbox(options: ToolboxOptions): ToolboxHandle;

package/src/lib/toolbox.d.ts

@@ -0,0 +1,49 @@
+import type { ElementFactory } from './chrome';
+import type { ModelField, QuestionKind } from './designer';
+import type { DesignerWords } from './designer-words';
+/**
+ * The toolbox: every kind of field as an icon and a short name, in groups
+ * that fold, with a search — Quantia's toolbox, for forms. The model's fields
+ * come first when there is a model. A tile clicked is added; a tile pressed
+ * is handed to the canvas, which carries it if the pointer moves.
+ *
+ * A tile names what it adds: `kind:<id>`, `model:<field name>` or `layout:section` / `layout:tabs`;
+ * in Advanced, the layout tiles are `block:<kind>` — groups, tabs and the blocks between fields.
+ * `form:saved`, under More, places one of the app's saved forms: the editor asks which.
+ */
+export interface ToolboxOptions {
+    el: ElementFactory;
+    doc: Document;
+    /** The kinds it offers: a survey's, or a screen's. */
+    kinds: readonly QuestionKind[];
+    /** Sections and tabs, for a screen. */
+    layout?: boolean;
+    /** The designer's words. */
+    words: DesignerWords;
+    /** “A saved form”, for a screen: shown while the designer can place one (`update`'s `forms`). */
+    forms?: boolean;
+    onPick(spec: string): void;
+    onPress?(spec: string, event: PointerEvent, tile: HTMLElement): void;
+}
+export interface ToolboxHandle {
+    element: HTMLElement;
+    /** The model's fields still to place, whether tabs can be added, whether new fields can be — a list shows only what the model has — and whether it is Advanced. */
+    update(state: {
+        modelFields: ModelField[];
+        tabs: boolean;
+        kinds?: boolean;
+        advanced?: boolean;
+        forms?: boolean;
+    }): void;
+}
+/** The kinds in the order and groups the toolbox shows them. */
+export declare const TOOLBOX_GROUPS: readonly [string, readonly string[]][];
+/**
+ * The groups for these kinds: Fieldia's, then the app's own — each of its
+ * kinds under the group it names, "Your kinds" unless it names one; a group
+ * Fieldia has takes it at its end.
+ */
+export declare function toolboxGroups(kinds: readonly QuestionKind[]): [string, string[]][];
+/** A toolbox group's title in the designer's words: Fieldia's by their key, an app's as the app named it. */
+export declare function groupName(words: DesignerWords, key: string): string;
+export declare function toolbox(options: ToolboxOptions): ToolboxHandle;

package/src/lib/toolbox.js

@@ -0,0 +1,161 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TOOLBOX_GROUPS = void 0;
+exports.toolboxGroups = toolboxGroups;
+exports.groupName = groupName;
+exports.toolbox = toolbox;
+const canvas_icons_1 = require("./canvas-icons");
+const app_kinds_1 = require("./app-kinds");
+const icons_1 = require("./icons");
+const kinds_1 = require("./kinds");
+const writes_1 = require("./writes");
+/** The kinds in the order and groups the toolbox shows them. */
+exports.TOOLBOX_GROUPS = [
+    ['Text', ['short-answer', 'paragraph', 'email', 'phone', 'website', 'keywords']],
+    ['Numbers and dates', ['number', 'amount', 'rating', 'scale', 'slider', 'progress', 'date', 'date-time', 'time']],
+    ['Choices', ['dropdown', 'multiple-choice', 'checkboxes', 'image-choice', 'tags', 'ranking', 'matrix', 'status', 'yes-no', 'tick']],
+    ['Records', ['link', 'links', 'lines']],
+    ['More', ['rich-text', 'image', 'file', 'signature', 'address', 'repeating']],
+    ['Business', ['priority', 'state-dot', 'duration', 'percentage', 'timer', 'date-range', 'colour', 'copy', 'pdf', 'embed', 'distribution', 'tax-totals', 'payments', 'properties']],
+];
+/**
+ * The groups for these kinds: Fieldia's, then the app's own — each of its
+ * kinds under the group it names, "Your kinds" unless it names one; a group
+ * Fieldia has takes it at its end.
+ */
+function toolboxGroups(kinds) {
+    const groups = exports.TOOLBOX_GROUPS.map(([title, ids]) => [title, [...ids]]);
+    for (const kind of kinds) {
+        if (!kind.app)
+            continue;
+        const title = kind.app.group?.trim() || app_kinds_1.APP_GROUP;
+        const group = groups.find(([name]) => name === title);
+        if (group)
+            group[1].push(kind.id);
+        else
+            groups.push([title, [kind.id]]);
+    }
+    return groups;
+}
+/** A toolbox group's title in the designer's words: Fieldia's by their key, an app's as the app named it. */
+function groupName(words, key) {
+    const groups = words.kinds.groups;
+    return Object.prototype.hasOwnProperty.call(groups, key) ? groups[key] : key;
+}
+function toolbox(options) {
+    const { el, doc } = options;
+    const w = options.words.toolbox;
+    const offered = new Map(options.kinds.map((k) => [k.id, k]));
+    const folded = new Set();
+    let query = '';
+    let kindsOn = true;
+    let advancedOn = false;
+    let formsOn = false;
+    const find = el('input', { type: 'search', class: 'fd-input fd-tool-find', placeholder: w.find, 'aria-label': w.find });
+    const none = el('p', { class: 'fd-tool-none', hidden: '' }, w.nothing);
+    const groupsBox = el('div', { class: 'fd-tool-groups' });
+    const element = el('aside', { class: 'fd-toolbox', 'aria-label': w.addAField }, find, groupsBox, none);
+    function tile(spec, icon, name, title, extra = '') {
+        const picture = typeof icon === 'string' ? (0, icons_1.designerIcon)(doc, icon) : icon;
+        const button = el('button', { type: 'button', class: `fd-tool ${extra}`.trim(), 'data-tool': spec, title }, picture, el('span', { class: 'fd-tool-name' }, name));
+        button.addEventListener('click', () => options.onPick(spec));
+        // A saved form is picked from a menu the tile opens: there is nothing to carry yet.
+        button.addEventListener('pointerdown', (event) => {
+            if (event.button === 0 && spec !== 'form:saved')
+                options.onPress?.(spec, event, button);
+        });
+        return button;
+    }
+    function group(key, title) {
+        const count = el('b', { class: 'fd-tool-count', hidden: '' });
+        const heading = el('button', { type: 'button', class: 'fd-tool-heading', 'aria-expanded': 'true' }, el('span', { class: 'fd-tool-caret', 'aria-hidden': 'true' }), el('span', { class: 'fd-tool-heading-name' }, title), count);
+        const tiles = el('div', { class: 'fd-tools' });
+        const element = el('section', { class: 'fd-tool-group', 'data-group': key }, heading, tiles);
+        heading.addEventListener('click', () => {
+            if (folded.has(key))
+                folded.delete(key);
+            else
+                folded.add(key);
+            show();
+        });
+        return { key, element, heading, count, tiles };
+    }
+    const fromModel = group('model', w.fromTheModel);
+    fromModel.element.classList.add('fd-tool-group-model');
+    const kindGroups = toolboxGroups(options.kinds).map(([title, ids]) => {
+        // Fieldia's groups by their key, in the designer's words; an app's by the name it gave.
+        const g = group(title, groupName(options.words, title));
+        for (const id of ids) {
+            const kind = offered.get(id);
+            const name = kind ? (0, kinds_1.kindName)(kind, options.words) : '';
+            if (kind)
+                g.tiles.append(tile(`kind:${id}`, id, name, w.addNew(name)));
+        }
+        return g;
+    }).filter((g) => g.tiles.children.length > 0);
+    // One of the app's saved forms, placed whole: an address, a contact person, a consent made once.
+    const formTile = tile('form:saved', 'saved-form', options.words.savedForms.tile, options.words.savedForms.tileTip);
+    if (options.forms)
+        kindGroups.find((g) => g.key === 'More')?.tiles.append(formTile);
+    const layout = group('layout', w.layout);
+    const tabsTile = tile('layout:tabs', 'tabs', w.tabs, w.tabsTip);
+    layout.tiles.append(tile('layout:section', 'section', w.section, w.sectionTip), tabsTile);
+    // Advanced's layout tiles: dropped beside, under, into or between parts like any field.
+    const blocks = ['group', 'side', 'tabs', 'heading', 'text', 'divider', 'spacer', 'image', 'button'];
+    const blockTiles = blocks.map((kind) => {
+        const [name, tip] = w.blocks[kind];
+        return tile(`block:${kind}`, (0, canvas_icons_1.blockIcon)(doc, kind), name, w.blockTip(name, tip));
+    });
+    layout.tiles.append(...blockTiles);
+    groupsBox.append(fromModel.element, ...kindGroups.map((g) => g.element), ...(options.layout ? [layout.element] : []));
+    /** What the search and the folding leave on show. */
+    function show() {
+        let any = false;
+        for (const g of [fromModel, ...kindGroups, layout]) {
+            const shut = folded.has(g.key) && !query;
+            (0, writes_1.setAttr)(g.heading, 'aria-expanded', String(!shut));
+            g.element.classList.toggle('fd-tool-shut', shut);
+            let shown = 0;
+            for (const t of g.tiles.children) {
+                const name = t.querySelector('.fd-tool-name')?.textContent?.toLowerCase() ?? '';
+                const block = blockTiles.includes(t);
+                const simpleOnly = g === layout && !block;
+                const unavailable = (g !== fromModel && !kindsOn) || (t === tabsTile && tabsTile.dataset['allowed'] !== 'true') || (block && !advancedOn) || (simpleOnly && advancedOn) || (t === formTile && !formsOn);
+                (0, writes_1.setHidden)(t, unavailable || (!!query && !name.includes(query)));
+                if (!t.hidden)
+                    shown++;
+            }
+            (0, writes_1.setHidden)(g.tiles, shut);
+            (0, writes_1.setHidden)(g.element, shown === 0);
+            if (shown)
+                any = true;
+        }
+        (0, writes_1.setHidden)(none, any);
+    }
+    find.addEventListener('input', () => {
+        query = find.value.trim().toLowerCase();
+        show();
+    });
+    return {
+        element,
+        update({ modelFields, tabs, kinds = true, advanced = false, forms = false }) {
+            kindsOn = kinds;
+            advancedOn = advanced;
+            formsOn = forms;
+            const key = modelFields.map((m) => `${m.name}:${m.field.label}:${m.field.type}`).join('|');
+            if (fromModel.element.dataset['key'] !== key) {
+                fromModel.element.dataset['key'] = key;
+                fromModel.tiles.replaceChildren(...modelFields.map((m) => {
+                    const node = { type: 'field', id: m.name, field: m.name };
+                    const icon = (0, kinds_1.kindOfField)(m.field, node) ?? 'short-answer';
+                    return tile(`model:${m.name}`, icon, m.field.label, w.inTheModel(m.field.label, (0, kinds_1.storedAs)(m.field, options.words)), 'fd-tool-model');
+                }));
+                fromModel.count.textContent = String(modelFields.length);
+                fromModel.count.hidden = modelFields.length === 0;
+            }
+            (0, writes_1.setData)(tabsTile, 'allowed', String(tabs));
+            show();
+        },
+    };
+}
+//# sourceMappingURL=toolbox.js.map

package/src/lib/toolbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbox.js","sourceRoot":"","sources":["../../../../../libs/designer/src/lib/toolbox.ts"],"names":[],"mappings":"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"}

package/src/lib/toolbox.mjs

@@ -0,0 +1,155 @@
+import { blockIcon } from './canvas-icons.mjs';
+import { APP_GROUP } from './app-kinds.mjs';
+import { designerIcon } from './icons.mjs';
+import { kindName, kindOfField, storedAs } from './kinds.mjs';
+import { setAttr, setData, setHidden } from './writes.mjs';
+/** The kinds in the order and groups the toolbox shows them. */
+export const TOOLBOX_GROUPS = [
+    ['Text', ['short-answer', 'paragraph', 'email', 'phone', 'website', 'keywords']],
+    ['Numbers and dates', ['number', 'amount', 'rating', 'scale', 'slider', 'progress', 'date', 'date-time', 'time']],
+    ['Choices', ['dropdown', 'multiple-choice', 'checkboxes', 'image-choice', 'tags', 'ranking', 'matrix', 'status', 'yes-no', 'tick']],
+    ['Records', ['link', 'links', 'lines']],
+    ['More', ['rich-text', 'image', 'file', 'signature', 'address', 'repeating']],
+    ['Business', ['priority', 'state-dot', 'duration', 'percentage', 'timer', 'date-range', 'colour', 'copy', 'pdf', 'embed', 'distribution', 'tax-totals', 'payments', 'properties']],
+];
+/**
+ * The groups for these kinds: Fieldia's, then the app's own — each of its
+ * kinds under the group it names, "Your kinds" unless it names one; a group
+ * Fieldia has takes it at its end.
+ */
+export function toolboxGroups(kinds) {
+    const groups = TOOLBOX_GROUPS.map(([title, ids]) => [title, [...ids]]);
+    for (const kind of kinds) {
+        if (!kind.app)
+            continue;
+        const title = kind.app.group?.trim() || APP_GROUP;
+        const group = groups.find(([name]) => name === title);
+        if (group)
+            group[1].push(kind.id);
+        else
+            groups.push([title, [kind.id]]);
+    }
+    return groups;
+}
+/** A toolbox group's title in the designer's words: Fieldia's by their key, an app's as the app named it. */
+export function groupName(words, key) {
+    const groups = words.kinds.groups;
+    return Object.prototype.hasOwnProperty.call(groups, key) ? groups[key] : key;
+}
+export function toolbox(options) {
+    const { el, doc } = options;
+    const w = options.words.toolbox;
+    const offered = new Map(options.kinds.map((k) => [k.id, k]));
+    const folded = new Set();
+    let query = '';
+    let kindsOn = true;
+    let advancedOn = false;
+    let formsOn = false;
+    const find = el('input', { type: 'search', class: 'fd-input fd-tool-find', placeholder: w.find, 'aria-label': w.find });
+    const none = el('p', { class: 'fd-tool-none', hidden: '' }, w.nothing);
+    const groupsBox = el('div', { class: 'fd-tool-groups' });
+    const element = el('aside', { class: 'fd-toolbox', 'aria-label': w.addAField }, find, groupsBox, none);
+    function tile(spec, icon, name, title, extra = '') {
+        const picture = typeof icon === 'string' ? designerIcon(doc, icon) : icon;
+        const button = el('button', { type: 'button', class: `fd-tool ${extra}`.trim(), 'data-tool': spec, title }, picture, el('span', { class: 'fd-tool-name' }, name));
+        button.addEventListener('click', () => options.onPick(spec));
+        // A saved form is picked from a menu the tile opens: there is nothing to carry yet.
+        button.addEventListener('pointerdown', (event) => {
+            if (event.button === 0 && spec !== 'form:saved')
+                options.onPress?.(spec, event, button);
+        });
+        return button;
+    }
+    function group(key, title) {
+        const count = el('b', { class: 'fd-tool-count', hidden: '' });
+        const heading = el('button', { type: 'button', class: 'fd-tool-heading', 'aria-expanded': 'true' }, el('span', { class: 'fd-tool-caret', 'aria-hidden': 'true' }), el('span', { class: 'fd-tool-heading-name' }, title), count);
+        const tiles = el('div', { class: 'fd-tools' });
+        const element = el('section', { class: 'fd-tool-group', 'data-group': key }, heading, tiles);
+        heading.addEventListener('click', () => {
+            if (folded.has(key))
+                folded.delete(key);
+            else
+                folded.add(key);
+            show();
+        });
+        return { key, element, heading, count, tiles };
+    }
+    const fromModel = group('model', w.fromTheModel);
+    fromModel.element.classList.add('fd-tool-group-model');
+    const kindGroups = toolboxGroups(options.kinds).map(([title, ids]) => {
+        // Fieldia's groups by their key, in the designer's words; an app's by the name it gave.
+        const g = group(title, groupName(options.words, title));
+        for (const id of ids) {
+            const kind = offered.get(id);
+            const name = kind ? kindName(kind, options.words) : '';
+            if (kind)
+                g.tiles.append(tile(`kind:${id}`, id, name, w.addNew(name)));
+        }
+        return g;
+    }).filter((g) => g.tiles.children.length > 0);
+    // One of the app's saved forms, placed whole: an address, a contact person, a consent made once.
+    const formTile = tile('form:saved', 'saved-form', options.words.savedForms.tile, options.words.savedForms.tileTip);
+    if (options.forms)
+        kindGroups.find((g) => g.key === 'More')?.tiles.append(formTile);
+    const layout = group('layout', w.layout);
+    const tabsTile = tile('layout:tabs', 'tabs', w.tabs, w.tabsTip);
+    layout.tiles.append(tile('layout:section', 'section', w.section, w.sectionTip), tabsTile);
+    // Advanced's layout tiles: dropped beside, under, into or between parts like any field.
+    const blocks = ['group', 'side', 'tabs', 'heading', 'text', 'divider', 'spacer', 'image', 'button'];
+    const blockTiles = blocks.map((kind) => {
+        const [name, tip] = w.blocks[kind];
+        return tile(`block:${kind}`, blockIcon(doc, kind), name, w.blockTip(name, tip));
+    });
+    layout.tiles.append(...blockTiles);
+    groupsBox.append(fromModel.element, ...kindGroups.map((g) => g.element), ...(options.layout ? [layout.element] : []));
+    /** What the search and the folding leave on show. */
+    function show() {
+        let any = false;
+        for (const g of [fromModel, ...kindGroups, layout]) {
+            const shut = folded.has(g.key) && !query;
+            setAttr(g.heading, 'aria-expanded', String(!shut));
+            g.element.classList.toggle('fd-tool-shut', shut);
+            let shown = 0;
+            for (const t of g.tiles.children) {
+                const name = t.querySelector('.fd-tool-name')?.textContent?.toLowerCase() ?? '';
+                const block = blockTiles.includes(t);
+                const simpleOnly = g === layout && !block;
+                const unavailable = (g !== fromModel && !kindsOn) || (t === tabsTile && tabsTile.dataset['allowed'] !== 'true') || (block && !advancedOn) || (simpleOnly && advancedOn) || (t === formTile && !formsOn);
+                setHidden(t, unavailable || (!!query && !name.includes(query)));
+                if (!t.hidden)
+                    shown++;
+            }
+            setHidden(g.tiles, shut);
+            setHidden(g.element, shown === 0);
+            if (shown)
+                any = true;
+        }
+        setHidden(none, any);
+    }
+    find.addEventListener('input', () => {
+        query = find.value.trim().toLowerCase();
+        show();
+    });
+    return {
+        element,
+        update({ modelFields, tabs, kinds = true, advanced = false, forms = false }) {
+            kindsOn = kinds;
+            advancedOn = advanced;
+            formsOn = forms;
+            const key = modelFields.map((m) => `${m.name}:${m.field.label}:${m.field.type}`).join('|');
+            if (fromModel.element.dataset['key'] !== key) {
+                fromModel.element.dataset['key'] = key;
+                fromModel.tiles.replaceChildren(...modelFields.map((m) => {
+                    const node = { type: 'field', id: m.name, field: m.name };
+                    const icon = kindOfField(m.field, node) ?? 'short-answer';
+                    return tile(`model:${m.name}`, icon, m.field.label, w.inTheModel(m.field.label, storedAs(m.field, options.words)), 'fd-tool-model');
+                }));
+                fromModel.count.textContent = String(modelFields.length);
+                fromModel.count.hidden = modelFields.length === 0;
+            }
+            setData(tabsTile, 'allowed', String(tabs));
+            show();
+        },
+    };
+}
+//# sourceMappingURL=toolbox.mjs.map