@fieldia/designer 0.0.0-stage → 0.12.0

package/src/lib/look-store.d.ts

@@ -0,0 +1,16 @@
+import type { LookStore, SavedLook } from './designer';
+/** The looks in what was read back, each well made: an id and a name, and only the values a look may hold. */
+export declare function wellMadeLooks(value: unknown): SavedLook[];
+/** Looks kept in memory, for as long as the page is open. `looks` is what it holds, to look at in a test. */
+export declare function createMemoryLookStore(initial?: readonly SavedLook[]): LookStore & {
+    looks: Map<string, SavedLook>;
+};
+/**
+ * Looks kept in this browser, under `key`, so they are offered again after a
+ * reload and on every page of the site. A browser that keeps nothing (a
+ * private window, storage turned off or full) keeps them in memory for the
+ * visit instead: every reading and writing is tried, never trusted.
+ */
+export declare function createBrowserLookStore(key?: string): LookStore;
+/** The looks every designer on the page keeps when the app gives no store: this browser's, one store for all of them. */
+export declare function browserLooks(): LookStore;

package/src/lib/look-store.js

@@ -0,0 +1,151 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wellMadeLooks = wellMadeLooks;
+exports.createMemoryLookStore = createMemoryLookStore;
+exports.createBrowserLookStore = createBrowserLookStore;
+exports.browserLooks = browserLooks;
+const core_1 = require("@fieldia/core");
+const layout_settings_1 = require("./layout-settings");
+const look_presets_1 = require("./look-presets");
+/**
+ * Where looks of one's own are kept, as Fieldia ships them: in memory, for a
+ * test or a page that keeps nothing, and in this browser, so a look saved
+ * today is offered tomorrow. An app keeps them for a whole workspace on its
+ * server with a `LookStore` of its own.
+ */
+/** What each value of a look may be; anything else read back is let go. */
+const ALLOWED = {
+    accent: (value) => typeof value === 'string' && /^#[0-9a-fA-F]{6}$/.test(value),
+    font: (value) => value === 'system' || value === 'serif' || value === 'rounded',
+    density: (value) => value === 'compact' || value === 'comfortable' || value === 'roomy',
+    corners: (value) => value === 'square' || value === 'soft' || value === 'round',
+    scheme: (value) => value === 'light' || value === 'dark' || value === 'auto',
+};
+/** Each kind of part's look in what was read back: only the kinds and settings the format has, each a value it may be; none, when nothing is left. */
+function wellMadeParts(value) {
+    if (!value || typeof value !== 'object')
+        return undefined;
+    const parts = {};
+    for (const [kind, settings] of Object.entries(core_1.PART_LOOKS)) {
+        const given = value[kind];
+        const part = {};
+        for (const name of settings)
+            if (given && typeof given === 'object' && layout_settings_1.PART_VALUES[name](given[name]))
+                part[name] = given[name];
+        if (Object.keys(part).length)
+            parts[kind] = part;
+    }
+    return Object.keys(parts).length ? parts : undefined;
+}
+/** The looks in what was read back, each well made: an id and a name, and only the values a look may hold. */
+function wellMadeLooks(value) {
+    if (!Array.isArray(value))
+        return [];
+    const seen = new Set();
+    const looks = [];
+    for (const item of value) {
+        if (!item || typeof item !== 'object')
+            continue;
+        const { id, name, look } = item;
+        if (typeof id !== 'string' || !id || seen.has(id) || typeof name !== 'string' || !name.trim() || !look || typeof look !== 'object')
+            continue;
+        const values = {};
+        for (const key of look_presets_1.PRESET_KEYS)
+            if (ALLOWED[key](look[key]))
+                values[key] = look[key];
+        const parts = wellMadeParts(look['parts']);
+        if (parts)
+            values.parts = parts;
+        seen.add(id);
+        looks.push({ id, name, look: values });
+    }
+    return looks;
+}
+const copy = (value) => JSON.parse(JSON.stringify(value));
+/** The list with a look in it: in its own place when it is kept already (renamed), else at the end. */
+function withLook(looks, look) {
+    const at = looks.findIndex((l) => l.id === look.id);
+    return at < 0 ? [...looks, copy(look)] : looks.map((l, i) => (i === at ? copy(look) : l));
+}
+/** Looks kept in memory, for as long as the page is open. `looks` is what it holds, to look at in a test. */
+function createMemoryLookStore(initial = []) {
+    const looks = new Map(initial.map((look) => [look.id, copy(look)]));
+    return {
+        looks,
+        async list() {
+            return copy([...looks.values()]);
+        },
+        async save(look) {
+            looks.set(look.id, copy(look));
+        },
+        async remove(id) {
+            looks.delete(id);
+        },
+    };
+}
+/**
+ * Looks kept in this browser, under `key`, so they are offered again after a
+ * reload and on every page of the site. A browser that keeps nothing (a
+ * private window, storage turned off or full) keeps them in memory for the
+ * visit instead: every reading and writing is tried, never trusted.
+ */
+function createBrowserLookStore(key = 'fieldia.designer.looks') {
+    /** Once the browser has failed to keep them, the looks live here for the rest of the visit. */
+    let inMemory = null;
+    const storage = () => {
+        const found = globalThis.localStorage;
+        if (!found)
+            throw new Error('This browser keeps nothing');
+        return found;
+    };
+    const read = () => {
+        if (inMemory)
+            return inMemory;
+        try {
+            const text = storage().getItem(key);
+            if (text === null)
+                return [];
+            try {
+                return wellMadeLooks(JSON.parse(text));
+            }
+            catch {
+                // Not written by us: read as none, and written over by the next look saved.
+                return [];
+            }
+        }
+        catch {
+            inMemory = [];
+            return inMemory;
+        }
+    };
+    const write = (looks) => {
+        if (inMemory) {
+            inMemory = looks;
+            return;
+        }
+        try {
+            storage().setItem(key, JSON.stringify(looks));
+        }
+        catch {
+            inMemory = looks;
+        }
+    };
+    return {
+        async list() {
+            return copy(read());
+        },
+        async save(look) {
+            write(withLook(read(), look));
+        },
+        async remove(id) {
+            write(read().filter((look) => look.id !== id));
+        },
+    };
+}
+let shared = null;
+/** The looks every designer on the page keeps when the app gives no store: this browser's, one store for all of them. */
+function browserLooks() {
+    shared ??= createBrowserLookStore();
+    return shared;
+}
+//# sourceMappingURL=look-store.js.map

package/src/lib/look-store.js.map

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

package/src/lib/look-store.mjs

@@ -0,0 +1,145 @@
+import { PART_LOOKS } from '@fieldia/core';
+import { PART_VALUES } from './layout-settings.mjs';
+import { PRESET_KEYS } from './look-presets.mjs';
+/**
+ * Where looks of one's own are kept, as Fieldia ships them: in memory, for a
+ * test or a page that keeps nothing, and in this browser, so a look saved
+ * today is offered tomorrow. An app keeps them for a whole workspace on its
+ * server with a `LookStore` of its own.
+ */
+/** What each value of a look may be; anything else read back is let go. */
+const ALLOWED = {
+    accent: (value) => typeof value === 'string' && /^#[0-9a-fA-F]{6}$/.test(value),
+    font: (value) => value === 'system' || value === 'serif' || value === 'rounded',
+    density: (value) => value === 'compact' || value === 'comfortable' || value === 'roomy',
+    corners: (value) => value === 'square' || value === 'soft' || value === 'round',
+    scheme: (value) => value === 'light' || value === 'dark' || value === 'auto',
+};
+/** Each kind of part's look in what was read back: only the kinds and settings the format has, each a value it may be; none, when nothing is left. */
+function wellMadeParts(value) {
+    if (!value || typeof value !== 'object')
+        return undefined;
+    const parts = {};
+    for (const [kind, settings] of Object.entries(PART_LOOKS)) {
+        const given = value[kind];
+        const part = {};
+        for (const name of settings)
+            if (given && typeof given === 'object' && PART_VALUES[name](given[name]))
+                part[name] = given[name];
+        if (Object.keys(part).length)
+            parts[kind] = part;
+    }
+    return Object.keys(parts).length ? parts : undefined;
+}
+/** The looks in what was read back, each well made: an id and a name, and only the values a look may hold. */
+export function wellMadeLooks(value) {
+    if (!Array.isArray(value))
+        return [];
+    const seen = new Set();
+    const looks = [];
+    for (const item of value) {
+        if (!item || typeof item !== 'object')
+            continue;
+        const { id, name, look } = item;
+        if (typeof id !== 'string' || !id || seen.has(id) || typeof name !== 'string' || !name.trim() || !look || typeof look !== 'object')
+            continue;
+        const values = {};
+        for (const key of PRESET_KEYS)
+            if (ALLOWED[key](look[key]))
+                values[key] = look[key];
+        const parts = wellMadeParts(look['parts']);
+        if (parts)
+            values.parts = parts;
+        seen.add(id);
+        looks.push({ id, name, look: values });
+    }
+    return looks;
+}
+const copy = (value) => JSON.parse(JSON.stringify(value));
+/** The list with a look in it: in its own place when it is kept already (renamed), else at the end. */
+function withLook(looks, look) {
+    const at = looks.findIndex((l) => l.id === look.id);
+    return at < 0 ? [...looks, copy(look)] : looks.map((l, i) => (i === at ? copy(look) : l));
+}
+/** Looks kept in memory, for as long as the page is open. `looks` is what it holds, to look at in a test. */
+export function createMemoryLookStore(initial = []) {
+    const looks = new Map(initial.map((look) => [look.id, copy(look)]));
+    return {
+        looks,
+        async list() {
+            return copy([...looks.values()]);
+        },
+        async save(look) {
+            looks.set(look.id, copy(look));
+        },
+        async remove(id) {
+            looks.delete(id);
+        },
+    };
+}
+/**
+ * Looks kept in this browser, under `key`, so they are offered again after a
+ * reload and on every page of the site. A browser that keeps nothing (a
+ * private window, storage turned off or full) keeps them in memory for the
+ * visit instead: every reading and writing is tried, never trusted.
+ */
+export function createBrowserLookStore(key = 'fieldia.designer.looks') {
+    /** Once the browser has failed to keep them, the looks live here for the rest of the visit. */
+    let inMemory = null;
+    const storage = () => {
+        const found = globalThis.localStorage;
+        if (!found)
+            throw new Error('This browser keeps nothing');
+        return found;
+    };
+    const read = () => {
+        if (inMemory)
+            return inMemory;
+        try {
+            const text = storage().getItem(key);
+            if (text === null)
+                return [];
+            try {
+                return wellMadeLooks(JSON.parse(text));
+            }
+            catch {
+                // Not written by us: read as none, and written over by the next look saved.
+                return [];
+            }
+        }
+        catch {
+            inMemory = [];
+            return inMemory;
+        }
+    };
+    const write = (looks) => {
+        if (inMemory) {
+            inMemory = looks;
+            return;
+        }
+        try {
+            storage().setItem(key, JSON.stringify(looks));
+        }
+        catch {
+            inMemory = looks;
+        }
+    };
+    return {
+        async list() {
+            return copy(read());
+        },
+        async save(look) {
+            write(withLook(read(), look));
+        },
+        async remove(id) {
+            write(read().filter((look) => look.id !== id));
+        },
+    };
+}
+let shared = null;
+/** The looks every designer on the page keeps when the app gives no store: this browser's, one store for all of them. */
+export function browserLooks() {
+    shared ??= createBrowserLookStore();
+    return shared;
+}
+//# sourceMappingURL=look-store.mjs.map

package/src/lib/look-store.mjs.map

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

package/src/lib/menu.d.mts

@@ -0,0 +1,37 @@
+import type { ElementFactory } from './chrome.mjs';
+/**
+ * A small menu of choices under the button that opened it: the editor a
+ * field is shown with, or its width. The current choice is marked and takes
+ * the keyboard first; arrows move, Enter picks, Escape gives focus back.
+ * One is open at a time, and pressing anywhere else closes it.
+ */
+export interface MenuItem {
+    id: string;
+    label: string;
+    icon?: string;
+    checked?: boolean;
+    /** Starts a group of items, under this heading. */
+    heading?: string;
+    /** Starts a group of items, under a line. */
+    divider?: boolean;
+}
+export interface MenuOptions {
+    el: ElementFactory;
+    anchor: HTMLElement;
+    title?: string;
+    items: MenuItem[];
+    /** A line under the items: why these, and not others. */
+    note?: string;
+    /**
+     * Things to do rather than one to choose: items are actions, and an item
+     * with `checked` set is a switch, on or off.
+     */
+    actions?: boolean;
+    /** Google Forms' roomy rows, for a menu with an icon on each. */
+    roomy?: boolean;
+    onPick(id: string): void;
+}
+export declare function openMenu(options: MenuOptions): {
+    element: HTMLElement;
+    close(): void;
+};

package/src/lib/menu.d.ts

@@ -0,0 +1,37 @@
+import type { ElementFactory } from './chrome';
+/**
+ * A small menu of choices under the button that opened it: the editor a
+ * field is shown with, or its width. The current choice is marked and takes
+ * the keyboard first; arrows move, Enter picks, Escape gives focus back.
+ * One is open at a time, and pressing anywhere else closes it.
+ */
+export interface MenuItem {
+    id: string;
+    label: string;
+    icon?: string;
+    checked?: boolean;
+    /** Starts a group of items, under this heading. */
+    heading?: string;
+    /** Starts a group of items, under a line. */
+    divider?: boolean;
+}
+export interface MenuOptions {
+    el: ElementFactory;
+    anchor: HTMLElement;
+    title?: string;
+    items: MenuItem[];
+    /** A line under the items: why these, and not others. */
+    note?: string;
+    /**
+     * Things to do rather than one to choose: items are actions, and an item
+     * with `checked` set is a switch, on or off.
+     */
+    actions?: boolean;
+    /** Google Forms' roomy rows, for a menu with an icon on each. */
+    roomy?: boolean;
+    onPick(id: string): void;
+}
+export declare function openMenu(options: MenuOptions): {
+    element: HTMLElement;
+    close(): void;
+};

package/src/lib/menu.js

@@ -0,0 +1,96 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.openMenu = openMenu;
+const icons_1 = require("./icons");
+const chrome_language_1 = require("./chrome-language");
+let open = null;
+/** Ids for menus' notes, unique on the page. */
+let notes = 0;
+function openMenu(options) {
+    open?.close(false);
+    const { el, anchor } = options;
+    const doc = anchor.ownerDocument;
+    // A menu holds items. With none — no versions yet — its note is all there is: a small dialog that takes focus, so it is read.
+    const empty = options.items.length === 0;
+    const menu = el('div', { class: options.roomy ? 'fd-menu fd-menu-roomy' : 'fd-menu', role: empty ? 'dialog' : 'menu', 'aria-label': options.title, tabindex: empty ? '-1' : undefined });
+    if (options.title)
+        menu.append(el('div', { class: 'fd-menu-title', 'aria-hidden': 'true' }, options.title));
+    const buttons = [];
+    for (const item of options.items) {
+        if (item.divider && buttons.length)
+            menu.append(el('div', { class: 'fd-menu-divider', role: 'separator' }));
+        if (item.heading)
+            menu.append(el('div', { class: 'fd-menu-heading', role: 'presentation' }, item.heading));
+        const role = !options.actions ? 'menuitemradio' : item.checked === undefined ? 'menuitem' : 'menuitemcheckbox';
+        const button = el('button', { type: 'button', class: 'fd-menu-item', role, 'aria-checked': role === 'menuitem' ? undefined : String(!!item.checked), 'data-item': item.id, tabindex: '-1' }, ...(item.icon ? [(0, icons_1.designerIcon)(doc, item.icon)] : []), el('span', { class: 'fd-menu-label' }, item.label));
+        button.addEventListener('click', () => {
+            close(true);
+            options.onPick(item.id);
+        });
+        buttons.push(button);
+        menu.append(button);
+    }
+    if (options.note) {
+        const note = el('p', { class: 'fd-menu-note', id: `fd-menu-note-${++notes}` }, options.note);
+        menu.append(note);
+        if (empty)
+            menu.setAttribute('aria-describedby', note.id);
+    }
+    const onKey = (event) => {
+        const at = buttons.indexOf(doc.activeElement);
+        // With nothing to pick, only Escape and Tab are the menu's: the rest go on to the page.
+        if (!buttons.length && event.key !== 'Escape' && event.key !== 'Tab')
+            return;
+        if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
+            event.preventDefault();
+            const next = (at + (event.key === 'ArrowDown' ? 1 : -1) + buttons.length) % buttons.length;
+            buttons[next]?.focus();
+        }
+        else if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            buttons[at]?.click();
+        }
+        else if (event.key === 'Escape') {
+            event.preventDefault();
+            event.stopPropagation();
+            close(true);
+        }
+        else if (event.key === 'Tab')
+            close(false);
+    };
+    menu.addEventListener('keydown', onKey);
+    const onOutside = (event) => {
+        if (!menu.contains(event.target) && event.target !== anchor && !anchor.contains(event.target))
+            close(false);
+    };
+    doc.addEventListener('pointerdown', onOutside, true);
+    function close(focusAnchor = false) {
+        if (!menu.isConnected)
+            return;
+        menu.remove();
+        doc.removeEventListener('pointerdown', onOutside, true);
+        anchor.setAttribute('aria-expanded', 'false');
+        if (open?.close === close)
+            open = null;
+        if (focusAnchor)
+            anchor.focus();
+    }
+    // Inside the editor, so the menu keeps the form's look; fixed, so nothing clips it.
+    (anchor.closest('.fd-form') ?? doc.body).append((0, chrome_language_1.speakLike)(menu, anchor));
+    anchor.setAttribute('aria-expanded', 'true');
+    const r = anchor.getBoundingClientRect();
+    const view = doc.defaultView;
+    const width = menu.offsetWidth || 240;
+    const height = menu.offsetHeight || 0;
+    const left = Math.max(8, Math.min(r.left, (view?.innerWidth ?? 1024) - width - 8));
+    const below = r.bottom + 6;
+    const top = view && below + height > view.innerHeight - 8 && r.top - height - 6 > 8 ? r.top - height - 6 : below;
+    Object.assign(menu.style, { left: `${left}px`, top: `${top}px` });
+    // The current choice takes the keyboard first; in a menu of things to do, the first of them.
+    (options.actions ? buttons[0] : buttons.find((b) => b.getAttribute('aria-checked') === 'true') ?? buttons[0])?.focus();
+    if (empty)
+        menu.focus();
+    open = { close };
+    return { element: menu, close: () => close(false) };
+}
+//# sourceMappingURL=menu.js.map

package/src/lib/menu.js.map

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

package/src/lib/menu.mjs

@@ -0,0 +1,93 @@
+import { designerIcon } from './icons.mjs';
+import { speakLike } from './chrome-language.mjs';
+let open = null;
+/** Ids for menus' notes, unique on the page. */
+let notes = 0;
+export function openMenu(options) {
+    open?.close(false);
+    const { el, anchor } = options;
+    const doc = anchor.ownerDocument;
+    // A menu holds items. With none — no versions yet — its note is all there is: a small dialog that takes focus, so it is read.
+    const empty = options.items.length === 0;
+    const menu = el('div', { class: options.roomy ? 'fd-menu fd-menu-roomy' : 'fd-menu', role: empty ? 'dialog' : 'menu', 'aria-label': options.title, tabindex: empty ? '-1' : undefined });
+    if (options.title)
+        menu.append(el('div', { class: 'fd-menu-title', 'aria-hidden': 'true' }, options.title));
+    const buttons = [];
+    for (const item of options.items) {
+        if (item.divider && buttons.length)
+            menu.append(el('div', { class: 'fd-menu-divider', role: 'separator' }));
+        if (item.heading)
+            menu.append(el('div', { class: 'fd-menu-heading', role: 'presentation' }, item.heading));
+        const role = !options.actions ? 'menuitemradio' : item.checked === undefined ? 'menuitem' : 'menuitemcheckbox';
+        const button = el('button', { type: 'button', class: 'fd-menu-item', role, 'aria-checked': role === 'menuitem' ? undefined : String(!!item.checked), 'data-item': item.id, tabindex: '-1' }, ...(item.icon ? [designerIcon(doc, item.icon)] : []), el('span', { class: 'fd-menu-label' }, item.label));
+        button.addEventListener('click', () => {
+            close(true);
+            options.onPick(item.id);
+        });
+        buttons.push(button);
+        menu.append(button);
+    }
+    if (options.note) {
+        const note = el('p', { class: 'fd-menu-note', id: `fd-menu-note-${++notes}` }, options.note);
+        menu.append(note);
+        if (empty)
+            menu.setAttribute('aria-describedby', note.id);
+    }
+    const onKey = (event) => {
+        const at = buttons.indexOf(doc.activeElement);
+        // With nothing to pick, only Escape and Tab are the menu's: the rest go on to the page.
+        if (!buttons.length && event.key !== 'Escape' && event.key !== 'Tab')
+            return;
+        if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
+            event.preventDefault();
+            const next = (at + (event.key === 'ArrowDown' ? 1 : -1) + buttons.length) % buttons.length;
+            buttons[next]?.focus();
+        }
+        else if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            buttons[at]?.click();
+        }
+        else if (event.key === 'Escape') {
+            event.preventDefault();
+            event.stopPropagation();
+            close(true);
+        }
+        else if (event.key === 'Tab')
+            close(false);
+    };
+    menu.addEventListener('keydown', onKey);
+    const onOutside = (event) => {
+        if (!menu.contains(event.target) && event.target !== anchor && !anchor.contains(event.target))
+            close(false);
+    };
+    doc.addEventListener('pointerdown', onOutside, true);
+    function close(focusAnchor = false) {
+        if (!menu.isConnected)
+            return;
+        menu.remove();
+        doc.removeEventListener('pointerdown', onOutside, true);
+        anchor.setAttribute('aria-expanded', 'false');
+        if (open?.close === close)
+            open = null;
+        if (focusAnchor)
+            anchor.focus();
+    }
+    // Inside the editor, so the menu keeps the form's look; fixed, so nothing clips it.
+    (anchor.closest('.fd-form') ?? doc.body).append(speakLike(menu, anchor));
+    anchor.setAttribute('aria-expanded', 'true');
+    const r = anchor.getBoundingClientRect();
+    const view = doc.defaultView;
+    const width = menu.offsetWidth || 240;
+    const height = menu.offsetHeight || 0;
+    const left = Math.max(8, Math.min(r.left, (view?.innerWidth ?? 1024) - width - 8));
+    const below = r.bottom + 6;
+    const top = view && below + height > view.innerHeight - 8 && r.top - height - 6 > 8 ? r.top - height - 6 : below;
+    Object.assign(menu.style, { left: `${left}px`, top: `${top}px` });
+    // The current choice takes the keyboard first; in a menu of things to do, the first of them.
+    (options.actions ? buttons[0] : buttons.find((b) => b.getAttribute('aria-checked') === 'true') ?? buttons[0])?.focus();
+    if (empty)
+        menu.focus();
+    open = { close };
+    return { element: menu, close: () => close(false) };
+}
+//# sourceMappingURL=menu.mjs.map

package/src/lib/menu.mjs.map

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

package/src/lib/outline-drag.d.mts

@@ -0,0 +1,30 @@
+import type { Designer } from './designer.mjs';
+import type { OutlineRow } from './outline-rows.mjs';
+/**
+ * Dragging rows of the outline, as the approved mockup drags them, at hand
+ * speed: what is carried stays where it is, dimmed, while one line shows
+ * where it would go — drawn as far in as the depth it lands at — or the row
+ * it would go into is washed (outline-drop.ts decides which). Moving the
+ * pointer across as well as down changes the depth, a row's indent at a
+ * time. A chip by the pointer says where in words, or why not. Let go, the
+ * rows move there as one edit (`moveParts`) and the move is said aloud;
+ * Escape, or letting go where nothing takes them, changes nothing. Held
+ * near the top or the bottom of the rail, the rail scrolls under them.
+ *
+ * What is carried: the rows picked, when the press is on one of them;
+ * otherwise the row pressed.
+ */
+export interface OutlineDragOptions {
+    tree: HTMLElement;
+    designer: Designer;
+    /** The rows on show, in order, and their elements. */
+    rows(): readonly OutlineRow[];
+    viewOf(id: string): HTMLElement | undefined;
+    folded(): ReadonlySet<string>;
+    rtl(): boolean;
+    say(words: string): void;
+    rectOf(element: Element): DOMRect;
+}
+export declare function outlineDrag(options: OutlineDragOptions): {
+    destroy(): void;
+};