lintje 0.1.1

package/dist-elements/types/components/inputs/shared/input.d.ts

@@ -0,0 +1,107 @@
+/**
+ * `LintjeInputElement` — what every control in `components/inputs/` has in common.
+ *
+ * Events: `lintje-change` (bubbles, not composed) carries the value to the component that drew
+ * the control. `lintje-values-change` (composed, `{ [name]: value }`) goes out only when `name`
+ * is set, so an input inside another component's shadow root does not leak a filter change.
+ */
+import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+/** What an input may commit. A host serialises it into the URL. */
+export type InputValue = string | number | boolean | null;
+export declare abstract class LintjeInputElement extends LintjeGridItemElement {
+    #private;
+    static properties: PropertyDeclarations;
+    /** The filter key, e.g. `p.threshold`. Without it no `lintje-values-change` is sent. */
+    name: string;
+    label: string;
+    hideLabel: boolean;
+    /**
+     * `row`: a setting's row — the name and its hint on the left, the control on the right; stacked
+     * again when the field itself is narrower than 35rem (a phone, a drawer). Left out, the label
+     * stands above the control.
+     */
+    layout?: 'row';
+    hint?: string;
+    /** The Dutch error message. */
+    error?: string;
+    disabled: boolean;
+    /** Differs from the default: draws the orange dot by the label. */
+    modified: boolean;
+    /** With `modified`: a link under the field ("Terugzetten naar 2 tot 12") that sends `lintje-reset`. */
+    resetLabel?: string;
+    /** The field must be filled. Draws nothing; sets `aria-required` and form validity. */
+    required: boolean;
+    /** Marks the label "(niet verplicht)", inside the label so it is in the accessible name. */
+    optional: boolean;
+    /** Takes part in a native `<form>`: its value is posted under `name`. */
+    static formAssociated: boolean;
+    /**
+     * The one `ElementInternals` per element: `attachInternals()` may run only once, so the base
+     * owns it and `LintjeFormInputElement` reuses it. `null` in happy-dom.
+     */
+    protected readonly internals: ElementInternals | null;
+    constructor();
+    /** The value as the form posts it; a control whose wire shape differs overrides this. */
+    protected get postedValue(): unknown;
+    /** Puts the value in the native form around the control, in the shape `formEntries` gives. */
+    protected syncForm(): void;
+    formResetCallback(): void;
+    /** The control's own `disabled`, or a `<fieldset disabled>` around it. */
+    formDisabledCallback(disabled: boolean): void;
+    protected get labelId(): string;
+    /** The id of the one native control, for the label's `for`. */
+    protected get controlId(): string;
+    /** Focuses the native control, else the checked radio, else the first focusable part. */
+    protected focusControl(options?: FocusOptions): void;
+    focus(options?: FocusOptions): void;
+    protected get hintId(): string;
+    protected get errorId(): string;
+    /** The message under the control: the host's `error`, or a control's own when there is none. */
+    protected get footMessage(): string;
+    /** What `aria-describedby` points at: the message, else the hint. */
+    protected get describedBy(): string | typeof nothing;
+    /** One change, told twice: `lintje-change`, and `lintje-values-change` when `name` is set. */
+    protected commit(value: InputValue): void;
+    /** The same commit for a non-scalar value; `url` is the shape sent in `lintje-values-change`. */
+    protected announce(value: unknown, url?: unknown): void;
+    /**
+     * The label line. With `forId` a real `<label for>`; without, a span whose click focuses the
+     * first part. `value` is shown behind the label and hidden with it.
+     */
+    protected renderLabel(forId?: string, value?: TemplateResult | typeof nothing): TemplateResult;
+    protected renderLabelSuffix(): TemplateResult | typeof nothing;
+    private get isOptional();
+    /**
+     * What the label says beyond its name — "(niet verplicht)" and the dot's words — for a name a
+     * control builds as a string instead of pointing at the label. Starts with a space when not empty.
+     */
+    protected get labelSuffixText(): string;
+    /** The label as a reader hears it; empty without a label. */
+    protected get labelText(): string;
+    protected renderFoot(): TemplateResult | typeof nothing;
+}
+/**
+ * `LintjeFormInputElement` — the text input, number input and textarea, which also stand in a
+ * host's form. Beyond the base it posts a string value, reports `required` as validity on the
+ * native control, and submits the host's form on Enter. `readonly` refuses every commit.
+ */
+export declare abstract class LintjeFormInputElement extends LintjeInputElement {
+    static properties: PropertyDeclarations;
+    readonly: boolean;
+    abstract value: unknown;
+    private initialValue;
+    protected abstract get formValue(): string;
+    /** The native control, the anchor of the validation message. */
+    protected get nativeControl(): HTMLInputElement | HTMLTextAreaElement | null;
+    protected announce(value: unknown, url?: unknown): void;
+    protected firstUpdated(changed: PropertyValues<this>): void;
+    protected syncForm(): void;
+    protected updated(changed: PropertyValues<this>): void;
+    /**
+     * Enter commits, then submits the host's form: the native control sits in a shadow root, so
+     * implicit submission cannot reach it. Waits a task so `lintje-form` can prevent it.
+     */
+    protected submitOnEnter(event: KeyboardEvent, commit: () => void): void;
+    formResetCallback(): void;
+}

package/dist-elements/types/components/inputs/tag-input/tag-input.d.ts

@@ -0,0 +1,61 @@
+/**
+ * `<lintje-tag-input>` — free keywords as chips in one field. Enter, a comma, a paste with commas
+ * or leaving the field makes chips; a duplicate lights up its chip and is said instead of being
+ * added. With `.options` it also suggests options, and still takes a word that is not among them.
+ * A chip's cross is its one control: the arrows walk the crosses, Backspace and Delete remove.
+ *
+ * Events: `lintje-change`; with a `name` also the composed `lintje-values-change`.
+ */
+import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import '../../../primitives/popover/popover.js';
+import { LintjeInputElement } from '../shared/input.js';
+import type { FilterOption } from '../../../types.js';
+export declare function splitWords(text: string): string[];
+/** The list after adding `words`, and the existing word each duplicate hit. Case-insensitive. */
+export declare function addWords(current: string[], words: string[]): {
+    next: string[];
+    added: string[];
+    duplicate: string | null;
+};
+export declare class LintjeTagInput extends LintjeInputElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    value: string[];
+    /** A chosen option enters `value` by its value and shows by its label. */
+    options?: FilterOption[];
+    placeholder: string;
+    stacked: boolean;
+    protected text: string;
+    protected flash: string | null;
+    protected news: string;
+    protected active: number;
+    /** Off after Escape, on again with the next keystroke. */
+    protected suggesting: boolean;
+    disconnectedCallback(): void;
+    private get input();
+    private labelOf;
+    private get suggestions();
+    private get listOpen();
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private resolve;
+    private add;
+    private light;
+    private removeChip;
+    private focusChip;
+    private onInput;
+    private onPaste;
+    private onKeydown;
+    private onChipKeydown;
+    /** Leaving the field makes the typed text a chip; moving to one of its own chips is not leaving. */
+    private onBlur;
+    private onPopoverClose;
+    private renderChip;
+    private renderSuggestions;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-tag-input': LintjeTagInput;
+    }
+}

package/dist-elements/types/components/inputs/text-editor/markdown.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The text editor's two directions: markdown into the surface, the surface back into markdown.
+ * Five formats only; the markdown written is the subset read, so a value survives a round trip.
+ * `domToMarkdown()` reads any DOM, so pasted HTML is filtered through it. Pure, no element.
+ */
+export declare function safeHref(url: string | null | undefined): string | null;
+export declare function inlineToHtml(source: string): string;
+export declare function markdownToHtml(markdown: string | null | undefined): string;
+export declare function domToMarkdown(root: Node): string;
+export declare function reduceHtml(html: string): string;

package/dist-elements/types/components/inputs/text-editor/text-editor.d.ts

@@ -0,0 +1,54 @@
+/**
+ * `<lintje-text-editor>` — formatted text (bold, italic, one heading, a bullet list, a link);
+ * the value is markdown (`markdown.ts`). Formatting uses `document.execCommand`, the one API
+ * every browser has for a `contenteditable` selection; the markdown writer reads only the five
+ * formats from whatever markup it leaves. Commits when the surface loses focus, if changed.
+ * A link is http(s), mailto, tel or relative; any other scheme is dropped.
+ *
+ * Events: `lintje-change` with the markdown; with a `name` also the composed `lintje-values-change`.
+ */
+import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeInputElement } from '../shared/input.js';
+import '../../../primitives/popover/popover.js';
+import '../../../primitives/button/button.js';
+import '../text-input/text-input.js';
+export type EditorFormat = 'bold' | 'italic' | 'heading' | 'list' | 'link';
+export declare class LintjeTextEditor extends LintjeInputElement {
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    value: string;
+    protected active: ReadonlySet<EditorFormat>;
+    protected collapsed: boolean;
+    protected toolIndex: number;
+    protected linkOpen: boolean;
+    protected linkError: string;
+    private shown;
+    private range;
+    private get surface();
+    private selection;
+    private selectedRange;
+    private readonly onSelectionChange;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private formatsAt;
+    protected updated(changed: PropertyValues<this>): void;
+    private settle;
+    private onFocusOut;
+    private restore;
+    private apply;
+    private link;
+    private onLinkChange;
+    private onLinkKeydown;
+    private onLinkFocusOut;
+    private onLinkClose;
+    private onSurfaceKeydown;
+    private onPaste;
+    private onToolbarKeydown;
+    private renderTool;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-text-editor': LintjeTextEditor;
+    }
+}

package/dist-elements/types/components/inputs/text-input/text-input.d.ts

@@ -0,0 +1,47 @@
+/**
+ * `<lintje-text-input>` — a text field: `clearable`, `error`, `readonly`, and `type` text,
+ * search, password or email. It checks nothing itself; the host sets `error`.
+ *
+ * It commits on `change` (leaving the field, Enter), since every commit is a URL change and a
+ * tile reload. `commit="input"` bundles keystrokes and commits 300 ms after the last. The same
+ * value is never committed twice. Events: `lintje-change`, and `lintje-values-change` with `name`.
+ */
+import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import '../../../primitives/button/button.js';
+import { LintjeFormInputElement } from '../shared/input.js';
+export type TextInputType = 'text' | 'search' | 'password' | 'email';
+/** When a typed value is committed: on leaving the field, or 300 ms after the last key. */
+export type CommitOn = 'change' | 'input';
+export declare class LintjeTextInput extends LintjeFormInputElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    value: string;
+    placeholder: string;
+    /** Shows the clear button once there is text. A search always has it. */
+    clearable: boolean;
+    stacked: boolean;
+    type: TextInputType;
+    /** The attribute `commit`; `commit()` is the method every input commits through. */
+    commitOn: CommitOn;
+    /** Passed to the native input as is. */
+    autocomplete: string;
+    protected revealed: boolean;
+    private readonly typing;
+    protected get formValue(): string;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private send;
+    private onInput;
+    private change;
+    private onKeydown;
+    private clear;
+    private reveal;
+    protected renderFoot(): TemplateResult | typeof nothing;
+    private get inputType();
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-text-input': LintjeTextInput;
+    }
+}

package/dist-elements/types/components/inputs/textarea/textarea.d.ts

@@ -0,0 +1,58 @@
+/**
+ * `<lintje-textarea>` — the multi-line text field: three to twelve lines (`rows` sets the least),
+ * with a counter when there is a `maxlength`. `variant="plain"` drops the field's box and its
+ * focus ring, takes the type of where it stands and fills its height, for a surface that frames
+ * the text and draws the ring itself (`lintje-translator`). Typing past the limit is allowed (a paste lands whole); the field
+ * shows the error, alerted once as the text crosses the limit. The counter is read out from 90 %
+ * of the limit on.
+ *
+ * The counter is `part="counter"`, so a surface can stand it on its own line.
+ *
+ * Commits like `lintje-text-input`; Ctrl+Enter commits and submits a host's form.
+ * Events: `lintje-change`, and `lintje-values-change` with a `name`.
+ */
+import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeFormInputElement } from '../shared/input.js';
+import type { CommitOn } from '../text-input/text-input.js';
+export declare function counterText(length: number, limit: number): string;
+export declare function limitMessage(length: number, limit: number | undefined): string;
+export declare function counterSpeaks(length: number, limit: number): boolean;
+export type TextareaVariant = 'field' | 'plain';
+export declare class LintjeTextarea extends LintjeFormInputElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    value: string;
+    placeholder: string;
+    /** The limit the counter counts to. */
+    maxlength?: number;
+    /** The attribute `commit`; `commit()` is the method every input commits through. */
+    commitOn: CommitOn;
+    stacked: boolean;
+    /** The least number of lines the field shows. */
+    rows: number;
+    /** `field` (default): the bordered field; `plain`: no box, the type of where it stands. */
+    variant: TextareaVariant;
+    private readonly typing;
+    private get counterId();
+    private get control();
+    protected get formValue(): string;
+    private get message();
+    protected get footMessage(): string;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private send;
+    private take;
+    private onInput;
+    private onChange;
+    private onKeydown;
+    protected updated(changed: PropertyValues<this>): void;
+    protected get describedBy(): string | typeof nothing;
+    private get counterShown();
+    protected renderFoot(): TemplateResult | typeof nothing;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-textarea': LintjeTextarea;
+    }
+}

package/dist-elements/types/components/inputs/time-input/time-format.d.ts

@@ -0,0 +1,22 @@
+/** The time input's arithmetic: a 24-hour clock time without day or zone, written as `HH:MM`. */
+export type ParsedTime = {
+    kind: 'empty';
+} | {
+    kind: 'invalid';
+} | {
+    kind: 'ok';
+    time: string;
+};
+/** `HH:MM` from an hour and a minute, or `null` when that is no time on the clock. */
+export declare function toTime(hour: number, minute: number): string | null;
+/** Minutes since midnight, or `null` when the string is not `HH:MM`. */
+export declare function toMinutes(time: string | null | undefined): number | null;
+export declare const isTime: (value: string | null | undefined) => value is string;
+/** Minutes since midnight → `HH:MM`, round the clock: 1440 is 00:00 again. */
+export declare function fromMinutes(minutes: number): string;
+/** Reads typed text: `9` → 09:00, `930` → 09:30, `1435`, `14.35` and `14:35` → 14:35. */
+export declare function parseTime(text: string): ParsedTime;
+export declare function addMinutes(time: string, count: number): string;
+/** The time on the clock now, rounded to the nearest `step` minutes: 10:52 with 15 is 10:45. */
+export declare function nowRounded(step: number, now?: Date): string;
+export declare function clampTime(time: string, min?: string | null, max?: string | null): string;

package/dist-elements/types/components/inputs/time-input/time-input.d.ts

@@ -0,0 +1,38 @@
+/**
+ * `<lintje-time-input>` — a time of day, `HH:MM` on a 24-hour clock, or `null` when empty.
+ * Typed text is read on leaving the field or Enter (`time-format.ts`). It checks its own text
+ * and shows a message in place of the hint; a host's `error` wins. It knows no day or time zone.
+ *
+ * Events: `lintje-change` with `HH:MM` or `null`; with a `name` also `lintje-values-change`.
+ */
+import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeInputElement } from '../shared/input.js';
+export declare class LintjeTimeInput extends LintjeInputElement {
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    value: string | null;
+    /** The earliest time, `HH:MM`. */
+    min?: string;
+    /** The latest time, `HH:MM`. */
+    max?: string;
+    /** The minutes PageUp and PageDown move. */
+    step: number;
+    placeholder: string;
+    stacked: boolean;
+    hint: string | undefined;
+    protected text: string;
+    protected problem: string;
+    private get message();
+    protected get footMessage(): string;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private outOfBounds;
+    private choose;
+    private onChange;
+    private onKeydown;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-time-input': LintjeTimeInput;
+    }
+}

package/dist-elements/types/components/inputs/toggle/toggle.d.ts

@@ -0,0 +1,20 @@
+/**
+ * `<lintje-toggle>` — a switch for immediate effect: it commits when switched, never in a form.
+ * A value that waits for a button is a checkbox.
+ *
+ * Events: `lintje-change`; with a `name` also the composed `lintje-values-change`.
+ */
+import { type PropertyDeclarations, type TemplateResult } from 'lit';
+import { LintjeInputElement } from '../shared/input.js';
+export declare class LintjeToggle extends LintjeInputElement {
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    checked: boolean;
+    private change;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-toggle': LintjeToggle;
+    }
+}

package/dist-elements/types/components/layout/expander/expander.d.ts

@@ -0,0 +1,38 @@
+/**
+ * `<lintje-expander>` — a title you press; what is slotted under it shows or hides.
+ *
+ * Shares its disclosure (`shared/disclosure.ts`) with `lintje-explainer` (rule 2). Closed, the
+ * content stays in the DOM, out of the tab order and the accessibility tree. What is slotted in
+ * `actions` stands beside the title, outside its button: a few icon buttons about the content.
+ * `leading` puts the chevron before the title and the content in line with the title's text, for
+ * a stack of expanders that read as rows. `columns` sets the title in a column of its own
+ * (`--lintje-expander-label`) with the content beside it, as rows of text do beside their speaker;
+ * a narrow expander stacks them again.
+ *
+ * Events: `lintje-toggle` (open, after the reader pressed the title).
+ */
+import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+export declare class LintjeExpander extends LintjeGridItemElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    heading: string;
+    subtitle?: string;
+    /** An icon file name. Decorative. */
+    icon?: string;
+    open: boolean;
+    /** No surface of its own: an expander inside a tile is not a second card. */
+    flat: boolean;
+    /** The chevron before the title, the content under the title's text. */
+    leading: boolean;
+    /** The title in a column of its own, the content beside it. */
+    columns: boolean;
+    protected updated(changed: PropertyValues<this>): void;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-expander': LintjeExpander;
+    }
+}

package/dist-elements/types/components/layout/split-pane/split-pane.d.ts

@@ -0,0 +1,58 @@
+/**
+ * `<lintje-split-pane>` — two panels side by side with a split the reader moves.
+ *
+ * Without dragging (WCAG 2.5.7): a click on the strip lifts the split, and the next click places
+ * it where it lands; Escape or a click outside puts it back. A double click returns to 50/50.
+ *
+ * Below 768 px there are never two panels: a `<lintje-segmented>` chooses which one shows. That
+ * choice is `pane`; a host that keeps it in the URL sets `pane` back.
+ *
+ * Events: `lintje-split-change` (the percentage), `lintje-pane-change` (`'start'` | `'end'`).
+ */
+import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeElement } from '../../../core/element.js';
+import '../../inputs/segmented/segmented.js';
+export type SplitPaneSide = 'start' | 'end';
+export declare const SPLIT_STEP = 5;
+export declare const SPLIT_RESET = 50;
+export declare function clampSplit(value: number, min: number, max: number): number;
+export declare function splitFromPointer(clientX: number, left: number, width: number, min: number, max: number): number;
+export declare function splitFromKey(key: string, value: number, min: number, max: number): number | null;
+export declare class LintjeSplitPane extends LintjeElement {
+    #private;
+    static styles: import("lit").CSSResult;
+    static properties: PropertyDeclarations;
+    /** The first panel's share, in percent. */
+    value: number;
+    min: number;
+    max: number;
+    /** Where the split is remembered in `localStorage`. Without it, nothing is stored. */
+    storageKey?: string;
+    /** The two panels' names, for the phone's choice. */
+    startLabel: string;
+    endLabel: string;
+    pane: SplitPaneSide;
+    protected dragging: boolean;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private commit;
+    private get block();
+    private readonly onPointerDown;
+    private splitAt;
+    private readonly onPointerMove;
+    private readonly onPointerUp;
+    /** The click after the lifting one places the split where it lands. */
+    private readonly onPlace;
+    private readonly onPlacedClick;
+    /** A press outside the element puts the split back. */
+    private readonly onOutside;
+    private cancelLift;
+    disconnectedCallback(): void;
+    private readonly onKeydown;
+    private onPaneChange;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-split-pane': LintjeSplitPane;
+    }
+}

package/dist-elements/types/components/layout/tabs/tabs.d.ts

@@ -0,0 +1,69 @@
+/**
+ * `<lintje-tabs>` — switches between panels slotted under each tab's `value`. The host holds
+ * `value`; the tabs only ask. A modified click on a link tab is the browser's.
+ * The row is one tab stop: arrows choose at once, and a disabled tab is reached but not chosen.
+ * `variant="panel"` draws large tabs that head a panel: each with an icon and a hint, the chosen
+ * one running into the panel below; on a phone the icon stands above the label and the hint goes.
+ * When every tab is a link, the row is a `<nav>` of links, the chosen one `aria-current="page"`,
+ * with the same look: pages are no tabs, and the content under it is the page's, not a tabpanel.
+ *
+ * Events: `lintje-tab-change` (the value), `lintje-navigate` `{ href }` for a tab with an `href`.
+ */
+import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { LintjeElement } from '../../../core/element.js';
+import '../../../primitives/badge/badge.js';
+export interface TabItem {
+    /** What `lintje-tab-change` carries and the name of the panel's slot. */
+    value: string;
+    label: string;
+    href?: string;
+    count?: number;
+    /** A word beside the label ("Nieuw"); two words at most. */
+    badge?: string;
+    /** The panel variant's icon, by file name. */
+    icon?: string;
+    /** The panel variant's line under the label, hidden on a phone. */
+    hint?: string;
+    disabled?: boolean;
+}
+export type TabsVariant = 'line' | 'panel';
+export declare function scrollEdges(scrollLeft: number, clientWidth: number, scrollWidth: number): {
+    start: boolean;
+    end: boolean;
+};
+export declare function scrollToShow(tabLeft: number, tabWidth: number, scrollLeft: number, clientWidth: number): number;
+export declare class LintjeTabs extends LintjeElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    tabs: TabItem[];
+    /** The chosen tab's value; the first tab when unset. */
+    value?: string;
+    label: string;
+    /** `line` (default): a row over the content; `panel`: large tabs that head a bordered panel. */
+    variant: TabsVariant;
+    protected edges: {
+        start: boolean;
+        end: boolean;
+    };
+    private onPanelFocus;
+    get selectedIndex(): number;
+    /** Every tab a link: the row is navigation between pages. */
+    private get isNav();
+    private get list();
+    private tabElement;
+    disconnectedCallback(): void;
+    private choose;
+    private onClick;
+    private onKeydown;
+    private measureEdges;
+    protected firstUpdated(): void;
+    protected updated(changed: PropertyValues<this>): void;
+    private renderTab;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-tabs': LintjeTabs;
+    }
+}

package/dist-elements/types/components/map/map-tile/map-tile.d.ts

@@ -0,0 +1,41 @@
+/**
+ * `<lintje-map-tile>` — a map in its tile. The map shows a new layer at once and expects the host
+ * to confirm it in the next `data`. `tile.expandable` shows the same map again in the modal; the
+ * modal's own events stop here.
+ *
+ * Events: `lintje-mark-select` `{id, label, href?}` (`href` is the one the server minted on that
+ * mark) and `lintje-layer-change` (the chosen layer's `value`). Undoing a selection is
+ * `lintje-mark-select` with `id: null` and `data.clearHref`, so a page that keeps the selection
+ * in the URL can drop it.
+ */
+import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { type FrameSettings } from '../../../core/element.js';
+import { LintjeContentTileElement } from '../../shared/content-tile.js';
+import '../../feedback/announcement/announcement.js';
+import '../../../primitives/tile/tile.js';
+import type { MapTileViewData } from '../../../types.js';
+export declare class LintjeMapTile extends LintjeContentTileElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    data?: MapTileViewData | null;
+    /** The chosen layer, shown before the host confirms it. */
+    layer?: string;
+    protected get dataSettings(): FrameSettings | undefined;
+    disconnectedCallback(): void;
+    protected expandChanged(open: boolean): void;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private png;
+    private csv;
+    protected render(): TemplateResult | typeof nothing;
+    private content;
+    /** Refocuses the chosen mark so clearing does not drop a keyboard user at the top; the map area
+     * takes the focus when the mark is gone after a redraw. */
+    private focusMark;
+    private mapOptions;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-map-tile': LintjeMapTile;
+    }
+}