neba 1.11.0 → 1.13.0

package/dist/internal/drag.d.ts

@@ -3,17 +3,19 @@
  * that gives all of it back.
  *
  * Five components drag something: a Sidebar's edge, a Panes boundary, a
- * WindowPane by its bar or its corner, a ScrollZone's strip, a DataTable's
- * column rule. The arithmetic differs in every one of them and stays where it
- * is. What was written five times and had already drifted is the scaffold
- * around it — three listeners, a `dataset.dragging`, the document's text
- * selection, and a teardown an unmount can call.
+ * WindowPane by its bar or its corner, a ScrollZone's strip, and a DataTable's
+ * column rule, its column headers and a run of its rows. The arithmetic differs
+ * in every one of them and stays where it is. What was written six times and
+ * had already drifted is the scaffold around it — three listeners, a
+ * `dataset.dragging`, the document's text selection, and a teardown an unmount
+ * can call.
  *
  * The drift is the reason this exists rather than the repetition. A DataTable's
  * column resize was the one copy with no selection suppression in it, so
  * dragging a column boundary in Safari selected the text of every cell the
  * pointer crossed; and it was the one with no unmount teardown, so a table that
- * went away mid-drag left two listeners on a detached node.
+ * went away mid-drag left two listeners on a detached node. Its row-range drag
+ * was the last copy and had the same hole in it, over more cells.
  *
  * There is deliberately **no requestAnimationFrame in here.** A `pointermove`
  * is already delivered once per frame in every browser the library supports —

package/dist/internal/drag.js

@@ -1 +1 @@
-export function beginPointerDrag({target:e,pointerId:t,onMove:r,onEnd:n,selectable:o=!0,mark:s=!0}){const i=o?function(){const e=document.body,t=e.style.getPropertyValue("-webkit-user-select");return e.style.setProperty("-webkit-user-select","none"),()=>{t?e.style.setProperty("-webkit-user-select",t):e.style.removeProperty("-webkit-user-select")}}():null;s&&(e.dataset.dragging="true"),e.setPointerCapture&&e.setPointerCapture(t);let a=!0;const l=()=>{a&&(a=!1,e.removeEventListener("pointermove",r),e.removeEventListener("pointerup",p),e.removeEventListener("pointercancel",p),s&&delete e.dataset.dragging,i?.())},p=()=>{l(),n?.()};return e.addEventListener("pointermove",r),e.addEventListener("pointerup",p),e.addEventListener("pointercancel",p),l}
+export function beginPointerDrag({target:e,pointerId:t,onMove:r,onEnd:n,selectable:o=!0,mark:s=!0}){const i=o?function(){const e=document.body,t=e.style.getPropertyValue("-webkit-user-select");return e.style.setProperty("-webkit-user-select","none"),()=>{t?e.style.setProperty("-webkit-user-select",t):e.style.removeProperty("-webkit-user-select")}}():null;s&&(e.dataset.dragging="true");try{e.setPointerCapture?.(t)}catch{}let a=!0;const c=()=>{a&&(a=!1,e.removeEventListener("pointermove",r),e.removeEventListener("pointerup",l),e.removeEventListener("pointercancel",l),s&&delete e.dataset.dragging,i?.())},l=()=>{c(),n?.()};return e.addEventListener("pointermove",r),e.addEventListener("pointerup",l),e.addEventListener("pointercancel",l),c}

package/dist/internal/format.d.ts

@@ -1,8 +1,8 @@
 /**
- * The `Intl` formatters, memoised.
+ * The `Intl` objects, memoised.
  *
- * Here for the reason everything else in this folder is: three unrelated parts
- * of the library construct them, and constructing one is the expensive half of
+ * Here for the reason everything else in this folder is: unrelated parts of the
+ * library construct them, and constructing one is the expensive half of
  * using one. Measured on V8, `new Intl.NumberFormat(...).format(n)` costs about
  * 16µs and `format(n)` on a formatter that already exists costs about 0.3µs —
  * fifty-five times the work to produce the same string.
@@ -13,10 +13,11 @@
  * one per category and one per tooltip row, and it writes all of them again on
  * every re-render — which, on a chart being hovered, is every frame.
  *
- * The cache is keyed on the locale and the options together, and it is unbounded
- * on purpose. The keys are not user data: they come from a component's own
- * option objects, of which any one page has a handful, so there is nothing here
- * that grows with the size of a table or the length of a series.
+ * The cache is keyed on the locale and the options together, and it goes
+ * through `memoise` so it cannot grow without bound. Nothing here grows with
+ * the size of a table or the length of a series — a page has a handful of
+ * option objects — but both halves of the key reach these functions from public
+ * props, so neither half is the library's to promise anything about.
  *
  * The options object is deliberately *not* part of the key by identity. A caller
  * writing `format={{ style: 'currency', currency: 'USD' }}` inline hands over a
@@ -25,5 +26,18 @@
  */
 /** A memoised `Intl.DateTimeFormat`. */
 export declare function dateFormatter(locale: string | undefined, options: Intl.DateTimeFormatOptions): Intl.DateTimeFormat;
+/**
+ * A memoised `Intl.Segmenter`, or `null` on a runtime that has none.
+ *
+ * The same rule as the two above, and the one constructor that was still being
+ * built per call. `AnimateTyping` asks for a string's graphemes, `AnimateSplit`
+ * for its words and `AnimateScramble` for its graphemes again — three effects
+ * that a page may well hold several of, each rebuilding a segmenter for a
+ * string that has not changed.
+ *
+ * `null` rather than a throw where `Intl.Segmenter` is missing: a caller can
+ * fall back to a spread, and a text effect is not worth taking a page down for.
+ */
+export declare function segmenter(locale: string | undefined, granularity: Intl.SegmenterOptions['granularity']): Intl.Segmenter | null;
 /** A memoised `Intl.NumberFormat`. */
 export declare function numberFormatter(locale: string | undefined, options?: Intl.NumberFormatOptions): Intl.NumberFormat;

package/dist/internal/format.js

@@ -1 +1 @@
-function t(t,e){return`${t??""}\0${e?JSON.stringify(e):""}`}const e=new Map;export function dateFormatter(n,r){const o=t(n,r);let a=e.get(o);return a||(a=new Intl.DateTimeFormat(n,r),e.set(o,a)),a}const n=new Map;export function numberFormatter(e,r){const o=t(e,r);let a=n.get(o);return a||(a=new Intl.NumberFormat(e,r),n.set(o,a)),a}
+import{memoise as n}from"./cache.js";function t(n,t){return`${n??""}\0${t?JSON.stringify(t):""}`}const e=new Map;export function dateFormatter(r,o){return n(e,t(r,o),()=>new Intl.DateTimeFormat(r,o))}const r=new Map;export function segmenter(e,o){return"undefined"!=typeof Intl&&"Segmenter"in Intl?n(r,t(e,{granularity:o}),()=>new Intl.Segmenter(e,{granularity:o})):null}const o=new Map;export function numberFormatter(e,r){return n(o,t(e,r),()=>new Intl.NumberFormat(e,r))}

package/dist/internal/grid.d.ts

@@ -1,43 +1,29 @@
 /**
- * The arithmetic and the vocabulary the three layout components share.
+ * The arithmetic and the vocabulary the layout components share.
  *
  * Like `internal/styles.ts` this is the library talking to itself, and it lives
  * here rather than in either component's folder for the same reason
  * `internal/button-group.ts` does: `GridContainer` and `Grid` are one system in
- * two elements, and neither should have to import the other.
+ * two elements, and neither should have to import the other. `Flex` reads the
+ * alignment tables and the gutter arithmetic below and nothing else, which is
+ * the whole of what it has in common with a grid.
  *
  * What is *not* here is the layout itself. A column width is
  * `(100% + gap) * span / columns - gap`, it has to change at four breakpoints,
  * and it is the width of an element whose column count is declared on its
  * parent — none of which Tailwind can spell, because Tailwind only ever sees
  * class names written out literally and `columns` is a number a caller picks.
- * So the widths are real CSS in `styles.css`, driven by the `--n-*` slots this
- * file generates. That is the same split the rest of the library makes: per-
- * instance values go in inline custom properties, never in class names.
- */
-import type * as React from 'react';
-import type { NebaAlignItems, NebaAlignSelf, NebaBreakpoint, NebaJustifyContent, NebaResponsive } from '../types.js';
-/** Smallest first, which is also the order the media queries have to be in. */
-export declare const breakpoints: readonly NebaBreakpoint[];
-/**
- * Turns a responsive value into the `--n-{name}-{breakpoint}` slots the CSS
- * reads, emitting only the breakpoints the caller actually named.
- *
- * The gaps are filled in by CSS rather than here: each breakpoint's rule falls
- * back through the ones below it, so `{ md: 6 }` needs one slot and not five.
- * That keeps the inline style on a grid item down to what was asked for.
- */
-export declare function responsiveSlots<T>(name: string, value: NebaResponsive<T> | undefined, toCss: (value: T) => string): React.CSSProperties;
-/**
- * Fills in the `xs` entry of a partial map with the prop's own default.
+ * So the widths are real CSS in `styles.css`, driven by the `--n-*` slots
+ * `internal/responsive.ts` generates. That is the same split the rest of the
+ * library makes: per-instance values go in inline custom properties, never in
+ * class names.
  *
- * Without this, `spacing={{ md: 4 }}` would be a grid with no gutter at all
- * below 48rem — the CSS fallback rather than the documented default of 2 — and
- * a caller who narrowed one breakpoint would silently lose every other one. A
- * map says "from here up, use this instead"; it does not say "and nothing
- * below".
+ * What is also not here any more is that generator. `responsiveSlots` and
+ * `withBaseline` were written for the grid and are not about grids, so they sit
+ * in `responsive.ts` where a Container and a Flex can reach them without
+ * importing column arithmetic they will never run.
  */
-export declare function withBaseline<T>(value: NebaResponsive<T> | undefined, baseline: T): NebaResponsive<T>;
+import type { NebaAlignItems, NebaAlignSelf, NebaJustifyContent } from '../types.js';
 /**
  * A count of columns, as a plain number for `calc()` to divide by.
  *
@@ -50,6 +36,22 @@ export declare function columnCount(value: number): string;
 export declare function columnUnits(value: number, min: number): string;
 export declare const spanValue: (value: number) => string;
 export declare const offsetValue: (value: number) => string;
+/**
+ * A width a column count cannot reach.
+ *
+ * `auto` is the contents' own width — an icon, a chip, a button at the end of
+ * a row — and `grow` is that plus whatever is left over in the row, which is
+ * how a title sits between an icon and an action. Neither is a share of
+ * twelve, so neither can come out of the arithmetic above.
+ *
+ * A number points back at `--n-col-width`, the arithmetic named in
+ * `styles.css`, rather than restating it: that is what lets one map mix the
+ * two — `span={{ xs: 'grow', md: 4 }}` — without the keyword at a narrow
+ * width leaking into a wider one.
+ */
+export declare function spanWidth(value: number | 'auto' | 'grow'): string;
+/** Which of the two keywords takes the space the row has left. */
+export declare function spanGrow(value: number | 'auto' | 'grow'): string;
 /**
  * A gutter, as a length.
  *

package/dist/internal/grid.js

@@ -1 +1 @@
-export const breakpoints=["xs","sm","md","lg","xl"];export function responsiveSlots(t,e,n){const s=function(t){return null==t?{}:"object"==typeof t?t:{xs:t}}(e),o={};for(const e of breakpoints){const r=s[e];void 0!==r&&(o[`--n-${t}-${e}`]=n(r))}return o}export function withBaseline(t,e){return null==t?e:"object"==typeof t?{xs:e,...t}:t}export function columnCount(t){return String(Math.max(1,Math.round(t)))}export function columnUnits(t,e){return String(Math.max(e,Math.round(t)))}export const spanValue=t=>columnUnits(t,1);export const offsetValue=t=>columnUnits(t,0);export function spacingValue(t){const e=.25*Math.max(0,t);return`${Number(e.toFixed(5))}rem`}export const justifyContentClasses={start:"justify-start",center:"justify-center",end:"justify-end","space-between":"justify-between","space-around":"justify-around","space-evenly":"justify-evenly",stretch:"justify-stretch"};export const alignItemsClasses={start:"items-start",center:"items-center",end:"items-end",stretch:"items-stretch",baseline:"items-baseline"};export const alignContentClasses={start:"content-start",center:"content-center",end:"content-end","space-between":"content-between","space-around":"content-around","space-evenly":"content-evenly",stretch:"content-stretch"};export const alignSelfClasses={auto:"self-auto",start:"self-start",center:"self-center",end:"self-end",stretch:"self-stretch",baseline:"self-baseline"};
+export function columnCount(t){return String(Math.max(1,Math.round(t)))}export function columnUnits(t,e){return String(Math.max(e,Math.round(t)))}export const spanValue=t=>columnUnits(t,1);export const offsetValue=t=>columnUnits(t,0);export function spanWidth(t){return"number"==typeof t?"var(--n-col-width)":"auto"}export function spanGrow(t){return"grow"===t?"1":"0"}export function spacingValue(t){const e=.25*Math.max(0,t);return`${Number(e.toFixed(5))}rem`}export const justifyContentClasses={start:"justify-start",center:"justify-center",end:"justify-end","space-between":"justify-between","space-around":"justify-around","space-evenly":"justify-evenly",stretch:"justify-stretch"};export const alignItemsClasses={start:"items-start",center:"items-center",end:"items-end",stretch:"items-stretch",baseline:"items-baseline"};export const alignContentClasses={start:"content-start",center:"content-center",end:"content-end","space-between":"content-between","space-around":"content-around","space-evenly":"content-evenly",stretch:"content-stretch"};export const alignSelfClasses={auto:"self-auto",start:"self-start",center:"self-center",end:"self-end",stretch:"self-stretch",baseline:"self-baseline"};

package/dist/internal/i18n.d.ts

@@ -285,9 +285,95 @@ export interface CarouselMessages {
     slide: string;
     previous: string;
     next: string;
+    /**
+     * The button that stops the slides advancing on their own, and the same
+     * button once they have been stopped.
+     *
+     * It says what it will do rather than what the carousel is doing, which is
+     * what a button's name is for — and it names the object, because a lone
+     * "Pause" tells a screen reader's element list nothing about which of the
+     * things on the page it would pause.
+     */
+    pause: string;
+    play: string;
 }
 /** The `carousel` namespace, as Carousel read it. */
 export declare const carouselMessages: MessageTable<CarouselMessages>;
+/**
+ * Every string a picker says that is not a date.
+ *
+ * One object rather than twenty props. These are a set: a caller who has to
+ * translate "Previous month" has to translate "Next month" in the same breath,
+ * and a component with twenty `*Label` props is a component whose signature is
+ * mostly apology. The same argument is why they are in here rather than
+ * defaulted in the pickers: a product in Korean should get all twenty from its
+ * `locale`, and the `labels` prop is then for the wording rather than for the
+ * language.
+ *
+ * The dates themselves are never in here — those come from `Intl`, which
+ * already knows what July is called in more languages than this file ever will.
+ */
+export interface PickerMessages {
+    /** The calendar's steppers, in day view. */
+    previousMonth: string;
+    nextMonth: string;
+    /** The same steppers in month view, where they move by a year. */
+    previousYear: string;
+    nextYear: string;
+    /** And in year view, where they move by a page of twelve. */
+    previousYears: string;
+    nextYears: string;
+    /** The two header buttons that open the month grid and the year grid. */
+    chooseMonth: string;
+    chooseYear: string;
+    /**
+     * The footer's actions. Three shortcuts rather than one because the button
+     * jumps to the current *unit*, and a month picker whose footer says "Today"
+     * is offering a day it has no way to accept.
+     */
+    today: string;
+    thisMonth: string;
+    thisYear: string;
+    now: string;
+    clear: string;
+    done: string;
+    /** The clock's columns. */
+    hour: string;
+    minute: string;
+    second: string;
+    meridiem: string;
+    /** Which end of a range the calendar is currently asking for. */
+    start: string;
+    end: string;
+}
+/** The `picker` namespace, as the four date and time pickers read it. */
+export declare const pickerMessages: MessageTable<PickerMessages>;
+/**
+ * The gallery, and the viewer a tile opens into.
+ *
+ * A Carousel's words are next to these and are deliberately not reused: a
+ * carousel moves between *slides* and this moves between pictures, and a
+ * screen reader saying "next slide" over a wall of photographs is describing
+ * something the reader is not looking at.
+ */
+export interface GalleryMessages {
+    /** Names the list, when the caller did not. */
+    label: string;
+    /** One tile's position. `{index}` and `{total}` are replaced with the numbers. */
+    item: string;
+    previous: string;
+    next: string;
+}
+/** The `gallery` namespace, as Gallery and its viewer read it. */
+export declare const galleryMessages: MessageTable<GalleryMessages>;
+export interface ImageMessages {
+    /**
+     * What stands where the picture was, when the file did not arrive and the
+     * caller gave no `alt` to say what it was.
+     */
+    unavailable: string;
+}
+export declare const imageMessages: MessageTable<ImageMessages>;
 /**
  * The charts.
  *
@@ -543,6 +629,12 @@ export interface NebaLocale {
     pagination?: Partial<PaginationMessages>;
     /** Carousel. */
     carousel?: Partial<CarouselMessages>;
+    /** Picker. */
+    picker?: Partial<PickerMessages>;
+    /** Gallery. */
+    gallery?: Partial<GalleryMessages>;
+    /** Image. */
+    image?: Partial<ImageMessages>;
     /** Chart. */
     chart?: Partial<ChartMessages>;
     /** Scroll. */

package/dist/internal/i18n.js

@@ -1 +1 @@
-import*as e from"react";export function fill(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>s[o]??e)}export const actionMessages={"":{close:"Close",dismiss:"Dismiss",clear:"Clear",remove:"Remove"}};export const confirmMessages={"":{confirm:"Confirm",cancel:"Cancel"}};export const linkMessages={"":{newTab:"(opens in a new tab)"}};export const spoilerMessages={"":{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"}};export const chatMessages={"":{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"}};export const emptyMessages={"":{title:"Nothing here"}};export const tableMessages={"":{search:"Search",selectAll:"Select all rows",selectRow:"Select row",rowsPerPage:"Rows per page",range:"{start}–{end} of {total}",selected:"{count} selected",empty:"No data",exportCsv:"Export CSV"}};export const colorMessages={"":{area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Preset colours",clear:"Clear",empty:"Choose a colour"}};export const ratingMessages={"":{label:"Rating",value:"{value} out of {max}",empty:"No rating"}};export const numberMessages={"":{increase:"Increase",decrease:"Decrease"}};export const paginationMessages={"":{label:"Pagination",page:"Page {page}",status:"Page {page} of {total}",previous:"Previous page",next:"Next page",first:"First page",last:"Last page"}};export const carouselMessages={"":{label:"Carousel",slide:"Slide {index} of {total}",previous:"Previous slide",next:"Next slide"}};export const chartMessages={"":{label:"Chart"}};export const scrollMessages={"":{label:"Scrollable content",previous:"Scroll back",next:"Scroll forward"}};export const breadcrumbMessages={"":{label:"Breadcrumb",expand:"Show hidden steps"}};export const commandMessages={"":{label:"Command palette",search:"Type a command or search…",empty:"No commands found"}};export const transferMessages={"":{source:"Available",target:"Selected",toTarget:"Move to selected",toSource:"Move to available",search:"Search",selectAll:"Select all",empty:"Nothing here"}};export const anchorMessages={"":{label:"On this page"}};export const comboboxMessages={"":{empty:"No matches",remove:"Remove {label}"}};export const overlayMessages={"":{label:"Overlay"}};export const windowMessages={"":{minimize:"Minimize",maximize:"Maximize",restore:"Restore",resize:"Resize window"}};export const layoutMessages={"":{skipToContent:"Skip to content",sidebar:"Sidebar",openSidebar:"Open sidebar",closeSidebar:"Close sidebar",resizeSidebar:"Resize sidebar"}};export const codeMessages={"":{code:"Code",copy:"Copy",copied:"Copied",copyFailed:"Could not copy",raw:"Raw",prompt:"Prompt"}};export const stepsMessages={"":{previous:"Previous",next:"Next",done:"Done",skip:"Skip",restart:"Start over",completed:"All steps complete",steps:"Steps",position:"{index} of {total}",step:"Step {index}: {title}"}};const s={zh:"zh-hans","zh-cn":"zh-hans","zh-my":"zh-hans","zh-sg":"zh-hans","zh-hk":"zh-hant","zh-mo":"zh-hant","zh-tw":"zh-hant"};const o=new WeakMap;export function resolveMessages(e,t){const a=e[""],r=t?.trim()??"";if(!r)return a;let n=o.get(e);n||(n=new Map,o.set(e,n));const c=n.get(r);if(c)return c;const l=function(e){const s=e.toLowerCase().split(/[-_]/).filter(Boolean),o=s[0];if(!o)return[];const t=s.slice(1),a=t.find(e=>/^[a-z]{4}$/.test(e)),r=t.find(e=>/^([a-z]{2}|\d{3})$/.test(e));return[a?`${o}-${a}`:"",r?`${o}-${r}`:"",o].filter(Boolean)}(r).map(o=>{const t=s[o];return e[o]??(t?e[t]:void 0)}).find(Boolean),i=l?{...a,...l}:a;return n.set(r,i),i}export function useMessages(s,o){return e.useMemo(()=>resolveMessages(s,o),[s,o])}export function fillMessage(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>s[o]??e)}const t={action:actionMessages,confirm:confirmMessages,link:linkMessages,spoiler:spoilerMessages,chat:chatMessages,empty:emptyMessages,table:tableMessages,color:colorMessages,rating:ratingMessages,number:numberMessages,pagination:paginationMessages,carousel:carouselMessages,chart:chartMessages,scroll:scrollMessages,breadcrumb:breadcrumbMessages,anchor:anchorMessages,transfer:transferMessages,command:commandMessages,combobox:comboboxMessages,overlay:overlayMessages,window:windowMessages,layout:layoutMessages,code:codeMessages,steps:stepsMessages};export function registerMessages(e,s){const a=e.trim().toLowerCase();for(const[e,r]of Object.entries(s)){const s=t[e];s&&r&&(s[a]=r,o.delete(s))}}
+import*as e from"react";import{memoise as s}from"./cache.js";export function fill(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>s[o]??e)}export const actionMessages={"":{close:"Close",dismiss:"Dismiss",clear:"Clear",remove:"Remove"}};export const confirmMessages={"":{confirm:"Confirm",cancel:"Cancel"}};export const linkMessages={"":{newTab:"(opens in a new tab)"}};export const spoilerMessages={"":{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"}};export const chatMessages={"":{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"}};export const emptyMessages={"":{title:"Nothing here"}};export const tableMessages={"":{search:"Search",selectAll:"Select all rows",selectRow:"Select row",rowsPerPage:"Rows per page",range:"{start}–{end} of {total}",selected:"{count} selected",empty:"No data",exportCsv:"Export CSV"}};export const colorMessages={"":{area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Preset colours",clear:"Clear",empty:"Choose a colour"}};export const ratingMessages={"":{label:"Rating",value:"{value} out of {max}",empty:"No rating"}};export const numberMessages={"":{increase:"Increase",decrease:"Decrease"}};export const paginationMessages={"":{label:"Pagination",page:"Page {page}",status:"Page {page} of {total}",previous:"Previous page",next:"Next page",first:"First page",last:"Last page"}};export const carouselMessages={"":{label:"Carousel",slide:"Slide {index} of {total}",previous:"Previous slide",next:"Next slide",pause:"Pause slide show",play:"Play slide show"}};export const pickerMessages={"":{previousMonth:"Previous month",nextMonth:"Next month",previousYear:"Previous year",nextYear:"Next year",previousYears:"Previous years",nextYears:"Next years",chooseMonth:"Choose a month",chooseYear:"Choose a year",today:"Today",thisMonth:"This month",thisYear:"This year",now:"Now",clear:"Clear",done:"Done",hour:"Hour",minute:"Minute",second:"Second",meridiem:"AM/PM",start:"Start",end:"End"}};export const galleryMessages={"":{label:"Gallery",item:"Image {index} of {total}",previous:"Previous image",next:"Next image"}};export const imageMessages={"":{unavailable:"Image unavailable"}};export const chartMessages={"":{label:"Chart"}};export const scrollMessages={"":{label:"Scrollable content",previous:"Scroll back",next:"Scroll forward"}};export const breadcrumbMessages={"":{label:"Breadcrumb",expand:"Show hidden steps"}};export const commandMessages={"":{label:"Command palette",search:"Type a command or search…",empty:"No commands found"}};export const transferMessages={"":{source:"Available",target:"Selected",toTarget:"Move to selected",toSource:"Move to available",search:"Search",selectAll:"Select all",empty:"Nothing here"}};export const anchorMessages={"":{label:"On this page"}};export const comboboxMessages={"":{empty:"No matches",remove:"Remove {label}"}};export const overlayMessages={"":{label:"Overlay"}};export const windowMessages={"":{minimize:"Minimize",maximize:"Maximize",restore:"Restore",resize:"Resize window"}};export const layoutMessages={"":{skipToContent:"Skip to content",sidebar:"Sidebar",openSidebar:"Open sidebar",closeSidebar:"Close sidebar",resizeSidebar:"Resize sidebar"}};export const codeMessages={"":{code:"Code",copy:"Copy",copied:"Copied",copyFailed:"Could not copy",raw:"Raw",prompt:"Prompt"}};export const stepsMessages={"":{previous:"Previous",next:"Next",done:"Done",skip:"Skip",restart:"Start over",completed:"All steps complete",steps:"Steps",position:"{index} of {total}",step:"Step {index}: {title}"}};const o={zh:"zh-hans","zh-cn":"zh-hans","zh-my":"zh-hans","zh-sg":"zh-hans","zh-hk":"zh-hant","zh-mo":"zh-hant","zh-tw":"zh-hant"};const a=new WeakMap;export function resolveMessages(e,t){const r=e[""],n=t?.trim()??"";if(!n)return r;let i=a.get(e);return i||(i=new Map,a.set(e,i)),s(i,n,()=>{const s=function(e){const s=e.toLowerCase().split(/[-_]/).filter(Boolean),o=s[0];if(!o)return[];const a=s.slice(1),t=a.find(e=>/^[a-z]{4}$/.test(e)),r=a.find(e=>/^([a-z]{2}|\d{3})$/.test(e));return[t?`${o}-${t}`:"",r?`${o}-${r}`:"",o].filter(Boolean)}(n).map(s=>{const a=Object.hasOwn(o,s)?o[s]:void 0;return Object.hasOwn(e,s)?e[s]:a&&Object.hasOwn(e,a)?e[a]:void 0}).find(Boolean);return s?{...r,...s}:r})}export function useMessages(s,o){return e.useMemo(()=>resolveMessages(s,o),[s,o])}export function fillMessage(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>Object.hasOwn(s,o)?s[o]:e)}const t={action:actionMessages,confirm:confirmMessages,link:linkMessages,spoiler:spoilerMessages,chat:chatMessages,empty:emptyMessages,table:tableMessages,color:colorMessages,rating:ratingMessages,number:numberMessages,pagination:paginationMessages,carousel:carouselMessages,picker:pickerMessages,gallery:galleryMessages,image:imageMessages,chart:chartMessages,scroll:scrollMessages,breadcrumb:breadcrumbMessages,anchor:anchorMessages,transfer:transferMessages,command:commandMessages,combobox:comboboxMessages,overlay:overlayMessages,window:windowMessages,layout:layoutMessages,code:codeMessages,steps:stepsMessages};export function registerMessages(e,s){const o=e.trim().toLowerCase();for(const[e,r]of Object.entries(s)){const s=t[e];s&&r&&(s[o]=r,a.delete(s))}}

package/dist/internal/icons.d.ts

@@ -101,6 +101,17 @@ export declare function CodeIcon(): React.JSX.Element;
  * it on the button under a finished guide.
  */
 export declare function RestartIcon(): React.JSX.Element;
+/**
+ * Stop and start, as the pair a rotation control switches between.
+ *
+ * Drawn as solids rather than as outlines, and at the same optical weight as
+ * each other: they sit in one button that swaps between them, so a pair that
+ * did not match in weight would read as the button changing size. The triangle
+ * is inset a little further than the bars because a shape that tapers to a
+ * point looks larger than a rectangle covering the same box.
+ */
+export declare function PauseIcon(): React.JSX.Element;
+export declare function PlayIcon(): React.JSX.Element;
 /**
  * The three dots that stand for what has been left out.
  *
@@ -112,6 +123,20 @@ export declare function RestartIcon(): React.JSX.Element;
 export declare function EllipsisIcon(): React.JSX.Element;
 export declare function StarIcon(): React.JSX.Element;
 export declare function StarOutlineIcon(): React.JSX.Element;
+/**
+ * The ring a control that is working draws in place of its own start icon.
+ *
+ * Two components draw it, and it is here rather than in either of them because
+ * a Button that is submitting and a TextField that is checking what was typed
+ * have to read as the same object in motion — the same ring at the same weight
+ * turning at the same rate. Two drawings would be two objects, and the second
+ * one would drift the first time either was touched.
+ *
+ * The arc is a quarter of the circle behind it, and both are stroked at 2 rather
+ * than the 1.5 every other glyph here uses: a ring that turns is read as a
+ * shape rather than as a line, and at 1.5 it reads as a smudge.
+ */
+export declare function SpinnerIcon(): React.JSX.Element;
 /** The filled dot: the chosen one of a set, where a tick would say "and". */
 export declare function DotIcon(): React.JSX.Element;
 /** The neutral note: a circled `i` without the serif problem an `i` has at 16px. */

package/dist/internal/icons.js

@@ -1 +1 @@
-import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CopyIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"5.75",y:"5.75",width:"7.5",height:"7.5",rx:"1.75",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M10.25 3.6a1.85 1.85 0 0 0-1.5-.85h-4a2 2 0 0 0-2 2v4c0 .62.28 1.17.72 1.54",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function CodeIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M5.75 4.5 2.5 8l3.25 3.5m4.5-7L13.5 8l-3.25 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function RestartIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M13 8a5 5 0 1 1-1.6-3.67",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M13.25 2.25v3h-3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}const o="M8 1.4 9.71 5.65 14.28 5.96 10.76 8.9 11.88 13.34 8 10.9 4.12 13.34 5.24 8.9 1.72 5.96 6.29 5.65Z";export function StarIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,fill:"currentColor",stroke:"currentColor",strokeLinejoin:"round"})})}export function StarOutlineIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,stroke:"currentColor",strokeWidth:"1.25",strokeLinejoin:"round"})})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}export function NoteIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export function SuccessIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function WarningIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]})}export function DangerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function severityIcon(e){switch(e){case"success":return r(SuccessIcon,{});case"warning":return r(WarningIcon,{});case"danger":return r(DangerIcon,{});default:return r(NoteIcon,{})}}
+import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CopyIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"5.75",y:"5.75",width:"7.5",height:"7.5",rx:"1.75",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M10.25 3.6a1.85 1.85 0 0 0-1.5-.85h-4a2 2 0 0 0-2 2v4c0 .62.28 1.17.72 1.54",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function CodeIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M5.75 4.5 2.5 8l3.25 3.5m4.5-7L13.5 8l-3.25 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function RestartIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M13 8a5 5 0 1 1-1.6-3.67",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M13.25 2.25v3h-3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function PauseIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:[r("rect",{x:"4",y:"3",width:"2.75",height:"10",rx:"1"}),r("rect",{x:"9.25",y:"3",width:"2.75",height:"10",rx:"1"})]})}export function PlayIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:r("path",{d:"M5.5 3.6a1 1 0 0 1 1.53-.85l6.1 3.9a1.2 1.2 0 0 1 0 2.02l-6.1 3.9a1 1 0 0 1-1.53-.85V3.6Z"})})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}const o="M8 1.4 9.71 5.65 14.28 5.96 10.76 8.9 11.88 13.34 8 10.9 4.12 13.34 5.24 8.9 1.72 5.96 6.29 5.65Z";export function StarIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,fill:"currentColor",stroke:"currentColor",strokeLinejoin:"round"})})}export function StarOutlineIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,stroke:"currentColor",strokeWidth:"1.25",strokeLinejoin:"round"})})}export function SpinnerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[r("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),r("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}export function NoteIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export function SuccessIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function WarningIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]})}export function DangerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function severityIcon(e){switch(e){case"success":return r(SuccessIcon,{});case"warning":return r(WarningIcon,{});case"danger":return r(DangerIcon,{});default:return r(NoteIcon,{})}}

package/dist/internal/link.d.ts

@@ -5,10 +5,11 @@
  * pointing back at this one, and a `Referer` header naming it. Modern browsers
  * imply `noopener` for `target="_blank"`; none of them implies `noreferrer`,
  * and neither is implied for a named target. So the two tokens are added
- * wherever a component lets a caller choose where a link opens — TextLink,
- * a Menu row, a NavigationMenu link — and they are added the same way in all
- * three, because a library where only one of them is safe is a library whose
- * users cannot tell which.
+ * wherever a component lets a caller choose where a link opens — TextLink, a
+ * Menu row, a NavigationMenu link, a ChatBubble's link, an AppLogo, a
+ * BottomNavigation destination — and they are added the same way in all of
+ * them, because a library where only some are safe is a library whose users
+ * cannot tell which.
  *
  * It is a *merge* and not an override, and that is the whole reason this is a
  * function rather than a string. The common reason to write a `rel` by hand is

package/dist/internal/media.d.ts

@@ -8,12 +8,19 @@ export declare function noMatchOnServer(): boolean;
 /**
  * The five widths, written once and read in both directions.
  *
- * They are Tailwind's own defaults, which is what makes a Neba layout and a
- * `md:` utility change at the same moment — and they are here rather than in
+ * They are Tailwind's defaults, which is what makes a Neba layout and a `md:`
+ * utility change at the same moment — and they are here rather than in
  * `page-layout.ts`, where they used to be, because a layout asks "is the window
  * *narrower* than this" and a caller asks "is it *at least* this". Two
  * questions, one table: a second copy would be a second chance for the two to
  * disagree about what `md` is.
+ *
+ * This copy is the fallback rather than the source. `styles.css` publishes the
+ * same four widths as `--neba-breakpoint-*`, filled in from Tailwind's own
+ * theme at build time, and `readBreakpoints` below prefers those — so a
+ * consumer who moves `--breakpoint-md` moves the CSS and this together instead
+ * of leaving the two to disagree silently. What is written here is what a
+ * server, and a page whose stylesheet has not arrived, has to answer with.
  */
 export declare const breakpointWidths: Record<NebaBreakpoint, string>;
 /** Narrower than this breakpoint. `xs` has nothing below it, so it is `null`. */

package/dist/internal/media.js

@@ -1 +1 @@
-"use client";import*as e from"react";const r=new Map;function t(e){if(r.has(e))return r.get(e)??null;const t="undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null;return r.set(e,t),t}export function subscribeToQuery(e,r){const n=t(e);return n?(n.addEventListener("change",r),()=>n.removeEventListener("change",r)):()=>{}}export function queryMatches(e){return t(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};export function widthBelow(e){return"xs"===e?null:`(width < ${breakpointWidths[e]})`}export function widthAtLeast(e){return`(width >= ${breakpointWidths[e]})`}export function useMediaQuery(r){const t=e.useCallback(e=>r?subscribeToQuery(r,e):()=>{},[r]),n=e.useCallback(()=>!!r&&queryMatches(r),[r]);return e.useSyncExternalStore(t,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const n=e=>subscribeToQuery(reducedMotionQuery,e),o=()=>queryMatches(reducedMotionQuery);export function usePrefersReducedMotion(){return e.useSyncExternalStore(n,o,noMatchOnServer)}
+"use client";import*as e from"react";import{memoise as t}from"./cache.js";const r=new Map;function n(e){return t(r,e,()=>"undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null)}export function subscribeToQuery(e,t){const r=n(e);return r?(r.addEventListener("change",t),()=>r.removeEventListener("change",t)):()=>{}}export function queryMatches(e){return n(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};let o=null;function u(){if(o)return o;if("undefined"==typeof window||!window.getComputedStyle)return breakpointWidths;const e=getComputedStyle(document.documentElement),t={...breakpointWidths};for(const r of["sm","md","lg","xl"]){const n=e.getPropertyValue(`--neba-breakpoint-${r}`).trim();n&&(t[r]=n)}return o=t,t}export function widthBelow(e){return"xs"===e?null:`(width < ${u()[e]})`}export function widthAtLeast(e){return`(width >= ${u()[e]})`}export function useMediaQuery(t){const r=e.useCallback(e=>t?subscribeToQuery(t,e):()=>{},[t]),n=e.useCallback(()=>!!t&&queryMatches(t),[t]);return e.useSyncExternalStore(r,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const c=e=>subscribeToQuery(reducedMotionQuery,e),i=()=>queryMatches(reducedMotionQuery);export function usePrefersReducedMotion(){return e.useSyncExternalStore(c,i,noMatchOnServer)}

package/dist/internal/observe.js

@@ -1 +1 @@
-const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const s=function(e){if("undefined"==typeof IntersectionObserver)return null;let t=r.get(e);if(!t){const n=new Map;t={watchers:n,observer:new IntersectionObserver(e=>{for(const t of e){const e=n.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e})},r.set(e,t)}return t}(t);if(!s)return null;let o=s.watchers.get(e);return o||(o=new Set,s.watchers.set(e,o),s.observer.observe(e)),o.add(n),()=>{const t=s.watchers.get(e);t&&(t.delete(n),0===t.size&&(s.watchers.delete(e),s.observer.unobserve(e)))}}
+const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const s=function(e){if("undefined"==typeof IntersectionObserver)return null;let t=r.get(e);if(!t){const n=new Map;t={watchers:n,observer:new IntersectionObserver(e=>{for(const t of e){const e=n.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e})},r.set(e,t)}return t}(t);if(!s)return null;let o=s.watchers.get(e);return o||(o=new Set,s.watchers.set(e,o),s.observer.observe(e)),o.add(n),()=>{const o=s.watchers.get(e);o&&(o.delete(n),0===o.size&&(s.watchers.delete(e),s.observer.unobserve(e),0===s.watchers.size&&(s.observer.disconnect(),r.delete(t))))}}

package/dist/internal/page-layout.d.ts

@@ -107,16 +107,18 @@ export declare const SidebarSideContext: React.Context<SidebarSide | null>;
  * The same five widths as Tailwind variants, for the parts of this that are
  * decided in CSS rather than in JavaScript.
  *
- * Written out per breakpoint because Tailwind only ever sees class names that
- * appear literally in the source — the same reason every table in
- * `internal/styles.ts` is a `Record` of complete strings.
+ * The tables themselves are `internal/responsive.ts`', because `Show` asks the
+ * identical question and two spellings of "hidden below `md`" would be two
+ * chances to disagree. What is added here is only the sixth key: `none` is a
+ * layout that never collapses, which is not a breakpoint and has no place in a
+ * table the rest of the library reads.
  *
- * `belowClasses` hides something at and above the breakpoint, which is what a
- * sidebar's own trigger wants: the hamburger exists exactly while the sidebar
- * does not. `aboveClasses` hides it below, which is what the sidebar's column
- * wants for the one paint between the server's HTML arriving and JavaScript
- * finding out how wide the window is — without it a phone draws the sidebar
- * full width and then throws it away.
+ * `collapsedOnlyClasses` hides something at and above the breakpoint, which is
+ * what a sidebar's own trigger wants: the hamburger exists exactly while the
+ * sidebar does not. `expandedOnlyClasses` hides it below, which is what the
+ * sidebar's column wants for the one paint between the server's HTML arriving
+ * and JavaScript finding out how wide the window is — without it a phone draws
+ * the sidebar full width and then throws it away.
  */
 export declare const collapsedOnlyClasses: Record<PageLayoutCollapse, string>;
 export declare const expandedOnlyClasses: Record<PageLayoutCollapse, string>;

package/dist/internal/page-layout.js

@@ -1 +1 @@
-"use client";import*as e from"react";import{useMediaQuery as t,widthBelow as n}from"./media.js";export const PageLayoutContext=/*@__PURE__*/e.createContext({present:!1,register:()=>{},collapseBelow:"none",open:{start:!1,end:!1},setOpen:()=>{},scroll:"page"});export const SidebarSideContext=/*@__PURE__*/e.createContext(null);export const collapsedOnlyClasses={none:"hidden",xs:"hidden",sm:"sm:hidden",md:"md:hidden",lg:"lg:hidden",xl:"xl:hidden"};export const expandedOnlyClasses={none:"",xs:"",sm:"max-sm:hidden",md:"max-md:hidden",lg:"max-lg:hidden",xl:"max-xl:hidden"};export function useCollapsed(e){return t("none"===e?null:n(e))}export function drawerSide(e){const t="undefined"!=typeof document&&"rtl"===getComputedStyle(document.documentElement).direction;return"start"===e?t?"right":"left":t?"left":"right"}
+"use client";import*as e from"react";import{useMediaQuery as t,widthBelow as n}from"./media.js";import{hiddenBelowClasses as o,hiddenFromClasses as r}from"./responsive.js";export const PageLayoutContext=/*@__PURE__*/e.createContext({present:!1,register:()=>{},collapseBelow:"none",open:{start:!1,end:!1},setOpen:()=>{},scroll:"page"});export const SidebarSideContext=/*@__PURE__*/e.createContext(null);export const collapsedOnlyClasses={none:"hidden",...r};export const expandedOnlyClasses={none:"",...o};export function useCollapsed(e){return t("none"===e?null:n(e))}export function drawerSide(e){const t="undefined"!=typeof document&&"rtl"===getComputedStyle(document.documentElement).direction;return"start"===e?t?"right":"left":t?"left":"right"}

package/dist/internal/picker.d.ts

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import type { PickerLabels } from './calendar.js';
 import type { NebaColor, NebaElevation, NebaSize, NebaStyleProps } from '../types.js';
 /**
  * The shell all four pickers wear: a field-shaped trigger with a popup hanging
@@ -74,7 +73,13 @@ interface InternalShellProps extends PickerShellProps {
     onClear: () => void;
     open: boolean;
     onOpenChange: (open: boolean) => void;
-    labels: PickerLabels;
+    /**
+     * The × that empties the control, named. One string rather than the whole
+     * `labels` set, which is all the shell ever drew of it — asking for
+     * twenty to render one is what had a ColorPicker spreading the picker
+     * defaults it does not use over a label it does.
+     */
+    clearLabel: string;
     /** `<input type="hidden">` rows, so the control submits with a form. */
     hiddenValues?: Array<{
         name: string;
@@ -99,7 +104,7 @@ interface InternalShellProps extends PickerShellProps {
  * and the way `invalid` re-points the whole colour family at `danger` so the
  * edge, the ring and the message turn over together.
  */
-export declare function PickerShell({ variant, size, color, density, elevation, label, description, error, invalid, startIcon, fullWidth, disabled, readOnly, required, id, className, style, display, samples, empty, clearable, onClear, open, onOpenChange, labels, hiddenValues, sideOffset, popupClassName, children, triggerRef, ...props }: InternalShellProps): React.JSX.Element;
+export declare function PickerShell({ variant, size, color, density, elevation, label, description, error, invalid, startIcon, fullWidth, disabled, readOnly, required, id, className, style, display, samples, empty, clearable, onClear, open, onOpenChange, clearLabel, hiddenValues, sideOffset, popupClassName, children, triggerRef, ...props }: InternalShellProps): React.JSX.Element;
 /**
  * The row of shortcuts under a picker's panel.
  *

package/dist/internal/picker.js

@@ -1 +1 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as n from"react";import{Field as i}from"@base-ui/react/field";import{Popover as t}from"@base-ui/react/popover";import{CloseIcon as l}from"./icons.js";import{WidthSizer as r}from"./sizer.js";import{chipRemoveClasses as s,controlHeightClasses as o,controlTextLeadingClasses as d,cx as c,disabledClasses as p,fieldReadOnlyClasses as u,fieldRestClasses as m,focusWithinRingClasses as f,gapClasses as b,iconClasses as h,metaTextClasses as x,paddingXClasses as g,radiusClasses as v,stackGapClasses as y,surfaceClasses as N,surfaceSlots as w,transitionClasses as P}from"./styles.js";export function popupSlots(e,a){return{...w(e,a),"--n-fill":`var(--neba-${e}-fill)`,"--n-fill-hover":`var(--neba-${e}-fill-hover)`,"--n-fill-active":`var(--neba-${e}-fill-active)`,"--n-on-solid":`var(--neba-${e}-on-solid)`}}const j=["group relative flex w-full items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",P,"focus-within:[transition-duration:0ms]",f,h].join(" ");export const pickerPopupClasses=[N,"border bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" ");export const popupPaddingClasses={xs:"p-1.5",sm:"p-2",md:"p-2.5",lg:"p-3",xl:"p-3.5"};export function PickerShell({variant:f="outline",size:h="md",color:N="primary",density:P="default",elevation:C=0,label:k,description:$,error:O,invalid:z,startIcon:F,fullWidth:R=!1,disabled:S=!1,readOnly:q=!1,required:D=!1,id:I,className:_,style:E,display:L,samples:T,empty:V,clearable:W=!1,onClear:A,open:B,onOpenChange:G,labels:H,hiddenValues:J,sideOffset:K=6,popupClassName:M,children:Q,triggerRef:U,...X}){const Y=n.useId(),Z=I??`${Y}-trigger`,ee=`${Y}-label`,ae=`${Y}-description`,ne=`${Y}-error`,ie=null!=O&&!1!==O&&""!==O,te=z??ie,le=te?"danger":N,re=S||q,se=c($?ae:null,ie?ne:null)||void 0;return a(i.Root,{disabled:S,invalid:te,className:c("flex-col align-top",y[h],R?"flex w-full":"inline-flex",_),style:{...w(le,C),...E},...X,children:[k?e(i.Label,{id:ee,htmlFor:Z,className:c(x[h],"font-medium",S?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:k}):null,a(t.Root,{open:B,onOpenChange:e=>G(e),children:[a("span",{className:c(j,o[h],d[h],v[h],b[h],g[P][h],S?p[f]:q?u[f]:m[f]),children:[a(t.Trigger,{id:Z,ref:U,disabled:S,"aria-labelledby":k?ee:void 0,"aria-describedby":se,"aria-required":D||void 0,"aria-invalid":te||void 0,className:c("flex min-w-0 flex-1 items-center bg-transparent text-start [font:inherit] text-inherit",b[h],"[outline:none]",re?"cursor-default":"cursor-pointer"),children:[F?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg) transition-[color] duration-(--neba-duration) group-focus-within:text-(--n-accent)",children:F}):null,a("span",{className:"flex min-w-0 flex-1 flex-col",children:[e("span",{className:c("w-full truncate",V?"text-(--neba-muted-fg)":"text-(--neba-fg)"),children:L}),e(r,{samples:T??[]})]})]}),!W||V||re?null:e("button",{type:"button","aria-label":H.clear,className:c(s,"text-(--neba-muted-fg)"),onClick:e=>{e.stopPropagation(),A()},children:e(l,{})})]}),e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-50 [outline:none]",sideOffset:K,align:"start",children:e(t.Popup,{initialFocus:!1,className:c(pickerPopupClasses,v[h],popupPaddingClasses[h],d[h],M),style:popupSlots(le,3),children:Q})})})]}),$?e(i.Description,{id:ae,className:c(x[h],"text-(--neba-muted-fg)"),children:$}):null,ie?e(i.Error,{id:ne,match:!0,className:c(x[h],"text-(--n-accent)"),children:O}):null,J?.map((a,n)=>e("input",{type:"hidden",name:a.name,value:a.value},n))]})}export function PickerFooter({size:a,children:n}){return e("div",{className:c("flex items-center justify-end border-t pt-1.5","[border-color:var(--n-line)]",b[a]),children:n})}export function PickerDivider(){return e("div",{"aria-hidden":"true",className:"w-px self-stretch bg-(--n-line)"})}
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{Field as a}from"@base-ui/react/field";import{Popover as r}from"@base-ui/react/popover";import{CloseIcon as i}from"./icons.js";import{WidthSizer as t}from"./sizer.js";import{chipRemoveClasses as o,controlTextLeadingClasses as s,cx as d,disabledClasses as c,fieldFocusTransitionClasses as p,fieldHeightClasses as u,fieldReadOnlyClasses as m,fieldRestClasses as f,fieldRingClasses as b,gapClasses as h,iconClasses as x,metaTextClasses as g,paddingXClasses as v,popupFadeClasses as N,radiusClasses as y,stackGapClasses as P,surfaceClasses as w,surfaceSlots as j,transitionClasses as C}from"./styles.js";export function popupSlots(e,l){return{...j(e,l),"--n-fill":`var(--neba-${e}-fill)`,"--n-fill-hover":`var(--neba-${e}-fill-hover)`,"--n-fill-active":`var(--neba-${e}-fill-active)`,"--n-on-solid":`var(--neba-${e}-on-solid)`}}const k=["group relative flex w-full items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",C,p,b,x].join(" ");export const pickerPopupClasses=[w,"border bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",N].join(" ");export const popupPaddingClasses={xs:"p-1.5",sm:"p-2",md:"p-2.5",lg:"p-3",xl:"p-3.5"};export function PickerShell({variant:p="outline",size:b="md",color:x="primary",density:N="default",elevation:w=0,label:C,description:$,error:z,invalid:O,startIcon:F,fullWidth:R=!1,disabled:S=!1,readOnly:q=!1,required:D=!1,id:I,className:L,style:E,display:T,samples:V,empty:W,clearable:A=!1,onClear:B,open:G,onOpenChange:H,clearLabel:J,hiddenValues:K,sideOffset:M=6,popupClassName:Q,children:U,triggerRef:X,...Y}){const Z=n.useId(),_=I??`${Z}-trigger`,ee=`${Z}-label`,le=`${Z}-description`,ne=`${Z}-error`,ae=null!=z&&!1!==z&&""!==z,re=O??ae,ie=re?"danger":x,te=S||q,oe=d($?le:null,ae?ne:null)||void 0;return l(a.Root,{disabled:S,invalid:re,className:d("flex-col align-top",P[b],R?"flex w-full":"inline-flex",L),style:{...j(ie,w),...E},...Y,children:[C?e(a.Label,{id:ee,htmlFor:_,className:d(g[b],"font-medium",S?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:C}):null,l(r.Root,{open:G,onOpenChange:e=>H(e),children:[l("span",{className:d(k,u[b],s[b],y[b],h[b],v[N][b],S?c[p]:q?m[p]:f[p]),children:[l(r.Trigger,{id:_,ref:X,disabled:S,"aria-labelledby":C?ee:void 0,"aria-describedby":oe,"aria-required":D||void 0,"aria-invalid":re||void 0,className:d("flex min-w-0 flex-1 items-center bg-transparent text-start [font:inherit] text-inherit",h[b],"[outline:none]",te?"cursor-default":"cursor-pointer"),children:[F?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg) transition-[color] duration-(--neba-duration) group-focus-within:text-(--n-accent)",children:F}):null,l("span",{className:"flex min-w-0 flex-1 flex-col",children:[e("span",{className:d("w-full truncate",W?"text-(--neba-muted-fg)":"text-(--neba-fg)"),children:T}),e(t,{samples:V??[]})]})]}),!A||W||te?null:e("button",{type:"button","aria-label":J,className:d(o,"text-(--neba-muted-fg)"),onClick:e=>{e.stopPropagation(),B()},children:e(i,{})})]}),e(r.Portal,{children:e(r.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",sideOffset:M,align:"start",children:e(r.Popup,{initialFocus:!1,className:d(pickerPopupClasses,y[b],popupPaddingClasses[b],s[b],Q),style:popupSlots(ie,3),children:U})})})]}),$?e(a.Description,{id:le,className:d(g[b],"text-(--neba-muted-fg)"),children:$}):null,ae?e(a.Error,{id:ne,match:!0,className:d(g[b],"text-(--n-accent)"),children:z}):null,K?.map((l,n)=>e("input",{type:"hidden",name:l.name,value:l.value},n))]})}export function PickerFooter({size:l,children:n}){return e("div",{className:d("flex items-center justify-end border-t pt-1.5","[border-color:var(--n-line)]",h[l]),children:n})}export function PickerDivider(){return e("div",{"aria-hidden":"true",className:"w-px self-stretch bg-(--n-line)"})}

package/dist/internal/progress.d.ts

@@ -16,7 +16,20 @@
  * first time a page carried both.
  */
 import type * as React from 'react';
-import type { NebaColor, NebaSize } from '../types.js';
+import type { NebaColor, NebaSize, NebaThreshold } from '../types.js';
+/**
+ * Which family a reading has earned.
+ *
+ * A `Meter` and a `GaugeChart` both answer this and had a copy each, which is
+ * the arrangement this folder exists to end: two implementations of "which band
+ * is this number in" is two chances to disagree about a boundary, on the two
+ * components a dashboard is most likely to draw side by side.
+ *
+ * Written as a scan rather than a sort so the array is read in the order it was
+ * given: thresholds are meant to be listed in ascending order, and silently
+ * reordering them would hide the one call site that did not.
+ */
+export declare function thresholdColor(value: number, color: NebaColor, thresholds: readonly NebaThreshold[] | undefined): NebaColor;
 /**
  * The props all three indicators take.
  *
@@ -73,6 +86,16 @@ export declare function progressSlots(color: NebaColor): React.CSSProperties;
  * a rule between two paragraphs, not a third of a button.
  */
 export declare const barThicknessClasses: Record<NebaSize, string>;
+/**
+ * How thick the line is, when a caller says so rather than the ladder.
+ *
+ * In pixels, because that is what the ring's arithmetic already works in and a
+ * bar and a ring should not take the number two different ways. `size` still
+ * decides everything else — the type scale beside the shape, the ring's
+ * diameter — so this is the one measurement pulled out of the step rather than
+ * a second size ladder.
+ */
+export type ProgressThickness = number;
 /**
  * The diameter of the ring, in pixels.
  *