@lo-tek/interfaces 0.0.0-stage → 0.37.0

package/dist/react.js

@@ -0,0 +1,296 @@
+import { accordion } from "./components/css/accordion/accordion.js";
+import { alert } from "./components/css/alert/alert.js";
+import { avatar } from "./components/css/avatar/avatar.js";
+import { badge } from "./components/css/badge/badge.js";
+import { breadcrumbs } from "./components/css/breadcrumbs/breadcrumbs.js";
+import { button } from "./components/css/button/button.js";
+import { card } from "./components/css/card/card.js";
+import { checkbox } from "./components/css/checkbox/checkbox.js";
+import { divider } from "./components/css/divider/divider.js";
+import { errorText } from "./components/css/error-text/error-text.js";
+import { fieldset, legend } from "./components/css/fieldset/fieldset.js";
+import { fileUpload } from "./components/css/file-upload/file-upload.js";
+import { heading } from "./components/css/heading/heading.js";
+import { helpText } from "./components/css/help-text/help-text.js";
+import { icon } from "./components/css/icon/icon.js";
+import { input } from "./components/css/input/input.js";
+import { label } from "./components/css/label/label.js";
+import { link } from "./components/css/link/link.js";
+import { list } from "./components/css/list/list.js";
+import { pagination } from "./components/css/pagination/pagination.js";
+import { paragraph } from "./components/css/paragraph/paragraph.js";
+import { progress } from "./components/css/progress/progress.js";
+import { radio } from "./components/css/radio/radio.js";
+import { search } from "./components/css/search/search.js";
+import { select } from "./components/css/select/select.js";
+import { fieldStates, isFieldState, isRequiredMarker, managedNames, rememberManaged, requiredMarkers, } from "./components/css/shared.js";
+import { skeleton } from "./components/css/skeleton/skeleton.js";
+import { skipLink } from "./components/css/skip-link/skip-link.js";
+import { spinner } from "./components/css/spinner/spinner.js";
+import { srOnly } from "./components/css/sr-only/sr-only.js";
+import { switchControl } from "./components/css/switch/switch.js";
+import { table, tableSort } from "./components/css/table/table.js";
+import { tag } from "./components/css/tag/tag.js";
+import { textarea } from "./components/css/textarea/textarea.js";
+import { toggleGroup } from "./components/css/toggle-group/toggle-group.js";
+import { tooltip } from "./components/css/tooltip/tooltip.js";
+import { dialog } from "./components/frame/dialog/dialog.js";
+import { errorSummary } from "./components/frame/error-summary/error-summary.js";
+import { computeFieldAttributes, createFieldId, } from "./components/frame/field/field-core.js";
+import { popover } from "./components/frame/popover/popover.js";
+import { sessionTimeout } from "./components/frame/session-timeout/session-timeout.js";
+import { suggestion } from "./components/frame/suggestion/suggestion.js";
+import { tabsWithState, } from "./components/frame/tabs/tabs.js";
+import { connectionStatus } from "./components/standalone/connection-status/connection-status.js";
+import { toast } from "./components/standalone/toast/toast.js";
+import { setAttributes as setHtmlAttributes } from "./dom.js";
+/**
+ * The attributes that have another name in React.
+ *
+ * `tabindex` came with the compound builder functions, and `autocomplete`
+ * with the suggestion field. Without the renaming React warns about every
+ * one of them.
+ *
+ * `aria-*` and `data-*`, on the other hand, stay as they are. React passes
+ * them on unchanged, and renaming them would give invalid attributes.
+ *
+ * `react.browser.test.ts` calls every builder function here with every
+ * allowed value it declares, collects all attribute names in the result,
+ * including those in lists and nested levels, and rejects every name React
+ * spells differently. The list there is React's and is longer than the four
+ * we rename, so a builder function that one day outputs `readonly` or
+ * `maxlength` stops there and not in a consumer's console.
+ */
+const REACT_NAMES = {
+    class: "className",
+    for: "htmlFor",
+    tabindex: "tabIndex",
+    autocomplete: "autoComplete",
+};
+export function toReactAttributes(attributes) {
+    const result = {};
+    for (const [name, value] of Object.entries(attributes)) {
+        // `tabindex` is a string in HTML and a number in React. Everything else
+        // passes straight through: it is the names that differ, not the values.
+        result[REACT_NAMES[name] ?? name] =
+            name === "tabindex" ? Number(value) : value;
+    }
+    // The new object manages the same as the old one, under the new names, so
+    // `setAttributes` below can clean up as much as the main entry point.
+    const names = managedNames(attributes);
+    if (names)
+        rememberManaged(result, names.map((name) => REACT_NAMES[name] ?? name));
+    return result;
+}
+/** The names back to HTML, for `setAttributes`. */
+const HTML_NAMES = Object.fromEntries(Object.entries(REACT_NAMES).map(([html, react]) => [react, html]));
+/**
+ * Writes a set from this entry point back to the HTML names.
+ *
+ * `setAttribute` writes the name as given, and in an HTML document it becomes
+ * lower case: `className` became the attribute `classname`, and `htmlFor`
+ * became `htmlfor`. The new object manages the same as the set it came from,
+ * so what is gone in the next call is cleaned up.
+ */
+function toHtmlAttributes(set) {
+    const result = {};
+    for (const [name, value] of Object.entries(set)) {
+        result[HTML_NAMES[name] ?? name] =
+            typeof value === "number" ? String(value) : value;
+    }
+    const names = managedNames(set);
+    if (names)
+        rememberManaged(result, names.map((name) => HTML_NAMES[name] ?? name));
+    return result;
+}
+/**
+ * Like `lt.setAttributes` in the main entry point, for the sets from here.
+ *
+ * A React app reaches the DOM through a `ref`, and then naturally uses `lt`
+ * from this entry point. Passed straight to the main entry point's
+ * `setAttributes`, `className` became the attribute `classname`, and the
+ * cleanup did not find the builder function behind the set. Here the names
+ * are translated back first.
+ */
+export function setAttributes(element, ...sets) {
+    setHtmlAttributes(element, ...sets.map((set) => toHtmlAttributes(set)));
+}
+/**
+ * Wraps a builder function so the return value gets the React names.
+ *
+ * The signature is written as an intersection type so TypeScript can infer
+ * both the options type and the extra fields attached to the function, that
+ * is `variants`, `isVariant` and the others, in one go.
+ */
+function forReact(fn) {
+    const wrapped = (options) => toReactAttributes(fn(options));
+    return Object.assign(wrapped, fn);
+}
+/**
+ * Re-exported from the main entry point.
+ *
+ * `field.mdx` points to it in a section that tells the reader to import from
+ * `@lo-tek/interfaces/react`, and without this a React consumer who follows
+ * the advice gets "createFieldId is not exported". It is safe only when the
+ * markup is rendered once; in a React component `useId()` is the answer,
+ * also in an app without a server.
+ */
+export { createFieldId };
+export const lt = {
+    accordion: forReact(accordion),
+    alert: forReact(alert),
+    avatar: forReact(avatar),
+    badge: forReact(badge),
+    breadcrumbs: forReact(breadcrumbs),
+    button: forReact(button),
+    card: forReact(card),
+    checkbox: forReact(checkbox),
+    divider: forReact(divider),
+    errorText: forReact(errorText),
+    fieldset: forReact(fieldset),
+    heading: forReact(heading),
+    fileUpload: forReact(fileUpload),
+    helpText: forReact(helpText),
+    icon: forReact(icon),
+    input: forReact(input),
+    label: forReact(label),
+    legend: forReact(legend),
+    link: forReact(link),
+    list: forReact(list),
+    pagination: forReact(pagination),
+    paragraph: forReact(paragraph),
+    radio: forReact(radio),
+    search: forReact(search),
+    select: forReact(select),
+    skeleton: forReact(skeleton),
+    skipLink: forReact(skipLink),
+    progress: forReact(progress),
+    spinner: forReact(spinner),
+    srOnly: forReact(srOnly),
+    switch: forReact(switchControl),
+    toggleGroup: forReact(toggleGroup),
+    tooltip: forReact(tooltip),
+    table: forReact(table),
+    tableSort: Object.assign((options) => {
+        const built = tableSort(options);
+        return {
+            header: built.header,
+            button: toReactAttributes(built.button),
+        };
+    }, { isDirection: tableSort.isDirection }),
+    tag: forReact(tag),
+    textarea: forReact(textarea),
+    /**
+     * Wires a whole field, with `className` and `htmlFor` on the label.
+     *
+     * `control`, `help` and `error` have no keys that need renaming, and are
+     * therefore the same in both entry points.
+     */
+    field: (options) => {
+        const field = computeFieldAttributes(options);
+        return { ...field, label: toReactAttributes(field.label) };
+    },
+    /**
+     * The compound builder functions return one attribute set per element,
+     * and each set must be renamed on its own. `host` has `tabindex`, and the
+     * panels in `lt.tabs()` have both `tabindex` and `class`.
+     */
+    errorSummary: (options = {}) => {
+        const built = errorSummary(options);
+        return {
+            host: toReactAttributes(built.host),
+            title: toReactAttributes(built.title),
+        };
+    },
+    dialog: Object.assign((options) => {
+        const built = dialog(options);
+        return {
+            host: built.host,
+            dialog: toReactAttributes(built.dialog),
+            header: toReactAttributes(built.header),
+            title: toReactAttributes(built.title),
+            subtitle: toReactAttributes(built.subtitle),
+            body: toReactAttributes(built.body),
+            footer: toReactAttributes(built.footer),
+        };
+    }, {
+        dialog: dialog.dialog,
+        header: dialog.header,
+        title: dialog.title,
+        subtitle: dialog.subtitle,
+        body: dialog.body,
+        footer: dialog.footer,
+        colors: dialog.colors,
+        isColor: dialog.isColor,
+    }),
+    popover: Object.assign((options) => {
+        const built = popover(options);
+        return {
+            host: built.host,
+            trigger: toReactAttributes(built.trigger),
+            panel: toReactAttributes(built.panel),
+        };
+    }, { isPlacement: popover.isPlacement }),
+    /**
+     * The whole state, not just the links: React reports a mismatch for every
+     * attribute the component writes on an element React has rendered. See
+     * `tabsWithState`.
+     */
+    tabs: (options) => {
+        const built = tabsWithState(options);
+        return {
+            list: toReactAttributes(built.list),
+            item: toReactAttributes(built.item),
+            tabs: built.tabs.map(toReactAttributes),
+            panels: built.panels.map(toReactAttributes),
+        };
+    },
+    suggestion: (options) => {
+        const built = suggestion(options);
+        return {
+            ...built,
+            label: toReactAttributes(built.label),
+            control: toReactAttributes(built.control),
+            list: toReactAttributes(built.list),
+            options: built.options.map(toReactAttributes),
+            empty: toReactAttributes(built.empty),
+            status: toReactAttributes(built.status),
+            value: toReactAttributes(built.value),
+        };
+    },
+    toast: (options = {}) => {
+        const built = toast(options);
+        return {
+            host: toReactAttributes(built.host),
+            message: toReactAttributes(built.message),
+            close: toReactAttributes(built.close),
+        };
+    },
+    sessionTimeout: Object.assign((options) => {
+        const built = sessionTimeout(options);
+        return {
+            host: toReactAttributes(built.host),
+            dialog: toReactAttributes(built.dialog),
+            title: toReactAttributes(built.title),
+            text: toReactAttributes(built.text),
+            count: toReactAttributes(built.count),
+            live: toReactAttributes(built.live),
+            actions: toReactAttributes(built.actions),
+            extend: toReactAttributes(built.extend),
+            logout: toReactAttributes(built.logout),
+        };
+    }, {
+        dialog: sessionTimeout.dialog,
+        title: sessionTimeout.title,
+        text: sessionTimeout.text,
+        count: sessionTimeout.count,
+        actions: sessionTimeout.actions,
+    }),
+    connectionStatus: forReact(connectionStatus),
+    setAttributes,
+    states: fieldStates,
+    isState: isFieldState,
+    markers: requiredMarkers,
+    isMarker: isRequiredMarker,
+};
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

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

package/dist/register.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Registers all the web components in one call.
+ *
+ * Each component has its own `defineLt*`, and an app that only uses the field
+ * can settle for `defineLtField()` and keep the rest out of its bundle. But
+ * most apps use several, and a demo app had seven calls in a `useEffect`,
+ * that is, after the first paint. Then the elements in the markup are plain
+ * `HTMLElement`s when React paints them, and the first call to
+ * `reportSuccess()` came before the effect. One call, at import, closes the
+ * gap.
+ *
+ * Like the individual functions, it does nothing on a server, so it can sit
+ * at the top of a module that runs in both places.
+ */
+export type { LtEventMap } from "./components/events.js";
+export declare function defineLt(): void;
+//# sourceMappingURL=register.d.ts.map

package/dist/register.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"register.d.ts","sourceRoot":"","sources":["../src/register.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAiBH,YAAY,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAExD,wBAAgB,QAAQ,IAAI,IAAI,CAU/B"}

package/dist/register.js

@@ -0,0 +1,35 @@
+/**
+ * Registers all the web components in one call.
+ *
+ * Each component has its own `defineLt*`, and an app that only uses the field
+ * can settle for `defineLtField()` and keep the rest out of its bundle. But
+ * most apps use several, and a demo app had seven calls in a `useEffect`,
+ * that is, after the first paint. Then the elements in the markup are plain
+ * `HTMLElement`s when React paints them, and the first call to
+ * `reportSuccess()` came before the effect. One call, at import, closes the
+ * gap.
+ *
+ * Like the individual functions, it does nothing on a server, so it can sit
+ * at the top of a module that runs in both places.
+ */
+import { defineLtDialog } from "./components/frame/dialog/lt-dialog.js";
+import { defineLtErrorSummary } from "./components/frame/error-summary/lt-error-summary.js";
+import { defineLtField } from "./components/frame/field/lt-field.js";
+import { defineLtPopover } from "./components/frame/popover/lt-popover.js";
+import { defineLtSessionTimeout } from "./components/frame/session-timeout/lt-session-timeout.js";
+import { defineLtSuggestion } from "./components/frame/suggestion/lt-suggestion.js";
+import { defineLtTabs } from "./components/frame/tabs/lt-tabs.js";
+import { defineLtConnectionStatus } from "./components/standalone/connection-status/lt-connection-status.js";
+import { defineLtToast } from "./components/standalone/toast/lt-toast.js";
+export function defineLt() {
+    defineLtField();
+    defineLtTabs();
+    defineLtErrorSummary();
+    defineLtPopover();
+    defineLtSuggestion();
+    defineLtDialog();
+    defineLtToast();
+    defineLtSessionTimeout();
+    defineLtConnectionStatus();
+}
+//# sourceMappingURL=register.js.map

package/dist/register.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"register.js","sourceRoot":"","sources":["../src/register.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAA;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sDAAsD,CAAA;AAC3F,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAA;AACpE,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAA;AAC1E,OAAO,EAAE,sBAAsB,EAAE,MAAM,0DAA0D,CAAA;AACjG,OAAO,EAAE,kBAAkB,EAAE,MAAM,gDAAgD,CAAA;AACnF,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAA;AACjE,OAAO,EAAE,wBAAwB,EAAE,MAAM,mEAAmE,CAAA;AAC5G,OAAO,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAA;AASzE,MAAM,UAAU,QAAQ;IACtB,aAAa,EAAE,CAAA;IACf,YAAY,EAAE,CAAA;IACd,oBAAoB,EAAE,CAAA;IACtB,eAAe,EAAE,CAAA;IACjB,kBAAkB,EAAE,CAAA;IACpB,cAAc,EAAE,CAAA;IAChB,aAAa,EAAE,CAAA;IACf,sBAAsB,EAAE,CAAA;IACxB,wBAAwB,EAAE,CAAA;AAC5B,CAAC"}

package/dist/tokens/color.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Colour arithmetic: sRGB, OKLCH and contrast, as `@lo-tek/interfaces/color`.
+ *
+ * The theme is computed in the core, written in Rust (`core/src/theme/color.rs`).
+ * These five calculations are the same, for anyone who wants to compute colours
+ * in JavaScript, including in the browser. The tests that check the colours a
+ * browser actually paints use them too, and so check the core against an
+ * independent implementation of the formula.
+ *
+ * The arithmetic is done in OKLCH, not HSL. In HSL, lightness means something
+ * different for each hue: `hsl(60 100% 50%)` is bright yellow and
+ * `hsl(240 100% 50%)` is almost black, with the same numbers. In OKLCH the
+ * lightness is the same perceived lightness whatever the hue, so the contract
+ * can set one lightness per role and apply it to every colour.
+ *
+ * Contrast is computed with the WCAG 2.1 formula, the same one the tests use,
+ * so the contract and the check agree.
+ */
+export type Rgb = {
+    r: number;
+    g: number;
+    b: number;
+};
+export type Oklch = {
+    l: number;
+    c: number;
+    h: number;
+};
+/** Reads `#rrggbb` or `#rgb`. */
+export declare function parseHex(hex: string): Rgb;
+export declare function toHex({ r, g, b }: Rgb): string;
+export declare function rgbToOklch({ r, g, b }: Rgb): Oklch;
+/**
+ * Converts an OKLCH colour to an rgb colour a screen can show.
+ *
+ * Not every combination of lightness and chroma can be shown in sRGB. If the
+ * colour falls outside, the chroma is reduced until it is inside, instead of
+ * clipping each channel separately. Clipping would change the hue.
+ */
+export declare function oklchToRgb(color: Oklch): Rgb;
+/** The contrast ratio between two colours, as WCAG 2.1 computes it. */
+export declare function contrastRatio(a: Rgb, b: Rgb): number;
+//# sourceMappingURL=color.d.ts.map

package/dist/tokens/color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../src/tokens/color.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH,MAAM,MAAM,GAAG,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AACrD,MAAM,MAAM,KAAK,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAEvD,iCAAiC;AACjC,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAmBzC;AAED,wBAAgB,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,GAAG,MAAM,CAO9C;AAeD,wBAAgB,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,GAAG,KAAK,CAsBlD;AA6BD;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,GAAG,CAc5C;AAMD,uEAAuE;AACvE,wBAAgB,aAAa,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,GAAG,MAAM,CAIpD"}

package/dist/tokens/color.js

@@ -0,0 +1,123 @@
+/**
+ * Colour arithmetic: sRGB, OKLCH and contrast, as `@lo-tek/interfaces/color`.
+ *
+ * The theme is computed in the core, written in Rust (`core/src/theme/color.rs`).
+ * These five calculations are the same, for anyone who wants to compute colours
+ * in JavaScript, including in the browser. The tests that check the colours a
+ * browser actually paints use them too, and so check the core against an
+ * independent implementation of the formula.
+ *
+ * The arithmetic is done in OKLCH, not HSL. In HSL, lightness means something
+ * different for each hue: `hsl(60 100% 50%)` is bright yellow and
+ * `hsl(240 100% 50%)` is almost black, with the same numbers. In OKLCH the
+ * lightness is the same perceived lightness whatever the hue, so the contract
+ * can set one lightness per role and apply it to every colour.
+ *
+ * Contrast is computed with the WCAG 2.1 formula, the same one the tests use,
+ * so the contract and the check agree.
+ */
+/** Reads `#rrggbb` or `#rgb`. */
+export function parseHex(hex) {
+    const clean = hex.trim().replace(/^#/, "");
+    const full = clean.length === 3
+        ? clean
+            .split("")
+            .map((char) => char + char)
+            .join("")
+        : clean;
+    if (!/^[0-9a-fA-F]{6}$/.test(full)) {
+        throw new Error(`"${hex}" is not a valid hexadecimal colour`);
+    }
+    return {
+        r: Number.parseInt(full.slice(0, 2), 16),
+        g: Number.parseInt(full.slice(2, 4), 16),
+        b: Number.parseInt(full.slice(4, 6), 16),
+    };
+}
+export function toHex({ r, g, b }) {
+    const channel = (value) => Math.round(Math.min(255, Math.max(0, value)))
+        .toString(16)
+        .padStart(2, "0");
+    return `#${channel(r)}${channel(g)}${channel(b)}`;
+}
+function toLinear(channel) {
+    const c = channel / 255;
+    return c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+}
+function fromLinear(channel) {
+    const c = channel <= 0.0031308
+        ? channel * 12.92
+        : 1.055 * channel ** (1 / 2.4) - 0.055;
+    return c * 255;
+}
+export function rgbToOklch({ r, g, b }) {
+    const lr = toLinear(r);
+    const lg = toLinear(g);
+    const lb = toLinear(b);
+    const l = 0.4122214708 * lr + 0.5363325363 * lg + 0.0514459929 * lb;
+    const m = 0.2119034982 * lr + 0.6806995451 * lg + 0.1073969566 * lb;
+    const s = 0.0883024619 * lr + 0.2817188376 * lg + 0.6299787005 * lb;
+    const l_ = Math.cbrt(l);
+    const m_ = Math.cbrt(m);
+    const s_ = Math.cbrt(s);
+    const lightness = 0.2104542553 * l_ + 0.793617785 * m_ - 0.0040720468 * s_;
+    const a = 1.9779984951 * l_ - 2.428592205 * m_ + 0.4505937099 * s_;
+    const bb = 0.0259040371 * l_ + 0.7827717662 * m_ - 0.808675766 * s_;
+    return {
+        l: lightness,
+        c: Math.hypot(a, bb),
+        h: (Math.atan2(bb, a) * 180) / Math.PI,
+    };
+}
+function oklchToRgbRaw({ l, c, h }) {
+    const rad = (h * Math.PI) / 180;
+    const a = c * Math.cos(rad);
+    const b = c * Math.sin(rad);
+    const l_ = l + 0.3963377774 * a + 0.2158037573 * b;
+    const m_ = l - 0.1055613458 * a - 0.0638541728 * b;
+    const s_ = l - 0.0894841775 * a - 1.291485548 * b;
+    const lr = l_ ** 3;
+    const mr = m_ ** 3;
+    const sr = s_ ** 3;
+    return {
+        r: fromLinear(4.0767416621 * lr - 3.3077115913 * mr + 0.2309699292 * sr),
+        g: fromLinear(-1.2684380046 * lr + 2.6097574011 * mr - 0.3413193965 * sr),
+        b: fromLinear(-0.0041960863 * lr - 0.7034186147 * mr + 1.707614701 * sr),
+    };
+}
+function outside({ r, g, b }) {
+    const margin = 0.5;
+    return [r, g, b].some((channel) => channel < -margin || channel > 255 + margin);
+}
+/**
+ * Converts an OKLCH colour to an rgb colour a screen can show.
+ *
+ * Not every combination of lightness and chroma can be shown in sRGB. If the
+ * colour falls outside, the chroma is reduced until it is inside, instead of
+ * clipping each channel separately. Clipping would change the hue.
+ */
+export function oklchToRgb(color) {
+    const attempt = oklchToRgbRaw(color);
+    if (!outside(attempt))
+        return attempt;
+    let low = 0;
+    let high = color.c;
+    for (let i = 0; i < 24; i += 1) {
+        const middle = (low + high) / 2;
+        if (outside(oklchToRgbRaw({ ...color, c: middle })))
+            high = middle;
+        else
+            low = middle;
+    }
+    return oklchToRgbRaw({ ...color, c: low });
+}
+function luminance({ r, g, b }) {
+    return 0.2126 * toLinear(r) + 0.7152 * toLinear(g) + 0.0722 * toLinear(b);
+}
+/** The contrast ratio between two colours, as WCAG 2.1 computes it. */
+export function contrastRatio(a, b) {
+    const la = luminance(a);
+    const lb = luminance(b);
+    return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
+}
+//# sourceMappingURL=color.js.map

package/dist/tokens/color.js.map

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

package/dist/tokens/contract.d.ts

@@ -0,0 +1,18 @@
+/**
+ * The colour contract, as `@lo-tek/interfaces/contract`: what each role is,
+ * and what it promises.
+ *
+ * One colour layer, not two. A colour is a point in a matrix of **family**
+ * (what it means) and **role** (what it does), and every family has the same
+ * roles. The hue comes from the consumer, the lightness from the role, and so
+ * the contrast is guaranteed by construction rather than by a check
+ * afterwards.
+ *
+ * The numbers are in `color-contract.json`, which the core reads, and the
+ * arithmetic happens there. Here is the data, for anyone who wants to read it.
+ * A theme is built with `buildTheme` from `@lo-tek/interfaces/theme`, and a
+ * hand-written theme is checked with `inspectTheme` from
+ * `@lo-tek/interfaces/theme-check`.
+ */
+export { type Appearance, NEUTRAL_LAYERS, REQUIREMENT, ROLES, type Role, } from "./matrix-cells.js";
+//# sourceMappingURL=contract.d.ts.map

package/dist/tokens/contract.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"contract.d.ts","sourceRoot":"","sources":["../../src/tokens/contract.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EACL,KAAK,UAAU,EACf,cAAc,EACd,WAAW,EACX,KAAK,EACL,KAAK,IAAI,GACV,MAAM,mBAAmB,CAAA"}

package/dist/tokens/contract.js

@@ -0,0 +1,18 @@
+/**
+ * The colour contract, as `@lo-tek/interfaces/contract`: what each role is,
+ * and what it promises.
+ *
+ * One colour layer, not two. A colour is a point in a matrix of **family**
+ * (what it means) and **role** (what it does), and every family has the same
+ * roles. The hue comes from the consumer, the lightness from the role, and so
+ * the contrast is guaranteed by construction rather than by a check
+ * afterwards.
+ *
+ * The numbers are in `color-contract.json`, which the core reads, and the
+ * arithmetic happens there. Here is the data, for anyone who wants to read it.
+ * A theme is built with `buildTheme` from `@lo-tek/interfaces/theme`, and a
+ * hand-written theme is checked with `inspectTheme` from
+ * `@lo-tek/interfaces/theme-check`.
+ */
+export { NEUTRAL_LAYERS, REQUIREMENT, ROLES, } from "./matrix-cells.js";
+//# sourceMappingURL=contract.js.map

package/dist/tokens/contract.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contract.js","sourceRoot":"","sources":["../../src/tokens/contract.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAEL,cAAc,EACd,WAAW,EACX,KAAK,GAEN,MAAM,mBAAmB,CAAA"}

package/dist/tokens/matrix-cells.d.ts

@@ -0,0 +1,30 @@
+/** The families LO-TEK ships itself. A consumer can have others. */
+export declare const FAMILIES: readonly ["accent", "visited", "brand1", "brand2", "brand3", "neutral", "danger", "warning", "success"];
+export type Family = (typeof FAMILIES)[number];
+/** LO-TEK's own brand colours. */
+export declare const LOTEK_BRANDS: Record<Family, string>;
+/** A role is a job a colour does, and it is the same in every family. */
+export type Role = "surface" | "borderSubtle" | "border" | "borderStrong" | "fill" | "text" | "textStrong" | "textSubtle" | "content";
+/** Light or dark. A theme is one or the other, never both. */
+export type Appearance = "light" | "dark";
+type Spec = {
+    lightness: Record<Appearance, number>;
+    chroma: number;
+};
+/** Lightness and chroma share per role, in each appearance. */
+export declare const ROLES: Record<Role, Spec>;
+/** The page and the raised surface, which only the neutral family has. */
+export declare const NEUTRAL_LAYERS: Record<"canvas" | "raised", Spec>;
+/** The contrast requirements, with a margin above WCAG. Text is 4.5 and graphics 3. */
+export declare const REQUIREMENT: {
+    readonly text: 4.6;
+    readonly graphic: 3.1;
+};
+/** Every name the matrix emits. */
+export type MatrixToken = "--lt-color-accent-surface" | "--lt-color-accent-border-subtle" | "--lt-color-accent-border" | "--lt-color-accent-border-strong" | "--lt-color-accent-fill" | "--lt-color-accent-text" | "--lt-color-accent-text-strong" | "--lt-color-accent-text-subtle" | "--lt-color-accent-content" | "--lt-color-visited-surface" | "--lt-color-visited-border-subtle" | "--lt-color-visited-border" | "--lt-color-visited-border-strong" | "--lt-color-visited-fill" | "--lt-color-visited-text" | "--lt-color-visited-text-strong" | "--lt-color-visited-text-subtle" | "--lt-color-visited-content" | "--lt-color-brand1-surface" | "--lt-color-brand1-border-subtle" | "--lt-color-brand1-border" | "--lt-color-brand1-border-strong" | "--lt-color-brand1-fill" | "--lt-color-brand1-text" | "--lt-color-brand1-text-strong" | "--lt-color-brand1-text-subtle" | "--lt-color-brand1-content" | "--lt-color-brand2-surface" | "--lt-color-brand2-border-subtle" | "--lt-color-brand2-border" | "--lt-color-brand2-border-strong" | "--lt-color-brand2-fill" | "--lt-color-brand2-text" | "--lt-color-brand2-text-strong" | "--lt-color-brand2-text-subtle" | "--lt-color-brand2-content" | "--lt-color-brand3-surface" | "--lt-color-brand3-border-subtle" | "--lt-color-brand3-border" | "--lt-color-brand3-border-strong" | "--lt-color-brand3-fill" | "--lt-color-brand3-text" | "--lt-color-brand3-text-strong" | "--lt-color-brand3-text-subtle" | "--lt-color-brand3-content" | "--lt-color-neutral-surface" | "--lt-color-neutral-border-subtle" | "--lt-color-neutral-border" | "--lt-color-neutral-border-strong" | "--lt-color-neutral-fill" | "--lt-color-neutral-text" | "--lt-color-neutral-text-strong" | "--lt-color-neutral-text-subtle" | "--lt-color-neutral-content" | "--lt-color-danger-surface" | "--lt-color-danger-border-subtle" | "--lt-color-danger-border" | "--lt-color-danger-border-strong" | "--lt-color-danger-fill" | "--lt-color-danger-text" | "--lt-color-danger-text-strong" | "--lt-color-danger-text-subtle" | "--lt-color-danger-content" | "--lt-color-warning-surface" | "--lt-color-warning-border-subtle" | "--lt-color-warning-border" | "--lt-color-warning-border-strong" | "--lt-color-warning-fill" | "--lt-color-warning-text" | "--lt-color-warning-text-strong" | "--lt-color-warning-text-subtle" | "--lt-color-warning-content" | "--lt-color-success-surface" | "--lt-color-success-border-subtle" | "--lt-color-success-border" | "--lt-color-success-border-strong" | "--lt-color-success-fill" | "--lt-color-success-text" | "--lt-color-success-text-strong" | "--lt-color-success-text-subtle" | "--lt-color-success-content" | "--lt-color-neutral-canvas" | "--lt-color-neutral-raised";
+/** LO-TEK's own colours in the light theme. */
+export declare const lightCells: Record<MatrixToken, string>;
+/** LO-TEK's own colours in the dark theme. */
+export declare const darkCells: Record<MatrixToken, string>;
+export {};
+//# sourceMappingURL=matrix-cells.d.ts.map

package/dist/tokens/matrix-cells.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"matrix-cells.d.ts","sourceRoot":"","sources":["../../src/tokens/matrix-cells.ts"],"names":[],"mappings":"AAEA,oEAAoE;AACpE,eAAO,MAAM,QAAQ,yGAAkG,CAAA;AAEvH,MAAM,MAAM,MAAM,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAA;AAE9C,kCAAkC;AAClC,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAU/C,CAAA;AAED,yEAAyE;AACzE,MAAM,MAAM,IAAI,GAAG,SAAS,GAAG,cAAc,GAAG,QAAQ,GAAG,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,YAAY,GAAG,YAAY,GAAG,SAAS,CAAA;AAErI,8DAA8D;AAC9D,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,CAAA;AAEzC,KAAK,IAAI,GAAG;IAAE,SAAS,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAA;AAErE,+DAA+D;AAC/D,eAAO,MAAM,KAAK,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,CAgEpC,CAAA;AAED,0EAA0E;AAC1E,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,QAAQ,GAAG,QAAQ,EAAE,IAAI,CAe5D,CAAA;AAED,uFAAuF;AACvF,eAAO,MAAM,WAAW;;;CAAsC,CAAA;AAE9D,mCAAmC;AACnC,MAAM,MAAM,WAAW,GACnB,2BAA2B,GAC3B,iCAAiC,GACjC,0BAA0B,GAC1B,iCAAiC,GACjC,wBAAwB,GACxB,wBAAwB,GACxB,+BAA+B,GAC/B,+BAA+B,GAC/B,2BAA2B,GAC3B,4BAA4B,GAC5B,kCAAkC,GAClC,2BAA2B,GAC3B,kCAAkC,GAClC,yBAAyB,GACzB,yBAAyB,GACzB,gCAAgC,GAChC,gCAAgC,GAChC,4BAA4B,GAC5B,2BAA2B,GAC3B,iCAAiC,GACjC,0BAA0B,GAC1B,iCAAiC,GACjC,wBAAwB,GACxB,wBAAwB,GACxB,+BAA+B,GAC/B,+BAA+B,GAC/B,2BAA2B,GAC3B,2BAA2B,GAC3B,iCAAiC,GACjC,0BAA0B,GAC1B,iCAAiC,GACjC,wBAAwB,GACxB,wBAAwB,GACxB,+BAA+B,GAC/B,+BAA+B,GAC/B,2BAA2B,GAC3B,2BAA2B,GAC3B,iCAAiC,GACjC,0BAA0B,GAC1B,iCAAiC,GACjC,wBAAwB,GACxB,wBAAwB,GACxB,+BAA+B,GAC/B,+BAA+B,GAC/B,2BAA2B,GAC3B,4BAA4B,GAC5B,kCAAkC,GAClC,2BAA2B,GAC3B,kCAAkC,GAClC,yBAAyB,GACzB,yBAAyB,GACzB,gCAAgC,GAChC,gCAAgC,GAChC,4BAA4B,GAC5B,2BAA2B,GAC3B,iCAAiC,GACjC,0BAA0B,GAC1B,iCAAiC,GACjC,wBAAwB,GACxB,wBAAwB,GACxB,+BAA+B,GAC/B,+BAA+B,GAC/B,2BAA2B,GAC3B,4BAA4B,GAC5B,kCAAkC,GAClC,2BAA2B,GAC3B,kCAAkC,GAClC,yBAAyB,GACzB,yBAAyB,GACzB,gCAAgC,GAChC,gCAAgC,GAChC,4BAA4B,GAC5B,4BAA4B,GAC5B,kCAAkC,GAClC,2BAA2B,GAC3B,kCAAkC,GAClC,yBAAyB,GACzB,yBAAyB,GACzB,gCAAgC,GAChC,gCAAgC,GAChC,4BAA4B,GAC5B,2BAA2B,GAC3B,2BAA2B,CAAA;AAE/B,+CAA+C;AAC/C,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAoFlD,CAAA;AAED,8CAA8C;AAC9C,eAAO,MAAM,SAAS,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAoFjD,CAAA"}