lintje 0.3.0 → 0.5.0

package/dist-elements/types/bundle/actions.d.ts

@@ -1,8 +1,8 @@
 /** The actions category (Knoppen en iconen): importing it defines its tags. */
-import '../primitives/button/button.js';
-import '../primitives/icon-button/icon-button.js';
+import '../components/actions/button/button.js';
+import '../components/actions/icon-button/icon-button.js';
 import '../components/actions/menu-button/menu-button.js';
 import '../components/actions/copy-button/copy-button.js';
 import '../components/actions/qr-code/qr-code.js';
-import '../icons/icon/icon.js';
+import '../components/actions/icon/icon.js';
 import '../components/actions/logo/logo.js';

package/dist-elements/types/bundle/content.d.ts

@@ -2,9 +2,11 @@
 import '../components/content/prose/prose.js';
 import '../components/content/code/code.js';
 import '../components/content/highlight/highlight.js';
+import '../components/content/token-value/token-value.js';
 import '../components/content/translator/translator.js';
 import '../components/content/audio-player/audio-player.js';
 import '../components/content/video-player/video-player.js';
 import '../components/content/transcript/transcript.js';
+import '../components/content/log-viewer/log-viewer.js';
 import '../components/content/document-viewer/document-viewer.js';
 import '../components/content/gallery/gallery.js';

package/dist-elements/types/bundle/feedback.d.ts

@@ -4,11 +4,11 @@ import '../components/feedback/toast/toast.js';
 import '../components/feedback/conflict-alert/conflict-alert.js';
 import '../components/feedback/empty-state/empty-state.js';
 import '../components/feedback/error-page/error-page.js';
-import '../primitives/badge/badge.js';
-import '../primitives/status-dot/status-dot.js';
-import '../primitives/spinner/spinner.js';
-import '../primitives/skeleton/skeleton.js';
-import '../primitives/progress-bar/progress-bar.js';
+import '../components/feedback/badge/badge.js';
+import '../components/feedback/status-dot/status-dot.js';
+import '../components/feedback/spinner/spinner.js';
+import '../components/feedback/skeleton/skeleton.js';
+import '../components/feedback/progress-bar/progress-bar.js';
 import '../components/feedback/job-list/job-list.js';
 import '../components/feedback/streaming-text/streaming-text.js';
 import '../components/feedback/ai-label/ai-label.js';

package/dist-elements/types/bundle/index.d.ts

@@ -1,14 +1,4 @@
-/**
- * The bundle: one module a plain HTML page includes; every `lintje-…` tag is registered.
- * `define()` leaves a tag another copy already defined alone. `tokens.css` and `fonts.css` stay
- * files: themes are document-level and a shadow root ignores `@font-face`. A page takes this
- * module or the category/tag entries (`core.ts`, `forms.ts`, `tag/<name>.js`), never both: they
- * do not share module state.
- */
-import '../icons/icon/icon.js';
 export * from './core.js';
-export { LintjeIcon, ICON_NAMES } from '../icons/icon/icon.js';
-export * from '../primitives/index.js';
 export * from '../components/index.js';
 export * from '../components/shared/charts/index.js';
 export { CATEGORIES, SECTIONS, tagsOf } from '../categories.js';
@@ -17,7 +7,7 @@ export type * from '../types.js';
 /** Every tag this bundle defines, for a host that wants to check. */
 export declare const LINTJE_TAGS: readonly string[];
 /** The views a host mounts: the tags that take a `data` object straight from the host. */
-export declare const LINTJE_VIEWS: readonly ['shell', 'page-header', 'filter-bar', 'kpi-row', 'chart', 'data-table', 'announcement', 'map', 'explainer', 'note', 'chat'];
+export declare const LINTJE_VIEWS: readonly ['shell', 'page-header', 'filter-bar', 'kpi-row', 'chart', 'data-table', 'announcement', 'map', 'explainer', 'note', 'chat', 'log-viewer'];
 export type LintjeViewName = (typeof LINTJE_VIEWS)[number];
 /** The tag of a view: `lintje-` plus its name. */
 export declare const tagFor: (view: LintjeViewName) => string;

package/dist-elements/types/bundle/inputs.d.ts

@@ -1,6 +1,7 @@
 /** The inputs category (Invoervelden): importing it defines its tags. */
 import '../components/inputs/field/field.js';
 import '../components/inputs/text-input/text-input.js';
+import '../components/inputs/find/find.js';
 import '../components/inputs/textarea/textarea.js';
 import '../components/inputs/number-input/number-input.js';
 import '../components/inputs/select/select.js';

package/dist-elements/types/bundle/layout.d.ts

@@ -1,7 +1,7 @@
 /** The layout category (Indeling): importing it defines its tags. */
-import '../primitives/grid/grid.js';
-import '../primitives/grid-item/grid-item.js';
-import '../primitives/tile/tile.js';
+import '../components/layout/grid/grid.js';
+import '../components/layout/grid-item/grid-item.js';
+import '../components/layout/tile/tile.js';
 import '../components/layout/tabs/tabs.js';
 import '../components/layout/expander/expander.js';
 import '../components/layout/split-pane/split-pane.js';

package/dist-elements/types/bundle/overlays.d.ts

@@ -2,6 +2,6 @@
 import '../components/overlays/modal/modal.js';
 import '../components/overlays/dialog/dialog.js';
 import '../components/overlays/drawer/drawer.js';
-import '../primitives/popover/popover.js';
-import '../primitives/tooltip/tooltip.js';
+import '../components/overlays/popover/popover.js';
+import '../components/overlays/tooltip/tooltip.js';
 import '../components/overlays/toggletip/toggletip.js';

package/dist-elements/types/categories.d.ts

@@ -9,9 +9,13 @@ export interface Category {
     intro: string;
     /** Tags without `lintje-`, or the id of a style guide section that shows no single tag. */
     elements: readonly string[];
+    /** The composite tags among `elements`; every other tag is a building block. */
+    composite?: readonly string[];
 }
 export declare const CATEGORIES: readonly Category[];
 /** The style guide's sections that show no single tag. */
 export declare const SECTIONS: readonly string[];
+/** Every composite tag, with its prefix. */
+export declare const COMPOSITE: readonly string[];
 /** A category's tags, with their prefix. */
 export declare const tagsOf: (category: Category) => string[];

package/dist-elements/types/{primitives → components/actions}/button/button.d.ts

@@ -6,7 +6,7 @@
  * there is a property; focusing the host focuses the inner control.
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
-import { LintjeElement } from '../../core/element.js';
+import { LintjeElement } from '../../../core/element.js';
 export type ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'link' | 'danger' | 'danger-secondary';
 export type ButtonSize = 'regular' | 'compact' | 'chrome';
 export declare class LintjeButton extends LintjeElement {

package/dist-elements/types/components/actions/copy-button/copy-button.d.ts

@@ -9,8 +9,8 @@
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
-import '../../../primitives/icon-button/icon-button.js';
+import '../button/button.js';
+import '../icon-button/icon-button.js';
 import '../../feedback/toast/toast.js';
 export declare class LintjeCopyButton extends LintjeElement {
     static styles: import("lit").CSSResult[];

package/dist-elements/types/{icons → components/actions}/icon/icon.d.ts

@@ -5,8 +5,8 @@
  * through. It takes `src`, else the register, else a loaded file; without any it draws nothing.
  */
 import { nothing, type TemplateResult } from 'lit';
-import { LintjeElement } from '../../core/element.js';
-import { ICONS, type IconGlyph, type IconName } from '../register.js';
+import { LintjeElement } from '../../../core/element.js';
+import { ICONS, type IconGlyph, type IconName } from '../../../icons/register.js';
 export type { IconName, IconGlyph };
 export { ICONS };
 /** The names the bundle carries; every other name is fetched. */

package/dist-elements/types/{primitives → components/actions}/icon-button/icon-button.d.ts

@@ -5,7 +5,7 @@
  * `disabled` keeps it focusable but swallows the press: no listener on the host sees it.
  */
 import { type TemplateResult } from 'lit';
-import { LintjeElement } from '../../core/element.js';
+import { LintjeElement } from '../../../core/element.js';
 export type IconButtonVariant = 'flat' | 'outlined' | 'tile';
 export declare class LintjeIconButton extends LintjeElement {
     static styles: import("lit").CSSResult[];

package/dist-elements/types/components/actions/menu-button/menu-button.d.ts

@@ -9,9 +9,9 @@
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/popover/popover.js';
-import '../../../primitives/spinner/spinner.js';
-import '../../../primitives/tooltip/tooltip.js';
+import '../../overlays/popover/popover.js';
+import '../../feedback/spinner/spinner.js';
+import '../../overlays/tooltip/tooltip.js';
 export interface MenuItem {
     /** What `lintje-action` carries. */
     value: string;
@@ -67,7 +67,10 @@ export declare class LintjeMenuButton extends LintjeElement {
      * flat with `variant="tertiary"` where it repeats, as at the end of every table row.
      */
     icon: boolean;
-    /** An icon file name before the label, saying what the label is a value of (the speed's "1×"). */
+    /**
+     * An icon file name before the label, saying what the label is a value of (the speed's "1×").
+     * Without a `label` the trigger is this icon alone, in a square; `accessible-label` names it.
+     */
     leadingIcon: string;
     disabled: boolean;
     /**

package/dist-elements/types/components/actions/qr-code/qr-code.d.ts

@@ -9,7 +9,7 @@
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
+import '../button/button.js';
 import '../../feedback/toast/toast.js';
 /** The code of `text` as an SVG of its dark modules, one path of horizontal runs. */
 export declare function codeImage(text: string, colour: string): string;

package/dist-elements/types/components/charts/chart/chart.d.ts

@@ -13,7 +13,7 @@ import { LintjeContentTileElement } from '../../shared/content-tile.js';
 import '../../feedback/announcement/announcement.js';
 import '../../tables/data-table/data-table.js';
 import '../../inputs/segmented/segmented.js';
-import '../../../primitives/tile/tile.js';
+import '../../layout/tile/tile.js';
 import type { ChartData } from '../../../types.js';
 type ChartView = 'chart' | 'table';
 export declare class LintjeChart extends LintjeContentTileElement {

package/dist-elements/types/components/charts/explainer/explainer.d.ts

@@ -6,7 +6,7 @@
  */
 import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { type FrameSettings } from '../../../core/element.js';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
 import type { ExplainerData } from '../../../types.js';
 export declare class LintjeExplainer extends LintjeGridItemElement {
     #private;

package/dist-elements/types/components/charts/kpi/kpi.d.ts

@@ -5,9 +5,9 @@
  * `prefers-reduced-motion` both stand at once.
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
-import '../../../primitives/status-dot/status-dot.js';
-import '../../../primitives/skeleton/skeleton.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
+import '../../feedback/status-dot/status-dot.js';
+import '../../feedback/skeleton/skeleton.js';
 import type { KpiGauge, KpiItem, KpiSparkline, ContentStateKind, KpiTrend, KpiVariable } from '../../../types.js';
 type Point = [number, number];
 /** The points of each unbroken run of values: a `null` ends a run (rule 15). */

package/dist-elements/types/components/charts/kpi-row/kpi-row.d.ts

@@ -1,7 +1,7 @@
 /** `<lintje-kpi-row>` — the KPI row: one grid, the KPIs staggered in from left to right. */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
 import { type FrameSettings } from '../../../core/element.js';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
 import '../kpi/kpi.js';
 import type { KpiRowData } from '../../../types.js';
 export declare class LintjeKpiRow extends LintjeGridItemElement {

package/dist-elements/types/components/charts/note/note.d.ts

@@ -1,7 +1,7 @@
 /** `<lintje-note>` — the analyst's note ("Toelichting analist"). */
 import { nothing, type PropertyDeclarations, type TemplateResult } from 'lit';
 import { type FrameSettings } from '../../../core/element.js';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
 import type { NoteData } from '../../../types.js';
 export declare class LintjeNote extends LintjeGridItemElement {
     static styles: import("lit").CSSResult[];

package/dist-elements/types/components/chat/chat/chat.d.ts

@@ -12,7 +12,7 @@
  */
 import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement, type FrameSettings } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
+import '../../actions/button/button.js';
 import '../chat-answer/chat-answer.js';
 import '../chat-composer/chat-composer.js';
 import '../chat-message/chat-message.js';

package/dist-elements/types/components/chat/chat-answer/chat-answer.d.ts

@@ -11,9 +11,9 @@
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
-import '../../../primitives/icon-button/icon-button.js';
-import '../../../primitives/spinner/spinner.js';
+import '../../actions/button/button.js';
+import '../../actions/icon-button/icon-button.js';
+import '../../feedback/spinner/spinner.js';
 import '../../feedback/announcement/announcement.js';
 import '../../charts/chart/chart.js';
 import '../chat-strip/chat-strip.js';

package/dist-elements/types/components/chat/chat-composer/chat-composer.d.ts

@@ -12,8 +12,8 @@
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
-import '../../../primitives/icon-button/icon-button.js';
+import '../../actions/button/button.js';
+import '../../actions/icon-button/icon-button.js';
 import '../../inputs/multiselect/multiselect.js';
 import '../../inputs/radio-group/radio-group.js';
 import type { ChatAnswerForm, ChatDraftTerms, ChatSourceData, ChatTermData } from '../../../types.js';

package/dist-elements/types/components/chat/chat-message/chat-message.d.ts

@@ -10,7 +10,7 @@
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/icon-button/icon-button.js';
+import '../../actions/icon-button/icon-button.js';
 import '../chat-composer/chat-composer.js';
 import type { ChatSourceData, ChatTermData, ChatTermRange } from '../../../types.js';
 export declare class LintjeChatMessage extends LintjeElement {

package/dist-elements/types/components/content/audio-player/audio-player.d.ts

@@ -8,13 +8,13 @@
  * `number` (seconds: the reader moved the position), `lintje-play`, `lintje-pause`.
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
-import '../../../primitives/button/button.js';
-import '../../../primitives/skeleton/skeleton.js';
+import '../../actions/button/button.js';
+import '../../feedback/skeleton/skeleton.js';
 import '../../feedback/announcement/announcement.js';
 import '../../actions/menu-button/menu-button.js';
-import { type SpeakerTurn } from './playback.js';
-import { LintjePlayerElement } from './player.js';
-export type { SpeakerTurn } from './playback.js';
+import { type SpeakerTurn } from '../shared/playback.js';
+import { LintjePlayerElement } from '../shared/player.js';
+export type { SpeakerTurn } from '../shared/playback.js';
 export declare class LintjeAudioPlayer extends LintjePlayerElement {
     static styles: import("lit").CSSResult[];
     static properties: PropertyDeclarations;

package/dist-elements/types/components/content/code/code.d.ts

@@ -4,7 +4,7 @@
  * It scrolls sideways by default, because a broken line is a changed line. No syntax colouring.
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
 export declare class LintjeCode extends LintjeGridItemElement {
     static styles: import("lit").CSSResult;
     static properties: PropertyDeclarations;

package/dist-elements/types/components/content/document-viewer/document-viewer.d.ts

@@ -11,8 +11,8 @@
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
-import '../../../primitives/skeleton/skeleton.js';
+import '../../actions/button/button.js';
+import '../../feedback/skeleton/skeleton.js';
 import '../../feedback/empty-state/empty-state.js';
 export type ZoomLevel = number | 'fit';
 export declare const ZOOM_MIN = 50;

package/dist-elements/types/components/content/highlight/highlight.d.ts

@@ -7,7 +7,7 @@
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/tooltip/tooltip.js';
+import '../../overlays/tooltip/tooltip.js';
 export type HighlightKind = 'uncertain' | 'term' | 'match' | 'added' | 'removed';
 export declare class LintjeHighlight extends LintjeElement {
     static styles: import("lit").CSSResult;

package/dist-elements/types/components/content/log-viewer/lines.d.ts

@@ -0,0 +1,33 @@
+/** What the log viewer works out from its lines, apart from drawing them. */
+import type { LogEntry, LogLevel } from '../../../types.js';
+import type { CsvCell } from '../../shared/download.js';
+/** A longer message shows this many lines and a button for the rest. */
+export declare const FOLD_AFTER = 5;
+export declare const FOLD_SHOW = 4;
+export declare const LEVEL_WORD: Record<LogLevel, string>;
+/** The text without terminal codes (CSI colour and cursor, OSC titles); colour carries no meaning here. */
+export declare function plain(text: string): string;
+/** No line says when, how bad or from where: the lines are drawn as plain output. */
+export declare function isRaw(entries: readonly LogEntry[]): boolean;
+/** How often `term` stands in `text`, ignoring case; `term` is lower case. */
+export declare function countHits(text: string, term: string): number;
+export interface Part {
+    text: string;
+    /** The hit's number in the whole log, from 1; absent for the text between hits. */
+    hit?: number;
+}
+/** The text cut at each hit; `first` is the number the first hit in it gets. */
+export declare function splitHits(text: string, term: string, first: number): Part[];
+/** The lines a folded message shows, and how many it hides; `hidden` is 0 for a short one. */
+export declare function fold(text: string): {
+    shown: string;
+    hidden: number;
+};
+/** The time since `start` as `+mm:ss.mmm`; `null` when either moment does not parse. */
+export declare function since(at: string | undefined, start: string | undefined): string | null;
+/** One line as text, as a terminal would show it. */
+export declare function lineText(entry: LogEntry): string;
+export declare const asText: (entries: readonly LogEntry[]) => string;
+export declare const asJson: (entries: readonly LogEntry[]) => string;
+/** The rows of a spreadsheet: one column per field, the message without terminal codes. */
+export declare const csvRows: (entries: readonly LogEntry[]) => CsvCell[][];

package/dist-elements/types/components/content/log-viewer/log-viewer.d.ts

@@ -0,0 +1,117 @@
+/**
+ * `<lintje-log-viewer>` — log lines in a tile, oldest first, that follow the newest while live.
+ *
+ * The host holds the filter (level, search term, "alleen treffers") and the chosen line, keeps
+ * them in the URL and sends only the lines that match; the view, the following and the cleared
+ * view are the element's own. It finds the hits of the term itself and steps through them. It
+ * never guesses: a line without a level has no badge. Lines without time, level or source are
+ * drawn as plain output. A danger action is the host's to confirm.
+ *
+ * Events: `lintje-log-filter-change` `{ level, search, onlyHits }`, `lintje-log-select`
+ * `string | null` (the chosen line), `lintje-log-action` `string` (one of `actions`),
+ * `lintje-log-retry`.
+ */
+import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
+import { type FrameSettings } from '../../../core/element.js';
+import '../../actions/button/button.js';
+import '../../actions/icon-button/icon-button.js';
+import '../../feedback/skeleton/skeleton.js';
+import '../../layout/tile/tile.js';
+import '../../actions/menu-button/menu-button.js';
+import '../../feedback/announcement/announcement.js';
+import '../../inputs/find/find.js';
+import '../../inputs/segmented/segmented.js';
+import '../../inputs/select/select.js';
+import '../code/code.js';
+import '../highlight/highlight.js';
+import { LintjeContentTileElement } from '../../shared/content-tile.js';
+import type { LogViewerData } from '../../../types.js';
+type TimeShown = 'clock' | 'since';
+/** How the filter row fits its own width: all on one line, the level folded to a select, or stacked. */
+type Fit = 'wide' | 'compact' | 'narrow';
+interface View {
+    wrap: boolean;
+    fold: boolean;
+    time: TimeShown;
+    columns: {
+        time: boolean;
+        level: boolean;
+        source: boolean;
+    };
+}
+export declare class LintjeLogViewer extends LintjeContentTileElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    static properties: PropertyDeclarations;
+    data?: LogViewerData;
+    protected view: View;
+    /** The current hit, from 1. */
+    protected hit: number;
+    /** The reader stands at the newest line, so new lines keep them there. */
+    protected following: boolean;
+    /** The first line that came in while the reader looked elsewhere. */
+    protected unreadFrom: string | null;
+    /** The last line hidden by "Venster leegmaken". */
+    protected clearedAfter: string | null;
+    protected unfolded: ReadonlySet<string>;
+    protected opened: ReadonlySet<string>;
+    /** The line the arrow keys stand on. */
+    protected activeId: string | null;
+    protected copied: 'menu' | 'line' | 'link' | null;
+    protected message: string;
+    protected fit: Fit;
+    protected get dataSettings(): FrameSettings | undefined;
+    disconnectedCallback(): void;
+    private get entries();
+    /** The lines after the cleared ones; all of them when the cleared line is no longer sent. */
+    private get shown();
+    private get filter();
+    /** A filter the host answered: an empty answer is "nothing for this filter", not an empty log. */
+    private get filtered();
+    private get term();
+    protected willUpdate(changed: PropertyValues<this>): void;
+    private arrive;
+    protected updated(changed: PropertyValues<this>): void;
+    private watchFit;
+    private refit;
+    private get log();
+    /** Scrolls the log, never the page: moving the page moves the controls from under the pointer. */
+    private reveal;
+    private readonly onScroll;
+    private toLatest;
+    private say;
+    private askFilter;
+    private select;
+    private get hitCounts();
+    private onStep;
+    private copy;
+    private get fileName();
+    private onViewAction;
+    private onCopyAction;
+    private onMoreAction;
+    /** In a narrow row the three menus are one: what does not fit beside the level folds into "Meer". */
+    private readonly onAnyAction;
+    private viewItems;
+    private copyItems;
+    private moreItems;
+    private readonly onRowsKeydown;
+    protected render(): TemplateResult | typeof nothing;
+    /** Three squares at the height of the fields beside them, so the row has one height. */
+    private renderTools;
+    private renderNotice;
+    private renderFilters;
+    private renderFrame;
+    private renderLines;
+    private get clearedTime();
+    private renderEmpty;
+    private renderRow;
+    private renderCells;
+    private toggle;
+    private renderFoot;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-log-viewer': LintjeLogViewer;
+    }
+}
+export {};

package/dist-elements/types/components/content/prose/prose.d.ts

@@ -5,7 +5,7 @@
  * stands.
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
 export type ProseTone = 'default' | 'muted';
 export declare class LintjeProse extends LintjeGridItemElement {
     static styles: import("lit").CSSResult;

package/dist-elements/types/components/content/token-value/token-value.d.ts

@@ -0,0 +1,42 @@
+/**
+ * `<lintje-token-value>` — what a design token computes to, here and now: a colour as a swatch
+ * and hex, a length in rem also in px, a text style as weight, size and line height.
+ *
+ * The value is read from the computed style, since a token ends in a `color-mix()` or an
+ * `oklch()` of the theme's `--primary`. A change of mode redraws it like any element; a change
+ * of theme is watched on the document.
+ */
+import { type PropertyDeclarations, type TemplateResult } from 'lit';
+import { LintjeElement } from '../../../core/element.js';
+export declare const NO_VALUE = "\u2014";
+/**
+ * A computed sRGB colour as upper-case hex, with its alpha in percent when it is not opaque;
+ * `null` for anything else. Browsers compute to `rgb(14, 61, 110)` or `color(srgb 0.05 0.24 0.43)`.
+ */
+export declare function formatColour(computed: string): string | null;
+export declare class LintjeTokenValue extends LintjeElement {
+    static styles: import("lit").CSSResult;
+    static properties: PropertyDeclarations;
+    /** The custom property to show, with its dashes: `--color-accent`. */
+    name?: string;
+    /** Without the swatch, where the colour already stands beside it, larger. */
+    noSwatch: boolean;
+    private observer?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(): void;
+    /**
+     * Set on the nodes, not bound: the probe exists only after render, and a reactive property
+     * set from `updated()` would schedule a second render per reading.
+     */
+    private reread;
+    /** The CSSOM keeps a valid declaration and drops the rest, so the probe tells what a value is. */
+    private colourOf;
+    private describe;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lintje-token-value': LintjeTokenValue;
+    }
+}

package/dist-elements/types/components/content/transcript/transcript.d.ts

@@ -13,13 +13,13 @@
  */
 import { type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
-import '../../../primitives/button/button.js';
-import '../../../primitives/icon-button/icon-button.js';
+import '../../actions/button/button.js';
+import '../../actions/icon-button/icon-button.js';
 import '../highlight/highlight.js';
 import '../../inputs/textarea/textarea.js';
 import '../../actions/menu-button/menu-button.js';
 import type { MenuEntry } from '../../actions/menu-button/menu-button.js';
-import { type BadgeTone } from '../../../primitives/badge/badge.js';
+import { type BadgeTone } from '../../feedback/badge/badge.js';
 export interface TranscriptSegment {
     id: string;
     /** When it starts, in seconds. */

package/dist-elements/types/components/content/translator/translator.d.ts

@@ -12,7 +12,7 @@
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
 import { LintjeElement } from '../../../core/element.js';
 import '../../inputs/textarea/textarea.js';
-import '../../../primitives/icon-button/icon-button.js';
+import '../../actions/icon-button/icon-button.js';
 export declare class LintjeTranslator extends LintjeElement {
     #private;
     static styles: import("lit").CSSResult;

package/dist-elements/types/components/content/video-player/video-player.d.ts

@@ -11,7 +11,7 @@
  */
 import { type PropertyDeclarations, type TemplateResult } from 'lit';
 import '../../actions/menu-button/menu-button.js';
-import { LintjePlayerElement } from '../audio-player/player.js';
+import { LintjePlayerElement } from '../shared/player.js';
 export interface TimedText {
     start: number;
     text: string;

package/dist-elements/types/components/feedback/announcement/announcement.d.ts

@@ -7,8 +7,8 @@
  */
 import { nothing, type PropertyDeclarations, type PropertyValues, type TemplateResult } from 'lit';
 import { type FrameSettings } from '../../../core/element.js';
-import { LintjeGridItemElement } from '../../../primitives/shared/grid-item-element.js';
-import '../../../primitives/tile/tile.js';
+import { LintjeGridItemElement } from '../../shared/grid-item-element.js';
+import '../../layout/tile/tile.js';
 import type { AnnouncementViewData } from '../../../types.js';
 export declare class LintjeAnnouncement extends LintjeGridItemElement {
     static styles: import("lit").CSSResult[];

package/dist-elements/types/{primitives → components/feedback}/badge/badge.d.ts

@@ -6,8 +6,8 @@
  * as `renderIcon()` / `iconStyles` do.
  */
 import { type CSSResult, type PropertyDeclarations, type TemplateResult } from 'lit';
-import { LintjeElement } from '../../core/element.js';
-import type { Tone } from '../shared/tone.js';
+import { LintjeElement } from '../../../core/element.js';
+import type { Tone } from '../../shared/tone.js';
 export type BadgeTone = Tone;
 export type BadgeVariant = 'label' | 'count' | 'unread';
 export declare const badgeStyles: CSSResult;