@x-tech-laboratories/x-libs 0.13.0 → 0.14.1

package/dist/web/states.js

@@ -1,10 +0,0 @@
-// What a request throws when the session has lapsed, so a page can tell it from any other failure and ask for a login.
-export class LoginNeeded extends Error {
-}
-// Hands a LoginNeeded on as an unhandled rejection, which the page's login listens for.
-export function pass_login_needed(error) {
-    if (!(error instanceof LoginNeeded))
-        return false;
-    void Promise.reject(error);
-    return true;
-}

package/dist/web/store.d.ts

@@ -1,11 +0,0 @@
-import { type Watch } from "./watch.ts";
-export interface Store<Value> {
-    get(): Value;
-    set(next: Value): void;
-    update(make: (current: Value) => Value): void;
-    watch: Watch;
-}
-export interface StoreOptions {
-    coalesce_in_milliseconds?: number;
-}
-export declare function create_store<Value>(initial: Value, options?: StoreOptions): Store<Value>;

package/dist/web/store.js

@@ -1,17 +0,0 @@
-// A value a page reads and events change, with a watch that redraws only what reads it.
-import { coalesce_bumps, create_watch } from "./watch.js";
-export function create_store(initial, options = {}) {
-    let value = initial;
-    const watch = create_watch();
-    const bump = options.coalesce_in_milliseconds ? coalesce_bumps(watch, options.coalesce_in_milliseconds) : watch.bump;
-    const set = (next) => {
-        value = next;
-        bump();
-    };
-    return {
-        get: () => value,
-        set,
-        update: (make) => set(make(value)),
-        watch,
-    };
-}

package/dist/web/tables.d.ts

@@ -1,28 +0,0 @@
-export interface Sorting {
-    key: string;
-    descending: boolean;
-}
-export interface SortableColumn<Row> {
-    label: string;
-    id?: string;
-    sort?: (row: Row) => string | number | null;
-}
-export type SortValue = string | number | null | undefined;
-export declare function column_id(column: {
-    id?: string;
-    label: string;
-}): string;
-export declare function sorting_list(sorting: Sorting | readonly Sorting[] | undefined): Sorting[];
-export declare function compare_values(first: SortValue, second: SortValue, descending?: boolean): number;
-export declare function sorted_rows<Row>(columns: SortableColumn<Row>[], rows: Row[], sorting: Sorting | readonly Sorting[] | undefined): Row[];
-export interface TreeRow<Row> {
-    row: Row;
-    children: TreeRow<Row>[];
-}
-export declare function sorted_tree<Row>(columns: SortableColumn<Row>[], rows: Row[], sorting: Sorting | readonly Sorting[] | undefined, get_children: (row: Row) => Row[] | undefined): TreeRow<Row>[];
-export declare function sort_after_click(sorting: readonly Sorting[], key: string, adding: boolean): Sorting[];
-export declare function sorting_from(query: URLSearchParams, fallback: Sorting): Sorting;
-export declare function ordered_columns(saved_order: readonly string[], all_columns: readonly string[]): string[];
-export declare function move_column(order: readonly string[], column: string, target: string, after: boolean): string[];
-export declare function moved<Item>(items: readonly Item[], from: number, to: number): Item[];
-export declare function clamp_width(width: number, min?: number, max?: number): number;

package/dist/web/tables.js

@@ -1,88 +0,0 @@
-// The order a sorted table shows its rows in, the sorting a click or a view's query asks for, and the order of its columns.
-export function column_id(column) {
-    return column.id ?? column.label;
-}
-// One sorting or several as a list, the first deciding first.
-export function sorting_list(sorting) {
-    if (!sorting)
-        return [];
-    return Array.isArray(sorting) ? [...sorting] : [sorting];
-}
-const is_empty = (value) => value === null || value === undefined || value === "";
-// Numbers by size and text by its words and numbers, with an empty value last whichever way the column sorts.
-export function compare_values(first, second, descending = false) {
-    if (is_empty(first) || is_empty(second))
-        return Number(is_empty(first)) - Number(is_empty(second));
-    const order = typeof first === "number" && typeof second === "number"
-        ? first - second
-        : String(first).localeCompare(String(second), undefined, { numeric: true, sensitivity: "base" });
-    return descending ? -order : order;
-}
-// The rows in the order the sortings ask for, the later ones breaking ties, and rows missing a value last.
-export function sorted_rows(columns, rows, sorting) {
-    const keys = sorting_list(sorting).flatMap((key) => {
-        const column = columns.find((candidate) => column_id(candidate) === key.key && candidate.sort);
-        return column?.sort ? [{ value: column.sort, descending: key.descending }] : [];
-    });
-    if (keys.length === 0)
-        return rows;
-    return [...rows].sort((left, right) => {
-        for (const key of keys) {
-            const order = compare_values(key.value(left), key.value(right), key.descending);
-            if (order !== 0)
-                return order;
-        }
-        return 0;
-    });
-}
-// Sorts each level of a tree on its own, so children stay under their parents.
-export function sorted_tree(columns, rows, sorting, get_children) {
-    return sorted_rows(columns, rows, sorting).map((row) => ({ row, children: sorted_tree(columns, get_children(row) ?? [], sorting, get_children) }));
-}
-// A plain click sorts by that column alone; a Shift+click adds it to the sort or flips it; a third click takes it out.
-export function sort_after_click(sorting, key, adding) {
-    const current = sorting.find((each) => each.key === key);
-    const next = !current ? { key, descending: false } : current.descending ? null : { key, descending: true };
-    if (!adding) {
-        if (current && sorting.length === 1)
-            return next ? [next] : [];
-        return [{ key, descending: false }];
-    }
-    if (!current)
-        return [...sorting, next];
-    return next ? sorting.map((each) => (each.key === key ? next : each)) : sorting.filter((each) => each.key !== key);
-}
-// The sorting a view's query asks for, such as ?sort=Name&dir=desc.
-export function sorting_from(query, fallback) {
-    const key = query.get("sort");
-    return key ? { key, descending: query.get("dir") === "desc" } : fallback;
-}
-// ── Columns ──────────────────────────────────────────────────────────────────
-// Every column in its saved order, leaving out ones gone since and placing a new one just after the column before it.
-export function ordered_columns(saved_order, all_columns) {
-    const ordered = saved_order.filter((column, index) => all_columns.includes(column) && saved_order.indexOf(column) === index);
-    all_columns.forEach((column, index) => {
-        if (ordered.includes(column))
-            return;
-        ordered.splice(index === 0 ? 0 : ordered.indexOf(all_columns[index - 1]) + 1, 0, column);
-    });
-    return ordered;
-}
-// Moves a column to just before or after another one.
-export function move_column(order, column, target, after) {
-    const rest = order.filter((each) => each !== column);
-    const index = rest.indexOf(target) + (after ? 1 : 0);
-    return [...rest.slice(0, index), column, ...rest.slice(index)];
-}
-// Moves the item at from to to, such as for a list's up and down buttons.
-export function moved(items, from, to) {
-    if (from < 0 || from >= items.length)
-        return [...items];
-    const rest = items.filter((_, index) => index !== from);
-    rest.splice(Math.max(0, Math.min(to, rest.length)), 0, items[from]);
-    return rest;
-}
-// A width held between the column's narrowest and widest.
-export function clamp_width(width, min = 48, max = 960) {
-    return Math.round(Math.min(max, Math.max(min, width)));
-}

package/dist/web/theme.d.ts

@@ -1,14 +0,0 @@
-export type Theme = "system" | "light" | "dark";
-export interface ThemeChoice {
-    get(): Theme;
-    set(theme: Theme): void;
-    on_change(listener: (theme: Theme) => void): () => void;
-    apply(theme?: Theme): void;
-}
-export interface ThemeStorage {
-    read(): Theme | undefined;
-    write(theme: Theme): void;
-}
-export declare function local_theme_storage(storage_key: string): ThemeStorage;
-export declare function theme_choice(where: string | ThemeStorage): ThemeChoice;
-export declare function next_theme(theme: Theme): Theme;

package/dist/web/theme.js

@@ -1,52 +0,0 @@
-// The light, dark or system theme, kept in this browser or the app's own settings, and set as data-theme on the page.
-// The choice kept in this browser under the storage key, such as "x-nix-theme".
-export function local_theme_storage(storage_key) {
-    return {
-        read: () => {
-            try {
-                const saved = localStorage.getItem(storage_key);
-                return saved === "light" || saved === "dark" ? saved : undefined;
-            }
-            catch {
-                return undefined;
-            }
-        },
-        write: (theme) => {
-            try {
-                if (theme === "system")
-                    localStorage.removeItem(storage_key);
-                else
-                    localStorage.setItem(storage_key, theme);
-            }
-            catch {
-                // Without storage the choice lasts until the page is closed.
-            }
-        },
-    };
-}
-// The choice kept under a storage key in this browser, or in the storage the app hands over.
-export function theme_choice(where) {
-    const storage = typeof where === "string" ? local_theme_storage(where) : where;
-    const listeners = new Set();
-    const get = () => storage.read() ?? "system";
-    const apply = (theme = get()) => {
-        if (theme === "system")
-            delete document.documentElement.dataset.theme;
-        else
-            document.documentElement.dataset.theme = theme;
-        for (const listener of listeners)
-            listener(theme);
-    };
-    const set = (theme) => {
-        storage.write(theme);
-        apply(theme);
-    };
-    return { get, set, apply, on_change: (listener) => {
-            listeners.add(listener);
-            return () => void listeners.delete(listener);
-        } };
-}
-// The header's button steps through system, light and dark.
-export function next_theme(theme) {
-    return theme === "system" ? "light" : theme === "light" ? "dark" : "system";
-}

package/dist/web/tree.d.ts

@@ -1,40 +0,0 @@
-export interface TreeItem {
-    id: string;
-    parent_id: string | null;
-    position: number;
-}
-export interface TreeNode<Item> {
-    item: Item;
-    children: TreeNode<Item>[];
-}
-export type SidePlacement = "before" | "after";
-export type DropPlacement = SidePlacement | "inside";
-export interface TreeMove {
-    parent_id: string | null;
-    position: number;
-}
-export interface DropOptions {
-    by_list_order?: boolean;
-}
-export declare function by_position<Item extends {
-    position: number;
-}>(first: Item, second: Item): number;
-export declare function children_of<Item extends TreeItem>(parent_id: string | null, items: Item[]): Item[];
-export declare function subtree_ids(item_id: string, items: TreeItem[]): Set<string>;
-export declare function nest<Item extends TreeItem>(shown: Item[], all?: Item[]): TreeNode<Item>[];
-export declare function in_tree_order<Item extends TreeItem>(items: Item[], reversed?: boolean): Item[];
-export declare function path_names<Item extends TreeItem>(item: Item, items: Item[], name_of: (item: Item) => string): string[];
-export declare function placement_at(fraction_down: number, allow_inside: boolean): DropPlacement;
-export declare function can_drop(dragged_id: string, target_id: string, items: TreeItem[]): boolean;
-export declare function position_for_drop<Item extends {
-    id: string;
-    position: number;
-}>(dragged: Item, target: Item, placement: SidePlacement, items: Item[], options?: DropOptions): number;
-export declare function move_for_drop<Item extends TreeItem>(dragged: Item, target: Item, placement: DropPlacement, items: Item[], options?: DropOptions): TreeMove;
-export declare function moves_for_drop<Item extends TreeItem>(dragged: Item[], target: Item, placement: DropPlacement, items: Item[], options?: DropOptions): TreeMove[];
-export type KeyMove = "up" | "down" | "indent" | "outdent";
-export declare function key_drop<Item extends TreeItem>(item: Item, direction: KeyMove, items: Item[]): {
-    target: Item;
-    placement: DropPlacement;
-} | null;
-export declare function move_for_key<Item extends TreeItem>(item: Item, direction: KeyMove, items: Item[]): TreeMove | null;

package/dist/web/tree.js

@@ -1,130 +0,0 @@
-// Trees of rows that name their parent and their place among siblings, and where a dragged or keyed row lands.
-// ── Shape ────────────────────────────────────────────────────────────────────
-export function by_position(first, second) {
-    return first.position - second.position;
-}
-export function children_of(parent_id, items) {
-    return items.filter((item) => item.parent_id === parent_id);
-}
-// The item itself plus everything below it, at any depth.
-export function subtree_ids(item_id, items) {
-    const ids = new Set([item_id]);
-    for (const id of ids) {
-        for (const child of children_of(id, items))
-            ids.add(child.id);
-    }
-    return ids;
-}
-// Each shown item sits under its nearest ancestor that is also shown, or at the top when none is, in the order given.
-export function nest(shown, all = shown) {
-    const item_by_id = new Map(all.map((item) => [item.id, item]));
-    const node_by_id = new Map(shown.map((item) => [item.id, { item, children: [] }]));
-    const top_nodes = [];
-    for (const node of node_by_id.values()) {
-        const seen = new Set([node.item.id]);
-        let ancestor_id = node.item.parent_id;
-        while (ancestor_id && !node_by_id.has(ancestor_id) && !seen.has(ancestor_id)) {
-            seen.add(ancestor_id);
-            ancestor_id = item_by_id.get(ancestor_id)?.parent_id ?? null;
-        }
-        if (ancestor_id && node_by_id.has(ancestor_id) && !seen.has(ancestor_id))
-            node_by_id.get(ancestor_id).children.push(node);
-        else
-            top_nodes.push(node);
-    }
-    return top_nodes;
-}
-// Every item in tree order: each followed by the items below it, siblings by position, each set of siblings reversed when asked.
-export function in_tree_order(items, reversed = false) {
-    const sorted = [...items].sort(by_position);
-    if (reversed)
-        sorted.reverse();
-    const walk = (nodes) => nodes.flatMap((node) => [node.item, ...walk(node.children)]);
-    const ordered = walk(nest(sorted, items));
-    const reached = new Set(ordered);
-    return [...ordered, ...sorted.filter((item) => !reached.has(item))];
-}
-// The names from the top of the tree down to the item, such as ["Work", "Clients"]; stops at a missing parent or a loop.
-export function path_names(item, items, name_of) {
-    const item_by_id = new Map(items.map((each) => [each.id, each]));
-    const path = [item];
-    let parent = item.parent_id === null ? undefined : item_by_id.get(item.parent_id);
-    while (parent && !path.includes(parent)) {
-        path.unshift(parent);
-        parent = parent.parent_id === null ? undefined : item_by_id.get(parent.parent_id);
-    }
-    return path.map(name_of);
-}
-// ── Dropping ─────────────────────────────────────────────────────────────────
-// The top and bottom quarters of a row drop beside it and the middle drops into it, or halves when nothing drops inside.
-export function placement_at(fraction_down, allow_inside) {
-    if (!allow_inside)
-        return fraction_down < 0.5 ? "before" : "after";
-    if (fraction_down < 0.25)
-        return "before";
-    if (fraction_down > 0.75)
-        return "after";
-    return "inside";
-}
-// A row cannot drop onto itself or anything below it.
-export function can_drop(dragged_id, target_id, items) {
-    return !subtree_ids(dragged_id, items).has(target_id);
-}
-// Picks a position between the neighbours at the drop point, so only the moved item changes.
-function position_beside(siblings, target, placement, options = {}) {
-    const sorted = options.by_list_order ? siblings : [...siblings].sort(by_position);
-    const index = sorted.findIndex((sibling) => sibling.id === target.id);
-    const neighbour = sorted[placement === "before" ? index - 1 : index + 1];
-    if (!neighbour)
-        return placement === "before" ? target.position - 1 : target.position + 1;
-    return (target.position + neighbour.position) / 2;
-}
-// For a flat list, where items only move before or after each other.
-export function position_for_drop(dragged, target, placement, items, options = {}) {
-    return position_beside(items.filter((item) => item.id !== dragged.id), target, placement, options);
-}
-// Inside drops after the target's last child; before and after drop among the target's siblings.
-export function move_for_drop(dragged, target, placement, items, options = {}) {
-    const others = items.filter((item) => item.id !== dragged.id);
-    if (placement === "inside") {
-        const last_child_position = Math.max(target.position, ...children_of(target.id, others).map((item) => item.position));
-        return { parent_id: target.id, position: last_child_position + 1 };
-    }
-    return { parent_id: target.parent_id, position: position_beside(children_of(target.parent_id, others), target, placement, options) };
-}
-// Moves several items together, keeping their order: inside the target after its last child, or in a run between it and its neighbour.
-export function moves_for_drop(dragged, target, placement, items, options = {}) {
-    const dragged_ids = new Set(dragged.map((item) => item.id));
-    const others = items.filter((item) => !dragged_ids.has(item.id));
-    if (placement === "inside") {
-        const last_child_position = Math.max(target.position, ...children_of(target.id, others).map((item) => item.position));
-        return dragged.map((_, index) => ({ parent_id: target.id, position: last_child_position + index + 1 }));
-    }
-    const siblings = children_of(target.parent_id, others);
-    if (!options.by_list_order)
-        siblings.sort(by_position);
-    const index = siblings.findIndex((sibling) => sibling.id === target.id);
-    const neighbour = siblings[placement === "before" ? index - 1 : index + 1];
-    const low = placement === "before" ? (neighbour?.position ?? target.position - 1) : target.position;
-    const high = placement === "before" ? target.position : (neighbour?.position ?? target.position + 1);
-    return dragged.map((_, index) => ({ parent_id: target.parent_id, position: low + ((high - low) * (index + 1)) / (dragged.length + 1) }));
-}
-// Up and down pass the sibling beside it, indent goes last inside the sibling above, outdent goes after its parent; null when it cannot go that way.
-export function key_drop(item, direction, items) {
-    const siblings = children_of(item.parent_id, items).sort(by_position);
-    const index = siblings.findIndex((sibling) => sibling.id === item.id);
-    const above = siblings[index - 1];
-    const below = siblings[index + 1];
-    const parent = items.find((each) => each.id === item.parent_id);
-    if (direction === "up")
-        return above ? { target: above, placement: "before" } : null;
-    if (direction === "down")
-        return below ? { target: below, placement: "after" } : null;
-    if (direction === "indent")
-        return above ? { target: above, placement: "inside" } : null;
-    return parent ? { target: parent, placement: "after" } : null;
-}
-export function move_for_key(item, direction, items) {
-    const drop = key_drop(item, direction, items);
-    return drop && move_for_drop(item, drop.target, drop.placement, items);
-}

package/dist/web/virtual.d.ts

@@ -1,7 +0,0 @@
-export interface VirtualWindow {
-    start: number;
-    end: number;
-    offset_px: number;
-    total_px: number;
-}
-export declare function virtual_window(total_rows: number, row_height: number, scroll_top: number, viewport_height: number, overscan?: number): VirtualWindow;

package/dist/web/virtual.js

@@ -1,10 +0,0 @@
-// Which rows of a long list a scrolled viewport needs, so only those are drawn.
-export function virtual_window(total_rows, row_height, scroll_top, viewport_height, overscan = 8) {
-    if (row_height <= 0)
-        throw new Error("row_height must be positive");
-    const first_visible = Math.floor(Math.max(0, scroll_top) / row_height);
-    const visible_count = Math.ceil(viewport_height / row_height);
-    const start = Math.max(0, first_visible - overscan);
-    const end = Math.min(total_rows, first_visible + visible_count + overscan);
-    return { start, end, offset_px: start * row_height, total_px: total_rows * row_height };
-}

package/dist/web/watch.d.ts

@@ -1,11 +0,0 @@
-export interface Watch {
-    version(): number;
-    bump(): void;
-    subscribe(listener: () => void): () => void;
-}
-export declare function create_watch(): Watch;
-export interface CoalescedBump {
-    (): void;
-    cancel(): void;
-}
-export declare function coalesce_bumps(watch: Watch, interval_in_milliseconds: number, now?: () => number): CoalescedBump;

package/dist/web/watch.js

@@ -1,37 +0,0 @@
-// A change counter a store bumps and a page watches, so only what reads the store redraws when it changes.
-export function create_watch() {
-    let version = 0;
-    const listeners = new Set();
-    return {
-        version: () => version,
-        bump: () => {
-            version += 1;
-            for (const listener of listeners)
-                listener();
-        },
-        subscribe: (listener) => {
-            listeners.add(listener);
-            return () => void listeners.delete(listener);
-        },
-    };
-}
-export function coalesce_bumps(watch, interval_in_milliseconds, now = () => performance.now()) {
-    let timer = null;
-    let last_bump_at = -Infinity;
-    const schedule = () => {
-        if (timer !== null)
-            return;
-        const wait = Math.max(0, interval_in_milliseconds - (now() - last_bump_at));
-        timer = setTimeout(() => {
-            timer = null;
-            last_bump_at = now();
-            watch.bump();
-        }, wait);
-    };
-    schedule.cancel = () => {
-        if (timer !== null)
-            clearTimeout(timer);
-        timer = null;
-    };
-    return schedule;
-}