plass-ui 1.5.0 → 1.7.0

package/dist/components/alert/PlAlert.js

@@ -1 +1 @@
-"use client";import{jsx as s,jsxs as e}from"react/jsx-runtime";import*as l from"react";import{useDefaults as t}from"../../internal/defaults.js";import{useLabels as a}from"../../internal/labels.js";import{CloseIcon as i,severityIcon as r}from"../../internal/icons.js";import{controlSlots as o,focusRingClasses as n,forcedFieldEdgeClasses as c,glassClasses as d,hasContent as m,iconClasses as f,radiusClasses as p,sheetBodyClasses as u,sheetHeaderGapClasses as h,sheetPaddingXClasses as v,sheetPaddingYClasses as x,sheetSectionGapClasses as g,sheetTitleClasses as b,transitionClasses as y}from"../../internal/styles.js";const j={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",c].join(" "),glass:/* @__PURE__ */[d,"border text-(--plass-fg) bg-(--plass-glass)","[border-color:var(--p-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--plass-fg) bg-(--p-soft)"},N={solid:"",glass:"text-(--p-accent)",ghost:"text-(--p-accent)"},w={solid:"",glass:"text-(--plass-muted-fg)",ghost:"text-(--plass-muted-fg)"},k={primary:"status",secondary:"status",info:"status",success:"status",warning:"alert",danger:"alert"};export const PlAlert=/* @__PURE__ */l.forwardRef(function PlAlert({variant:l="glass",size:c,color:d,density:$,elevation:z=0,title:A,icon:C,action:P,onClose:_,closeLabel:B,className:L,style:R,children:q,...D},E){const F=t(),G=a(),H=B??G.dismiss,I=c??F.size??"md",J=d??F.color??"info",K=$??F.density??"default",M=void 0===C?r(J):C,O=N[l],Q=m(A);return e("div",{ref:E,role:k[J],className:["flex w-full items-start",v[K][I],x[K][I],p[I],g[I],u[I],y,j[l],f,L??""].filter(Boolean).join(" "),style:{...o(J,z,l),...R},...D,children:[m(M)?s("span",{className:`flex h-[1lh] shrink-0 items-center ${O}`,children:M}):null,e("div",{className:`flex min-w-0 flex-1 flex-col ${h[I]}`,children:[Q?s("div",{className:`plass-title font-semibold ${b[I]} ${O}`,children:A}):null,m(q)?s("div",{className:Q?w[l]:void 0,children:q}):null]}),m(P)?s("div",{className:"flex h-[1lh] shrink-0 items-center",children:P}):null,_?s("span",{className:"flex h-[1lh] shrink-0 items-center",children:s("button",{type:"button","aria-label":H,onClick:_,className:["inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full","opacity-70 [transition:opacity_var(--plass-duration)_var(--plass-ease)]","hover:opacity-100 focus-visible:opacity-100",n].join(" "),children:s(i,{})})}):null]})});
+"use client";import{jsx as s,jsxs as e}from"react/jsx-runtime";import*as l from"react";import{useDefaults as t}from"../../internal/defaults.js";import{useLabels as a}from"../../internal/labels.js";import{CloseIcon as i,severityIcon as r}from"../../internal/icons.js";import{controlSlots as o,focusRingClasses as n,forcedFieldEdgeClasses as c,glassClasses as d,hasContent as m,iconClasses as f,radiusClasses as p,sheetBodyClasses as u,sheetHeaderGapClasses as h,sheetPaddingXClasses as v,sheetPaddingYClasses as x,sheetSectionGapClasses as g,sheetTitleClasses as b,targetClasses as y,transitionClasses as j}from"../../internal/styles.js";const N={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",c].join(" "),glass:/* @__PURE__ */[d,"border text-(--plass-fg) bg-(--plass-glass)","[border-color:var(--p-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--plass-fg) bg-(--p-soft)"},w={solid:"",glass:"text-(--p-accent)",ghost:"text-(--p-accent)"},k={solid:"",glass:"text-(--plass-muted-fg)",ghost:"text-(--plass-muted-fg)"},$={primary:"status",secondary:"status",info:"status",success:"status",warning:"alert",danger:"alert"};export const PlAlert=/* @__PURE__ */l.forwardRef(function PlAlert({variant:l="glass",size:c,color:d,density:z,elevation:A=0,title:C,icon:P,action:_,onClose:B,closeLabel:L,className:R,style:q,children:D,...E},F){const G=t(),H=a(),I=L??H.dismiss,J=c??G.size??"md",K=d??G.color??"info",M=z??G.density??"default",O=void 0===P?r(K):P,Q=w[l],S=m(C);return e("div",{ref:F,role:$[K],className:["flex w-full items-start",v[M][J],x[M][J],p[J],g[J],u[J],j,N[l],f,R??""].filter(Boolean).join(" "),style:{...o(K,A,l),...q},...E,children:[m(O)?s("span",{className:`flex h-[1lh] shrink-0 items-center ${Q}`,children:O}):null,e("div",{className:`flex min-w-0 flex-1 flex-col ${h[J]}`,children:[S?s("div",{className:`plass-title font-semibold ${b[J]} ${Q}`,children:C}):null,m(D)?s("div",{className:S?k[l]:void 0,children:D}):null]}),m(_)?s("div",{className:"flex h-[1lh] shrink-0 items-center",children:_}):null,B?s("span",{className:"flex h-[1lh] shrink-0 items-center",children:s("button",{type:"button","aria-label":I,onClick:B,className:[y,"inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full","opacity-70 [transition:opacity_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","hover:opacity-100 focus-visible:opacity-100",n].join(" "),children:s(i,{})})}):null]})});

package/dist/components/animate-counter/PlAnimateCounter.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{mergeProps as a}from"@base-ui/react/merge-props";import{useRender as s}from"@base-ui/react/use-render";import{useAnimationRun as i}from"../../internal/animate.js";import{useDefaults as o}from"../../internal/defaults.js";import{usePrefersReducedMotion as u}from"../../internal/media.js";import{cx as m,srOnlyClasses as c}from"../../internal/styles.js";function easeOut(e){return 1-(1-e)**3}export const PlAnimateCounter=/* @__PURE__ */n.forwardRef(function PlAnimateCounter({value:l,from:f=0,duration:d=1200,delay:p=0,format:h,easing:g=easeOut,trigger:j="visible",play:A,once:F=!0,threshold:b=.2,paused:x,render:v,className:y,...N},q){const E=o(),M=u(),R=i({trigger:j,play:A,once:F,threshold:b,paused:x,infinite:!1,nonce:l}),w=n.useMemo(()=>new Intl.NumberFormat(E.locale,h),[E.locale,h]),[C,O]=n.useState(()=>M?l:f),P=n.useRef(0),I=n.useRef(g);n.useEffect(()=>{I.current=g}),n.useEffect(()=>{P.current=0},[R.runs,l,f]),n.useEffect(()=>{if(M)return void O(l);if(!R.started)return P.current=0,void O(f);if(x)return;const e=Math.max(1,d);let r,t=0;const step=n=>{r??=n-P.current,P.current=n-r;const a=Math.min(1,(P.current-p)/e);a<0?t=requestAnimationFrame(step):(O(f+(l-f)*I.current(a)),a<1&&(t=requestAnimationFrame(step)))};return t=requestAnimationFrame(step),()=>cancelAnimationFrame(t)},[R.started,R.runs,M,x,l,f,d,p]);const S=w.format(l);return s({render:v??e("span",{}),ref:[q,R.ref],props:{className:m("tabular-nums",y),"data-plass-animation":"counter","data-state":R.state,children:t(r,{children:[e("span",{className:c,children:S}),e("span",{"aria-hidden":"true",children:w.format(C)})]}),...a(N,R.handlers)}})});
+"use client";import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{mergeProps as a}from"@base-ui/react/merge-props";import{useRender as s}from"@base-ui/react/use-render";import{useAnimationRun as i}from"../../internal/animate.js";import{useDefaults as o}from"../../internal/defaults.js";import{usePrefersReducedMotion as u}from"../../internal/media.js";import{cx as m,srOnlyCopyClasses as c}from"../../internal/styles.js";function easeOut(e){return 1-(1-e)**3}export const PlAnimateCounter=/* @__PURE__ */n.forwardRef(function PlAnimateCounter({value:l,from:f=0,duration:d=1200,delay:p=0,format:h,easing:g=easeOut,trigger:j="visible",play:y,once:A=!0,threshold:F=.2,paused:b,render:x,className:N,...v},R){const q=o(),E=u(),O=i({trigger:j,play:y,once:A,threshold:F,paused:b,infinite:!1,nonce:l}),k=`${q.locale??""}\0${JSON.stringify(h??null)}`,w=n.useRef(null);null!==w.current&&w.current.key===k||(w.current={key:k,formatter:new Intl.NumberFormat(q.locale,h)});const C=w.current.formatter,[M,P]=n.useState(()=>E?l:f),S=n.useRef(0),$=n.useRef(g);n.useEffect(()=>{$.current=g}),n.useEffect(()=>{S.current=0},[O.runs,l,f]),n.useEffect(()=>{if(E)return void P(l);if(!O.started)return S.current=0,void P(f);if(b)return;const e=Math.max(1,d);let r,t=0;const step=n=>{r??=n-S.current,S.current=n-r;const a=Math.min(1,(S.current-p)/e);a<0?t=requestAnimationFrame(step):(P(f+(l-f)*$.current(a)),a<1&&(t=requestAnimationFrame(step)))};return t=requestAnimationFrame(step),()=>cancelAnimationFrame(t)},[O.started,O.runs,E,b,l,f,d,p]);const I=C.format(l);return s({render:x??e("span",{}),ref:[R,O.ref],props:{className:m("tabular-nums",N),"data-plass-animation":"counter","data-state":O.state,children:t(r,{children:[e("span",{className:c,children:I}),e("span",{"aria-hidden":"true",children:C.format(M)})]}),...a(v,O.handlers)}})});

package/dist/components/animate-float/PlAnimateFloat.js

@@ -1 +1 @@
-"use client";import*as e from"react";import{mergeProps as a}from"@base-ui/react/merge-props";import{useRender as r}from"@base-ui/react/use-render";import{animBaseClass as t,lengthValue as n,useAnimateElement as i}from"../../internal/animate.js";import{cx as s}from"../../internal/styles.js";export const PlAnimateFloat=/* @__PURE__ */e.forwardRef(function PlAnimateFloat({duration:e=3e3,delay:l=0,easing:o="ease-in-out",repeat:c="infinite",alternate:m,paused:p,trigger:d="mount",play:f,once:u=!0,threshold:y=.2,distance:h=8,orientation:g="vertical",render:N,className:b,style:j,children:v,...x},A){const F=n(h),P="vertical"===g,w=i({effect:null,duration:e,delay:l,easing:o,repeat:c,alternate:m,x:P?"0":F,y:P?`-${F}`:"0",trigger:d,play:f,once:u,threshold:y,paused:p,infinite:!0,children:v});return r({render:N,ref:[A,w.ref],props:{...a(x,w.props),className:s(t,"plass-anim-float",w.className,b),style:{...w.style,...j},"data-plass-animation":"float",children:w.children}})});
+"use client";import*as e from"react";import{mergeProps as a}from"@base-ui/react/merge-props";import{useRender as r}from"@base-ui/react/use-render";import{animBaseClass as t,lengthValue as n,useAnimateElement as i}from"../../internal/animate.js";import{cx as l}from"../../internal/styles.js";export const PlAnimateFloat=/* @__PURE__ */e.forwardRef(function PlAnimateFloat({duration:e=3e3,delay:s=0,easing:o="ease-in-out",repeat:c="infinite",alternate:p,paused:m,trigger:d="mount",play:f,once:u=!0,threshold:y=.2,distance:h=8,orientation:g="vertical",render:b,className:x,style:N,children:j,...v},A){const F=n(h),P="vertical"===g,w=i({effect:null,duration:e,delay:s,easing:o,repeat:c,alternate:p,x:P?"0":F,y:P?"number"==typeof h?-h+"px":`calc(-1 * ${F})`:"0",trigger:d,play:f,once:u,threshold:y,paused:m,infinite:!0,children:j});return r({render:b,ref:[A,w.ref],props:{...a(v,w.props),className:l(t,"plass-anim-float",w.className,x),style:{...w.style,...N},"data-plass-animation":"float",children:w.children}})});

package/dist/components/animate-headline/PlAnimateHeadline.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PlassAnimateProps } from '../../types.js';
+import type { PlassAnimateProps, PlassAnimateRepeat } from '../../types.js';
 export interface PlAnimateHeadlineProps extends Omit<PlassAnimateProps, 'alternate'>, React.ComponentPropsWithoutRef<'div'> {
     /**
      * How long each line is held before the next one comes up, in milliseconds.
@@ -23,6 +23,15 @@ export interface PlAnimateHeadlineProps extends Omit<PlassAnimateProps, 'alterna
      * @default true
      */
     loop?: boolean;
+    /**
+     * How the headline stops, and nothing else. It counts neither lines nor
+     * cycles: `loop` decides whether the lines start again after the last one.
+     * With `trigger="hover"`, `'infinite'` stops the reel where it is when the
+     * pointer and the focus leave, and a count leaves it turning after they have
+     * gone. Under any other `trigger` it changes nothing.
+     * @default 'infinite'
+     */
+    repeat?: PlassAnimateRepeat;
     /**
      * How far a line travels as it comes up or leaves — a CSS length, or a number
      * in pixels. `'100%'` is one line's own height.

package/dist/components/animate-marquee/PlAnimateMarquee.d.ts

@@ -15,6 +15,9 @@ export interface PlAnimateMarqueeProps extends PlassAnimateProps, React.Componen
      * How fast the content travels, in pixels per second. A speed rather than a
      * duration, so a strip of four logos and a strip of forty move at the same
      * pace instead of the long one becoming a blur.
+     *
+     * `0` or less holds the strip where it is, as `paused` does. `duration`
+     * overrides this.
      * @default 60
      */
     speed?: number;
@@ -38,6 +41,13 @@ export interface PlAnimateMarqueeProps extends PlassAnimateProps, React.Componen
      * @default true
      */
     pauseOnHover?: boolean;
+    /**
+     * What the strip is called — "Partners", "Customers". It names the box as a
+     * group, and under `prefers-reduced-motion` that box is the tab stop a
+     * keyboard reader scrolls it with, which is otherwise announced with no name
+     * of its own.
+     */
+    label?: string;
     /** The things that scroll past. */
     children?: React.ReactNode;
 }
@@ -63,7 +73,7 @@ export interface PlAnimateMarqueeProps extends PlassAnimateProps, React.Componen
  * the box would be out of sight for good. So the stylesheet draws only the
  * first copy and lets the box scroll along it instead of clipping it, and the
  * box is a tab stop while there is anything to scroll, for a reader with no
- * pointer to scroll it with.
+ * pointer to scroll it with. `label` is that stop's name.
  *
  * Only the first copy is read out or reached with Tab. The rest carry
  * `aria-hidden`, or a screen reader would announce everything on the strip as

package/dist/components/animate-marquee/PlAnimateMarquee.js

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{mergeProps as r}from"@base-ui/react/merge-props";import{isInfinite as a,lengthValue as n,repeatValue as i,directionValue as s,useAnimationRun as o}from"../../internal/animate.js";import{inertProps as l}from"../../internal/inert.js";import{usePrefersReducedMotion as m}from"../../internal/media.js";import{cx as p}from"../../internal/styles.js";export const PlAnimateMarquee=/* @__PURE__ */t.forwardRef(function PlAnimateMarquee({duration:u,delay:c=0,easing:d,repeat:f="infinite",alternate:h,paused:v,trigger:g="mount",play:y,once:b=!0,threshold:j=.2,orientation:q="horizontal",reverse:x=!1,speed:R=60,gap:H="2rem",copies:M=2,pauseOnHover:w=!0,className:z,style:A,children:N,...O},S){const W=o({trigger:g,play:y,once:b,threshold:j,paused:v,infinite:a(f)}),G=t.useRef(null),P=t.useRef(null),[$,k]=t.useState(0),[C,E]=t.useState(!1),F="vertical"===q,I=m();t.useEffect(()=>{const e=G.current,t=P.current;if(!e||!t)return;const measure=()=>{const r=getComputedStyle(e),a=parseFloat(F?r.rowGap:r.columnGap)||0,n=F?t.offsetHeight:t.offsetWidth;k(n+a),E(F?e.scrollHeight>e.clientHeight:e.scrollWidth>e.clientWidth)};if(measure(),"undefined"==typeof ResizeObserver)return;const r=new ResizeObserver(measure);return r.observe(t),r.observe(e),()=>r.disconnect()},[F,N,I]);const B=u??($>0?$/R*1e3:12e3);return e("div",{ref:e=>{G.current=e,W.ref(e),"function"==typeof S?S(e):S&&(S.current=e)},className:p("plass-marquee",F&&"plass-marquee-vertical",z),style:{"--p-anim-gap":n(H),...d?{"--p-anim-ease":d}:{},"--p-anim-duration":`${Math.round(B)}ms`,"--p-anim-delay":`${c}ms`,"--p-anim-repeat":i(f),"--p-anim-direction":s(x?"out":"in",h),"--p-anim-state":W.state,...A},"data-plass-animation":"marquee","data-state":W.state,"data-pause-on-hover":w?"":void 0,tabIndex:I&&C?0:void 0,...r(O,W.handlers),children:Array.from({length:Math.max(1,M)},(t,r)=>(t=>e("div",{ref:0===t?P:void 0,className:"plass-marquee-track","aria-hidden":0===t?void 0:"true",...l(0!==t),children:N},t))(r))})});
+"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{mergeProps as r}from"@base-ui/react/merge-props";import{isInfinite as a,lengthValue as i,repeatValue as n,directionValue as s,useAnimationRun as o}from"../../internal/animate.js";import{inertProps as l}from"../../internal/inert.js";import{usePrefersReducedMotion as m}from"../../internal/media.js";import{cx as p}from"../../internal/styles.js";export const PlAnimateMarquee=/* @__PURE__ */t.forwardRef(function PlAnimateMarquee({duration:u,delay:c=0,easing:d,repeat:f="infinite",alternate:h,paused:v,trigger:g="mount",play:y,once:b=!0,threshold:j=.2,orientation:q="horizontal",reverse:x=!1,speed:R=60,gap:H="2rem",copies:M=2,pauseOnHover:w=!0,label:z,className:A,style:N,children:O,...S},W){const G=void 0===u&&R<=0,P=o({trigger:g,play:y,once:b,threshold:j,paused:v||G,infinite:a(f)}),$=t.useRef(null),k=t.useRef(null),[C,E]=t.useState(0),[F,I]=t.useState(!1),B="vertical"===q,D=m();t.useEffect(()=>{const e=$.current,t=k.current;if(!e||!t)return;const measure=()=>{const r=getComputedStyle(e),a=parseFloat(B?r.rowGap:r.columnGap)||0,i=B?t.offsetHeight:t.offsetWidth;E(i+a),I(B?e.scrollHeight>e.clientHeight:e.scrollWidth>e.clientWidth)};if(measure(),"undefined"==typeof ResizeObserver)return;const r=new ResizeObserver(measure);return r.observe(t),r.observe(e),()=>r.disconnect()},[B,D]);const J=u??(C>0&&!G?C/R*1e3:12e3);return e("div",{ref:e=>{$.current=e,P.ref(e),"function"==typeof W?W(e):W&&(W.current=e)},className:p("plass-marquee",B&&"plass-marquee-vertical",A),style:{"--p-anim-gap":i(H),...d?{"--p-anim-ease":d}:{},"--p-anim-duration":`${Math.round(J)}ms`,"--p-anim-delay":`${c}ms`,"--p-anim-repeat":n(f),"--p-anim-direction":s(x?"out":"in",h),"--p-anim-state":P.state,...N},"data-plass-animation":"marquee","data-state":P.state,"data-pause-on-hover":w?"":void 0,tabIndex:D&&F?0:void 0,role:z?"group":void 0,"aria-label":z,...r(S,P.handlers),children:Array.from({length:Math.max(1,M)},(t,r)=>(t=>e("div",{ref:0===t?k:void 0,className:"plass-marquee-track","aria-hidden":0===t?void 0:"true",...l(0!==t),children:O},t))(r))})});

package/dist/components/animate-scramble/PlAnimateScramble.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{mergeProps as n}from"@base-ui/react/merge-props";import{useRender as s}from"@base-ui/react/use-render";import{useAnimationRun as i}from"../../internal/animate.js";import{usePrefersReducedMotion as m}from"../../internal/media.js";import{poolOf as o,scrambleAt as c}from"../../internal/scramble.js";import{cx as l,srOnlyClasses as u}from"../../internal/styles.js";export const PlAnimateScramble=/* @__PURE__ */a.forwardRef(function PlAnimateScramble({children:d,characters:f,duration:p=1200,delay:h=0,tick:x=45,trigger:b="visible",play:j,once:M=!0,threshold:g=.2,paused:A,render:y,className:F,...v},N){const S=m(),q=i({trigger:b,play:j,once:M,threshold:g,paused:A,infinite:!1,nonce:d}),E=a.useMemo(()=>f??o(d),[f,d]),[P,R]=a.useState(()=>d),k=a.useRef(0);return a.useEffect(()=>{k.current=0},[q.runs,d]),a.useEffect(()=>{if(S)return void R(d);if(!q.started)return k.current=0,void R(c(d,E,0,0));if(A)return;const e=Math.max(1,p);let r,t=0,a=0,n=-1;const step=s=>{r??=s-k.current,k.current=s-r;const i=k.current-h,m=Math.min(1,i/e),o=Math.floor(Math.max(0,i)/Math.max(1,x));o!==n&&(n=o,a+=1,R(c(d,E,Math.max(0,m),a))),m<1?t=requestAnimationFrame(step):R(d)};return t=requestAnimationFrame(step),()=>cancelAnimationFrame(t)},[q.started,q.runs,S,A,d,E,p,h,x]),s({render:y??e("span",{}),ref:[N,q.ref],props:{className:l(F),"data-plass-animation":"scramble","data-state":q.state,children:t(r,{children:[e("span",{className:u,children:d}),e("span",{"aria-hidden":"true",children:P})]}),...n(v,q.handlers)}})});
+"use client";import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{mergeProps as n}from"@base-ui/react/merge-props";import{useRender as s}from"@base-ui/react/use-render";import{useAnimationRun as i}from"../../internal/animate.js";import{usePrefersReducedMotion as m}from"../../internal/media.js";import{poolOf as o,scrambleAt as c}from"../../internal/scramble.js";import{cx as l,srOnlyCopyClasses as u}from"../../internal/styles.js";export const PlAnimateScramble=/* @__PURE__ */a.forwardRef(function PlAnimateScramble({children:d,characters:f,duration:p=1200,delay:h=0,tick:x=45,trigger:b="visible",play:j,once:M=!0,threshold:g=.2,paused:A,render:y,className:F,...v},N){const S=m(),q=i({trigger:b,play:j,once:M,threshold:g,paused:A,infinite:!1,nonce:d}),E=a.useMemo(()=>f??o(d),[f,d]),[P,R]=a.useState(()=>d),k=a.useRef(0);return a.useEffect(()=>{k.current=0},[q.runs,d]),a.useEffect(()=>{if(S)return void R(d);if(!q.started)return k.current=0,void R(c(d,E,0,0));if(A)return;const e=Math.max(1,p);let r,t=0,a=0,n=-1;const step=s=>{r??=s-k.current,k.current=s-r;const i=k.current-h,m=Math.min(1,i/e),o=Math.floor(Math.max(0,i)/Math.max(1,x));o!==n&&(n=o,a+=1,R(c(d,E,Math.max(0,m),a))),m<1?t=requestAnimationFrame(step):R(d)};return t=requestAnimationFrame(step),()=>cancelAnimationFrame(t)},[q.started,q.runs,S,A,d,E,p,h,x]),s({render:y??e("span",{}),ref:[N,q.ref],props:{className:l(F),"data-plass-animation":"scramble","data-state":q.state,children:t(r,{children:[e("span",{className:u,children:d}),e("span",{"aria-hidden":"true",children:P})]}),...n(v,q.handlers)}})});

package/dist/components/animate-split/PlAnimateSplit.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{mergeProps as n}from"@base-ui/react/merge-props";import{useRender as i}from"@base-ui/react/use-render";import{animBaseClass as s,animationClasses as o,animationSlots as c,isInfinite as p,revealClip as l,slideOffsets as m,staggerSlots as d,useAnimationRun as u}from"../../internal/animate.js";import{cx as f,srOnlyClasses as g}from"../../internal/styles.js";import{graphemesOf as h}from"../../internal/text.js";const y=/[\p{Script=Han}\p{Script=Hiragana}\p{Script=Katakana}\p{Script=Bopomofo}\p{Script=Thai}\p{Script=Lao}\p{Script=Khmer}\p{Script=Myanmar}]/u;function effectStart(e){switch(e){case"slide":return{opacity:0,...m("bottom","100%")};case"grow":return{opacity:0,scale:.8};case"zoom":return{opacity:0,scale:.4};case"rotate":return{opacity:0,angle:"-180deg",angleTo:"0deg"};case"reveal":return{opacity:1,clip:l("left")};default:return{opacity:0}}}export const PlAnimateSplit=/* @__PURE__ */a.forwardRef(function PlAnimateSplit({children:l,by:m="word",effect:S="fade",mode:w="in",duration:b=400,delay:j=0,easing:x,repeat:N=1,alternate:v,paused:k,trigger:$="mount",play:A,once:F=!0,threshold:H=.2,timeline:K,range:M,stagger:P=40,durationStep:T=0,reverse:z=!1,render:B,className:L,style:O,...R},q){const C=a.useMemo(()=>function piecesOf(e,t){const r=[];for(const a of e.split(/(\s+)/)){if(""===a)continue;if("word"===t||""===a.trim()){r.push([a]);continue}let e=[];for(const t of h(a))0===e.length||y.test(t)?(e=[t],r.push(e)):e.push(t)}return r}(l,m),[l,m]),D=u({trigger:"view"===K?"mount":$,play:A,once:F,threshold:H,paused:k,infinite:p(N)}),E={...effectStart(S),duration:b,delay:j,easing:x,repeat:N,alternate:v,mode:w,timeline:K,range:M},G=C.reduce((e,t)=>""===t[0].trim()?e:e+t.length,0),I=`${s} ${o[S]}`;let J=-1;const renderPart=(t,r)=>(J+=1,e("span",{className:`${I} inline-block whitespace-normal`,style:{...c(d(E,{index:J,count:G,stagger:P,durationStep:T,reverse:z})),"--p-anim-state":D.state},children:t},r));return i({render:B??e("span",{}),ref:[q,D.ref],props:{...n(R,D.handlers),className:f(L),style:O,"data-plass-animation":S,"data-state":D.state,children:r(t,{children:[e("span",{className:g,children:l}),e("span",{"aria-hidden":"true",children:C.map((t,r)=>""===t[0].trim()?e(a.Fragment,{children:t[0]},r):1===t.length?renderPart(t[0],r):e("span",{className:"inline-block",children:t.map((e,t)=>renderPart(e,t))},r))})]})}})});
+"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{mergeProps as n}from"@base-ui/react/merge-props";import{useRender as i}from"@base-ui/react/use-render";import{animBaseClass as s,animationClasses as o,animationSlots as c,isInfinite as p,revealClip as l,slideOffsets as m,staggerSlots as d,useAnimationRun as u}from"../../internal/animate.js";import{cx as f,srOnlyCopyClasses as g}from"../../internal/styles.js";import{graphemesOf as h}from"../../internal/text.js";const y=/[\p{Script=Han}\p{Script=Hiragana}\p{Script=Katakana}\p{Script=Bopomofo}\p{Script=Thai}\p{Script=Lao}\p{Script=Khmer}\p{Script=Myanmar}]/u;function effectStart(e){switch(e){case"slide":return{opacity:0,...m("bottom","100%")};case"grow":return{opacity:0,scale:.8};case"zoom":return{opacity:0,scale:.4};case"rotate":return{opacity:0,angle:"-180deg",angleTo:"0deg"};case"reveal":return{opacity:1,clip:l("left")};default:return{opacity:0}}}export const PlAnimateSplit=/* @__PURE__ */a.forwardRef(function PlAnimateSplit({children:l,by:m="word",effect:S="fade",mode:w="in",duration:b=400,delay:j=0,easing:x,repeat:N=1,alternate:v,paused:k,trigger:$="mount",play:A,once:F=!0,threshold:H=.2,timeline:K,range:M,stagger:P=40,durationStep:T=0,reverse:z=!1,render:B,className:L,style:O,...R},q){const C=a.useMemo(()=>function piecesOf(e,t){const r=[];for(const a of e.split(/(\s+)/)){if(""===a)continue;if("word"===t||""===a.trim()){r.push([a]);continue}let e=[];for(const t of h(a))0===e.length||y.test(t)?(e=[t],r.push(e)):e.push(t)}return r}(l,m),[l,m]),D=u({trigger:"view"===K?"mount":$,play:A,once:F,threshold:H,paused:k,infinite:p(N)}),E={...effectStart(S),duration:b,delay:j,easing:x,repeat:N,alternate:v,mode:w,timeline:K,range:M},G=C.reduce((e,t)=>""===t[0].trim()?e:e+t.length,0),I=`${s} ${o[S]}`;let J=-1;const renderPart=(t,r)=>(J+=1,e("span",{className:`${I} inline-block whitespace-normal`,style:{...c(d(E,{index:J,count:G,stagger:P,durationStep:T,reverse:z})),"--p-anim-state":D.state},children:t},r));return i({render:B??e("span",{}),ref:[q,D.ref],props:{...n(R,D.handlers),className:f(L),style:O,"data-plass-animation":S,"data-state":D.state,children:r(t,{children:[e("span",{className:g,children:l}),e("span",{"aria-hidden":"true",children:C.map((t,r)=>""===t[0].trim()?e(a.Fragment,{children:t[0]},r):1===t.length?renderPart(t[0],r):e("span",{className:"inline-block",children:t.map((e,t)=>renderPart(e,t))},r))})]})}})});

package/dist/components/animate-typing/PlAnimateTyping.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{mergeProps as a}from"@base-ui/react/merge-props";import{isInfinite as s,useAnimationRun as i}from"../../internal/animate.js";import{usePrefersReducedMotion as n}from"../../internal/media.js";import{srOnlyClasses as l}from"../../internal/styles.js";import{graphemesOf as o,textOf as c}from"../../internal/text.js";export const PlAnimateTyping=/* @__PURE__ */r.forwardRef(function PlAnimateTyping({text:m,speed:u=24,hold:p=1400,erase:d=!1,eraseSpeed:f,caret:h=!0,caretChar:y="|",duration:g,delay:j=0,repeat:x=1,paused:T,trigger:v="mount",play:N,once:b=!0,threshold:M=.2,className:w,style:A,children:E,...P},R){const S=i({trigger:v,play:N,once:b,threshold:M,paused:T,infinite:s(x)}),k=n(),C=m??c(E),q=r.useMemo(()=>o(C),[C]),z=q.length,[B,D]=r.useState(0),F=r.useRef(0),G=g&&z>0?g/z:1e3/Math.max(u,1),H=1e3/Math.max(f??2*u,1);return r.useEffect(()=>{F.current=0},[z,S.runs]),r.useEffect(()=>{if(k||0===z)return void D(z);if(!S.started)return F.current=0,void D(0);if(T)return;let e,t=!1,r=F.current,a=1,s=!1;const i="infinite"===x?1/0:Math.max(1,x);if(r>=z&&1===i)return;const step=()=>{if(!t){if(s)return r-=1,F.current=r,D(r),r<=0&&(s=!1,a+=1),void(e=setTimeout(step,s?H:G));if(r+=1,F.current=r,D(r),r<z)e=setTimeout(step,G);else if(!(a>=i)){if(d)return s=!0,void(e=setTimeout(step,p));a+=1,e=setTimeout(()=>{t||(r=0,F.current=0,D(0),e=setTimeout(step,G))},p)}}};return D(r),e=setTimeout(step,0===r?j:G),()=>{t=!0,clearTimeout(e)}},[S.started,S.runs,T,k,z,G,H,j,p,d,x]),t("div",{ref:e=>{S.ref(e),"function"==typeof R?R(e):R&&(R.current=e)},className:w,style:A,"data-plass-animation":"typing","data-state":S.state,...a(P,S.handlers),children:[e("span",{className:l,children:C}),t("span",{"aria-hidden":"true",className:"relative whitespace-pre-wrap",children:[q.slice(0,B).join(""),h?e("span",{className:"plass-caret absolute",children:y}):null,e("span",{"data-sample":q.slice(B).join(""),className:"invisible before:content-[attr(data-sample)]",children:h?e("span",{className:"inline-block",children:y}):null})]})]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{mergeProps as a}from"@base-ui/react/merge-props";import{isInfinite as s,useAnimationRun as i}from"../../internal/animate.js";import{usePrefersReducedMotion as n}from"../../internal/media.js";import{srOnlyCopyClasses as l}from"../../internal/styles.js";import{graphemesOf as o,textOf as c}from"../../internal/text.js";export const PlAnimateTyping=/* @__PURE__ */r.forwardRef(function PlAnimateTyping({text:m,speed:u=24,hold:p=1400,erase:d=!1,eraseSpeed:f,caret:h=!0,caretChar:y="|",duration:g,delay:j=0,repeat:x=1,paused:T,trigger:v="mount",play:N,once:b=!0,threshold:M=.2,className:w,style:A,children:E,...P},R){const S=i({trigger:v,play:N,once:b,threshold:M,paused:T,infinite:s(x)}),k=n(),C=m??c(E),q=r.useMemo(()=>o(C),[C]),z=q.length,[B,D]=r.useState(0),F=r.useRef(0),G=g&&z>0?g/z:1e3/Math.max(u,1),H=1e3/Math.max(f??2*u,1);return r.useEffect(()=>{F.current=0},[C,S.runs]),r.useEffect(()=>{if(k||0===z)return void D(z);if(!S.started)return F.current=0,void D(0);if(T)return;let e,t=!1,r=F.current,a=1,s=!1;const i="infinite"===x?1/0:Math.max(1,x);if(r>=z&&1===i)return;const step=()=>{if(!t){if(s)return r-=1,F.current=r,D(r),r<=0&&(s=!1,a+=1),void(e=setTimeout(step,s?H:G));if(r+=1,F.current=r,D(r),r<z)e=setTimeout(step,G);else if(!(a>=i)){if(d)return s=!0,void(e=setTimeout(step,p));a+=1,e=setTimeout(()=>{t||(r=0,F.current=0,D(0),e=setTimeout(step,G))},p)}}};return D(r),e=setTimeout(step,0===r?j:G),()=>{t=!0,clearTimeout(e)}},[S.started,S.runs,C,T,k,z,G,H,j,p,d,x]),t("div",{ref:e=>{S.ref(e),"function"==typeof R?R(e):R&&(R.current=e)},className:w,style:A,"data-plass-animation":"typing","data-state":S.state,...a(P,S.handlers),children:[e("span",{className:l,children:C}),t("span",{"aria-hidden":"true",className:"relative whitespace-pre-wrap",children:[q.slice(0,B).join(""),h?e("span",{className:"plass-caret absolute",children:y}):null,e("span",{"data-sample":q.slice(B).join(""),className:"invisible before:content-[attr(data-sample)]",children:h?e("span",{className:"inline-block",children:y}):null})]})]})});

package/dist/components/app-logo/PlAppLogo.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s,Fragment as l}from"react/jsx-runtime";import*as a from"react";import{useRender as t}from"@base-ui/react/use-render";import{useDefaults as r}from"../../internal/defaults.js";import{controlSlots as n,cx as i,forcedFieldEdgeClasses as o,glassClasses as c,hasContent as m,metaTextClasses as d,radiusClasses as p}from"../../internal/styles.js";const x={xs:"h-5",sm:"h-6",md:"h-8",lg:"h-10",xl:"h-12"},g={xs:"size-5",sm:"size-6",md:"size-8",lg:"size-10",xl:"size-12"},f={xs:"text-sm",sm:"text-base",md:"text-lg",lg:"text-xl",xl:"text-2xl"},u={xs:"gap-1.5",sm:"gap-2",md:"gap-2.5",lg:"gap-3",xl:"gap-3.5"},h={solid:`[background-image:var(--p-fill)] text-(--p-on-solid) [box-shadow:var(--p-lift)] ${o}`,glass:`${c} bg-(--plass-glass) text-(--p-accent) border [border-color:var(--plass-glass-line)]`,ghost:"bg-(--p-soft) text-(--p-accent)"};export const PlAppLogo=/* @__PURE__ */a.forwardRef(function PlAppLogo({children:a,src:o,alt:c="",name:b,description:v,shape:z="bare",variant:j="solid",size:N,color:w,render:y,className:k,style:A,...L},P){const $=r(),_=N??$.size??"md",F=w??$.color??"primary",R="bare"!==z,q=m(b)||m(v),B=o?e("img",{src:o,alt:c,className:R?"size-[70%] object-contain":"h-full w-auto"}):a;return t({render:y,ref:P,props:{className:i("inline-flex items-center text-(--plass-fg) [&_svg]:h-full [&_svg]:w-auto",u[_],k),style:{...n(F,1,j),...A},children:s(l,{children:[e("span",{"aria-hidden":!!m(b)||void 0,className:i("flex shrink-0 items-center justify-center overflow-hidden",R?g[_]:x[_],R?h[j]:"","circle"===z?"rounded-full":R?p[_]:""),children:B}),q?s("span",{className:"flex min-w-0 flex-col",children:[m(b)?e("span",{className:i("truncate font-semibold",f[_]),children:b}):null,m(v)?e("span",{className:i("truncate text-(--plass-muted-fg)",d[_]),children:v}):null]}):null]}),...L}})});
+"use client";import{jsx as e,jsxs as s,Fragment as l}from"react/jsx-runtime";import*as r from"react";import{useRender as t}from"@base-ui/react/use-render";import{useDefaults as a}from"../../internal/defaults.js";import{controlSlots as n,cx as i,focusRingClasses as o,hasContent as c,markRestClasses as m,metaTextClasses as d,radiusClasses as p,transitionClasses as x}from"../../internal/styles.js";const f={xs:"h-5",sm:"h-6",md:"h-8",lg:"h-10",xl:"h-12"},u={xs:"size-5",sm:"size-6",md:"size-8",lg:"size-10",xl:"size-12"},g={xs:"text-sm",sm:"text-base",md:"text-lg",lg:"text-xl",xl:"text-2xl"},h={xs:"gap-1.5",sm:"gap-2",md:"gap-2.5",lg:"gap-3",xl:"gap-3.5"};export const PlAppLogo=/* @__PURE__ */r.forwardRef(function PlAppLogo({children:r,src:z,alt:j="",name:N,description:b,shape:v="bare",variant:w="solid",size:y,color:A,render:L,className:P,style:$,..._},k){const F=a(),R=y??F.size??"md",q=A??F.color??"primary",B="bare"!==v,C=c(N)||c(b),D=z?e("img",{src:z,alt:j,className:B?"size-[70%] object-contain":"h-full w-auto"}):r;return t({render:L,ref:k,props:{className:i("inline-flex items-center text-(--plass-fg) [&_svg]:h-full [&_svg]:w-auto",h[R],o,P),style:{...n(q,1,w),...$},children:s(l,{children:[e("span",{"aria-hidden":!!c(N)||void 0,className:i("flex shrink-0 items-center justify-center overflow-hidden",B?u[R]:f[R],B?`${x} ${m[w]}`:"","circle"===v?"rounded-full":B?p[R]:""),children:D}),C?s("span",{className:"flex min-w-0 flex-col",children:[c(N)?e("span",{className:i("truncate font-semibold",g[R]),children:N}):null,c(b)?e("span",{className:i("truncate text-(--plass-muted-fg)",d[R]),children:b}):null]}):null]}),..._}})});

package/dist/components/area-chart/PlAreaChart.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { type CartesianChartProps } from '../../internal/chart-frame.js';
 import { type ChartMarkers } from '../../internal/chart-line.js';
-import type { PlassChartCurve, PlassChartValueLabels } from '../../types.js';
+import type { PlassChartCurve, PlassChartLabelColor, PlassChartNulls, PlassChartValueLabels } from '../../types.js';
 export interface PlAreaChartProps extends CartesianChartProps {
     /**
      * How the edge of the band gets from one point to the next. The same three
@@ -30,10 +30,39 @@ export interface PlAreaChartProps extends CartesianChartProps {
     /** @default 'none' */
     valueLabels?: PlassChartValueLabels;
     /**
-     * Draws the band straight through a `null` instead of breaking at it. Off,
-     * and on an area it matters more than on a line: a fill that closes across a
-     * missing month paints a made-up number over a larger part of the chart.
-     * @default false
+     * What colour those numbers are written in.
+     *
+     * `series` — the default — gives each label the colour of the band it is
+     * sitting on, so a plot with four labelled series says which number belongs
+     * to which without the reader tracing it back. `ink` writes them all in the
+     * page's own foreground: the chart palette clears 4:1 against the sheet,
+     * which is the floor a *mark* is held to rather than the 4.5:1 body text
+     * wants, so reach for it where the labels have to meet the text contrast rule
+     * on their own.
+     * @default 'series'
+     */
+    valueLabelColor?: PlassChartLabelColor;
+    /**
+     * What a gap in a series does to the band.
+     *
+     * - `gap` — it breaks at the `null`. The default, and the only answer that
+     *   claims nothing the data did not: the blank says the reading is missing.
+     * - `connect` — the two sides are joined. Only when the gap is an artefact of
+     *   how the data was collected; otherwise the segment is a number the chart
+     *   made up.
+     * - `zero` — the gap is read as a zero, everywhere: on the axis, in the
+     *   tooltip and in the table as well as under the band. For a missing row
+     *   that genuinely means none.
+     * @default 'gap'
+     */
+    nulls?: PlassChartNulls;
+    /**
+     * Bridges a gap instead of breaking at it. It matters more on an area than on
+     * a line: a fill that closes across a missing month paints the made-up number
+     * over a larger part of the chart.
+     * @deprecated Use `nulls`. `connectNulls` is `nulls="connect"`, and `nulls`
+     * also has the third answer — reading the gap as a zero — which a boolean
+     * cannot express. It is still honoured when `nulls` is not given.
      */
     connectNulls?: boolean;
 }
@@ -51,4 +80,4 @@ export interface PlAreaChartProps extends CartesianChartProps {
  * so two of them overlapping stay readable. Stacked bands are opaquer, because
  * there the fill *is* the mark rather than a hint at the line above it.
  */
-export declare function PlAreaChart({ curve, stacked, markers, valueLabels, connectNulls, series, yAxis, format, locale, ...props }: PlAreaChartProps): React.JSX.Element;
+export declare function PlAreaChart({ curve, stacked, markers, valueLabels, valueLabelColor, nulls: nullsProp, connectNulls, series, yAxis, format, locale, ...props }: PlAreaChartProps): React.JSX.Element;

package/dist/components/area-chart/PlAreaChart.js

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as t}from"../../internal/chart-frame.js";import{LineSeries as a}from"../../internal/chart-line.js";import{stackToFull as n,writeChartValue as o}from"../../internal/chart.js";import{useDefaults as l}from"../../internal/defaults.js";export function PlAreaChart({curve:s="linear",stacked:i=!1,markers:c="none",valueLabels:m="none",connectNulls:u=!1,series:f,yAxis:d,format:p,locale:x,...h}){const j=l(),k=x??j.locale,v=r.useId().replace(/:/g,""),A="full"===i,b=r.useMemo(()=>A?n(f,e=>o(e,p,k)):f,[f,A,p,k]);return e(t,{...h,series:b,format:p,locale:x,yAxis:A?{min:0,max:100,tickFormat:e=>`${e}%`,...d}:d,stacked:!1!==i,inset:!0,includeZero:!0,headroom:"none"===m?0:10,children:r=>e(a,{context:r,curve:s,filled:!0,stacked:!1!==i,markers:c,valueLabels:m,connectNulls:u,gradient:!1,idPrefix:v})})}
+"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as a}from"../../internal/chart-frame.js";import{LineSeries as t}from"../../internal/chart-line.js";import{stackToFull as l,writeChartValue as o,zeroNulls as n}from"../../internal/chart.js";import{useDefaults as s}from"../../internal/defaults.js";export function PlAreaChart({curve:i="linear",stacked:c=!1,markers:m="none",valueLabels:u="none",valueLabelColor:f="series",nulls:d,connectNulls:p=!1,series:x,yAxis:k,format:h,locale:j,...v}){const b=s(),L=j??b.locale,g=r.useId().replace(/:/g,""),A="full"===c,C=d??(p?"connect":"gap"),y=r.useMemo(()=>{const e="zero"===C?n(x):x;return A?l(e,e=>o(e,h,L)):e},[x,C,A,h,L]);return e(a,{...v,series:y,format:h,locale:j,yAxis:A?{min:0,max:100,tickFormat:e=>`${e}%`,...k}:k,stacked:!1!==c,stroked:!1===c,inset:!0,includeZero:!0,headroom:"none"===u?0:10,children:r=>e(t,{context:r,curve:i,filled:!0,stacked:!1!==c,markers:m,valueLabels:u,valueLabelColor:f,nulls:C,gradient:!1,idPrefix:g})})}

package/dist/components/aspect-ratio/PlAspectRatio.js

@@ -1 +1 @@
-"use client";import*as e from"react";import{useDefaults as i}from"../../internal/defaults.js";import{useRender as o}from"@base-ui/react/use-render";import{cx as t,radiusClasses as c}from"../../internal/styles.js";const l=/* @__PURE__ */["[&>img]:size-full","[&>video]:size-full","[&>canvas]:size-full","[&>svg]:size-full","[&>iframe]:size-full","[&>picture]:size-full","[&>picture>img]:size-full"].join(" "),r={cover:"[&>img]:object-cover [&>video]:object-cover [&>picture>img]:object-cover",contain:"[&>img]:object-contain [&>video]:object-contain [&>picture>img]:object-contain",fill:"[&>img]:object-fill [&>video]:object-fill [&>picture>img]:object-fill",none:"[&>img]:object-none [&>video]:object-none [&>picture>img]:object-none","scale-down":"[&>img]:object-scale-down [&>video]:object-scale-down [&>picture>img]:object-scale-down"};export const PlAspectRatio=/* @__PURE__ */e.forwardRef(function PlAspectRatio({ratio:e=1,fit:n="cover",rounded:s=!1,size:a,render:f,className:m,style:d,children:u,...j},b){const p=i(),v=a??p.size??"md",g=t("relative block w-full overflow-hidden",l,r[n],s?c[v]:"",m);return o({render:f,ref:b,props:{className:g,style:{aspectRatio:e,...d},children:u,...j}})});
+"use client";import*as e from"react";import{useDefaults as i}from"../../internal/defaults.js";import{useRender as o}from"@base-ui/react/use-render";import{cx as t,focusRingClasses as c,radiusClasses as r}from"../../internal/styles.js";const l=/* @__PURE__ */["[&>img]:size-full","[&>video]:size-full","[&>canvas]:size-full","[&>svg]:size-full","[&>iframe]:size-full","[&>picture]:size-full","[&>picture>img]:size-full"].join(" "),n={cover:"[&>img]:object-cover [&>video]:object-cover [&>picture>img]:object-cover",contain:"[&>img]:object-contain [&>video]:object-contain [&>picture>img]:object-contain",fill:"[&>img]:object-fill [&>video]:object-fill [&>picture>img]:object-fill",none:"[&>img]:object-none [&>video]:object-none [&>picture>img]:object-none","scale-down":"[&>img]:object-scale-down [&>video]:object-scale-down [&>picture>img]:object-scale-down"};export const PlAspectRatio=/* @__PURE__ */e.forwardRef(function PlAspectRatio({ratio:e=1,fit:s="cover",rounded:a=!1,size:m,render:f,className:d,style:u,children:p,...j},b){const v=i(),g=m??v.size??"md",z=v.color??"primary",w=t("relative block w-full overflow-hidden",l,n[s],a?r[g]:"",c,d);return o({render:f,ref:b,props:{className:w,style:{aspectRatio:e,"--p-ring":`var(--plass-${z}-ring)`,...u},children:p,...j}})});

package/dist/components/avatar/PlAvatar.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{useDefaults as t}from"../../internal/defaults.js";import{Avatar as s}from"@base-ui/react/avatar";import{controlHeightClasses as o,controlSlots as l,controlSquareClasses as n,forcedFieldEdgeClasses as i,glassClasses as c,hasContent as d,radiusClasses as m,srOnlyClasses as p,transitionClasses as f}from"../../internal/styles.js";const g={xs:"text-[0.5625rem]",sm:"text-[0.6875rem]",md:"text-[0.8125rem]",lg:"text-[1rem]",xl:"text-[1.1875rem]"},v={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",i].join(" "),glass:/* @__PURE__ */[c,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--p-accent) bg-(--p-soft-press) [box-shadow:var(--p-elev)]"},h=/* @__PURE__ */["relative inline-flex shrink-0 select-none items-center justify-center overflow-hidden","align-middle leading-none font-semibold tracking-wide whitespace-nowrap","[&_svg]:pointer-events-none [&_svg]:size-[55%]",f].join(" ");function PersonIcon(){return r("svg",{viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",children:[e("path",{d:"M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Z"}),e("path",{d:"M12 14.25c-4.28 0-7.75 2.42-7.75 5.4 0 .75.6 1.35 1.35 1.35h12.8c.75 0 1.35-.6 1.35-1.35 0-2.98-3.47-5.4-7.75-5.4Z"})]})}export const PlAvatar=/* @__PURE__ */a.forwardRef(function PlAvatar({src:a,srcSet:i,alt:c,name:f,initials:u,shape:x,variant:b,size:j,color:y,elevation:w,delay:N,imageProps:z,onLoadingStatusChange:A,className:C,style:P,children:k,...B},S){const I=t(),L=x??"circle",F=b??"ghost",M=j??I.size??"md",R=y??I.color??"primary",Z=w??0,_=f?function initialsOf(e){const r=e.normalize("NFC").trim().split(/\s+/).filter(Boolean);return 0===r.length?"":((Array.from(r[0])[0]??"")+(r.length>1?Array.from(r[r.length-1])[0]??"":"")).toLocaleUpperCase()}(f):"",O=c??f,U=d(k)?k:(u??_)||e(PersonIcon,{}),q=d(k)||Boolean(u??_),D=[h,o[M],n[M],g[M],"circle"===L?"rounded-full":m[M],v[F],C??""].filter(Boolean).join(" ");return r(s.Root,{ref:S,className:D,style:{...l(R,Z,F),...P},...B,children:[a?e(s.Image,{src:a,srcSet:i,alt:O??"",className:"size-full object-cover",onLoadingStatusChange:A,...z}):null,r(s.Fallback,{delay:a?N:void 0,className:"flex size-full items-center justify-center",children:[O&&q?e("span",{className:p,children:O}):null,e("span",{"aria-hidden":!(!O||!q)||void 0,className:"contents",children:U})]})]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{useDefaults as n}from"../../internal/defaults.js";import{Avatar as a}from"@base-ui/react/avatar";import{controlHeightClasses as s,controlSlots as i,controlSquareClasses as l,hasContent as o,markRestClasses as c,pictureSlotClasses as m,radiusClasses as d,srOnlyClasses as f,transitionClasses as u}from"../../internal/styles.js";const h={xs:"text-[0.5625rem]",sm:"text-[0.6875rem]",md:"text-[0.8125rem]",lg:"text-[1rem]",xl:"text-[1.1875rem]"},p=/* @__PURE__ */["relative inline-flex shrink-0 select-none items-center justify-center overflow-hidden","align-middle leading-none font-semibold tracking-wide whitespace-nowrap","[&_svg]:pointer-events-none [&_svg]:size-[55%]",u].join(" ");function PersonIcon(){return t("svg",{viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",children:[e("path",{d:"M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Z"}),e("path",{d:"M12 14.25c-4.28 0-7.75 2.42-7.75 5.4 0 .75.6 1.35 1.35 1.35h12.8c.75 0 1.35-.6 1.35-1.35 0-2.98-3.47-5.4-7.75-5.4Z"})]})}export const PlAvatar=/* @__PURE__ */r.forwardRef(function PlAvatar({src:r,srcSet:u,alt:g,name:v,initials:x,shape:j,variant:y,size:N,color:w,elevation:z,delay:A,imageProps:C,onLoadingStatusChange:P,className:b,style:B,children:S,...k},I){const L=n(),F=j??"circle",M=y??"ghost",R=N??L.size??"md",Z=w??L.color??"primary",_=z??0,O=v?function initialsOf(e){const t=e.normalize("NFC").trim().split(/\s+/).filter(Boolean);return 0===t.length?"":((Array.from(t[0])[0]??"")+(t.length>1?Array.from(t[t.length-1])[0]??"":"")).toLocaleUpperCase()}(v):"",U=g??v,$=o(S)?S:(x??O)||e(PersonIcon,{}),q=o(S)||Boolean(x??O),D=[p,s[R],l[R],h[R],"circle"===F?"rounded-full":d[R],c[M],b??""].filter(Boolean).join(" ");return t(a.Root,{ref:I,className:D,style:{...i(Z,_,M),...B},...k,children:[r?e(a.Image,{src:r,srcSet:u,alt:U??"",className:"size-full object-cover",onLoadingStatusChange:P,...C}):null,t(a.Fallback,{delay:r?A:void 0,className:"flex size-full items-center justify-center",children:[U&&q?e("span",{className:f,children:U}):null,e("span",{"aria-hidden":!(!U||!q)||void 0,className:`contents ${m}`,children:$})]})]})});

package/dist/components/back-top/PlBackTop.d.ts

@@ -27,6 +27,12 @@ export interface PlBackTopProps extends Omit<React.ComponentPropsWithoutRef<'but
      * On by default, because that is what this component is. Turn it off to put
      * the button somewhere of your own — the end of an article, a toolbar — and
      * keep the appearing and the scrolling.
+     *
+     * A pinned button sits 24px off the bottom end corner, and the safe area on
+     * both of those edges on top of that, so it clears the home indicator, the
+     * navigation bar or a landscape camera cutout of an edge-to-edge screen. The
+     * pinning is an inline `position: fixed` with logical insets, so a `style` of
+     * your own replaces it and a class of your own cannot.
      * @default true
      */
     floating?: boolean;

package/dist/components/back-top/PlBackTop.js

@@ -1 +1 @@
-"use client";import{jsx as o}from"react/jsx-runtime";import*as e from"react";import{PlIconButton as t}from"../icon-button/PlIconButton.js";import{useDefaults as r}from"../../internal/defaults.js";import{resolveScrollTarget as n}from"../../internal/scroll-target.js";import{useLabels as i}from"../../internal/labels.js";import{focusablesIn as s}from"../../internal/focusable.js";import{usePrefersReducedMotion as l}from"../../internal/media.js";import{cx as a,transitionClasses as c}from"../../internal/styles.js";function ChevronUp(){return o("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:o("path",{d:"M4.5 9.5 8 6l3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export const PlBackTop=/* @__PURE__ */e.forwardRef(function PlBackTop({target:d,visibilityHeight:f=400,label:m,icon:u,floating:p=!0,variant:v="glass",size:b,color:h,elevation:j=2,className:k,onClick:T,...g},x){const y=r(),w=i(),C=m??w.backToTop,z=b??y.size??"md",B=h??y.color??"primary",E=l(),[L,P]=e.useState(!1);return e.useEffect(()=>{const o=n(d);if(!o)return;const read=()=>P(function scrollTopOf(o){return o instanceof Window?o.scrollY:o.scrollTop}(o)>f);return read(),o.addEventListener("scroll",read,{passive:!0}),()=>o.removeEventListener("scroll",read)},[d,f]),o(t,{ref:x,label:C,icon:u??o(ChevronUp,{}),variant:v,size:z,color:B,elevation:j,onClick:o=>{if(T?.(o),o.defaultPrevented)return;const e=n(d);e?.scrollTo({top:0,behavior:E?"instant":"smooth"});const t=o.currentTarget;if(e&&document.activeElement===t){const o=e===window?document.body:e,r=s(o).find(o=>o!==t&&!o.closest('[aria-hidden="true"]'));r?r.focus({preventScroll:!0}):t.blur()}},"aria-hidden":!L||void 0,tabIndex:L?void 0:-1,className:a(p?"fixed end-6 bottom-6 z-30":"",c,L?"opacity-100":"pointer-events-none opacity-0",k),...g})});
+"use client";import{jsx as e}from"react/jsx-runtime";import*as o from"react";import{PlIconButton as t}from"../icon-button/PlIconButton.js";import{useDefaults as n}from"../../internal/defaults.js";import{resolveScrollTarget as r}from"../../internal/scroll-target.js";import{useLabels as i}from"../../internal/labels.js";import{focusablesIn as s}from"../../internal/focusable.js";import{usePrefersReducedMotion as l}from"../../internal/media.js";import{cx as a,safeInlineClasses as c,transitionClasses as d}from"../../internal/styles.js";const f="1.5rem";function ChevronUp(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"M4.5 9.5 8 6l3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export const PlBackTop=/* @__PURE__ */o.forwardRef(function PlBackTop({target:m,visibilityHeight:p=400,label:u,icon:v,floating:b=!0,variant:h="glass",size:j,color:k,elevation:x=2,className:y,style:T,onClick:g,...E},w){const B=n(),C=i(),z=u??C.backToTop,L=j??B.size??"md",P=k??B.color??"primary",I=l(),[N,S]=o.useState(!1);o.useEffect(()=>{const e=r(m);if(!e)return;const read=()=>S(function scrollTopOf(e){return e instanceof Window?e.scrollY:e.scrollTop}(e)>p);return read(),e.addEventListener("scroll",read,{passive:!0}),()=>e.removeEventListener("scroll",read)},[m,p]);const U=b?{position:"fixed",insetInlineEnd:`calc(${f} + var(--p-safe-inline, 0px))`,insetBlockEnd:`calc(${f} + env(safe-area-inset-bottom, 0px))`}:{};return e(t,{ref:w,label:z,icon:v??e(ChevronUp,{}),variant:h,size:L,color:P,elevation:x,onClick:e=>{if(g?.(e),e.defaultPrevented)return;const o=r(m);o?.scrollTo({top:0,behavior:I?"instant":"smooth"});const t=e.currentTarget;if(o&&document.activeElement===t){const e=o===window?document.body:o,n=s(e).find(e=>e!==t&&!e.closest('[aria-hidden="true"]'));n?n.focus({preventScroll:!0}):t.blur()}},"aria-hidden":!N||void 0,tabIndex:N?void 0:-1,className:a(b?"z-30":"",b&&c.End,d,N?"opacity-100":"pointer-events-none opacity-0",y),style:{...U,...T},...E})});

package/dist/components/badge/PlBadge.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as t,jsxs as s}from"react/jsx-runtime";import*as m from"react";import{useDefaults as o}from"../../internal/defaults.js";import{controlSlots as a,forcedFieldEdgeClasses as l,glassClasses as n,hasContent as r,srOnlyClasses as i,transitionClasses as d}from"../../internal/styles.js";const p={xs:"h-3.5 min-w-3.5",sm:"h-4 min-w-4",md:"h-4.5 min-w-4.5",lg:"h-5 min-w-5",xl:"h-6 min-w-6"},b={xs:"size-1.5",sm:"size-2",md:"size-2.5",lg:"size-2.5",xl:"size-3"},x={xs:"text-[0.5625rem]",sm:"text-[0.625rem]",md:"text-[0.6875rem]",lg:"text-[0.75rem]",xl:"text-[0.8125rem]"},c={default:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-1.5",xl:"px-2"},compact:{xs:"px-0.5",sm:"px-0.5",md:"px-1",lg:"px-1",xl:"px-1.5"}},g="rounded-full",f={xs:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},sm:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},md:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},lg:{badge:"-mt-2.5 -mb-2.5 -ms-2.5 -me-2.5",dot:"-mt-1 -mb-1 -ms-1 -me-1"},xl:{badge:"-mt-3 -mb-3 -ms-3 -me-3",dot:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5"}},u={"top-start":"top-0 start-0","top-end":"top-0 end-0","bottom-start":"bottom-0 start-0","bottom-end":"bottom-0 end-0"},h={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"},v={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",l].join(" "),glass:/* @__PURE__ */[n,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--p-accent) bg-(--p-soft-press)"};export const PlBadge=/* @__PURE__ */m.forwardRef(function PlBadge({variant:m="solid",size:l,color:n,density:w,elevation:j=0,content:y,max:z=99,dot:N=!1,showZero:k=!1,invisible:B=!1,placement:P="top-end",overlap:$="square",label:q,className:C,style:F,children:R,...Z},A){const D=o(),E=l??D.size??"md",G=n??D.color??"primary",H=w??D.density??"default",I=r(R),J=!r(y)||0===y&&!k,K=N||J,L=B||J&&!N,M=["pointer-events-none z-10 inline-flex shrink-0 items-center justify-center","font-semibold tabular-nums whitespace-nowrap",g,d,v[m],K?b[E]:[p[E],x[E],c[H][E]].join(" "),I?`absolute ${u[P]}`:"relative align-middle",I?K?f[E].dot:f[E].badge:"",I&&"circle"===$?h[P]:"",L?"invisible":"",C??""].filter(Boolean).join(" "),O=function capContent(e,t){return"number"==typeof e&&e>t?`${t}+`:e}(y,z),Q=e("span",{ref:A,className:M,style:{...a(G,j,m),...F},"aria-hidden":!!L||void 0,...Z,children:L?null:s(t,{children:[K||q?e("span",{className:i,children:q??O}):null,K?null:e("span",{"aria-hidden":!!q||void 0,children:O})]})});return I?s("span",{className:"relative inline-flex shrink-0 align-middle",children:[R,Q]}):Q});
+"use client";import{jsx as e,Fragment as t,jsxs as m}from"react/jsx-runtime";import*as s from"react";import{useDefaults as n}from"../../internal/defaults.js";import{controlSlots as i,hasContent as l,markRestClasses as o,srOnlyClasses as a,transitionClasses as r}from"../../internal/styles.js";const d={xs:"h-3.5 min-w-3.5",sm:"h-4 min-w-4",md:"h-4.5 min-w-4.5",lg:"h-5 min-w-5",xl:"h-6 min-w-6"},p={xs:"size-1.5",sm:"size-2",md:"size-2.5",lg:"size-2.5",xl:"size-3"},x={xs:"text-[0.5625rem]",sm:"text-[0.625rem]",md:"text-[0.6875rem]",lg:"text-[0.75rem]",xl:"text-[0.8125rem]"},b={default:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-1.5",xl:"px-2"},compact:{xs:"px-0.5",sm:"px-0.5",md:"px-1",lg:"px-1",xl:"px-1.5"}},c="rounded-full",u={xs:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},sm:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},md:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},lg:{badge:"-mt-2.5 -mb-2.5 -ms-2.5 -me-2.5",dot:"-mt-1 -mb-1 -ms-1 -me-1"},xl:{badge:"-mt-3 -mb-3 -ms-3 -me-3",dot:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5"}},f={"top-start":"top-0 start-0","top-end":"top-0 end-0","bottom-start":"bottom-0 start-0","bottom-end":"bottom-0 end-0"},g={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"};export const PlBadge=/* @__PURE__ */s.forwardRef(function PlBadge({variant:s="solid",size:h,color:v,density:w,elevation:j=0,content:y,max:z=99,dot:N=!1,showZero:B=!1,invisible:k=!1,placement:P="top-end",overlap:$="square",label:q,className:C,style:F,children:R,...Z},A){const D=n(),E=h??D.size??"md",G=v??D.color??"primary",H=w??D.density??"default",I=l(R),J=!l(y)||0===y&&!B,K=N||J,L=k||J&&!N,M=["pointer-events-none z-10 inline-flex shrink-0 items-center justify-center","font-semibold tabular-nums whitespace-nowrap",c,r,o[s],K?p[E]:[d[E],x[E],b[H][E]].join(" "),I?`absolute ${f[P]}`:"relative align-middle",I?K?u[E].dot:u[E].badge:"",I&&"circle"===$?g[P]:"",L?"invisible":"",C??""].filter(Boolean).join(" "),O=function capContent(e,t){return"number"==typeof e&&e>t?`${t}+`:e}(y,z),Q=e("span",{ref:A,className:M,style:{...i(G,j,s),...F},"aria-hidden":!!L||void 0,...Z,children:L?null:m(t,{children:[K||q?e("span",{className:a,children:q??O}):null,K?null:e("span",{"aria-hidden":!!q||void 0,children:O})]})});return I?m("span",{className:"relative inline-flex shrink-0 align-middle",children:[R,Q]}):Q});

package/dist/components/bar-chart/PlBarChart.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type CartesianChartProps } from '../../internal/chart-frame.js';
-import type { PlassChartValueLabels, PlassOrientation } from '../../types.js';
+import type { PlassChartCategory, PlassChartLabelColor, PlassChartSort, PlassChartValueLabels, PlassOrientation } from '../../types.js';
 export interface PlBarChartProps extends CartesianChartProps {
     /**
      * Which way the bars run.
@@ -46,6 +46,58 @@ export interface PlBarChartProps extends CartesianChartProps {
      * @default 'none'
      */
     valueLabels?: PlassChartValueLabels;
+    /**
+     * What colour those numbers are written in.
+     *
+     * `series` — the default — gives each label the colour of the bar it is
+     * sitting past, so a group of four labelled bars says which number belongs to
+     * which series without the reader counting along the group. `ink` writes them
+     * all in the page's own foreground: the chart palette clears 4:1 against the
+     * sheet, which is the floor a *mark* is held to rather than the 4.5:1 body
+     * text wants, so reach for it where the labels have to meet the text contrast
+     * rule on their own.
+     * @default 'series'
+     */
+    valueLabelColor?: PlassChartLabelColor;
+    /**
+     * Puts the categories in order of size rather than leaving them in the order
+     * they were given.
+     *
+     * A bar chart is the one shape whose categories can be shuffled without
+     * losing anything — that is the test for reaching for it over a line chart —
+     * so sorting them is free, and it is what turns a wall of bars into a ranking
+     * a reader can scan down. Leave it alone where the order already means
+     * something: months, sizes, a funnel's steps.
+     *
+     * With more than one series the size of a category is the **total** across
+     * all of them, and each series' magnitude rather than its signed value — a
+     * category whose two series are +50 and −50 is a hundred units of chart, not
+     * nothing. A series hidden from the legend is still counted, because a chart
+     * whose columns rearranged themselves when an entry was clicked is one a
+     * reader cannot use.
+     * @default 'none'
+     */
+    sort?: PlassChartSort;
+    /**
+     * Keeps the largest this many categories and sums the rest into one.
+     *
+     * The answer to a chart of ninety countries: a bar too short to see is a bar
+     * costing width without saying anything, and eighty of them is a chart of
+     * nothing but noise. What is folded is decided by size and never by `sort`,
+     * so `ascending` shows the small ones it kept rather than keeping the small
+     * ones — and the fold is always last, wherever the sort would otherwise have
+     * put it, because it is not a category but what is left.
+     *
+     * A fold of nothing but gaps stays a gap rather than becoming a zero.
+     */
+    maxCategories?: number;
+    /**
+     * What that fold is called. Falls back to the label pack's own word, which is
+     * "Other" in English.
+     */
+    otherLabel?: string;
+    /** The category axis' labels. Points may carry their own `x` instead. */
+    categories?: readonly PlassChartCategory[];
 }
 /**
  * Lengths, compared.
@@ -60,4 +112,4 @@ export interface PlBarChartProps extends CartesianChartProps {
  * is this total made of". They are different questions and the chart should be
  * asked only one of them at a time.
  */
-export declare function PlBarChart({ orientation, stacked, rounded, barSize, valueLabels, series, yAxis, format, locale, size: sizeProp, density: densityProp, ...props }: PlBarChartProps): React.JSX.Element;
+export declare function PlBarChart({ orientation, stacked, rounded, barSize, valueLabels, valueLabelColor, sort, maxCategories, otherLabel, series, categories, yAxis, format, locale, size: sizeProp, density: densityProp, ...props }: PlBarChartProps): React.JSX.Element;

package/dist/components/bar-chart/PlBarChart.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{CartesianChart as l,markTransitionClasses as r}from"../../internal/chart-frame.js";import{barBandRatio as n,barMaxThickness as i,barPath as o,barRadius as s,chartFontSizes as c,dimmedByHover as u,labelledPoints as d,markGap as m,stackToFull as h,writeChartValue as f}from"../../internal/chart.js";import{useDefaults as v}from"../../internal/defaults.js";export function PlBarChart({orientation:a="vertical",stacked:r=!1,rounded:o=!0,barSize:s,valueLabels:c="none",series:u,yAxis:d,format:m,locale:x,size:p,density:b,...y}){const z=v(),g=p??z.size??"md",k=b??z.density??"default",M=x??z.locale,j="horizontal"===a,B="full"===r,P=t.useMemo(()=>B?h(u,e=>f(e,m,M)):u,[u,B,m,M]);return e(l,{...y,series:P,format:m,locale:x,size:g,density:k,horizontal:j,stacked:!1!==r,yAxis:B?{min:0,max:100,tickFormat:e=>`${e}%`,...d}:d,includeZero:!0,bandRatio:n[k],headroom:"none"===c?0:12,children:a=>e(Bars,{context:a,stacked:!1!==r,rounded:o,barSize:s??i[g],valueLabels:c,size:g})})}function Bars({context:t,stacked:l,rounded:n,barSize:i,valueLabels:h,size:f}){const{values:v,visible:x,colors:p,hovered:b,activeIndex:y,plot:z,band:g,horizontal:k,valuePx:M,categoryPx:j,zeroPx:B,format:P}=t,S=v.map((e,a)=>({one:e,index:a})).filter(e=>x[e.index]),A=l?1:Math.max(1,S.length),L=Math.min(i,Math.max(1,(g.band-m*(A-1))/A)),N=L*A+m*(A-1),W=[],w=[],C=c[f];return a("g",{children:[S.map(({one:t,index:i},c)=>{const f=p[i],v=u(b,i,x),g=d(t,h);return e("g",{opacity:v?.28:1,className:r,children:t.map((t,i)=>{if(null===t.value)return null;const u=j(i),d=l?0:c*(L+m)-N/2+L/2,h=l?t.value>=0?W[i]??0:w[i]??0:0,v=M(h),x=M(h+t.value);l&&(t.value>=0?W[i]=h+t.value:w[i]=h+t.value);const p=l&&0!==h?m:0,b=Math.abs(x-v)-p;if(b<=0)return null;const B=x<v,S=i===y,A=k?o(Math.min(v,x)+(B?0:p),z.top+u+d-L/2,b,L,n&&!l?s:n?s/2:0,t.value>=0?"right":"left"):o(z.left+u+d-L/2,Math.min(v,x)+(B?0:p),L,b,n&&!l?s:n?s/2:0,t.value>=0?"up":"down");return a("g",{children:[e("path",{d:A,fill:t.color??f,opacity:S?1:.92,className:r}),g(i)?e("text",{x:k?x+(t.value>=0?5:-5):z.left+u+d,y:k?z.top+u+d:t.value>=0?x-5:x+C+2,textAnchor:k?t.value>=0?"start":"end":"middle",dominantBaseline:k?"central":void 0,fontSize:C,fontWeight:500,fill:"var(--plass-fg)",className:"tabular-nums",children:t.label??P(t.value)}):null]},i)})},i)}),e("line",k?{x1:B,x2:B,y1:z.top,y2:z.top+z.height,stroke:"var(--plass-chart-baseline)",strokeWidth:1}:{x1:z.left,x2:z.left+z.width,y1:B,y2:B,stroke:"var(--plass-chart-baseline)",strokeWidth:1})]})}
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{CartesianChart as r,markTransitionClasses as l}from"../../internal/chart-frame.js";import{barBandRatio as o,barMaxThickness as s,barPath as i,barRadius as n,chartFontSizes as c,dimmedByHover as u,labelledPoints as d,markGap as m,rankCategories as h,stackToFull as f,writeChartValue as v}from"../../internal/chart.js";import{useDefaults as x}from"../../internal/defaults.js";import{useLabels as p}from"../../internal/labels.js";export function PlBarChart({orientation:a="vertical",stacked:l=!1,rounded:i=!0,barSize:n,valueLabels:c="none",valueLabelColor:u="series",sort:d="none",maxCategories:m,otherLabel:b,series:g,categories:y,yAxis:z,format:k,locale:M,size:j,density:L,...C}){const B=x(),P=j??B.size??"md",S=L??B.density??"default",A=M??B.locale,N="horizontal"===a,W="full"===l,w=p(),F=b??w.chartOther,I=t.useMemo(()=>h(g,y,{sort:d,max:m,other:F}),[g,y,d,m,F]),O=t.useMemo(()=>W?f(I.series,e=>v(e,k,A)):I.series,[I.series,W,k,A]);return e(r,{...C,series:O,categories:I.categories,format:k,locale:M,size:P,density:S,horizontal:N,stacked:!1!==l,yAxis:W?{min:0,max:100,tickFormat:e=>`${e}%`,...z}:z,includeZero:!0,bandRatio:o[S],headroom:"none"===c?0:12,children:a=>e(Bars,{context:a,stacked:!1!==l,rounded:i,barSize:n??s[P],valueLabels:c,valueLabelColor:u,size:P})})}function Bars({context:t,stacked:r,rounded:o,barSize:s,valueLabels:h,valueLabelColor:f,size:v}){const{values:x,visible:p,colors:b,hovered:g,activeIndex:y,plot:z,band:k,horizontal:M,valuePx:j,categoryPx:L,zeroPx:C,format:B}=t,P=x.map((e,a)=>({one:e,index:a})).filter(e=>p[e.index]),S=r?1:Math.max(1,P.length),A=Math.min(s,Math.max(1,(k.band-m*(S-1))/S)),N=A*S+m*(S-1),W=[],w=[],F=c[v];return a("g",{children:[P.map(({one:t,index:s},c)=>{const v=b[s],x=u(g,s,p),k=d(t,h);return e("g",{opacity:x?.28:1,className:l,children:t.map((t,s)=>{if(null===t.value)return null;const u=L(s),d=r?0:c*(A+m)-N/2+A/2,h=r?t.value>=0?W[s]??0:w[s]??0:0,x=j(h),p=j(h+t.value);r&&(t.value>=0?W[s]=h+t.value:w[s]=h+t.value);const b=r&&0!==h?m:0,g=Math.abs(p-x)-b;if(g<=0)return null;const C=p<x,P=s===y,S=M?i(Math.min(x,p)+(C?0:b),z.top+u+d-A/2,g,A,o&&!r?n:o?n/2:0,t.value>=0?"right":"left"):i(z.left+u+d-A/2,Math.min(x,p)+(C?0:b),A,g,o&&!r?n:o?n/2:0,t.value>=0?"up":"down");return a("g",{children:[e("path",{d:S,fill:t.color??v,opacity:P?1:.92,className:l}),k(s)?e("text",{x:M?p+(t.value>=0?5:-5):z.left+u+d,y:M?z.top+u+d:t.value>=0?p-5:p+F+2,textAnchor:M?t.value>=0?"start":"end":"middle",dominantBaseline:M?"central":void 0,fontSize:F,fontWeight:600,fill:"ink"===f?"var(--plass-fg)":t.color??v,className:"tabular-nums",children:t.label??B(t.value)}):null]},s)})},s)}),e("line",M?{x1:C,x2:C,y1:z.top,y2:z.top+z.height,stroke:"var(--plass-chart-baseline)",strokeWidth:1}:{x1:z.left,x2:z.left+z.width,y1:C,y2:C,stroke:"var(--plass-chart-baseline)",strokeWidth:1})]})}

package/dist/components/blockquote/PlBlockquote.d.ts

@@ -53,8 +53,8 @@ export interface PlBlockquoteProps extends PlassStyleProps, Omit<React.Component
  * name. VitePress's `.vp-doc blockquote` sets a grey `border-left`, a
  * `padding-left` and a `color`, all at a specificity a one-class utility cannot
  * outrank, so a rule drawn on the quote itself would silently come out grey and
- * a pixel too thin. Moving the drawing onto a wrapper is what lets the docs undo
- * VitePress's version without also undoing this one.
+ * a pixel too thin. Drawn on a wrapper, the quote looks the same whatever a host
+ * stylesheet does to `blockquote`.
  *
  * The wrapper is a `<figure>` when there is an attribution and a `<div>` when
  * there is not, because the HTML spec is explicit that the attribution goes

package/dist/components/blockquote/PlBlockquote.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as r from"react";import{useDefaults as l}from"../../internal/defaults.js";import{glassClasses as t,hasContent as a,metaTextClasses as o,radiusClasses as n,sheetPaddingXClasses as i,sheetPaddingYClasses as c,surfaceSlots as d,transitionClasses as m}from"../../internal/styles.js";const p={xs:"text-[0.75rem]/[1.25rem]",sm:"text-[0.8125rem]/[1.375rem]",md:"text-[0.9375rem]/[1.625rem]",lg:"text-[1.0625rem]/[1.875rem]",xl:"text-[1.25rem]/[2.125rem]"},f="border-s-2 [border-inline-start-color:var(--p-accent)]",u={solid:/* @__PURE__ */[t,"bg-(--plass-glass-press)","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */[t,"border border-s-2 bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"bg-transparent"};function QuoteMarkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"M6.4 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6ZM13.3 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6Z",fill:"currentColor"})})}export const PlBlockquote=/* @__PURE__ */r.forwardRef(function PlBlockquote({variant:r="ghost",size:t,color:g,density:x,elevation:h=0,author:v,source:b,cite:j,icon:N,className:y,style:k,children:w,...z},B){const M=l(),q=t??M.size??"md",I=g??M.color??"primary",P=x??M.density??"default",Q=a(v)||a(b),Z=void 0===N?e(QuoteMarkIcon,{}):N,C=["flex flex-col text-(--plass-fg)",f,"ghost"===r?"":`${n[q]} rounded-s-none`,u[r],i[P][q],c[P][q],m,y??""].filter(Boolean).join(" "),R=s("blockquote",{cite:j,className:p[q],children:[a(Z)?e("span",{"aria-hidden":"true",className:"mb-1 block size-[2em] text-(--p-soft-press) [&>svg]:size-full",children:Z}):null,w]}),$={...d(I,h),...k};return Q?s("figure",{ref:B,className:C,style:$,...z,children:[R,s("figcaption",{className:["mt-2 flex flex-wrap items-baseline gap-x-1.5 text-(--plass-muted-fg)",o[q]].join(" "),children:[a(v)?s("span",{className:"font-medium text-(--plass-fg)",children:[e("span",{"aria-hidden":"true",children:"— "}),v]}):null,a(b)?e("cite",{className:"not-italic",children:b}):null]})]}):e("div",{ref:B,className:C,style:$,...z,children:R})});
+"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as r from"react";import{useDefaults as l}from"../../internal/defaults.js";import{glassClasses as t,hasContent as a,metaTextClasses as o,radiusClasses as n,sheetPaddingXClasses as i,sheetPaddingYClasses as c,surfaceSlots as m,transitionClasses as d}from"../../internal/styles.js";const p={xs:"text-[0.75rem]/[1.25rem]",sm:"text-[0.8125rem]/[1.375rem]",md:"text-[0.9375rem]/[1.625rem]",lg:"text-[1.0625rem]/[1.875rem]",xl:"text-[1.25rem]/[2.125rem]"},f="border-s-2 [border-inline-start-color:var(--p-accent)]",u={solid:/* @__PURE__ */[t,"bg-(--plass-glass-press)","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */[t,"border border-s-2 bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"bg-transparent"};function QuoteMarkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"M6.4 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6ZM13.3 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6Z",fill:"currentColor"})})}export const PlBlockquote=/* @__PURE__ */r.forwardRef(function PlBlockquote({variant:r="ghost",size:t,color:g,density:x,elevation:h=0,author:v,source:b,cite:j,icon:N,className:k,style:y,children:w,...z},B){const M=l(),q=t??M.size??"md",I=g??M.color??"primary",P=x??M.density??"default",Q=a(v)||a(b),Z=void 0===N?e(QuoteMarkIcon,{}):N,$=["m-0 flex flex-col text-(--plass-fg)",f,"ghost"===r?"":`${n[q]} rounded-s-none`,u[r],i[P][q],c[P][q],d,k??""].filter(Boolean).join(" "),C=s("blockquote",{cite:j,className:`m-0 ${p[q]}`,children:[a(Z)?e("span",{"aria-hidden":"true",className:"mb-1 block size-[2em] text-(--p-soft-press) [&>svg]:block [&>svg]:size-full",children:Z}):null,w]}),R={...m(I,h),...y};return Q?s("figure",{ref:B,className:$,style:R,...z,children:[C,s("figcaption",{className:["mt-2 flex flex-wrap items-baseline gap-x-1.5 text-(--plass-muted-fg)",o[q]].join(" "),children:[a(v)?s("span",{className:"font-medium text-(--plass-fg)",children:[e("span",{"aria-hidden":"true",children:"— "}),v]}):null,a(b)?e("cite",{className:"not-italic",children:b}):null]})]}):e("div",{ref:B,className:$,style:R,...z,children:C})});

package/dist/components/bottom-navigation/PlBottomNavigation.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as a,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{useDefaults as s}from"../../internal/defaults.js";import{useRender as i}from"@base-ui/react/use-render";import{cx as r,focusRingInsetClasses as n,hasContent as o,iconSizeClasses as c,metaTextClasses as d,radiusClasses as m,sheetLineClasses as u,sheetRestClasses as p,srOnlyClasses as f,surfaceSlots as g,transitionClasses as h}from"../../internal/styles.js";const x=/* @__PURE__ */l.createContext({value:null,change:()=>{},size:"md",density:"default",labels:"all",disabled:!1}),v={static:"",sticky:"sticky bottom-0 z-20",fixed:"fixed inset-x-0 bottom-0 z-30"},b={xs:"min-h-10",sm:"min-h-12",md:"min-h-14",lg:"min-h-16",xl:"min-h-18"},y={default:{xs:"p-1",sm:"p-1",md:"p-1.5",lg:"p-2",xl:"p-2.5"},compact:{xs:"p-0.5",sm:"p-0.5",md:"p-1",lg:"p-1",xl:"p-1.5"}},N={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"};export const PlBottomNavigation=/* @__PURE__ */l.forwardRef(function PlBottomNavigation({variant:a="glass",size:t,color:n,density:o,elevation:c=0,value:d,defaultValue:f=null,onValueChange:N,position:z="fixed",labels:w="all",divider:k=!0,safeArea:j=!0,disabled:C=!1,label:P,render:B,className:I,style:R,children:V,...A},D){const F=s(),M=t??F.size??"md",S=n??F.color??"primary",q=o??F.density??"default",[E,G]=l.useState(f),H=void 0!==d,J=H?d:E,K=l.useCallback(e=>{H||G(e),N?.(e)},[H,N]),L=l.useMemo(()=>({value:J??null,change:K,size:M,density:q,labels:w,disabled:C}),[J,K,M,q,w,C]),O=r("w-full min-w-0","static"===z?m[M]:"",p[a],"glass"===a&&"static"!==z?"border-0":"",k?u:"",v[z],j?"pb-[env(safe-area-inset-bottom)]":"",h,I);return i({render:B??e("nav",{}),ref:D,props:{"aria-label":P,className:O,style:{...g(S,c),...R},children:e(x.Provider,{value:L,children:e("div",{className:r("flex w-full items-stretch",b[M],y[q][M]),children:V})}),...A}})});export const PlBottomNavigationItem=/* @__PURE__ */l.forwardRef(function PlBottomNavigationItem({value:s,icon:i,href:u,disabled:p=!1,className:g,children:v,onClick:b,...y},z){const w=l.useContext(x),k=p||w.disabled,j=null!==w.value&&w.value===s,C="all"===w.labels||"selected"===w.labels&&j,P=r("flex min-w-0 flex-1 flex-col items-center justify-center px-1 py-1.5",N[w.size],m[w.size],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",h,n,k?"cursor-not-allowed opacity-50 saturate-[0.35] text-(--plass-muted-fg)":j?"cursor-pointer font-medium text-(--p-accent) bg-(--p-soft) hover:bg-(--p-soft-hover)":"cursor-pointer text-(--plass-muted-fg) hover:text-(--plass-fg) hover:bg-(--plass-glass-hover)",g),B=t(a,{children:[o(i)?e("span",{className:r("flex shrink-0 items-center justify-center",c[w.size]),children:i}):null,o(v)?e("span",{className:C?r("max-w-full truncate leading-tight",d[w.size]):f,children:v}):null]}),press=e=>{k?e.preventDefault():(w.change(s),b?.(e))};return u?e("a",{ref:z,href:k?void 0:u,"aria-current":j?"page":void 0,"aria-disabled":k||void 0,className:P,onClick:press,...y,children:B}):e("button",{ref:z,type:"button",disabled:k,"aria-current":j?"page":void 0,className:P,onClick:press,...y,children:B})});
+"use client";import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{useDefaults as s}from"../../internal/defaults.js";import{useRender as i}from"@base-ui/react/use-render";import{useBottomBarHeight as r}from"../../internal/bottom-bar.js";import{cx as n,focusRingInsetClasses as o,hasContent as c,iconSizeClasses as d,metaTextClasses as m,radiusClasses as u,sheetLineClasses as p,sheetRestClasses as f,srOnlyClasses as g,surfaceSlots as h,transitionClasses as x}from"../../internal/styles.js";const b=/* @__PURE__ */l.createContext({value:null,change:()=>{},size:"md",density:"default",labels:"all",disabled:!1}),v={static:"",sticky:"sticky bottom-0 z-20",fixed:"fixed inset-x-0 bottom-0 z-30"},y={xs:"min-h-10",sm:"min-h-12",md:"min-h-14",lg:"min-h-16",xl:"min-h-18"},N={default:{xs:"p-1",sm:"p-1",md:"p-1.5",lg:"p-2",xl:"p-2.5"},compact:{xs:"p-0.5",sm:"p-0.5",md:"p-1",lg:"p-1",xl:"p-1.5"}},z={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"};export const PlBottomNavigation=/* @__PURE__ */l.forwardRef(function PlBottomNavigation({variant:t="glass",size:a,color:o,density:c,elevation:d=0,value:m,defaultValue:g=null,onValueChange:z,position:w="fixed",labels:j="all",divider:k=!0,safeArea:C=!0,disabled:P=!1,label:B,render:R,className:I,style:V,children:A,...D},F){const M=s(),S=a??M.size??"md",q=o??M.color??"primary",E=c??M.density??"default",[G,H]=l.useState(g),J=void 0!==m,K=J?m:G,L=l.useCallback(e=>{J||H(e),z?.(e)},[J,z]),O=l.useMemo(()=>({value:K??null,change:L,size:S,density:E,labels:j,disabled:P}),[K,L,S,E,j,P]),Q=l.useRef(null);r(Q,"fixed"===w);const T=n("w-full min-w-0","static"===w?u[S]:"",f[t],"glass"===t&&"static"!==w?"border-0":"",k?p:"",v[w],C?"pb-[env(safe-area-inset-bottom)]":"",x,I);return i({render:R??e("nav",{}),ref:[F,Q],props:{"aria-label":B,className:T,style:{...h(q,d),...V},children:e(b.Provider,{value:O,children:e("div",{className:n("flex w-full items-stretch",y[S],N[E][S]),children:A})}),...D}})});export const PlBottomNavigationItem=/* @__PURE__ */l.forwardRef(function PlBottomNavigationItem({value:s,icon:i,href:r,disabled:p=!1,className:f,children:h,onClick:v,...y},N){const w=l.useContext(b),j=p||w.disabled,k=null!==w.value&&w.value===s,C="all"===w.labels||"selected"===w.labels&&k,P=n("flex min-w-0 flex-1 flex-col items-center justify-center px-1 py-1.5",z[w.size],u[w.size],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",x,o,j?"cursor-not-allowed opacity-50 saturate-[0.35] text-(--plass-muted-fg)":k?"cursor-pointer font-medium text-(--p-accent) bg-(--p-soft) hover:bg-(--p-soft-hover)":"cursor-pointer text-(--plass-muted-fg) hover:text-(--plass-fg) hover:bg-(--plass-glass-hover)",f),B=a(t,{children:[c(i)?e("span",{className:n("flex shrink-0 items-center justify-center",d[w.size]),children:i}):null,c(h)?e("span",{className:C?n("max-w-full truncate leading-tight",m[w.size]):g,children:h}):null]}),press=e=>{j?e.preventDefault():(w.change(s),v?.(e))};return r?e("a",{ref:N,href:j?void 0:r,"aria-current":k?"page":void 0,"aria-disabled":j||void 0,className:P,onClick:press,...y,children:B}):e("button",{ref:N,type:"button",disabled:j,"aria-current":k?"page":void 0,className:P,onClick:press,...y,children:B})});

package/dist/components/breadcrumb/PlBreadcrumb.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import*as a from"react";import{useDefaults as s}from"../../internal/defaults.js";import{useLabels as n}from"../../internal/labels.js";import{ArrowRightIcon as l,ChevronIcon as c,EllipsisIcon as i}from"../../internal/icons.js";import{textOf as o}from"../../internal/text.js";import{controlTextClasses as m,cx as u,focusRingClasses as d,gapClasses as p,hasContent as f,iconClasses as h,radiusClasses as x,transitionClasses as g}from"../../internal/styles.js";const b=/* @__PURE__ */a.createContext({size:"md",last:!1}),y={default:{xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"},compact:{xs:"gap-0.5",sm:"gap-1",md:"gap-1",lg:"gap-1.5",xl:"gap-2"}},N={xs:x.xs,sm:x.xs,md:x.xs,lg:x.sm,xl:x.sm},v=["chevron","arrow","slash","dot"];function absoluteHref(e,t){if(!t)return e;try{return new URL(e,t).href}catch{return e}}function breadcrumbListData(e,t){const r=e.map((e,r)=>{const{href:a,children:s}=e.props;return{"@type":"ListItem",position:r+1,name:o(s),...a?{item:absoluteHref(a,t)}:null}});return JSON.stringify({"@context":"https://schema.org","@type":"BreadcrumbList",itemListElement:r}).replace(/</g,"\\u003c")}export const PlBreadcrumb=/* @__PURE__ */a.forwardRef(function PlBreadcrumb({size:r,color:o,density:p,separator:f="chevron",maxItems:x,itemsBeforeCollapse:N=1,itemsAfterCollapse:k=1,expandable:w=!0,label:j,expandLabel:C,structuredData:L=!1,baseUrl:B,className:I,style:M,children:z,...P},R){const S=s(),A=n(),E=j??A.breadcrumb,D=C??A.breadcrumbExpand,H=r??S.size??"md",$=o??S.color??"primary",F=p??S.density??"default",[U,_]=a.useState(!1),q=a.useRef(null),J=a.useRef(!1);a.useEffect(()=>{if(!U||!J.current)return;J.current=!1;const e=Array.from(q.current?.children??[]).filter(e=>"true"!==e.getAttribute("aria-hidden"));for(const t of e.slice(Math.max(0,N))){const e=t.querySelector("a[href], button:not(:disabled)");if(e)return void e.focus()}},[U,N]);const O=a.Children.toArray(z).filter(a.isValidElement),T=O.length,V=O.some(e=>!0===e.props.current),G=!U&&void 0!==x&&T>Math.max(x,1)&&T-N-k>1?[...O.slice(0,Math.max(0,N)),null,...O.slice(T-Math.max(0,k))]:O,K=function isSeparatorName(e){return"string"==typeof e&&v.includes(e)}(f)?function separatorMark(t){switch(t){case"chevron":return e("span",{className:"flex -rotate-90 items-center rtl:rotate-90",children:e(c,{})});case"arrow":return e("span",{className:"flex items-center rtl:rotate-180",children:e(l,{})});case"slash":return e("span",{className:"opacity-70",children:"/"});case"dot":return e("span",{className:"opacity-70",children:"·"});default:return null}}(f):f,Q=u("inline-flex items-center rounded-(--plass-radius-xs) px-0.5","text-(--plass-muted-fg)",g,h,w?u("cursor-pointer hover:bg-(--p-soft) hover:text-(--p-accent)",d):"");return t("nav",{ref:R,"aria-label":E,className:u("flex",m[H],h,I),style:{"--p-accent":`var(--plass-${$}-accent)`,"--p-soft":`var(--plass-${$}-soft)`,"--p-ring":`var(--plass-${$}-ring)`,...M},...P,children:[L&&T>0?e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:breadcrumbListData(O,B)}}):null,e("ol",{ref:q,role:"list",className:u("flex list-none flex-wrap items-center p-0",y[F][H]),children:G.map((r,s)=>t(a.Fragment,{children:[s>0?e("li",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--plass-muted-fg) select-none",children:K}):null,r?e(b.Provider,{value:{size:H,last:!V&&s===G.length-1},children:r}):e("li",{className:"flex shrink-0 items-center",children:w?e("button",{type:"button",className:Q,"aria-label":D,onClick:()=>{J.current=!0,_(!0)},children:e(i,{})}):e("span",{className:Q,"aria-hidden":"true",children:e(i,{})})})]},r?r.key??s:"fold"))})]})});export const PlBreadcrumbItem=/* @__PURE__ */a.forwardRef(function PlBreadcrumbItem({href:s,onClick:n,startIcon:l,endIcon:c,current:i,disabled:o=!1,className:m,children:h,...x},y){const{size:v,last:k}=a.useContext(b),w=i??k,j=Boolean(s||n)&&!w&&!o,C=u("inline-flex min-w-0 items-center px-1",p[v],N[v],g,o?"cursor-not-allowed text-(--plass-muted-fg) opacity-50":w?"font-medium text-(--plass-fg)":j?u("cursor-pointer text-(--plass-muted-fg)","hover:bg-(--p-soft) hover:text-(--p-accent)",d):"text-(--plass-muted-fg)"),L=t(r,{children:[f(l)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:l}):null,e("span",{className:"truncate",children:h}),f(c)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:c}):null]});return e("li",{ref:y,className:u("flex min-w-0 items-center",m),...x,children:j&&s?e("a",{href:s,className:C,onClick:n,children:L}):j?e("button",{type:"button",className:C,onClick:n,children:L}):e("span",{className:C,"aria-current":w?"page":void 0,"aria-disabled":o||void 0,children:L})})});
+"use client";import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import*as a from"react";import{useDefaults as s}from"../../internal/defaults.js";import{useLabels as n}from"../../internal/labels.js";import{ArrowRightIcon as l,ChevronIcon as c,EllipsisIcon as i}from"../../internal/icons.js";import{textOf as o}from"../../internal/text.js";import{controlTextClasses as m,cx as u,focusRingClasses as d,gapClasses as p,hasContent as f,iconClasses as h,radiusClasses as x,transitionClasses as g}from"../../internal/styles.js";const b=/* @__PURE__ */a.createContext({size:"md",last:!1}),y={default:{xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"},compact:{xs:"gap-0.5",sm:"gap-1",md:"gap-1",lg:"gap-1.5",xl:"gap-2"}},N={xs:x.xs,sm:x.xs,md:x.xs,lg:x.sm,xl:x.sm},v=["chevron","arrow","slash","dot"];function absoluteHref(e,t){if(!t)return e;try{return new URL(e,t).href}catch{return e}}function breadcrumbListData(e,t){const r=e.map((e,r)=>{const{href:a,children:s}=e.props;return{"@type":"ListItem",position:r+1,name:o(s),...a?{item:absoluteHref(a,t)}:null}});return JSON.stringify({"@context":"https://schema.org","@type":"BreadcrumbList",itemListElement:r}).replace(/</g,"\\u003c")}export const PlBreadcrumb=/* @__PURE__ */a.forwardRef(function PlBreadcrumb({size:r,color:o,density:p,separator:f="chevron",maxItems:x,itemsBeforeCollapse:N=1,itemsAfterCollapse:k=1,expandable:w=!0,label:j,expandLabel:C,structuredData:L=!1,baseUrl:B,className:I,style:M,children:z,...P},R){const S=s(),A=n(),E=j??A.breadcrumb,D=C??A.breadcrumbExpand,H=r??S.size??"md",$=o??S.color??"primary",F=p??S.density??"default",[U,_]=a.useState(!1),q=a.useRef(null),J=a.useRef(!1);a.useEffect(()=>{if(!U||!J.current)return;J.current=!1;const e=Array.from(q.current?.children??[]).filter(e=>"true"!==e.getAttribute("aria-hidden"));for(const t of e.slice(Math.max(0,N))){const e=t.querySelector("a[href], button:not(:disabled)");if(e)return void e.focus()}},[U,N]);const O=a.Children.toArray(z).filter(a.isValidElement),T=O.length,V=O.some(e=>!0===e.props.current),G=!U&&void 0!==x&&T>Math.max(x,1)&&T-N-k>1?[...O.slice(0,Math.max(0,N)),null,...O.slice(T-Math.max(0,k))]:O,K=function isSeparatorName(e){return"string"==typeof e&&v.includes(e)}(f)?function separatorMark(t){switch(t){case"chevron":return e("span",{className:"flex -rotate-90 items-center rtl:rotate-90",children:e(c,{})});case"arrow":return e("span",{className:"flex items-center rtl:rotate-180",children:e(l,{})});case"slash":return e("span",{className:"opacity-70",children:"/"});case"dot":return e("span",{className:"opacity-70",children:"·"});default:return null}}(f):f,Q=u("inline-flex items-center rounded-(--plass-radius-xs) px-0.5","text-(--plass-muted-fg)",g,h,w?u("cursor-pointer hover:bg-(--p-soft) hover:text-(--p-accent)",d):"");return t("nav",{ref:R,"aria-label":E,className:u("flex",m[H],h,I),style:{"--p-accent":`var(--plass-${$}-accent)`,"--p-soft":`var(--plass-${$}-soft)`,"--p-ring":`var(--plass-${$}-ring)`,...M},...P,children:[L&&T>0?e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:breadcrumbListData(O,B)}}):null,e("ol",{ref:q,role:"list",className:u("m-0 flex list-none flex-wrap items-center p-0",y[F][H]),children:G.map((r,s)=>t(a.Fragment,{children:[s>0?e("li",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--plass-muted-fg) select-none",children:K}):null,r?e(b.Provider,{value:{size:H,last:!V&&s===G.length-1},children:r}):e("li",{className:"flex shrink-0 items-center",children:w?e("button",{type:"button",className:Q,"aria-label":D,onClick:()=>{J.current=!0,_(!0)},children:e(i,{})}):e("span",{className:Q,"aria-hidden":"true",children:e(i,{})})})]},r?r.key??s:"fold"))})]})});export const PlBreadcrumbItem=/* @__PURE__ */a.forwardRef(function PlBreadcrumbItem({href:s,onClick:n,startIcon:l,endIcon:c,current:i,disabled:o=!1,className:m,children:h,...x},y){const{size:v,last:k}=a.useContext(b),w=i??k,j=Boolean(s||n)&&!w&&!o,C=u("inline-flex min-w-0 items-center px-1",p[v],N[v],g,o?"cursor-not-allowed text-(--plass-muted-fg) opacity-50":w?"font-medium text-(--plass-fg)":j?u("cursor-pointer text-(--plass-muted-fg)","hover:bg-(--p-soft) hover:text-(--p-accent)",d):"text-(--plass-muted-fg)"),L=t(r,{children:[f(l)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:l}):null,e("span",{className:"truncate",children:h}),f(c)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:c}):null]});return e("li",{ref:y,className:u("flex min-w-0 items-center",m),...x,children:j&&s?e("a",{href:s,className:C,onClick:n,children:L}):j?e("button",{type:"button",className:C,onClick:n,children:L}):e("span",{className:C,"aria-current":w?"page":void 0,"aria-disabled":o||void 0,children:L})})});

package/dist/components/button/PlButton.d.ts

@@ -17,8 +17,15 @@ export interface PlButtonProps extends PlassStyleProps, Omit<React.ComponentProp
     /**
      * Shows a spinner in place of `startIcon` and stops the button from
      * activating, while keeping it focusable and visually unchanged otherwise.
+     * A screen reader hears the label set's `loading` word after its name.
      */
     loading?: boolean;
+    /**
+     * The word a screen reader hears after the name while `loading` — "Saving",
+     * "Sending". It takes the place of the label set's `loading` for this button.
+     * @default 'Loading'
+     */
+    loadingLabel?: string;
     /** Inert but not dimmed — the action exists, it just is not available here. */
     readOnly?: boolean;
     /**

package/dist/components/button/PlButton.js

@@ -1 +1 @@
-"use client";import{jsx as s,Fragment as e,jsxs as o}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{Button as l}from"@base-ui/react/button";import{useRender as t}from"@base-ui/react/use-render";import{ButtonGroupContext as i}from"../../internal/button-group.js";import{followPointer as n}from"../../internal/glow.js";import{Spinner as d}from"../../internal/icons.js";import{controlHeightClasses as p,controlSlots as c,controlSquareClasses as g,controlTextClasses as v,disabledClasses as m,focusRingClasses as b,forcedEdgeClasses as x,gapClasses as h,glassClasses as u,hasContent as f,iconClasses as $,paddingXClasses as j,radiusClasses as w,readOnlyFilterClasses as y,transitionClasses as k}from"../../internal/styles.js";const P={xs:`${p.xs} ${h.xs} ${w.xs} ${v.xs}`,sm:`${p.sm} ${h.sm} ${w.sm} ${v.sm}`,md:`${p.md} ${h.md} ${w.md} ${v.md}`,lg:`${p.lg} ${h.lg} ${w.lg} ${v.lg}`,xl:`${p.xl} ${h.xl} ${w.xl} ${v.xl}`},B={xs:`${g.xs} px-0`,sm:`${g.sm} px-0`,md:`${g.md} px-0`,lg:`${g.lg} px-0`,xl:`${g.xl} px-0`},z=/* @__PURE__ */["relative inline-flex shrink-0 select-none items-center justify-center","whitespace-nowrap align-middle font-semibold leading-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",k,b,$].join(" "),C={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",x].join(" "),glass:/* @__PURE__ */[u,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--p-accent) bg-transparent"},D={solid:/* @__PURE__ */["hover:brightness-105","hover:[box-shadow:var(--p-elev-hover),var(--p-lift-hover)]","active:brightness-95","active:[box-shadow:var(--p-elev-press),var(--p-lift-press)]"].join(" "),glass:/* @__PURE__ */["hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)]","hover:[box-shadow:var(--p-elev-hover),var(--plass-gloss-glass)]","active:bg-(--plass-glass-press)","active:[box-shadow:var(--p-elev-press),var(--plass-gloss-glass)]"].join(" "),ghost:"hover:bg-(--p-soft) active:bg-(--p-soft-hover)"},W={solid:/* @__PURE__ */["cursor-default text-(--p-on-solid) [background-image:var(--p-fill)]",`shadow-none ${y}`].join(" "),glass:/* @__PURE__ */[u,"cursor-default border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]",`[box-shadow:var(--plass-gloss-glass)] ${y}`].join(" "),ghost:`cursor-default text-(--p-accent) bg-transparent ${y}`};export const PlButton=/* @__PURE__ */r.forwardRef(function PlButton({variant:p,size:g,color:v,density:b,elevation:x,startIcon:h,endIcon:u,loading:$=!1,readOnly:w=!1,fullWidth:y=!1,disabled:k,focusableWhenDisabled:I=!1,render:M,className:N,style:F,children:O,onClick:R,onPointerMove:q,...A},E){const G=a(),H=r.useContext(i),J=p??H?.variant??"solid",K=g??H?.size??G.size??"md",L=v??H?.color??G.color??"primary",Q=b??H?.density??G.density??"default",S=x??H?.elevation??1,T=k??H?.disabled??!1,U=!f(O),V=$||w,X=!T&&!V,Y=[z,P[K],U?B[K]:j[Q][K],T?m[J]:w?W[J]:C[J],X?`${D[J]} cursor-pointer`:"",X?"plass-glow":"",$?"cursor-progress":"",y?"w-full":"",N??""].filter(Boolean).join(" ");return t({render:M??s(l,{disabled:T,focusableWhenDisabled:I}),ref:E,props:{className:Y,style:{...c(L,S,J),...F},"aria-disabled":V||T&&I||void 0,"aria-busy":$||void 0,"data-loading":$||void 0,"data-readonly":w||void 0,onClick:s=>{if(V)return s.preventDefault(),void s.stopPropagation();R?.(s)},onPointerMove:s=>{n(s),q?.(s)},...A,children:o(e,{children:[$?s(d,{}):h,O,u]})}})});
+"use client";import{jsx as s,Fragment as e,jsxs as o}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{Button as l}from"@base-ui/react/button";import{useRender as t}from"@base-ui/react/use-render";import{ButtonGroupContext as i}from"../../internal/button-group.js";import{useDisabled as n}from"../../internal/form.js";import{glowPointerMove as d}from"../../internal/glow.js";import{Spinner as p}from"../../internal/icons.js";import{loadingLabel as c}from"../../internal/loading.js";import{controlHeightClasses as g,controlSlots as v,controlSquareClasses as m,controlTextClasses as b,cx as f,disabledClasses as h,focusRingClasses as u,forcedEdgeClasses as x,gapClasses as $,glassClasses as j,hasContent as w,iconClasses as y,paddingXClasses as k,radiusClasses as P,readOnlyFilterClasses as B,transitionClasses as z}from"../../internal/styles.js";const C={xs:`${g.xs} ${$.xs} ${P.xs} ${b.xs}`,sm:`${g.sm} ${$.sm} ${P.sm} ${b.sm}`,md:`${g.md} ${$.md} ${P.md} ${b.md}`,lg:`${g.lg} ${$.lg} ${P.lg} ${b.lg}`,xl:`${g.xl} ${$.xl} ${P.xl} ${b.xl}`},D={xs:`${m.xs} px-0`,sm:`${m.sm} px-0`,md:`${m.md} px-0`,lg:`${m.lg} px-0`,xl:`${m.xl} px-0`},I=/* @__PURE__ */["relative inline-flex shrink-0 select-none items-center justify-center","whitespace-nowrap align-middle font-semibold leading-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",z,u,y].join(" "),W={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",x].join(" "),glass:/* @__PURE__ */[j,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--p-accent) bg-transparent"},M={solid:/* @__PURE__ */["hover:brightness-105","hover:[box-shadow:var(--p-elev-hover),var(--p-lift-hover)]","active:brightness-95","active:[box-shadow:var(--p-elev-press),var(--p-lift-press)]"].join(" "),glass:/* @__PURE__ */["hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)]","hover:[box-shadow:var(--p-elev-hover),var(--plass-gloss-glass)]","active:bg-(--plass-glass-press)","active:[box-shadow:var(--p-elev-press),var(--plass-gloss-glass)]"].join(" "),ghost:"hover:bg-(--p-soft) active:bg-(--p-soft-hover)"},N={solid:/* @__PURE__ */["cursor-default text-(--p-on-solid) [background-image:var(--p-fill)]",`shadow-none ${B}`].join(" "),glass:/* @__PURE__ */[j,"cursor-default border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]",`[box-shadow:var(--plass-gloss-glass)] ${B}`].join(" "),ghost:`cursor-default text-(--p-accent) bg-transparent ${B}`};export const PlButton=/* @__PURE__ */r.forwardRef(function PlButton({variant:g,size:m,color:b,density:u,elevation:x,startIcon:$,endIcon:j,loading:y=!1,loadingLabel:P,readOnly:B=!1,fullWidth:z=!1,disabled:F,focusableWhenDisabled:L=!1,render:O,className:R,style:q,children:A,onClick:E,onPointerMove:G,"aria-describedby":H,...J},K){const Q=a(),S=r.useId(),T=r.useContext(i),U=g??T?.variant??"solid",V=m??T?.size??Q.size??"md",X=b??T?.color??Q.color??"primary",Y=u??T?.density??Q.density??"default",Z=x??T?.elevation??1,_=n(!1),ss=(F??T?.disabled??!1)||_&&!O,es=!w(A),os=y||B,rs=!ss&&!os,as=[I,C[V],es?D[V]:k[Y][V],ss?h[U]:B?N[U]:W[U],rs?`${M[U]} cursor-pointer`:"",rs?"plass-glow":"",y?"cursor-progress":"",z?"w-full":"",R??""].filter(Boolean).join(" ");return t({render:O??s(l,{disabled:ss,focusableWhenDisabled:L}),ref:K,props:{className:as,style:{...v(X,Z,U),...q},"aria-disabled":os||ss&&L||void 0,"aria-busy":y||void 0,"aria-describedby":y?f(H,S):H,"data-loading":y||void 0,"data-readonly":B||void 0,onClick:s=>{if(os)return s.preventDefault(),void s.stopPropagation();E?.(s)},onPointerMove:d(rs,G),...J,children:o(e,{children:[y?s(p,{}):$,A,j,y?s("span",{id:S,hidden:!0,children:P??Q.labels?.loading??c}):null]})}})});