neba 1.2.0 → 1.4.0

package/dist/internal/animate.d.ts

@@ -0,0 +1,175 @@
+/**
+ * The machinery every `Animate*` component runs on, and the `transition` prop
+ * with it.
+ *
+ * It lives in `internal/` for the reason `button-group.ts` and `menu.ts` do:
+ * eleven components need it and none of them should have to import another. The
+ * `transition` prop needs the same table from the other side — a Card and an
+ * `AnimateFade` must produce the same fade, or the library has two fades.
+ *
+ * ## The shape of it
+ *
+ * Every effect is one `@keyframes` in `styles.css` running from a state written
+ * entirely in custom properties to the element's natural one. Nothing here
+ * generates CSS: it fills `--n-anim-*` slots, and the stylesheet decides what
+ * they mean. That is the same split `styleSlots()` makes for colour, for the
+ * same reason — Tailwind only ever sees class names that appear literally in
+ * the source, so a per-value class would not scale past the first prop.
+ *
+ * Because the from-state is the *keyframe* rather than a second class, running
+ * an effect backwards is `animation-direction: reverse` and nothing else. That
+ * is what makes `mode="out"` free on all six.
+ *
+ * ## What is deliberately not here
+ *
+ * An animation that has to know what its children *are* — a marquee that
+ * duplicates them, a headline that swaps between them, a typewriter that
+ * counts characters — cannot be a class name and a few numbers. Those are
+ * components, and their logic stays in their own files.
+ */
+import * as React from 'react';
+import type { NebaAnimateRepeat, NebaAnimateTrigger, NebaAnimation, NebaSide, NebaTransition } from '../types';
+/**
+ * Which keyframe an effect runs.
+ *
+ * `grow` and `zoom` share one: they are the same arithmetic at two strengths,
+ * and a second identical `@keyframes` would only be a second place to fix a
+ * bug. What separates them is their defaults and their origin, which is a
+ * property rather than a keyframe.
+ */
+export declare const animationClasses: Record<NebaAnimation, string>;
+/** The class that reads the slots. Always paired with one of the above. */
+export declare const animBaseClass = "neba-anim";
+/**
+ * How long each effect takes when nobody said.
+ *
+ * They are not one number because they do not travel the same distance. A fade
+ * crosses one axis of opacity; a rotate crosses half a turn and reads as rushed
+ * at the same duration. `blink` is the odd one out — it is a cycle rather than
+ * an arrival, so its number is a period.
+ */
+export declare const defaultDurations: Record<NebaAnimation, number>;
+/** A number is pixels; a string is already a CSS length. */
+export declare function lengthValue(value: number | string): string;
+export declare function isInfinite(repeat: NebaAnimateRepeat | undefined): boolean;
+export interface AnimationSlotOptions {
+    duration: number;
+    delay: number;
+    easing?: string;
+    repeat: NebaAnimateRepeat;
+    alternate?: boolean;
+    mode?: 'in' | 'out';
+    /** Where the animated properties start. Only the ones an effect reads. */
+    opacity?: number;
+    scale?: number;
+    x?: string;
+    y?: string;
+    angle?: string;
+    angleTo?: string;
+}
+/**
+ * The `--n-anim-*` slots, as an inline style object.
+ *
+ * Inline rather than utilities for the reason the colour slots are: these are
+ * per-instance numbers, and Tailwind cannot generate a class for a duration it
+ * has never seen written down.
+ */
+export declare function animationSlots(options: AnimationSlotOptions): React.CSSProperties;
+/**
+ * Which way a slide starts, given the edge it comes from.
+ *
+ * `NebaSide` is physical everywhere in the library, and it stays physical here:
+ * something sliding in from the top of the window comes from the top in every
+ * writing direction.
+ */
+export declare function slideOffsets(from: NebaSide, distance: number | string): {
+    x: string;
+    y: string;
+};
+/**
+ * What a component's `transition` prop turns into: one class pair and a handful
+ * of custom properties, merged into whatever the component was already writing.
+ *
+ * No hook, no ref, no observer — which is the whole design. A component that
+ * offers `transition` gains four lines and no behaviour it has to own, and a
+ * caller who needs a trigger, a replay or a hover reaches for the `Animate*`
+ * component that does exactly that.
+ */
+export declare function transitionProps(transition: NebaTransition | undefined): {
+    className: string;
+    style: React.CSSProperties;
+};
+/**
+ * Whether the reader has asked for less motion.
+ *
+ * The CSS side of this is handled in the stylesheet, where every keyframe is
+ * switched off at once. This is for the three effects whose motion is written
+ * in JavaScript — a typewriter, a headline reel, a measured marquee — where
+ * there is no rule to switch off and the component has to decide for itself
+ * what "still" means.
+ */
+export declare function usePrefersReducedMotion(): boolean;
+export interface AnimationRunOptions {
+    trigger: NebaAnimateTrigger;
+    play?: boolean;
+    once: boolean;
+    threshold: number;
+    paused?: boolean;
+    /** An infinite effect stops when the pointer leaves; a finite one finishes. */
+    infinite: boolean;
+}
+export interface AnimationRun {
+    /** Goes on the animated element. */
+    ref: React.RefCallback<HTMLElement>;
+    /** `running` or `paused`, for `--n-anim-state`. */
+    state: 'running' | 'paused';
+    /** Whether the animation has been let go at all, for `data-state`. */
+    started: boolean;
+    /** Spread onto the element when `trigger` is `hover`; empty otherwise. */
+    handlers: React.HTMLAttributes<HTMLElement>;
+}
+/**
+ * Starts, restarts and holds an animation.
+ *
+ * Two things here are less obvious than they look.
+ *
+ * **Waiting is `animation-play-state: paused`, not a second class.** An
+ * element that has not been triggered yet has to already look like its own
+ * first frame, or a `visible` fade would be fully drawn until it scrolled into
+ * view and then blink out to start. With `fill-mode: both` a paused animation
+ * shows exactly that frame, so waiting and running are one animation in two
+ * states rather than two states to keep in step.
+ *
+ * **Restarting reaches for the DOM.** There is no way to rewind a CSS animation
+ * from React: re-rendering with the same class changes nothing, and a `key`
+ * would restart the animation by unmounting the children, taking their state
+ * with it. Clearing `animation-name`, reading a layout property to force the
+ * style to settle, and putting it back is the one move that rewinds the element
+ * and leaves everything inside it alone.
+ */
+export declare function useAnimationRun({ trigger, play, once, threshold, paused, infinite }: AnimationRunOptions): AnimationRun;
+export interface AnimateElementParams extends AnimationSlotOptions, AnimationRunOptions {
+    /** Which keyframe. `null` for the components that write their own. */
+    effect: NebaAnimation | null;
+}
+export interface AnimateElement {
+    ref: React.RefCallback<HTMLElement>;
+    className: string;
+    style: React.CSSProperties;
+    /** The hover handlers and the two data attributes, ready to be spread. */
+    props: React.HTMLAttributes<HTMLElement> & Record<string, unknown>;
+}
+/**
+ * Everything an `Animate*` root needs, in one call.
+ *
+ * The six effect components differ only in their defaults and in which slots
+ * they fill, so this is where the identical two-thirds of each of them lives.
+ * The four that have to understand their children — Typing, Marquee, Headline,
+ * Appear — call `useAnimationRun` directly and put the classes where their own
+ * structure needs them, which is why `effect` is allowed to be `null`.
+ *
+ * `data-neba-animation` and `data-state` are here rather than in each component
+ * because they are the same two facts every time, and because a test that has
+ * to assert on a class name is a test that breaks when a class name changes.
+ */
+export declare function useAnimateElement(params: AnimateElementParams): AnimateElement;

package/dist/internal/animate.js

@@ -0,0 +1 @@
+import*as e from"react";export const animationClasses={fade:"neba-anim-fade",grow:"neba-anim-scale",slide:"neba-anim-slide",zoom:"neba-anim-scale",rotate:"neba-anim-rotate",blink:"neba-anim-blink"};export const animBaseClass="neba-anim";export const defaultDurations={fade:320,grow:340,slide:380,zoom:340,rotate:460,blink:900};export function lengthValue(e){return"number"==typeof e?`${e}px`:e}export function isInfinite(e){return"infinite"===e}export function animationSlots(e){const n={"--n-anim-duration":`${e.duration}ms`,"--n-anim-delay":`${e.delay}ms`,"--n-anim-repeat":(i=e.repeat,"infinite"===i?"infinite":String(i)),"--n-anim-direction":(t=e.mode??"in",a=e.alternate,"out"===t?a?"alternate-reverse":"reverse":a?"alternate":"normal")};var t,a,i;return e.easing&&(n["--n-anim-ease"]=e.easing),void 0!==e.opacity&&(n["--n-anim-opacity"]=String(e.opacity)),void 0!==e.scale&&(n["--n-anim-scale"]=String(e.scale)),void 0!==e.x&&(n["--n-anim-x"]=e.x),void 0!==e.y&&(n["--n-anim-y"]=e.y),void 0!==e.angle&&(n["--n-anim-angle"]=e.angle),void 0!==e.angleTo&&(n["--n-anim-angle-to"]=e.angleTo),n}export function slideOffsets(e,n){const t=lengthValue(n),a="number"==typeof n?-n+"px":`calc(-1 * ${t})`;switch(e){case"top":return{x:"0px",y:a};case"bottom":return{x:"0px",y:t};case"left":return{x:a,y:"0px"};default:return{x:t,y:"0px"}}}export function transitionProps(e){if(!e)return{className:"",style:{}};const n="string"==typeof e?{type:e}:e,{type:t}=n,a={duration:n.duration??defaultDurations[t],delay:n.delay??0,easing:n.easing,repeat:n.repeat??("blink"===t?"infinite":1),alternate:n.alternate};if("grow"!==t&&"zoom"!==t||(a.scale=n.scale??("zoom"===t?.4:.8)),"slide"===t){const{x:e,y:t}=slideOffsets(n.from??"bottom",n.distance??"100%");a.x=e,a.y=t}return"rotate"===t&&(a.angle=`${n.angle??-180}deg`),{className:`neba-anim ${animationClasses[t]}`,style:animationSlots(a)}}export function usePrefersReducedMotion(){const[n,t]=e.useState(!1);return e.useEffect(()=>{if("undefined"==typeof window||!window.matchMedia)return;const e=window.matchMedia("(prefers-reduced-motion: reduce)");t(e.matches);const n=e=>t(e.matches);return e.addEventListener("change",n),()=>e.removeEventListener("change",n)},[]),n}export function useAnimationRun({trigger:n,play:t,once:a,threshold:i,paused:o,infinite:r}){const s=e.useRef(null),[c,l]=e.useState("mount"===n),[u,m]=e.useState(0),d=e.useCallback(()=>{l(!0),m(e=>e+1)},[]);e.useLayoutEffect(()=>{const e=s.current;if(!e||0===u)return;const n=[e,...e.querySelectorAll(".neba-anim, .neba-marquee-track")];for(const e of n)e.style.animationName="none";e.offsetWidth;for(const e of n)e.style.animationName=""},[u]),e.useEffect(()=>{if("visible"!==n)return;const e=s.current;if(!e||"undefined"==typeof IntersectionObserver)return void l(!0);const t=new IntersectionObserver(([e])=>{e.isIntersecting?(d(),a&&t.disconnect()):a||l(!1)},{threshold:i});return t.observe(e),()=>t.disconnect()},[n,a,i,d]),e.useEffect(()=>{"manual"===n&&(t?d():l(!1))},[n,t,d]);const f="hover"===n?{onPointerEnter:d,onFocus:d,onPointerLeave:()=>{r&&l(!1)},onBlur:()=>{r&&l(!1)}}:{};return{ref:e.useCallback(e=>{s.current=e},[]),state:c&&!o?"running":"paused",started:c,handlers:f}}export function useAnimateElement(e){const{effect:n,trigger:t,play:a,once:i,threshold:o,paused:r,infinite:s,...c}=e,l=useAnimationRun({trigger:t,play:a,once:i,threshold:o,paused:r,infinite:s});return{ref:l.ref,className:n?`neba-anim ${animationClasses[n]}`:"",style:{...animationSlots(c),"--n-anim-state":l.state},props:{...l.handlers,"data-neba-animation":n??void 0,"data-state":l.state}}}

package/dist/internal/color.d.ts

@@ -0,0 +1,108 @@
+/**
+ * Colour arithmetic, written out rather than installed.
+ *
+ * ColorPicker is the only component that has to *compute* a colour rather than
+ * name one, and the whole of what it needs is here: three representations, the
+ * conversions between them, one parser and one formatter. It is a hundred lines
+ * of trigonometry-free arithmetic, which is the entire reason the library still
+ * has one runtime dependency.
+ *
+ * Two decisions worth knowing before reading:
+ *
+ * - **HSV is the model the panel is drawn in, and it never leaves.** A
+ *   saturation/value square with a hue rail beside it *is* HSV, so the picker
+ *   keeps its state that way and converts on the way out. Round-tripping
+ *   through RGB instead would lose the hue of every greyscale colour — black is
+ *   `#000` at every hue — and the rail would jump to red the moment the pointer
+ *   reached a corner.
+ * - **`alpha` is 0–1, everything else is what CSS says it is.** `h` is degrees,
+ *   `s`/`v`/`l` are percentages, `r`/`g`/`b` are 0–255. No component invents a
+ *   normalised unit, because every one of these numbers is eventually written
+ *   into a string a human reads.
+ *
+ * Nothing here is exported from `src/index.ts`. It is the library talking to
+ * itself, in the sense that `internal/` always means.
+ */
+/** 0–255 per channel, the way a hex triplet and `rgb()` both spell it. */
+export interface Rgb {
+    r: number;
+    g: number;
+    b: number;
+}
+/** `h` in degrees, `s` and `v` as percentages. The panel's own model. */
+export interface Hsv {
+    h: number;
+    s: number;
+    v: number;
+}
+/** `h` in degrees, `s` and `l` as percentages. Only ever an output format. */
+export interface Hsl {
+    h: number;
+    s: number;
+    l: number;
+}
+/** A colour and how much of it there is. `alpha` is 0–1. */
+export interface ColorValue {
+    hsv: Hsv;
+    alpha: number;
+}
+/** The three ways the picker will write a colour back out. */
+export type ColorFormat = 'hex' | 'rgb' | 'hsl';
+export declare function clamp(value: number, min: number, max: number): number;
+export declare function hsvToRgb({ h, s, v }: Hsv): Rgb;
+export declare function rgbToHsv({ r, g, b }: Rgb): Hsv;
+export declare function rgbToHsl({ r, g, b }: Rgb): Hsl;
+export declare function hslToRgb({ h, s, l }: Hsl): Rgb;
+/**
+ * A CSS colour string, or `null` if it is not one this understands.
+ *
+ * Hex in all four lengths, `rgb()`/`rgba()` and `hsl()`/`hsla()` in both the
+ * comma and the space syntax. Named colours and `color()` are deliberately out:
+ * a picker has to be able to write every value it can read, and there is no
+ * honest way back from `rebeccapurple` to a point on the panel.
+ */
+export declare function parseColor(input: string): ColorValue | null;
+export declare function rgbToHex({ r, g, b }: Rgb, alpha?: number): string;
+/**
+ * The value the component hands back, in whichever notation was asked for.
+ *
+ * `hex` drops the alpha pair when the colour is opaque, and the two functional
+ * forms drop the fourth argument for the same reason — a caller who never
+ * turned `alpha` on should never see `rgba(…, 1)` come out of a control they
+ * only used three channels of.
+ */
+export declare function formatColor(hsv: Hsv, alpha: number, format: ColorFormat): string;
+/** A plain `rgb()` for the swatches and rails, where alpha is drawn separately. */
+export declare function cssColor(hsv: Hsv, alpha?: number): string;
+/**
+ * Black or white, whichever can be read on top of this colour.
+ *
+ * The tick on a chosen swatch is the only thing the picker draws *on* an
+ * arbitrary colour, and a fixed white tick disappears on yellow. The threshold
+ * is relative luminance rather than plain lightness, because the eye weighs
+ * green about six times as heavily as blue and a colour model that pretends
+ * otherwise puts the tick the wrong way round on both.
+ */
+export declare function readableInk(hsv: Hsv): string;
+/**
+ * The swatches a picker shows when it was given none.
+ *
+ * Deliberately not the library's own six families: those are semantic roles and
+ * a picker is asked for a colour, not for a meaning. This is a plain spectrum
+ * plus the greys — the row somebody reaches for when they are labelling a
+ * calendar, a tag or a project, which is what a colour picker in an application
+ * is nearly always for.
+ */
+export declare const defaultSwatches: readonly string[];
+/**
+ * The chequerboard behind a translucent colour, as a background shorthand.
+ *
+ * Two conic gradients would be one declaration fewer, but a chequer drawn with
+ * conic gradients has a seam down the middle of every tile on a fractional
+ * device pixel ratio. Four linear stops at 45° do not.
+ */
+export declare const checkerBackground: {
+    readonly backgroundImage: "linear-gradient(45deg, var(--neba-border) 25%, transparent 25%), linear-gradient(-45deg, var(--neba-border) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--neba-border) 75%), linear-gradient(-45deg, transparent 75%, var(--neba-border) 75%)";
+    readonly backgroundSize: "8px 8px";
+    readonly backgroundPosition: "0 0, 0 4px, 4px -4px, -4px 0";
+};

package/dist/internal/color.js

@@ -0,0 +1 @@
+export function clamp(r,n,t){return r<n?n:r>t?t:r}function r(r){const n=r%360;return n<0?n+360:n}function n(r){return Math.round(r)}export function hsvToRgb({h:t,s:e,v:o}){const a=r(t)/60,s=clamp(e,0,100)/100,c=clamp(o,0,100)/100,g=c*s,u=g*(1-Math.abs(a%2-1)),l=c-g,b=Math.floor(a)%6,[i,f,h]=[[g,u,0],[u,g,0],[0,g,u],[0,u,g],[u,0,g],[g,0,u]][b];return{r:n(255*(i+l)),g:n(255*(f+l)),b:n(255*(h+l))}}export function rgbToHsv({r:n,g:t,b:e}){const o=clamp(n,0,255)/255,a=clamp(t,0,255)/255,s=clamp(e,0,255)/255,c=Math.max(o,a,s),g=c-Math.min(o,a,s);let u=0;return 0!==g&&(u=c===o?(a-s)/g%6:c===a?(s-o)/g+2:(o-a)/g+4),{h:r(60*u),s:0===c?0:g/c*100,v:100*c}}export function rgbToHsl({r:r,g:n,b:t}){const{h:e,s:o,v:a}=rgbToHsv({r:r,g:n,b:t}),s=a/100,c=s*(1-o/100/2),g=Math.min(c,1-c);return{h:e,s:0===g?0:(s-c)/g*100,l:100*c}}export function hslToRgb({h:r,s:n,l:t}){const e=clamp(t,0,100)/100,o=e+clamp(n,0,100)/100*Math.min(e,1-e);return hsvToRgb({h:r,s:0===o?0:2*(1-e/o)*100,v:100*o})}const t=/^#?([0-9a-f]{3,8})$/i;export function parseColor(r){const n=r.trim().toLowerCase();if(!n)return null;if(n.startsWith("#")||t.test(n))return function(r){const n=t.exec(r.trim());if(!n)return null;const e=n[1],o=3===e.length||4===e.length?[...e].map(r=>r+r).join(""):e;if(6!==o.length&&8!==o.length)return null;const a=r=>parseInt(o.slice(2*r,2*r+2),16);return{hsv:rgbToHsv({r:a(0),g:a(1),b:a(2)}),alpha:8===o.length?a(3)/255:1}}(n);const e=/^(rgba?|hsla?)\((.*)\)$/.exec(n);if(!e)return null;const[,o,a]=e,s=function(r){return(r.match(/-?[\d.]+%?/g)??[]).map(r=>(r.endsWith("%"),parseFloat(r)))}(a);if(s.length<3||s.some(Number.isNaN))return null;const c=function(r,n,t){if(n.length<=t)return 1;const e=r.match(/-?[\d.]+%?/g)??[];return clamp(e[t]?.endsWith("%")?n[t]/100:n[t],0,1)}(a,s,3);return o.startsWith("rgb")?{hsv:rgbToHsv({r:s[0],g:s[1],b:s[2]}),alpha:c}:{hsv:rgbToHsv(hslToRgb({h:s[0],s:s[1],l:s[2]})),alpha:c}}function e(r){return clamp(n(r),0,255).toString(16).padStart(2,"0")}export function rgbToHex({r:r,g:n,b:t},o=1){const a=`#${e(r)}${e(n)}${e(t)}`;return o>=1?a:`${a}${e(255*o)}`}function o(r){return String(Math.round(100*clamp(r,0,1))/100)}export function formatColor(r,t,e){const a=hsvToRgb(r);if("hex"===e)return rgbToHex(a,t);if("rgb"===e){const r=`${n(a.r)}, ${n(a.g)}, ${n(a.b)}`;return t>=1?`rgb(${r})`:`rgba(${r}, ${o(t)})`}const{h:s,s:c,l:g}=rgbToHsl(a),u=`${n(s)}, ${n(c)}%, ${n(g)}%`;return t>=1?`hsl(${u})`:`hsla(${u}, ${o(t)})`}export function cssColor(r,n=1){const{r:t,g:e,b:a}=hsvToRgb(r);return n>=1?`rgb(${t}, ${e}, ${a})`:`rgba(${t}, ${e}, ${a}, ${o(n)})`}export function readableInk(r){const{r:n,g:t,b:e}=hsvToRgb(r),o=r=>{const n=r/255;return n<=.03928?n/12.92:((n+.055)/1.055)**2.4};return.2126*o(n)+.7152*o(t)+.0722*o(e)>.42?"#000000":"#ffffff"}export const defaultSwatches=["#000000","#4b5563","#9ca3af","#ffffff","#ef4444","#f97316","#f59e0b","#84cc16","#22c55e","#14b8a6","#06b6d4","#3b82f6","#6366f1","#8b5cf6","#d946ef","#ec4899"];export const checkerBackground={backgroundImage:"linear-gradient(45deg, var(--neba-border) 25%, transparent 25%), linear-gradient(-45deg, var(--neba-border) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--neba-border) 75%), linear-gradient(-45deg, transparent 75%, var(--neba-border) 75%)",backgroundSize:"8px 8px",backgroundPosition:"0 0, 0 4px, 4px -4px, -4px 0"};

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

@@ -0,0 +1,170 @@
+/**
+ * The arithmetic a DataTable is made of.
+ *
+ * Here rather than in the component for the reason `progress.ts` and `color.ts`
+ * are here: none of it is layout and none of it is a class name. Sorting rows,
+ * matching a query against them, cutting a page out of the result and working
+ * out which twenty of forty thousand rows are actually on screen are four
+ * questions with numeric answers, and a component file that also has to draw a
+ * resize handle is not where they can be read.
+ *
+ * `color.ts` is the precedent for a single-consumer file: the test is whether
+ * the thing is separable, not whether two components happen to want it. Every
+ * function below takes plain values and returns plain values — there is no
+ * React in this file, and nothing in it knows what a column is.
+ */
+import type { NebaDensity, NebaSize } from '../types';
+/**
+ * Row height, in **pixels**, and the one number in the library that has to be a
+ * number rather than a class.
+ *
+ * Virtual scrolling is arithmetic on this value: how far down the list a scroll
+ * offset lands, how tall the spacer above the first rendered row is, how many
+ * rows fit in the viewport for PageDown. A Tailwind class cannot be added up.
+ *
+ * The ladder is deliberately below `controlHeightClasses` at every step — 28px
+ * at `md` against a Button's 32 — because a DataTable is a hundred rows on one
+ * screen and a Table is eight. A row here is the height of the text plus enough
+ * air to click, and nothing more; `density` is what takes the last of the air
+ * out. A caller who puts a Chip or an Avatar in a cell raises `rowHeight`.
+ */
+export declare const dataRowHeights: Record<NebaDensity, Record<NebaSize, number>>;
+/**
+ * The header, one step taller than the rows under it.
+ *
+ * A fixed number rather than "whatever the content measures", because a sticky
+ * header over a group row needs an offset to stick the second row at, and a
+ * measured one would be a layout read on every scroll frame.
+ */
+export declare const dataHeaderHeights: Record<NebaDensity, Record<NebaSize, number>>;
+/**
+ * The tick column, and the resize handle's grab area.
+ *
+ * The tick column is `tickSizeClasses` plus the two padding tracks, rounded to
+ * a whole pixel: a column narrower than the box in it clips the focus ring.
+ */
+export declare const dataTickWidths: Record<NebaSize, number>;
+/** How wide a column is when neither the caller nor a drag has said. */
+export declare const defaultColumnWidth = 160;
+/** How narrow a drag may make one. Below this the heading is a single letter. */
+export declare const minColumnWidth = 48;
+export type SortDirection = 'asc' | 'desc';
+/** One key of a sort, and which way it runs. */
+export interface SortEntry {
+    key: string;
+    direction: SortDirection;
+}
+/**
+ * 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 the wrong question.
+ *
+ * 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): number;
+/**
+ * Sorts by every key at once, 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.
+ *
+ * `comparatorFor` returns `null` for a key no column claims, so a sort left
+ * over from a column that has since been removed is skipped rather than
+ * throwing.
+ */
+export declare function sortRows<T>(rows: readonly T[], sort: readonly SortEntry[], comparatorFor: (key: string) => ((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 caller cannot get back to by pressing
+ * anything if the cycle only has two. This is the opposite of the choice
+ * TreeView's single select makes, and for the same reason: there, "nothing
+ * chosen" is reachable by pressing something else; here it is not.
+ *
+ * `additive` is what a Shift-click sets. It keeps 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 silently make it the first.
+ */
+export declare function nextSort(current: readonly SortEntry[], key: string, additive: boolean): SortEntry[];
+/**
+ * A cell value as something a query can be matched against.
+ *
+ * Case-folded and stripped of combining marks, so `jose` finds `José` and
+ * `SEOUL` finds `Seoul`. `NFD` splits an accented letter into the letter and
+ * its accent and the range then deletes the accent; a search field is the one
+ * place where losing that distinction is the point.
+ *
+ * A `Date` is deliberately *not* formatted here. What a reader sees in the cell
+ * came out of the caller's `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 that wants its dates searchable gives them a `value`.
+ */
+export declare function searchText(value: unknown): string;
+/** Where one page starts and stops, and how many there are. */
+export interface PageBounds {
+    /** 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: a filter that cuts a
+ * twenty-page table to three leaves the caller's `page` at 14, 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): PageBounds;
+/** Which rows are rendered, and how much empty space stands in for the rest. */
+export interface VirtualWindow {
+    /** Index of the first row rendered. */
+    start: number;
+    /** One past the last. */
+    end: number;
+    /** The height of the spacer row above, in pixels. */
+    before: number;
+    /** And of the one below. */
+    after: number;
+}
+/**
+ * The rows a scroll offset puts on screen, plus a margin either side.
+ *
+ * Two spacer rows rather than a translated `<tbody>`: a transform on the body
+ * of a table breaks `position: sticky` on the header above it, and the library
+ * has a rule about transforms anyway. Padding is also what keeps the scrollbar
+ * honest — the scroll height is the real one, so dragging the thumb to the
+ * middle lands in the middle of the data.
+ *
+ * `viewport` of `0` is the first render, before anything has been measured. It
+ * cannot mean "no rows" — the layout effect that measures runs after a render
+ * and there would be nothing to measure — so it renders a screen's worth on
+ * spec and corrects before the frame is painted.
+ */
+export declare function virtualWindow(scrollTop: number, viewport: number, rowHeight: number, count: number, overscan: number): VirtualWindow;
+/**
+ * Every key between two, inclusive, in the order the rows are currently in.
+ *
+ * "Currently" is the point: a Shift-click selects what the reader can see
+ * between the two rows they clicked, so the range is taken from the sorted,
+ * filtered order rather than from the order `items` arrived in. Which of the
+ * two keys is the anchor does not matter — dragging up selects the same rows as
+ * dragging down.
+ *
+ * A key that is no longer in the list (a row the current filter hides) yields
+ * an empty range rather than a range from one end, which is what an index of
+ * `-1` would silently produce.
+ */
+export declare function keysBetween(order: readonly string[], from: string, to: string): string[];

package/dist/internal/data-table.js

@@ -0,0 +1 @@
+export const dataRowHeights={default:{xs:24,sm:28,md:32,lg:38,xl:44},compact:{xs:20,sm:24,md:28,lg:32,xl:38}};export const dataHeaderHeights={default:{xs:28,sm:32,md:36,lg:42,xl:48},compact:{xs:24,sm:28,md:32,lg:36,xl:42}};export const dataTickWidths={xs:30,sm:34,md:38,lg:42,xl:50};export const defaultColumnWidth=160;export const minColumnWidth=48;export function compareValues(t,e,n){const o=null==t||""===t,r=null==e||""===e;return o||r?o&&r?0:o?1:-1:"number"==typeof t&&"number"==typeof e?Number.isNaN(t)||Number.isNaN(e)?Number.isNaN(t)&&Number.isNaN(e)?0:Number.isNaN(t)?1:-1:t-e:"boolean"==typeof t&&"boolean"==typeof e?Number(t)-Number(e):t instanceof Date&&e instanceof Date?t.getTime()-e.getTime():n.compare(String(t),String(e))}export function sortRows(t,e,n){if(0===e.length)return t;const o=e.map(t=>{const e=n(t.key);return e?{compare:e,sign:"desc"===t.direction?-1:1}:null}).filter(t=>null!==t);return 0===o.length?t:[...t].sort((t,e)=>{for(const n of o){const o=n.compare(t,e);if(0!==o)return o*n.sign}return 0})}export function nextSort(t,e,n){const o=t.find(t=>t.key===e),r=void 0===o?"asc":"asc"===o.direction?"desc":null;return n?null===r?t.filter(t=>t.key!==e):void 0===o?[...t,{key:e,direction:r}]:t.map(t=>t.key===e?{key:e,direction:r}:t):null===r?[]:[{key:e,direction:r}]}export function searchText(t){return null==t||"object"==typeof t?"":String(t).normalize("NFD").replace(/[\u0300-\u036f]/g,"").toLowerCase()}export function pageBounds(t,e,n){const o=Math.max(1,Math.floor(n)),r=Math.max(1,Math.ceil(t/o)),a=Math.min(Math.max(Math.floor(e),1),r),i=(a-1)*o;return{pages:r,page:a,start:i,end:Math.min(i+o,t)}}export function virtualWindow(t,e,n,o,r){const a=e>0?Math.ceil(e/n):3*r,i=Math.max(0,Math.floor(t/n)-r),s=Math.min(o,i+a+2*r);return{start:i,end:s,before:i*n,after:Math.max(0,(o-s)*n)}}export function keysBetween(t,e,n){const o=t.indexOf(e),r=t.indexOf(n);return-1===o||-1===r?[]:t.slice(Math.min(o,r),Math.max(o,r)+1)}

package/dist/internal/i18n.d.ts

@@ -62,6 +62,71 @@ export interface NebaMessages {
         /** What the three dots mean. */
         typing: string;
     };
+    /** Empty. */
+    empty: {
+        /**
+         * The headline over a region with nothing in it.
+         *
+         * The one string in here that is *drawn* at full size rather than read out
+         * or written on a button, and it is here for the same reason the rest are:
+         * an empty state has nothing to take its words from. What is missing is the
+         * caller's — a search, an inbox, a folder — so the default says only that
+         * there is nothing, and anything more specific is the `title` prop.
+         */
+        title: string;
+    };
+    /**
+     * DataTable.
+     *
+     * A DataTable is the one component in the library that draws chrome of its
+     * own — a search field, a header tick that chooses everything at once, a
+     * footer counting what is on screen — so it is also the one that has the most
+     * to say without being handed the words.
+     */
+    table: {
+        /** Placeholder and accessible name of the search field. */
+        search: string;
+        /** The tick in the header row, which chooses every row at once. */
+        selectAll: string;
+        /** The tick on a row. */
+        selectRow: string;
+        /** Beside the footer's page-size Select. */
+        rowsPerPage: string;
+        /**
+         * Which rows are on screen, out of how many there are. `{start}`, `{end}`
+         * and `{total}` are replaced with the numbers, already formatted for the
+         * locale — a template rather than three fragments, because the order the
+         * three appear in is exactly what differs between languages.
+         */
+        range: string;
+        /** How many rows are chosen. `{count}` is replaced the same way. */
+        selected: string;
+    };
+    /**
+     * ColorPicker.
+     *
+     * All but one of these are names for something with no text on it: a square
+     * of colour, two rails, a grid of swatches. A control a sighted reader
+     * understands from a glance at a gradient is a control that says nothing at
+     * all without them, which makes this the one namespace here where the strings
+     * are the entire accessible interface rather than a convenience on top of it.
+     */
+    color: {
+        /** The saturation/brightness square. */
+        area: string;
+        /** The rail beside it. */
+        hue: string;
+        /** The rail below that, when `alpha` is on. */
+        alpha: string;
+        /** The field the colour can be typed into. */
+        value: string;
+        /** The grid of ready-made colours. */
+        swatches: string;
+        /** The × that empties the control. */
+        clear: string;
+        /** What the trigger reads before anything has been chosen. */
+        empty: string;
+    };
 }
 /**
  * The strings for a locale, merged over English.
@@ -76,3 +141,14 @@ export interface NebaMessages {
 export declare function resolveMessages(locale?: string): NebaMessages;
 /** The same, as a hook, for the components that read it during a render. */
 export declare function useMessages(locale?: string): NebaMessages;
+/**
+ * Fills the `{placeholders}` in one of the strings above.
+ *
+ * Two of them carry numbers, and neither could be assembled out of fragments:
+ * "1–25 of 1,204" is "전체 1,204개 중 1–25" in Korean and "1,204 kayıttan 1–25"
+ * in Turkish, so what differs between languages is the *order*, which only a
+ * whole sentence can state. A `{name}` with no value is left alone rather than
+ * blanked, so a mistranslated placeholder shows up as itself instead of as a
+ * hole in the middle of a sentence.
+ */
+export declare function fillMessage(template: string, values: Record<string, string>): string;

package/dist/internal/i18n.js

@@ -1 +1 @@
-import*as e from"react";const n={link:{newTab:"(opens in a new tab)"},spoiler:{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"},chat:{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"}},i={ko:{link:{newTab:"(새 창에서 열림)"},spoiler:{reveal:"내용 보기",hide:"숨기기",notice:"스포일러가 포함되어 있을 수 있습니다"},chat:{sending:"보내는 중",sent:"보냄",delivered:"전달됨",read:"읽음",failed:"전송 실패",typing:"입력 중…"}},ja:{link:{newTab:"(新しいタブで開きます)"},spoiler:{reveal:"表示する",hide:"隠す",notice:"ネタバレを含む可能性があります"},chat:{sending:"送信中",sent:"送信済み",delivered:"配信済み",read:"既読",failed:"送信できませんでした",typing:"入力中…"}},"zh-hans":{link:{newTab:"(在新标签页中打开)"},spoiler:{reveal:"显示内容",hide:"隐藏",notice:"此内容可能包含剧透"},chat:{sending:"发送中",sent:"已发送",delivered:"已送达",read:"已读",failed:"发送失败",typing:"正在输入…"}},"zh-hant":{link:{newTab:"(在新分頁中開啟)"},spoiler:{reveal:"顯示內容",hide:"隱藏",notice:"此內容可能包含劇透"},chat:{sending:"傳送中",sent:"已傳送",delivered:"已送達",read:"已讀",failed:"傳送失敗",typing:"正在輸入…"}},es:{link:{newTab:"(se abre en una pestaña nueva)"},spoiler:{reveal:"Mostrar",hide:"Ocultar",notice:"Puede contener spoilers"},chat:{sending:"Enviando",sent:"Enviado",delivered:"Entregado",read:"Leído",failed:"No enviado",typing:"Escribiendo…"}},pt:{link:{newTab:"(abre em uma nova aba)"},spoiler:{reveal:"Mostrar",hide:"Ocultar",notice:"Pode conter spoilers"},chat:{sending:"Enviando",sent:"Enviado",delivered:"Entregue",read:"Lido",failed:"Não enviado",typing:"Digitando…"}},fr:{link:{newTab:"(s’ouvre dans un nouvel onglet)"},spoiler:{reveal:"Afficher",hide:"Masquer",notice:"Peut contenir des spoilers"},chat:{sending:"Envoi en cours",sent:"Envoyé",delivered:"Distribué",read:"Lu",failed:"Non envoyé",typing:"En train d’écrire…"}},de:{link:{newTab:"(wird in einem neuen Tab geöffnet)"},spoiler:{reveal:"Anzeigen",hide:"Ausblenden",notice:"Kann Spoiler enthalten"},chat:{sending:"Wird gesendet",sent:"Gesendet",delivered:"Zugestellt",read:"Gelesen",failed:"Nicht gesendet",typing:"Schreibt…"}},it:{link:{newTab:"(si apre in una nuova scheda)"},spoiler:{reveal:"Mostra",hide:"Nascondi",notice:"Può contenere spoiler"},chat:{sending:"Invio in corso",sent:"Inviato",delivered:"Consegnato",read:"Letto",failed:"Non inviato",typing:"Sta scrivendo…"}},nl:{link:{newTab:"(opent in een nieuw tabblad)"},spoiler:{reveal:"Tonen",hide:"Verbergen",notice:"Kan spoilers bevatten"},chat:{sending:"Wordt verzonden",sent:"Verzonden",delivered:"Afgeleverd",read:"Gelezen",failed:"Niet verzonden",typing:"Aan het typen…"}},pl:{link:{newTab:"(otwiera się w nowej karcie)"},spoiler:{reveal:"Pokaż",hide:"Ukryj",notice:"Może zawierać spoilery"},chat:{sending:"Wysyłanie",sent:"Wysłano",delivered:"Dostarczono",read:"Przeczytano",failed:"Nie wysłano",typing:"Pisze…"}},ru:{link:{newTab:"(откроется в новой вкладке)"},spoiler:{reveal:"Показать",hide:"Скрыть",notice:"Может содержать спойлеры"},chat:{sending:"Отправляется",sent:"Отправлено",delivered:"Доставлено",read:"Прочитано",failed:"Не отправлено",typing:"Печатает…"}},tr:{link:{newTab:"(yeni sekmede açılır)"},spoiler:{reveal:"Göster",hide:"Gizle",notice:"Spoiler içerebilir"},chat:{sending:"Gönderiliyor",sent:"Gönderildi",delivered:"İletildi",read:"Okundu",failed:"Gönderilemedi",typing:"Yazıyor…"}},ar:{link:{newTab:"(يفتح في علامة تبويب جديدة)"},spoiler:{reveal:"إظهار",hide:"إخفاء",notice:"قد يحتوي على حرق للأحداث"},chat:{sending:"جارٍ الإرسال",sent:"تم الإرسال",delivered:"تم التسليم",read:"تمت القراءة",failed:"لم يتم الإرسال",typing:"يكتب الآن…"}},hi:{link:{newTab:"(नए टैब में खुलता है)"},spoiler:{reveal:"दिखाएँ",hide:"छिपाएँ",notice:"इसमें स्पॉइलर हो सकते हैं"},chat:{sending:"भेजा जा रहा है",sent:"भेजा गया",delivered:"डिलीवर हुआ",read:"पढ़ा गया",failed:"नहीं भेजा गया",typing:"टाइप कर रहे हैं…"}},id:{link:{newTab:"(terbuka di tab baru)"},spoiler:{reveal:"Tampilkan",hide:"Sembunyikan",notice:"Mungkin mengandung spoiler"},chat:{sending:"Mengirim",sent:"Terkirim",delivered:"Diterima",read:"Dibaca",failed:"Gagal terkirim",typing:"Sedang mengetik…"}},vi:{link:{newTab:"(mở trong tab mới)"},spoiler:{reveal:"Hiện nội dung",hide:"Ẩn",notice:"Có thể chứa nội dung tiết lộ"},chat:{sending:"Đang gửi",sent:"Đã gửi",delivered:"Đã nhận",read:"Đã xem",failed:"Chưa gửi được",typing:"Đang nhập…"}},th:{link:{newTab:"(เปิดในแท็บใหม่)"},spoiler:{reveal:"แสดงเนื้อหา",hide:"ซ่อน",notice:"อาจมีการเปิดเผยเนื้อหา"},chat:{sending:"กำลังส่ง",sent:"ส่งแล้ว",delivered:"ส่งถึงแล้ว",read:"อ่านแล้ว",failed:"ส่งไม่สำเร็จ",typing:"กำลังพิมพ์…"}}},a={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 t=new Map([["",n]]);export function resolveMessages(e){const r=e?.trim()??"",d=t.get(r);if(d)return d;const l=function(e){const n=e.toLowerCase().split(/[-_]/).filter(Boolean),i=n[0];if(!i)return[];const a=n.slice(1),t=a.find(e=>/^[a-z]{4}$/.test(e)),r=a.find(e=>/^([a-z]{2}|\d{3})$/.test(e));return[t?`${i}-${t}`:"",r?`${i}-${r}`:"",i].filter(Boolean)}(r).map(e=>i[e]??i[a[e]??""]).find(Boolean),o=l?{link:{...n.link,...l.link},spoiler:{...n.spoiler,...l.spoiler},chat:{...n.chat,...l.chat}}:n;return t.set(r,o),o}export function useMessages(n){return e.useMemo(()=>resolveMessages(n),[n])}
+import*as e from"react";const a={link:{newTab:"(opens in a new tab)"},spoiler:{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"},chat:{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"},empty:{title:"Nothing here"},table:{search:"Search",selectAll:"Select all rows",selectRow:"Select row",rowsPerPage:"Rows per page",range:"{start}–{end} of {total}",selected:"{count} selected"},color:{area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Preset colours",clear:"Clear",empty:"Choose a colour"}},t={ko:{link:{newTab:"(새 창에서 열림)"},spoiler:{reveal:"내용 보기",hide:"숨기기",notice:"스포일러가 포함되어 있을 수 있습니다"},chat:{sending:"보내는 중",sent:"보냄",delivered:"전달됨",read:"읽음",failed:"전송 실패",typing:"입력 중…"},empty:{title:"내용이 없습니다"},table:{search:"검색",selectAll:"모든 행 선택",selectRow:"행 선택",rowsPerPage:"페이지당 행 수",range:"전체 {total}개 중 {start}–{end}",selected:"{count}개 선택됨"},color:{area:"채도와 명도",hue:"색상",alpha:"불투명도",value:"색상 값",swatches:"기본 색상",clear:"지우기",empty:"색상 선택"}},ja:{link:{newTab:"(新しいタブで開きます)"},spoiler:{reveal:"表示する",hide:"隠す",notice:"ネタバレを含む可能性があります"},chat:{sending:"送信中",sent:"送信済み",delivered:"配信済み",read:"既読",failed:"送信できませんでした",typing:"入力中…"},empty:{title:"表示するものがありません"},table:{search:"検索",selectAll:"すべての行を選択",selectRow:"行を選択",rowsPerPage:"1 ページの行数",range:"{total} 件中 {start}–{end} 件",selected:"{count} 件を選択中"},color:{area:"彩度と明度",hue:"色相",alpha:"不透明度",value:"カラー値",swatches:"プリセットの色",clear:"クリア",empty:"色を選択"}},"zh-hans":{link:{newTab:"(在新标签页中打开)"},spoiler:{reveal:"显示内容",hide:"隐藏",notice:"此内容可能包含剧透"},chat:{sending:"发送中",sent:"已发送",delivered:"已送达",read:"已读",failed:"发送失败",typing:"正在输入…"},empty:{title:"暂无内容"},table:{search:"搜索",selectAll:"全选所有行",selectRow:"选择此行",rowsPerPage:"每页行数",range:"第 {start}–{end} 行，共 {total} 行",selected:"已选择 {count} 行"},color:{area:"饱和度和明度",hue:"色相",alpha:"不透明度",value:"颜色值",swatches:"预设颜色",clear:"清除",empty:"选择颜色"}},"zh-hant":{link:{newTab:"(在新分頁中開啟)"},spoiler:{reveal:"顯示內容",hide:"隱藏",notice:"此內容可能包含劇透"},chat:{sending:"傳送中",sent:"已傳送",delivered:"已送達",read:"已讀",failed:"傳送失敗",typing:"正在輸入…"},empty:{title:"沒有內容"},table:{search:"搜尋",selectAll:"全選所有列",selectRow:"選擇此列",rowsPerPage:"每頁列數",range:"第 {start}–{end} 列，共 {total} 列",selected:"已選擇 {count} 列"},color:{area:"飽和度與明度",hue:"色相",alpha:"不透明度",value:"顏色值",swatches:"預設顏色",clear:"清除",empty:"選擇顏色"}},es:{link:{newTab:"(se abre en una pestaña nueva)"},spoiler:{reveal:"Mostrar",hide:"Ocultar",notice:"Puede contener spoilers"},chat:{sending:"Enviando",sent:"Enviado",delivered:"Entregado",read:"Leído",failed:"No enviado",typing:"Escribiendo…"},empty:{title:"No hay nada aquí"},table:{search:"Buscar",selectAll:"Seleccionar todas las filas",selectRow:"Seleccionar fila",rowsPerPage:"Filas por página",range:"{start}–{end} de {total}",selected:"{count} seleccionadas"},color:{area:"Saturación y brillo",hue:"Tono",alpha:"Opacidad",value:"Valor del color",swatches:"Colores predefinidos",clear:"Borrar",empty:"Elegir un color"}},pt:{link:{newTab:"(abre em uma nova aba)"},spoiler:{reveal:"Mostrar",hide:"Ocultar",notice:"Pode conter spoilers"},chat:{sending:"Enviando",sent:"Enviado",delivered:"Entregue",read:"Lido",failed:"Não enviado",typing:"Digitando…"},empty:{title:"Nada por aqui"},table:{search:"Pesquisar",selectAll:"Selecionar todas as linhas",selectRow:"Selecionar linha",rowsPerPage:"Linhas por página",range:"{start}–{end} de {total}",selected:"{count} selecionadas"},color:{area:"Saturação e brilho",hue:"Matiz",alpha:"Opacidade",value:"Valor da cor",swatches:"Cores predefinidas",clear:"Limpar",empty:"Escolher uma cor"}},fr:{link:{newTab:"(s’ouvre dans un nouvel onglet)"},spoiler:{reveal:"Afficher",hide:"Masquer",notice:"Peut contenir des spoilers"},chat:{sending:"Envoi en cours",sent:"Envoyé",delivered:"Distribué",read:"Lu",failed:"Non envoyé",typing:"En train d’écrire…"},empty:{title:"Rien ici"},table:{search:"Rechercher",selectAll:"Sélectionner toutes les lignes",selectRow:"Sélectionner la ligne",rowsPerPage:"Lignes par page",range:"{start}–{end} sur {total}",selected:"{count} sélectionnées"},color:{area:"Saturation et luminosité",hue:"Teinte",alpha:"Opacité",value:"Valeur de la couleur",swatches:"Couleurs prédéfinies",clear:"Effacer",empty:"Choisir une couleur"}},de:{link:{newTab:"(wird in einem neuen Tab geöffnet)"},spoiler:{reveal:"Anzeigen",hide:"Ausblenden",notice:"Kann Spoiler enthalten"},chat:{sending:"Wird gesendet",sent:"Gesendet",delivered:"Zugestellt",read:"Gelesen",failed:"Nicht gesendet",typing:"Schreibt…"},empty:{title:"Nichts vorhanden"},table:{search:"Suchen",selectAll:"Alle Zeilen auswählen",selectRow:"Zeile auswählen",rowsPerPage:"Zeilen pro Seite",range:"{start}–{end} von {total}",selected:"{count} ausgewählt"},color:{area:"Sättigung und Helligkeit",hue:"Farbton",alpha:"Deckkraft",value:"Farbwert",swatches:"Vorgegebene Farben",clear:"Löschen",empty:"Farbe auswählen"}},it:{link:{newTab:"(si apre in una nuova scheda)"},spoiler:{reveal:"Mostra",hide:"Nascondi",notice:"Può contenere spoiler"},chat:{sending:"Invio in corso",sent:"Inviato",delivered:"Consegnato",read:"Letto",failed:"Non inviato",typing:"Sta scrivendo…"},empty:{title:"Non c’è nulla"},table:{search:"Cerca",selectAll:"Seleziona tutte le righe",selectRow:"Seleziona riga",rowsPerPage:"Righe per pagina",range:"{start}–{end} di {total}",selected:"{count} selezionate"},color:{area:"Saturazione e luminosità",hue:"Tonalità",alpha:"Opacità",value:"Valore del colore",swatches:"Colori predefiniti",clear:"Cancella",empty:"Scegli un colore"}},nl:{link:{newTab:"(opent in een nieuw tabblad)"},spoiler:{reveal:"Tonen",hide:"Verbergen",notice:"Kan spoilers bevatten"},chat:{sending:"Wordt verzonden",sent:"Verzonden",delivered:"Afgeleverd",read:"Gelezen",failed:"Niet verzonden",typing:"Aan het typen…"},empty:{title:"Hier is niets"},table:{search:"Zoeken",selectAll:"Alle rijen selecteren",selectRow:"Rij selecteren",rowsPerPage:"Rijen per pagina",range:"{start}–{end} van {total}",selected:"{count} geselecteerd"},color:{area:"Verzadiging en helderheid",hue:"Kleurtoon",alpha:"Dekking",value:"Kleurwaarde",swatches:"Vooraf ingestelde kleuren",clear:"Wissen",empty:"Kies een kleur"}},pl:{link:{newTab:"(otwiera się w nowej karcie)"},spoiler:{reveal:"Pokaż",hide:"Ukryj",notice:"Może zawierać spoilery"},chat:{sending:"Wysyłanie",sent:"Wysłano",delivered:"Dostarczono",read:"Przeczytano",failed:"Nie wysłano",typing:"Pisze…"},empty:{title:"Nic tu nie ma"},table:{search:"Szukaj",selectAll:"Zaznacz wszystkie wiersze",selectRow:"Zaznacz wiersz",rowsPerPage:"Wierszy na stronę",range:"{start}–{end} z {total}",selected:"Zaznaczono: {count}"},color:{area:"Nasycenie i jasność",hue:"Barwa",alpha:"Krycie",value:"Wartość koloru",swatches:"Kolory predefiniowane",clear:"Wyczyść",empty:"Wybierz kolor"}},ru:{link:{newTab:"(откроется в новой вкладке)"},spoiler:{reveal:"Показать",hide:"Скрыть",notice:"Может содержать спойлеры"},chat:{sending:"Отправляется",sent:"Отправлено",delivered:"Доставлено",read:"Прочитано",failed:"Не отправлено",typing:"Печатает…"},empty:{title:"Здесь пусто"},table:{search:"Поиск",selectAll:"Выбрать все строки",selectRow:"Выбрать строку",rowsPerPage:"Строк на странице",range:"{start}–{end} из {total}",selected:"Выбрано: {count}"},color:{area:"Насыщенность и яркость",hue:"Оттенок",alpha:"Непрозрачность",value:"Значение цвета",swatches:"Готовые цвета",clear:"Очистить",empty:"Выберите цвет"}},tr:{link:{newTab:"(yeni sekmede açılır)"},spoiler:{reveal:"Göster",hide:"Gizle",notice:"Spoiler içerebilir"},chat:{sending:"Gönderiliyor",sent:"Gönderildi",delivered:"İletildi",read:"Okundu",failed:"Gönderilemedi",typing:"Yazıyor…"},empty:{title:"Burada bir şey yok"},table:{search:"Ara",selectAll:"Tüm satırları seç",selectRow:"Satırı seç",rowsPerPage:"Sayfa başına satır",range:"{total} kayıttan {start}–{end}",selected:"{count} seçildi"},color:{area:"Doygunluk ve parlaklık",hue:"Renk tonu",alpha:"Opaklık",value:"Renk değeri",swatches:"Hazır renkler",clear:"Temizle",empty:"Bir renk seçin"}},ar:{link:{newTab:"(يفتح في علامة تبويب جديدة)"},spoiler:{reveal:"إظهار",hide:"إخفاء",notice:"قد يحتوي على حرق للأحداث"},chat:{sending:"جارٍ الإرسال",sent:"تم الإرسال",delivered:"تم التسليم",read:"تمت القراءة",failed:"لم يتم الإرسال",typing:"يكتب الآن…"},empty:{title:"لا يوجد شيء هنا"},table:{search:"بحث",selectAll:"تحديد كل الصفوف",selectRow:"تحديد الصف",rowsPerPage:"صفوف لكل صفحة",range:"{start}–{end} من {total}",selected:"تم تحديد {count}"},color:{area:"التشبع والسطوع",hue:"درجة اللون",alpha:"العتامة",value:"قيمة اللون",swatches:"ألوان جاهزة",clear:"مسح",empty:"اختر لونًا"}},hi:{link:{newTab:"(नए टैब में खुलता है)"},spoiler:{reveal:"दिखाएँ",hide:"छिपाएँ",notice:"इसमें स्पॉइलर हो सकते हैं"},chat:{sending:"भेजा जा रहा है",sent:"भेजा गया",delivered:"डिलीवर हुआ",read:"पढ़ा गया",failed:"नहीं भेजा गया",typing:"टाइप कर रहे हैं…"},empty:{title:"यहाँ कुछ नहीं है"},table:{search:"खोजें",selectAll:"सभी पंक्तियाँ चुनें",selectRow:"पंक्ति चुनें",rowsPerPage:"प्रति पृष्ठ पंक्तियाँ",range:"{total} में से {start}–{end}",selected:"{count} चुनी गईं"},color:{area:"संतृप्ति और चमक",hue:"रंग",alpha:"अपारदर्शिता",value:"रंग मान",swatches:"पूर्व निर्धारित रंग",clear:"साफ़ करें",empty:"एक रंग चुनें"}},id:{link:{newTab:"(terbuka di tab baru)"},spoiler:{reveal:"Tampilkan",hide:"Sembunyikan",notice:"Mungkin mengandung spoiler"},chat:{sending:"Mengirim",sent:"Terkirim",delivered:"Diterima",read:"Dibaca",failed:"Gagal terkirim",typing:"Sedang mengetik…"},empty:{title:"Tidak ada apa-apa di sini"},table:{search:"Cari",selectAll:"Pilih semua baris",selectRow:"Pilih baris",rowsPerPage:"Baris per halaman",range:"{start}–{end} dari {total}",selected:"{count} dipilih"},color:{area:"Saturasi dan kecerahan",hue:"Rona",alpha:"Opasitas",value:"Nilai warna",swatches:"Warna preset",clear:"Hapus",empty:"Pilih warna"}},vi:{link:{newTab:"(mở trong tab mới)"},spoiler:{reveal:"Hiện nội dung",hide:"Ẩn",notice:"Có thể chứa nội dung tiết lộ"},chat:{sending:"Đang gửi",sent:"Đã gửi",delivered:"Đã nhận",read:"Đã xem",failed:"Chưa gửi được",typing:"Đang nhập…"},empty:{title:"Không có gì ở đây"},table:{search:"Tìm kiếm",selectAll:"Chọn tất cả các hàng",selectRow:"Chọn hàng",rowsPerPage:"Số hàng mỗi trang",range:"{start}–{end} trên {total}",selected:"Đã chọn {count}"},color:{area:"Độ bão hòa và độ sáng",hue:"Sắc độ",alpha:"Độ mờ đục",value:"Giá trị màu",swatches:"Màu dựng sẵn",clear:"Xóa",empty:"Chọn màu"}},th:{link:{newTab:"(เปิดในแท็บใหม่)"},spoiler:{reveal:"แสดงเนื้อหา",hide:"ซ่อน",notice:"อาจมีการเปิดเผยเนื้อหา"},chat:{sending:"กำลังส่ง",sent:"ส่งแล้ว",delivered:"ส่งถึงแล้ว",read:"อ่านแล้ว",failed:"ส่งไม่สำเร็จ",typing:"กำลังพิมพ์…"},empty:{title:"ไม่มีอะไรที่นี่"},table:{search:"ค้นหา",selectAll:"เลือกทุกแถว",selectRow:"เลือกแถวนี้",rowsPerPage:"จำนวนแถวต่อหน้า",range:"{start}–{end} จาก {total}",selected:"เลือกแล้ว {count} รายการ"},color:{area:"ความอิ่มตัวและความสว่าง",hue:"เฉดสี",alpha:"ความทึบ",value:"ค่าสี",swatches:"สีที่กำหนดไว้",clear:"ล้าง",empty:"เลือกสี"}}},l={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 n=new Map([["",a]]);export function resolveMessages(e){const r=e?.trim()??"",i=n.get(r);if(i)return i;const s=function(e){const a=e.toLowerCase().split(/[-_]/).filter(Boolean),t=a[0];if(!t)return[];const l=a.slice(1),n=l.find(e=>/^[a-z]{4}$/.test(e)),r=l.find(e=>/^([a-z]{2}|\d{3})$/.test(e));return[n?`${t}-${n}`:"",r?`${t}-${r}`:"",t].filter(Boolean)}(r).map(e=>t[e]??t[l[e]??""]).find(Boolean),o=s?{link:{...a.link,...s.link},spoiler:{...a.spoiler,...s.spoiler},chat:{...a.chat,...s.chat},empty:{...a.empty,...s.empty},table:{...a.table,...s.table},color:{...a.color,...s.color}}:a;return n.set(r,o),o}export function useMessages(a){return e.useMemo(()=>resolveMessages(a),[a])}export function fillMessage(e,a){return e.replace(/\{(\w+)\}/g,(e,t)=>a[t]??e)}