material-plus-ui 1.6.0 → 1.7.0

package/dist/internal/data-table.d.ts

@@ -0,0 +1,162 @@
+/**
+ * The arithmetic an `MPDataTable` is made of.
+ *
+ * Here rather than in the component for the reason `internal/mockup.tsx` gives:
+ * a component whose interesting fifty lines are buried in machinery is a
+ * component nobody can read. Ranking two rows, cutting a page out of a list,
+ * working out which rows a Shift-click covers and escaping a comma so a
+ * spreadsheet does not shift a column are four questions with plain answers, and
+ * a file that also has to draw a resize handle is not where they can be found.
+ *
+ * There is no React in this file and nothing in it knows what a column is.
+ * Everything takes plain values and returns plain values, which is also what
+ * makes it the half of the component that can be tested without a browser.
+ */
+/** Which way a column runs when it is sorted. */
+export type MPSortDirection = 'asc' | 'desc';
+/** One key of the sort, and its direction. A sort is a list of these. */
+export interface MPDataTableSort {
+    /** The column's `key`. */
+    key: string;
+    direction: MPSortDirection;
+}
+/**
+ * The default comparison, for the columns that do not bring one.
+ *
+ * Empty sorts last in **both** directions, which is the one asymmetry here and
+ * the one every spreadsheet has: a blank is not the smallest value, it is the
+ * absence of one, and a descending sort whose first screen is forty blanks has
+ * answered a question nobody asked.
+ *
+ * Numbers compare as numbers, dates as instants, booleans with `false` first,
+ * and everything else through the collator — which is `numeric`, so `item2`
+ * comes before `item10` rather than after it.
+ */
+export declare function compareValues(a: unknown, b: unknown, collator: Intl.Collator, descending?: boolean): number;
+/**
+ * Sorts by every key at once, the first key outermost.
+ *
+ * The sort is **stable** — `Array.prototype.sort` has been since ES2019 — which
+ * is what makes a multi-key sort composable: sorting by name and then adding
+ * date to the end of the list leaves rows with the same date in name order,
+ * because that is the order they were already in.
+ *
+ * **The direction goes to `comparatorFor` rather than being applied to what it
+ * hands back.** A machine that reversed the result would reverse everything in
+ * it, and a comparison has parts that must not turn over — an empty cell sorts
+ * last whichever way the column runs. Who reverses what is a policy, and this
+ * function has none.
+ *
+ * `comparatorFor` answers `null` for a key no column claims, so a sort left over
+ * from a column that has since gone is skipped rather than throwing.
+ */
+export declare function sortRows<T>(rows: readonly T[], sort: readonly MPDataTableSort[], comparatorFor: (key: string, direction: MPSortDirection) => ((a: T, b: T) => number) | null): T[];
+/**
+ * What pressing a heading does, given what the sort already says.
+ *
+ * Three states rather than two — ascending, descending, unsorted — because the
+ * order the rows arrived in is a state a reader cannot get back to by pressing
+ * anything if the cycle only has two. That is the opposite of the choice
+ * `MPTreeView`'s single select makes, and for the same reason read the other
+ * way: there, "nothing chosen" is reachable by pressing something else; here it
+ * is not.
+ *
+ * `additive` is what a Shift-press sets. It leaves the column where it already
+ * is in the list rather than moving it to the end, so flipping the second key of
+ * a two-key sort does not quietly make it the first.
+ */
+export declare function nextSort(current: readonly MPDataTableSort[], key: string, additive: boolean): MPDataTableSort[];
+/** Where one page starts and stops, and how many there are. */
+export interface MPPageBounds {
+    /** How many pages the rows come to. Never below `1`. */
+    pages: number;
+    /** The page actually shown, clamped into range. */
+    page: number;
+    /** Index of the first row on it. */
+    start: number;
+    /** One past the last. */
+    end: number;
+}
+/**
+ * The page arithmetic, with the clamp in it.
+ *
+ * The clamp is the whole reason this is a function rather than two expressions
+ * at the call site. A search that cuts a twenty-page table to three leaves the
+ * caller's `page` at fourteen, and a table that answers with an empty screen has
+ * told the reader their search found nothing. The page moves to the last one
+ * that exists instead.
+ */
+export declare function pageBounds(total: number, page: number, pageSize: number): MPPageBounds;
+/**
+ * Every key between two, inclusive, in the order the rows are currently in.
+ *
+ * "Currently" is the point. A Shift-press chooses what the reader can see
+ * between the two rows they pressed, so the range is taken from the sorted,
+ * searched order rather than from the order `items` arrived in — otherwise
+ * shift-pressing two adjacent rows of a sorted table would take in every row
+ * that happens to lie between them in the original array.
+ *
+ * Which of the two keys is the anchor does not matter: dragging up covers the
+ * same rows as dragging down. A key that is no longer in the list — a row the
+ * current search hides — yields nothing rather than the range from one end that
+ * an index of `-1` would quietly produce.
+ */
+export declare function keysBetween(order: readonly string[], from: string, to: string): string[];
+/**
+ * A value as something a query can be matched against.
+ *
+ * `toLocaleLowerCase` and nothing else, which is the fold `MPCombobox`,
+ * `MPCommandPalette` and `MPTreeSelect` already use. A collator that knew about
+ * diacritics would be a second answer to a question this library has answered
+ * one way — and a reader who has learned what the search box in one part of a
+ * product does should not have learned the wrong thing about the rest of it.
+ *
+ * A `Date` is deliberately not formatted. What a reader sees in a cell came out
+ * of the caller's own `render`, and guessing a format the search would agree
+ * with is how a table ends up not finding a date that is on the screen. A column
+ * whose dates should be searchable gives them a `value`.
+ */
+export declare function searchText(value: unknown): string;
+/** Every string a row can be found by, folded once and joined into one haystack. */
+export declare function searchHaystack(values: readonly unknown[]): string;
+/**
+ * One field, quoted only when it has to be.
+ *
+ * The escaping is the whole job here and getting it wrong is silent: a comma
+ * inside a cell shifts every column after it by one, and nobody notices until a
+ * spreadsheet somewhere is off by a column. RFC 4180 is four rules and all four
+ * are in these six lines — a field is quoted if it holds the separator, a quote
+ * or a line break, and a quote inside a quoted field is written twice.
+ *
+ * `null` and `undefined` are empty rather than the words "null" and "undefined",
+ * which is what `String()` would put in the cell.
+ */
+export declare function csvField(value: unknown, separator: string): string;
+export interface MPCsvOptions {
+    /** What goes between fields. `;` for the locales whose spreadsheets expect it. */
+    separator?: string;
+    /**
+     * Writes a byte-order mark in front.
+     *
+     * On by default, and not as a nicety: Excel reads a UTF-8 CSV without one as
+     * the local code page, so every non-ASCII name in the file arrives as
+     * mojibake. Every other reader ignores the mark.
+     */
+    bom?: boolean;
+}
+/** Rows of already-stringable values, as one CSV document. */
+export declare function toCsv(rows: readonly (readonly unknown[])[], options?: MPCsvOptions): string;
+/**
+ * Hands the file to the browser.
+ *
+ * A `blob:` URL and a synthesised press, which is the only way a page can
+ * produce a file the reader keeps. The URL is released on the next frame rather
+ * than straight away: some browsers have not finished reading it when the press
+ * returns, and releasing it too early is a download that silently produces
+ * nothing.
+ */
+export declare function downloadText(text: string, fileName: string, type: string): void;
+/** How wide a column is when neither the caller nor a drag has said. */
+export declare const DEFAULT_COLUMN_WIDTH = 160;
+/** How narrow a drag may make one. Below this the heading is a single letter. */
+export declare const MIN_COLUMN_WIDTH = 48;

package/dist/internal/data-table.js

@@ -0,0 +1 @@
+export function compareValues(e,t,n,o=!1){const r=null==e||""===e,i=null==t||""===t;if(r||i)return r&&i?0:r?1:-1;const a=o?-1:1;return"number"==typeof e&&"number"==typeof t?Number.isNaN(e)||Number.isNaN(t)?Number.isNaN(e)&&Number.isNaN(t)?0:Number.isNaN(e)?1:-1:a*(e-t):"boolean"==typeof e&&"boolean"==typeof t?a*(Number(e)-Number(t)):e instanceof Date&&t instanceof Date?a*(e.getTime()-t.getTime()):a*n.compare(String(e),String(t))}export function sortRows(e,t,n){const o=[];for(const e of t){const t=n(e.key,e.direction);t&&o.push(t)}return 0===o.length?e:[...e].sort((e,t)=>{for(const n of o){const o=n(e,t);if(0!==o)return o}return 0})}export function nextSort(e,t,n){const o=e.find(e=>e.key===t),r=void 0===o?"asc":"asc"===o.direction?"desc":null;return n?null===r?e.filter(e=>e.key!==t):void 0===o?[...e,{key:t,direction:r}]:e.map(e=>e.key===t?{key:t,direction:r}:e):null===r?[]:[{key:t,direction:r}]}export function pageBounds(e,t,n){const o=Math.max(1,Math.floor(n)),r=Math.max(1,Math.ceil(e/o)),i=Math.min(Math.max(Math.floor(t),1),r),a=(i-1)*o;return{pages:r,page:i,start:a,end:Math.min(a+o,e)}}export function keysBetween(e,t,n){const o=e.indexOf(t),r=e.indexOf(n);return-1===o||-1===r?[]:e.slice(Math.min(o,r),Math.max(o,r)+1)}export function searchText(e){return null==e||"object"==typeof e?"":String(e).toLocaleLowerCase()}export function searchHaystack(e){return e.map(searchText).join("\0")}export function csvField(e,t){if(null==e)return"";const n=e instanceof Date?e.toISOString():"object"==typeof e?JSON.stringify(e):String(e);return/["\r\n]/.test(n)||n.includes(t)?`"${n.replaceAll('"','""')}"`:n}export function toCsv(e,t={}){const{separator:n=",",bom:o=!0}=t,r=e.map(e=>e.map(e=>csvField(e,n)).join(n)).join("\r\n");return o?`\ufeff${r}`:r}export function downloadText(e,t,n){const o=URL.createObjectURL(new Blob([e],{type:n})),r=document.createElement("a");r.href=o,r.download=t,r.rel="noopener",r.style.display="none",document.body.append(r),r.click(),r.remove(),requestAnimationFrame(()=>URL.revokeObjectURL(o))}export const DEFAULT_COLUMN_WIDTH=160;export const MIN_COLUMN_WIDTH=48;

package/dist/internal/density.d.ts

@@ -0,0 +1,9 @@
+import type { MPDensity, MPSize } from '../types.js';
+/** The control height at a rung, tightened by a density step. */
+export declare function controlHeight(size: MPSize, density?: MPDensity): string;
+/** The room inside a sheet at a rung, tightened by a density step. */
+export declare function sheetPad(size: MPSize, density?: MPDensity): string;
+/** The same, sideways only. */
+export declare function sheetPadX(size: MPSize, density?: MPDensity): string;
+/** And the other axis. */
+export declare function sheetPadY(size: MPSize, density?: MPDensity): string;

package/dist/internal/density.js

@@ -0,0 +1 @@
+import{CONTROL_HEIGHT as p,SHEET_PAD as x,SHEET_PAD_X as t,SHEET_PAD_Y as h}from"./scale.js";const e={xs:["h-7","h-6","h-6"],sm:["h-9","h-8","h-7"],md:["h-13","h-12","h-11"],lg:["h-15","h-14","h-13"],xl:["h-17","h-16","h-15"]};export function controlHeight(x,t=0){return 0===t?p[x]:e[x][-t-1]}const n={xs:["p-2","p-1.5","p-1.5"],sm:["p-2.5","p-2","p-1.5"],md:["p-3.5","p-3","p-2.5"],lg:["p-4.5","p-4","p-3.5"],xl:["p-5.5","p-5","p-4.5"]},r={xs:["px-2","px-1.5","px-1.5"],sm:["px-2.5","px-2","px-1.5"],md:["px-3.5","px-3","px-2.5"],lg:["px-4.5","px-4","px-3.5"],xl:["px-5.5","px-5","px-4.5"]},s={xs:["py-2","py-1.5","py-1.5"],sm:["py-2.5","py-2","py-1.5"],md:["py-3.5","py-3","py-2.5"],lg:["py-4.5","py-4","py-3.5"],xl:["py-5.5","py-5","py-4.5"]};export function sheetPad(p,t=0){return 0===t?x[p]:n[p][-t-1]}export function sheetPadX(p,x=0){return 0===x?t[p]:r[p][-x-1]}export function sheetPadY(p,x=0){return 0===x?h[p]:s[p][-x-1]}

package/dist/internal/elevation.d.ts

@@ -0,0 +1,26 @@
+import type { MPElevation, MPVariant } from '../types.js';
+/**
+ * The five weights of `CONTAINER_SURFACE` said as a height instead, one row per
+ * MD3 level.
+ *
+ * A tone **and** a shadow per row, which is what makes an `elevation` prop
+ * possible at all. The `elevated` row of the variant table is this table's level
+ * 1, written twice because the two props are two different questions and neither
+ * should have to resolve the other to answer its own.
+ *
+ * Levels 4 and 5 share `surface-container-high` and `surface-container-highest`
+ * with the levels under them because the specification runs out of container
+ * roles before it runs out of levels. Inventing a sixth tone to keep the columns
+ * tidy would be inventing a colour role.
+ */
+export declare const ELEVATION_SURFACE: Record<MPElevation, string>;
+/**
+ * What a container paints, from whichever of the two props answered.
+ *
+ * A level wins where one was given, and takes the tone with it — so `variant` is
+ * left holding only what a level does not describe, which is the hairline. Two
+ * props writing one `background-color` would otherwise be settled by the order
+ * two class names happened to reach the generated stylesheet, which is not a
+ * decision anybody made.
+ */
+export declare function containerSurface(variant: MPVariant, elevation: MPElevation | undefined): string;

package/dist/internal/elevation.js

@@ -0,0 +1 @@
+import{CONTAINER_SURFACE as o}from"./surface.js";export const ELEVATION_SURFACE={0:"bg-mp-surface shadow-none",1:"shadow-mp-1 bg-mp-surface-container-low",2:"shadow-mp-2 bg-mp-surface-container",3:"shadow-mp-3 bg-mp-surface-container-high",4:"shadow-mp-4 bg-mp-surface-container-high",5:"shadow-mp-5 bg-mp-surface-container-highest"};export function containerSurface(r,e){return void 0===e?o[r]:"outlined"===r?`border-mp-outline-variant border ${ELEVATION_SURFACE[e]}`:ELEVATION_SURFACE[e]}

package/dist/internal/highlight.d.ts

@@ -0,0 +1,96 @@
+/**
+ * The grammar engine behind `MPCodeBlock`, and the only thing in this library
+ * that is *loaded* rather than imported.
+ *
+ * highlight.js is the second runtime dependency the package has, and it is here
+ * for a reason no amount of hand-written regex answers: colouring a language
+ * means knowing that language, and there are thirty-four of them here. It is
+ * reached through `highlight.js/lib/core` plus one module per language, never
+ * through the package root — which is all hundred and ninety at once.
+ *
+ * **Every one of those specifiers sits behind an `import()`, and that is the
+ * whole design.** A bundler resolves it at build time and emits it as its own
+ * chunk, so a page that renders an `MPCodeBlock` with `highlight={false}`
+ * downloads none of it, and a page that colours TypeScript downloads the core
+ * and TypeScript and not the other thirty-three. Done with a static import the
+ * component would spend forty kilobytes before drawing a character.
+ *
+ * It is a real `dependencies` entry rather than an optional peer because a
+ * specifier a bundler cannot resolve fails the **whole** build rather than the
+ * part that would have used it: the bundler walks and resolves this module
+ * while it is still deciding whether to keep it. An optional peer would mean
+ * `import { MPButton } from 'material-plus-ui'` breaking for anyone who had not
+ * installed a syntax highlighter.
+ *
+ * What comes back out of here is not HTML. highlight.js emits a string of
+ * nested `<span>`s, and the block needs *lines* — a line is what carries a
+ * number, a prompt and a place in the scroll — so `tokenize` turns that string
+ * into runs of text with a class on them, split at every newline. Which is also
+ * why nothing in this library ever writes `dangerouslySetInnerHTML`.
+ */
+/** One run of text with a single colour: the innermost span highlight.js drew. */
+export interface MPCodeToken {
+    text: string;
+    /** The class it was drawn under — `hljs-keyword`, `hljs-title function_`. */
+    token?: string;
+}
+/** One line of code, as the runs it is made of. An empty array is a blank line. */
+export type MPCodeLine = MPCodeToken[];
+/** The core, and what it hands `registerMPLanguage`. Opaque here; only hljs reads them. */
+type Hljs = typeof import('highlight.js/lib/core').default;
+type LanguageDefinition = Parameters<Hljs['registerLanguage']>[1];
+/**
+ * Teaches `MPCodeBlock` a language the built-in set does not have.
+ *
+ * The same arrangement `registerMPMessages` makes for the eighteen languages
+ * the library does not ship, and for the same reason: highlight.js knows a
+ * hundred and ninety grammars, a documentation site uses six, and the
+ * thirty-four here are a guess at which six. Registering is how an Elixir
+ * project or a Nix flake gets coloured without the other hundred and fifty
+ * being in anybody's build.
+ *
+ * ```ts
+ * import { registerMPLanguage } from 'material-plus-ui';
+ * import elixir from 'highlight.js/lib/languages/elixir';
+ *
+ * registerMPLanguage('elixir', elixir);
+ * ```
+ *
+ * Call it at module scope. A language registered after a block has drawn does
+ * not repaint that block — nothing here re-renders on its own — but every block
+ * mounted after it sees it.
+ *
+ * @param name What `language` will be written as. Registering a name the
+ *   library already has replaces it.
+ * @param definition The default export of a `highlight.js/lib/languages/*`
+ *   module.
+ */
+export declare function registerMPLanguage(name: string, definition: LanguageDefinition): void;
+/** The canonical name a caller's spelling means, whether or not it can be loaded. */
+export declare function canonicalLanguage(language: string | undefined): string | null;
+/**
+ * Colours `code`, or answers `null` when the language is unknown.
+ *
+ * The block is coloured whole and split afterwards, never a line at a time: a
+ * block comment, a template literal and a heredoc all span lines, and a
+ * highlighter handed one line at a time reads the second line of a comment as
+ * code.
+ */
+export declare function highlightCode(code: string, language: string): Promise<MPCodeLine[] | null>;
+/**
+ * highlight.js's own markup, as lines of coloured runs.
+ *
+ * The output is a strictly nested tree of `<span class="…">` with escaped text
+ * between, and a span may cross a newline — which is exactly why this exists
+ * rather than a `split('\n')` over the string. Walking it keeps the open class
+ * across the break and reopens it on the next line.
+ *
+ * Only the innermost class survives a nesting. In the browser that is the one
+ * on the element the text actually sits in, so it is the one whose colour
+ * applies; keeping the ancestors would put two equally specific rules on one
+ * run and let stylesheet order decide the colour.
+ */
+export declare function tokenize(html: string): MPCodeLine[];
+/** The same shape with no colour in it: what a block draws before its chunk lands. */
+export declare function plainLines(code: string): MPCodeLine[];
+export {};

package/dist/internal/highlight.js

@@ -0,0 +1 @@
+const i={bash:()=>import("highlight.js/lib/languages/bash"),c:()=>import("highlight.js/lib/languages/c"),cpp:()=>import("highlight.js/lib/languages/cpp"),csharp:()=>import("highlight.js/lib/languages/csharp"),css:()=>import("highlight.js/lib/languages/css"),diff:()=>import("highlight.js/lib/languages/diff"),dockerfile:()=>import("highlight.js/lib/languages/dockerfile"),go:()=>import("highlight.js/lib/languages/go"),graphql:()=>import("highlight.js/lib/languages/graphql"),ini:()=>import("highlight.js/lib/languages/ini"),java:()=>import("highlight.js/lib/languages/java"),javascript:()=>import("highlight.js/lib/languages/javascript"),json:()=>import("highlight.js/lib/languages/json"),kotlin:()=>import("highlight.js/lib/languages/kotlin"),less:()=>import("highlight.js/lib/languages/less"),lua:()=>import("highlight.js/lib/languages/lua"),makefile:()=>import("highlight.js/lib/languages/makefile"),markdown:()=>import("highlight.js/lib/languages/markdown"),objectivec:()=>import("highlight.js/lib/languages/objectivec"),perl:()=>import("highlight.js/lib/languages/perl"),php:()=>import("highlight.js/lib/languages/php"),plaintext:()=>import("highlight.js/lib/languages/plaintext"),powershell:()=>import("highlight.js/lib/languages/powershell"),python:()=>import("highlight.js/lib/languages/python"),r:()=>import("highlight.js/lib/languages/r"),ruby:()=>import("highlight.js/lib/languages/ruby"),rust:()=>import("highlight.js/lib/languages/rust"),scss:()=>import("highlight.js/lib/languages/scss"),shell:()=>import("highlight.js/lib/languages/shell"),sql:()=>import("highlight.js/lib/languages/sql"),swift:()=>import("highlight.js/lib/languages/swift"),typescript:()=>import("highlight.js/lib/languages/typescript"),xml:()=>import("highlight.js/lib/languages/xml"),yaml:()=>import("highlight.js/lib/languages/yaml")},t={"c++":"cpp",cc:"cpp",cjs:"javascript",console:"bash",cs:"csharp",cts:"typescript",docker:"dockerfile",golang:"go",gql:"graphql",h:"cpp",hpp:"cpp",htm:"xml",html:"xml",js:"javascript",jsx:"javascript",kt:"kotlin",kts:"kotlin",md:"markdown",mdx:"markdown",mjs:"javascript",mm:"objectivec",mts:"typescript",mysql:"sql",node:"javascript",none:"plaintext",objc:"objectivec",plain:"plaintext",posh:"powershell",ps1:"powershell",psql:"sql",py:"python",rb:"ruby",rs:"rust",sh:"bash",svelte:"xml",svg:"xml",text:"plaintext",toml:"ini",ts:"typescript",tsx:"typescript",txt:"plaintext",vue:"xml",yml:"yaml",zsh:"bash"},l=new Map;let g=null;const s=new Map;export function registerMPLanguage(i,t){const g=i.toLowerCase();l.set(g,t),s.delete(g)}export function canonicalLanguage(i){if(!i)return null;const l=i.trim().toLowerCase();return l?t[l]??l:null}export async function highlightCode(t,a){let e=s.get(a);e||(e=async function(t){const s=l.get(t),a=s?void 0:i[t];if(!s&&!a)return null;g??=import("highlight.js/lib/core").then(i=>i.default);const e=await g;return s?e.registerLanguage(t,s):e.getLanguage(t)||e.registerLanguage(t,(await a()).default),t}(a).catch(i=>{throw s.delete(a),i}),s.set(a,e));const h=await e;if(!h||!g)return null;return tokenize((await g).highlight(t,{language:h,ignoreIllegals:!0}).value)}const a={"&amp;":"&","&lt;":"<","&gt;":">","&quot;":'"',"&#x27;":"'"};export function tokenize(i){const t=[[]],l=[],g=/<span class="([^"]*)">|<\/span>/g;let s=0;const e=i=>{if(!i)return;const g=l[l.length-1];i.replace(/&(?:amp|lt|gt|quot|#x27);/g,i=>a[i]).split("\n").forEach((i,l)=>{l>0&&t.push([]),i&&t[t.length-1].push(g?{text:i,token:g}:{text:i})})};for(const t of i.matchAll(g))e(i.slice(s,t.index)),s=t.index+t[0].length,void 0===t[1]?l.pop():l.push(t[1]);return e(i.slice(s)),t}export function plainLines(i){return i.split("\n").map(i=>i?[{text:i}]:[])}

package/dist/internal/i18n.d.ts

@@ -189,6 +189,57 @@ export interface MPMessages {
         /** One slide, and its own position mark. `Slide 2 of 5`. */
         slide: string;
     };
+    /**
+     * MPScrollZone.
+     *
+     * Read out and never drawn, like the carousel's above — but a namespace of
+     * its own rather than three more keys in that one, because the words differ
+     * where it matters. A carousel's arrow moves to the *slide* before this one
+     * and there is a countable thing on the other side of the press; a scroll
+     * zone's moves the strip along and lands wherever the content happens to
+     * start. A translation that reused *Previous slide* for it would be naming a
+     * slide the reader is not being taken to.
+     */
+    scroll: {
+        /** What the strip is called when the caller has not said what is in it. */
+        label: string;
+        /** The two buttons, named by which way they travel. */
+        previous: string;
+        next: string;
+    };
+    /**
+     * MPAnchor.
+     *
+     * One string, and it is read out rather than drawn: the rows are the page's
+     * own headings, and the only thing the component says on its own behalf is
+     * what the `<nav>` around them is called. A page with a table of contents and
+     * a menu in it has two navigation landmarks, and a screen reader that offers
+     * both of them as "navigation" has told the reader nothing.
+     */
+    anchor: {
+        /** The name of the `<nav>` the list of headings is inside. */
+        label: string;
+    };
+    /**
+     * MPCodeBlock.
+     *
+     * Two of these are **drawn** — the copy button says its own word, and says a
+     * different one once the clipboard has taken the code — which is unusual in
+     * this table and is what makes the namespace necessary. A Korean page with a
+     * button reading *Copy* is a page the component broke.
+     */
+    code: {
+        /** The button that puts the code on the clipboard. */
+        copy: string;
+        /** What it says for a moment afterwards. */
+        copied: string;
+        /** And what it says when the browser refused. */
+        copyFailed: string;
+        /** The toggle that drops the colouring. Read out; the button is a glyph. */
+        raw: string;
+        /** What the scrollable region is called when nothing named it. */
+        label: string;
+    };
     /**
      * MPBreadcrumb.
      *
@@ -215,6 +266,74 @@ export interface MPMessages {
         /** The row that offers what was typed as a value of its own. */
         add: string;
     };
+    /**
+     * MPSparkline.
+     *
+     * One string, and it is the whole of what a sparkline says to a reader who
+     * cannot see it. The mark has no axis and no tooltip — see the note on the
+     * component — so the shape has to arrive as a sentence or not at all.
+     *
+     * `{count}`, `{first}` and `{last}` are filled in by `fillMessage`, and the
+     * two ends rather than the two extremes because it is the direction a reader
+     * wants from a sparkline: 120 to 400 says which way it went, and 90 to 410
+     * does not.
+     */
+    /**
+     * The framed charts.
+     *
+     * Three words, and every one of them is a name for a thing the chart drew
+     * rather than a thing the caller wrote. A chart's own content — its series
+     * names, its categories, its title — is the caller's and is never translated
+     * here; these are the scaffolding around it.
+     *
+     * `label` is the fallback accessible name. A chart is a focusable
+     * `role="img"`, and one with nothing to be called by is a tab stop that
+     * announces silence, so there is always a name even when the caller gave
+     * none.
+     *
+     * `table` names the grid under every chart — the relief channel that makes a
+     * picture readable to somebody who cannot see it — and `category` heads its
+     * first column, the one holding whatever the marks are filed under.
+     */
+    chart: {
+        /** What an unnamed chart is called. */
+        label: string;
+        /** The caption on the table under it. */
+        table: string;
+        /** The heading over that table's first column. */
+        category: string;
+    };
+    sparkline: {
+        summary: string;
+    };
+    /**
+     * MPTour.
+     *
+     * The four buttons and the counter — every one of them drawn, and none of
+     * them the caller's. A tour is a component whose whole content is somebody
+     * else's writing, so these five are the only words it says on its own behalf,
+     * and a tour whose steps are in Korean under a *Next* button is a tour that
+     * was translated halfway.
+     *
+     * The × is `common`'s, because it is the same × every sheet in the library
+     * closes with.
+     *
+     * `{index}` and `{total}` are filled in by `fillMessage`, and they are
+     * positional for the reason the pagination's are: a language that counts the
+     * total first is not one an argument order can serve.
+     */
+    tour: {
+        /** Back one step. Missing on the first. */
+        previous: string;
+        /** On one step. */
+        next: string;
+        /** What Next becomes on the last step. */
+        done: string;
+        /** Leaves the tour without finishing it. */
+        skip: string;
+        /** Where the reader is: "Step 2 of 5". */
+        position: string;
+    };
     /**
      * MPTable.
      *
@@ -225,6 +344,57 @@ export interface MPMessages {
     table: {
         empty: string;
     };
+    /**
+     * MPDataTable.
+     *
+     * The words the table says on its own behalf, and not one of them is the
+     * caller's data. Three are read out and never drawn — the ticks have no
+     * visible label, and a column of unnamed checkboxes is a column a screen
+     * reader announces as nothing at all — and three are drawn in the bar under
+     * the rows.
+     *
+     * The empty line is `table`'s, the search field's word is `transfer`'s and the
+     * pages are `pagination`'s: what is here is only what none of them says.
+     *
+     * `{count}` and `{total}` are filled in by `fillMessage`.
+     */
+    dataTable: {
+        /** The tick in the header, which chooses every row on the page. */
+        selectAll: string;
+        /** One row's tick. Read out with the row it is in. */
+        selectRow: string;
+        /**
+         * How many rows there are, after the search and before the page.
+         *
+         * A label with a number after it — "Rows: 7" — in every language that
+         * inflects a noun for number, and the natural phrase in the ones that do
+         * not. "1 rows" is what a single `{total} rows` says one row in seven times
+         * out of seven, and the alternative is a plural form per language in a table
+         * that holds one string per key: Polish and Arabic need four and six of
+         * them. Naming the thing and then counting it is right in every language and
+         * costs nothing.
+         */
+        total: string;
+        /**
+         * And how many of them are held, when any are.
+         *
+         * A second fact beside the first rather than a sentence joining the two.
+         * Written as one — "{count} of {total} selected" — the two numbers are
+         * counted over different sets, because a row the search has hidden is still
+         * chosen: a table of seven with one hidden row held would have said "1 of 1
+         * selected" the moment a search left one row on screen.
+         */
+        selected: string;
+        /** The button that writes the rows out as a file. */
+        download: string;
+        /** The label on the footer's page-size control. */
+        perPage: string;
+        /**
+         * The handle between two headings, which is a control a keyboard can reach:
+         * the arrow keys widen and narrow the column it belongs to.
+         */
+        resize: string;
+    };
     /**
      * MPFilePicker.
      *

package/dist/internal/initials.d.ts

@@ -0,0 +1,28 @@
+/**
+ * A name reduced to the letters that stand in for it.
+ *
+ * The first character of the first word plus the first of the last — "Jane Doe"
+ * is `JD`, "Acme Supply Co" is `AC`, and "홍길동" is `홍`.
+ *
+ * One word gives one character on purpose. Korean, Japanese and Chinese names
+ * are a single token, and two of their characters at 32px is a smudge where one
+ * of them is a name.
+ *
+ * `Array.from` rather than indexing, and that is the whole reason this is a
+ * function rather than a `slice(0, 1)` at each call site: a string index is a
+ * UTF-16 code unit, so `name[0]` on a name beginning with an emoji or any
+ * character outside the basic plane returns half of it, and half a surrogate
+ * pair renders as the replacement glyph. `normalize('NFC')` is the other half
+ * of the same care — a decomposed "Å" would otherwise give the bare A, with the
+ * ring left behind on the next character.
+ *
+ * The rule is wrong for some names, which is what every caller's own `initials`
+ * prop is for. It is not wrong often enough to be worth a locale-aware guess
+ * that would be wrong differently.
+ *
+ * A file of its own because two components need it and neither should import
+ * the other. `MPAvatar` derives a person's initials and `MPAppLogo` derives a
+ * product's, and a page carrying both would otherwise be able to disagree with
+ * itself about what a two-word name comes to.
+ */
+export declare function initialsOf(name: string): string;

package/dist/internal/initials.js

@@ -0,0 +1 @@
+export function initialsOf(r){const t=r.normalize("NFC").trim().split(/\s+/).filter(Boolean);if(0===t.length)return"";return((Array.from(t[0])[0]??"")+(t.length>1?Array.from(t[t.length-1])[0]??"":"")).toLocaleUpperCase()}

package/dist/internal/mark.d.ts

@@ -0,0 +1,52 @@
+/**
+ * The mark that comes and goes, and the timing every one of them shares.
+ *
+ * Six controls in this library draw a small shape to say "this one" — a
+ * checkbox's tick, a radio's dot, the tick beside a chosen row in a select, in a
+ * combobox, and in a menu's two kinds of item. They are the same event, so they
+ * have to be the same motion: a tick that grows into a `MPSelect` and one that
+ * is stamped into an `MPMenu` beside it read as two libraries, and that is
+ * exactly what the library had before this file.
+ *
+ * It is a string rather than a component because the elements it goes on are
+ * Base UI's own indicator parts. There is nothing to wrap: what differs between
+ * the six is which part renders and what the mark is drawn with, and what does
+ * not differ is the two hundred milliseconds and the frame it arrives from.
+ *
+ * ## Two from-states, because there are two kinds of mark
+ *
+ * A tick is a **stroke**. Drawn from nothing it spends its first frames as a
+ * smudge too small to read as a tick, and the eye takes the arrival for a
+ * flicker rather than for a stroke — so it starts at 0.6, already legible.
+ *
+ * A dot is a **disc**, and a disc at any size is still a disc. It can grow out
+ * of the centre of the ring taking the accent around it, which is the arrival
+ * MD3 draws for a radio.
+ *
+ * ## Why the third one is spelled differently
+ *
+ * `data-starting-style` and `data-ending-style` are Base UI's own two frames,
+ * and they are what `MARK_MOTION` and `DOT_MOTION` are written against. They
+ * work wherever the part stays mounted for the length of its exit, which the
+ * checkbox's, the radio's and the menu's indicators all do.
+ *
+ * `Select.ItemIndicator` and `Combobox.ItemIndicator` do not: both return `null`
+ * the moment their row stops being the chosen one, so `data-ending-style` never
+ * reaches the DOM and a tick that faded in vanished in a frame. Their answer is
+ * `keepMounted` plus `MARK_MOTION_KEPT`, which drives both directions off
+ * `data-selected` and needs neither frame. The cost is one empty `aria-hidden`
+ * span per row, in a column the list already reserves the width of.
+ */
+/** A stroke, arriving from 0.6 and leaving the same way. */
+export declare const MARK_MOTION: string;
+/** A disc, arriving from nothing. */
+export declare const DOT_MOTION: string;
+/**
+ * A stroke on a part that is kept mounted, so its resting state is the empty
+ * one and `data-selected` is what draws it.
+ *
+ * Always paired with `keepMounted` on the indicator. Without it the part is only
+ * ever in the DOM while it is selected, and a rule that hides everything else
+ * would hide the only thing there is.
+ */
+export declare const MARK_MOTION_KEPT: string;

package/dist/internal/mark.js

@@ -0,0 +1 @@
+const t=/*@__PURE__*/["transition-[opacity,scale]","duration-(--mp-sys-motion-duration-short4)","ease-mp-standard"].join(" ");export const MARK_MOTION=/*@__PURE__*/[t,"data-starting-style:scale-60 data-starting-style:opacity-0","data-ending-style:scale-60 data-ending-style:opacity-0"].join(" ");export const DOT_MOTION=/*@__PURE__*/[t,"data-starting-style:scale-0 data-starting-style:opacity-0","data-ending-style:scale-0 data-ending-style:opacity-0"].join(" ");export const MARK_MOTION_KEPT=/*@__PURE__*/[t,"scale-60 opacity-0","data-selected:scale-100 data-selected:opacity-100"].join(" ");

package/dist/internal/measure.d.ts

@@ -0,0 +1,31 @@
+/**
+ * How wide content is allowed to get, and the ladder it is usually asked for on.
+ *
+ * A module of its own rather than a third table in `internal/scale.ts`, and the
+ * reason is what `scale.ts` is: ladders of literal Tailwind class names, read by
+ * nearly every component in the library. The measure stopped being one of those
+ * when it started being read off the window size classes — and an `MPBox`, which
+ * wants a padding ladder and nothing else, should not carry those into its
+ * bundle to get one.
+ *
+ * Three components import this: `MPContainer`, `MPHeader` and `MPFooter`. They
+ * are the three that hold content to a width while the sheet around it spans the
+ * window, and they have to agree about where that edge is or the bar and the
+ * article under it line up at every width but one.
+ */
+import type { MPMeasure, MPWindowClass } from '../types.js';
+/**
+ * One `maxWidth`, as the length `max-width` is given.
+ *
+ * A rung of the ladder above, resolved against the boundaries in force where the
+ * component is — so a page that moved one with `MPConfigProvider` moves its
+ * measures too — or anything else the caller wrote, which reaches CSS untouched.
+ * `'60ch'` and `'42rem'` are the same kind of answer as `'lg'` rather than a
+ * second prop. See `MPMeasure`.
+ *
+ * The rungs were once four `rem` values written out — `37.5rem`, `52.5rem`,
+ * `75rem`, `100rem` — which are the four boundaries at a 16px root and only at a
+ * 16px root. A reader who had scaled their text up got a container that agreed
+ * with the media queries at no width at all.
+ */
+export declare function measureValue(value: MPMeasure, mins: Record<MPWindowClass, number>): string;

package/dist/internal/measure.js

@@ -0,0 +1 @@
+const e={xs:null,sm:"medium",md:"expanded",lg:"large",xl:"extra-large"};export function measureValue(n,r){if(!(n in e))return n;const l=e[n];return`${l?r[l]:480}px`}

package/dist/internal/messages/anchor.d.ts

@@ -0,0 +1,3 @@
+import type { MPNamespace } from '../i18n.js';
+/** `MPAnchor`'s one name — see `MPMessages['anchor']`. */
+export declare const ANCHOR: MPNamespace<'anchor'>;

package/dist/internal/messages/anchor.js

@@ -0,0 +1 @@
+export const ANCHOR={name:"anchor",en:{label:"On this page"}};

package/dist/internal/messages/chart.d.ts

@@ -0,0 +1,3 @@
+import type { MPNamespace } from '../i18n.js';
+/** The framed charts' three words — see `MPMessages['chart']`. */
+export declare const CHART: MPNamespace<'chart'>;