plass-ui 1.5.0 → 1.6.0

package/dist/components/segmented-button/PlSegmentedButton.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as t from"react";import{useDefaults as a}from"../../internal/defaults.js";import{Radio as r}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{controlHeightClasses as n,controlSlots as o,controlTextClasses as i,focusRingInsetClasses as d,forcedCheckedTextClasses as u,forcedFieldEdgeClasses as c,forcedFillClasses as p,gapClasses as f,glassClasses as h,hasContent as g,iconClasses as m,paddingXClasses as v,transitionClasses as y}from"../../internal/styles.js";const b=/* @__PURE__ */t.createContext({variant:"glass",size:"md",density:"default",fullWidth:!1}),x={solid:`${h} bg-(--plass-glass-press) p-1 [box-shadow:var(--p-elev),var(--plass-well)] ${c}`,glass:`${h} border bg-(--plass-glass) p-1 [border-color:var(--plass-glass-line)] [box-shadow:var(--p-elev),var(--plass-well)]`,ghost:""},w={solid:"[background-image:var(--p-fill)] [box-shadow:var(--plass-shadow-1),var(--p-lift)]",glass:`${h} bg-(--plass-glass-press) [box-shadow:var(--plass-shadow-1),var(--plass-gloss-glass)]`,ghost:`${h} bg-(--plass-glass-press) [box-shadow:var(--plass-shadow-1),var(--plass-gloss-glass)]`},k={solid:"data-[checked]:text-(--p-on-solid)",glass:"data-[checked]:text-(--p-accent)",ghost:"data-[checked]:text-(--p-accent)"};export const PlSegment=/* @__PURE__ */t.forwardRef(function PlSegment({value:a,startIcon:l,endIcon:o,disabled:c=!1,className:p,children:h,...x},w){const{variant:j,size:P,density:$,fullWidth:R}=t.useContext(b);return s(r.Root,{ref:w,value:a,disabled:c,"data-segment":"",className:["relative z-10 inline-flex shrink-0 cursor-pointer items-center justify-center select-none","font-semibold whitespace-nowrap","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",n[P],i[P],f[P],v[$][P],"rounded-full",y,m,"text-(--plass-muted-fg) hover:text-(--plass-fg)",k[j],u,d,"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","data-[readonly]:cursor-default",R?"flex-1":"",p??""].filter(Boolean).join(" "),...x,children:[g(l)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:l}):null,h,g(o)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:o}):null]})});export const PlSegmentedButton=/* @__PURE__ */t.forwardRef(function PlSegmentedButton({variant:r="glass",size:n,color:i,density:d,elevation:u=0,value:c,defaultValue:f=null,onValueChange:h,disabled:g=!1,readOnly:m=!1,name:v,fullWidth:k=!1,className:j,style:P,children:$,...R},z){const N=a(),S=n??N.size??"md",W=i??N.color??"primary",C=d??N.density??"default",[B,A]=t.useState(f),O=void 0!==c,V=O?c:B,E=t.useRef(null),I=t.useRef(null),L=t.useCallback(e=>{const s=E.current,t=I.current;if(!s||!t)return;const a=s.querySelector("[data-segment][data-checked]");if(!a)return;const r=!e||!t.hasAttribute("data-ready");r&&t.removeAttribute("data-ready"),t.style.setProperty("--p-seg-x",`${a.offsetLeft}px`),t.style.setProperty("--p-seg-y",`${a.offsetTop}px`),t.style.setProperty("--p-seg-w",`${a.offsetWidth}px`),t.style.setProperty("--p-seg-h",`${a.offsetHeight}px`),r&&t.offsetWidth,t.setAttribute("data-ready","")},[]);t.useLayoutEffect(()=>{L(!0)},[L,V,r,S,C,k,$]),t.useEffect(()=>{const e=E.current;if(!e)return;const s=new ResizeObserver(()=>L(!1));return s.observe(e),()=>s.disconnect()},[L]);const q=t.useMemo(()=>({variant:r,size:S,density:C,fullWidth:k}),[r,S,C,k]);return e(b.Provider,{value:q,children:s(l,{ref:e=>{E.current=e,"function"==typeof z?z(e):z&&(z.current=e)},value:V,onValueChange:e=>{const s=e??null;O||A(s),h?.(s)},disabled:g,readOnly:m,name:v,className:["relative inline-flex items-center rounded-full",x[r],y,m?"saturate-[0.55]":"",g?"opacity-50 saturate-[0.35]":"",k?"flex w-full":"",j??""].filter(Boolean).join(" "),style:{...o(W,u,r),...P},...R,children:[null!=V?e("span",{ref:I,"aria-hidden":"true",className:["pointer-events-none absolute rounded-full","top-(--p-seg-y) left-(--p-seg-x) h-(--p-seg-h) w-(--p-seg-w)",w[r],p,"[transition-property:left,top,width,height]","[transition-timing-function:var(--plass-ease)]","[transition-duration:0ms] data-[ready]:[transition-duration:var(--plass-duration)]"].join(" ")}):null,$]})})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as s from"react";import{glowPointerMove as a}from"../../internal/glow.js";import{useDefaults as r}from"../../internal/defaults.js";import{Radio as l}from"@base-ui/react/radio";import{RadioGroup as o}from"@base-ui/react/radio-group";import{controlHeightClasses as n,controlSlots as i,controlTextClasses as d,focusRingInsetClasses as c,forcedCheckedTextClasses as u,forcedFieldEdgeClasses as p,forcedFillClasses as f,gapClasses as h,glassClasses as g,hasContent as m,iconClasses as v,paddingXClasses as y,transitionClasses as b}from"../../internal/styles.js";const x=/* @__PURE__ */s.createContext({variant:"glass",size:"md",density:"default",fullWidth:!1}),w={solid:`${g} bg-(--plass-glass-press) p-1 [box-shadow:var(--p-elev),var(--plass-well)] ${p}`,glass:`${g} border bg-(--plass-glass) p-1 [border-color:var(--plass-glass-line)] [box-shadow:var(--p-elev),var(--plass-well)]`,ghost:""},k={solid:"[background-image:var(--p-fill)] [box-shadow:var(--plass-shadow-1),var(--p-lift)]",glass:`${g} bg-(--plass-glass-press) [box-shadow:var(--plass-shadow-1),var(--plass-gloss-glass)]`,ghost:`${g} bg-(--plass-glass-press) [box-shadow:var(--plass-shadow-1),var(--plass-gloss-glass)]`},P={solid:"data-[checked]:text-(--p-on-solid)",glass:"data-[checked]:text-(--p-accent)",ghost:"data-[checked]:text-(--p-accent)"};export const PlSegment=/* @__PURE__ */s.forwardRef(function PlSegment({value:r,startIcon:o,endIcon:i,disabled:p=!1,className:f,children:g,onPointerMove:w,...k},j){const{variant:$,size:R,density:z,fullWidth:N}=s.useContext(x);return t(l.Root,{ref:j,value:r,disabled:p,"data-segment":"",className:["relative z-10 inline-flex shrink-0 cursor-pointer items-center justify-center select-none","font-semibold whitespace-nowrap","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",n[R],d[R],h[R],y[z][R],"rounded-full",b,v,p?"":"plass-glow","not-data-[checked]:[--p-glow:var(--p-soft)]","not-data-[checked]:[--p-flash:var(--p-soft-hover)]","text-(--plass-muted-fg) hover:text-(--plass-fg)",P[$],u,c,"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","data-[readonly]:cursor-default",N?"flex-1":"",f??""].filter(Boolean).join(" "),onPointerMove:a(!p,w),...k,children:[m(o)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:o}):null,g,m(i)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:i}):null]})});export const PlSegmentedButton=/* @__PURE__ */s.forwardRef(function PlSegmentedButton({variant:a="glass",size:l,color:n,density:d,elevation:c=0,value:u,defaultValue:p=null,onValueChange:h,disabled:g=!1,readOnly:m=!1,name:v,fullWidth:y=!1,className:P,style:j,children:$,...R},z){const N=r(),S=l??N.size??"md",W=n??N.color??"primary",C=d??N.density??"default",[B,A]=s.useState(p),M=void 0!==u,O=M?u:B,V=s.useRef(null),E=s.useRef(null),I=s.useCallback(e=>{const t=V.current,s=E.current;if(!t||!s)return;const a=t.querySelector("[data-segment][data-checked]");if(!a)return;const r=!e||!s.hasAttribute("data-ready");r&&s.removeAttribute("data-ready"),s.style.setProperty("--p-seg-x",`${a.offsetLeft}px`),s.style.setProperty("--p-seg-y",`${a.offsetTop}px`),s.style.setProperty("--p-seg-w",`${a.offsetWidth}px`),s.style.setProperty("--p-seg-h",`${a.offsetHeight}px`),r&&s.offsetWidth,s.setAttribute("data-ready","")},[]);s.useLayoutEffect(()=>{I(!0)},[I,O,a,S,C,y,$]),s.useEffect(()=>{const e=V.current;if(!e)return;const t=new ResizeObserver(()=>I(!1));return t.observe(e),()=>t.disconnect()},[I]);const L=s.useMemo(()=>({variant:a,size:S,density:C,fullWidth:y}),[a,S,C,y]);return e(x.Provider,{value:L,children:t(o,{ref:e=>{V.current=e,"function"==typeof z?z(e):z&&(z.current=e)},value:O,onValueChange:e=>{const t=e??null;M||A(t),h?.(t)},disabled:g,readOnly:m,name:v,className:["relative inline-flex items-center rounded-full",w[a],b,m?"saturate-[0.55]":"",g?"opacity-50 saturate-[0.35]":"",y?"flex w-full":"",P??""].filter(Boolean).join(" "),style:{...i(W,c,a),...j},...R,children:[null!=O?e("span",{ref:E,"aria-hidden":"true",className:["pointer-events-none absolute rounded-full","top-(--p-seg-y) left-(--p-seg-x) h-(--p-seg-h) w-(--p-seg-w)",k[a],f,"[transition-property:left,top,width,height]","[transition-timing-function:var(--plass-ease)]","[transition-duration:0ms] data-[ready]:[transition-duration:var(--plass-duration)]"].join(" ")}):null,$]})})});

package/dist/components/select/PlSelect.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PlassElevation, PlassFieldClassNames, PlassHotKeys, PlassStyleProps } from '../../types.js';
+import type { PlassElevation, PlassFieldClassNames, PlassHotKeys, PlassFieldLabelPlacement, PlassStyleProps } from '../../types.js';
 /**
  * What a select's value may be.
  *
@@ -51,8 +51,14 @@ export interface PlSelectProps extends PlassStyleProps, Omit<React.ComponentProp
      * @default 0
      */
     elevation?: PlassElevation;
-    /** Label above the trigger, wired to it by Base UI's Field. */
+    /** The name of what the select holds, wired to the trigger by Base UI's Field. */
     label?: React.ReactNode;
+    /**
+     * Where the `label` goes — above the trigger, or in its top edge.
+     * Falls back to the nearest `PlassProvider`, then to `top`.
+     * @default 'top'
+     */
+    labelPlacement?: PlassFieldLabelPlacement;
     /** Helper text below the trigger. */
     description?: React.ReactNode;
     /** Error message below. Its presence also turns the select invalid. */

package/dist/components/select/PlSelect.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{useDefaults as t}from"../../internal/defaults.js";import{Select as s}from"@base-ui/react/select";import{Field as r}from"@base-ui/react/field";import{CheckIcon as i,ChevronIcon as n}from"../../internal/icons.js";import{WidthSizer as o}from"../../internal/sizer.js";import{hotKeyHandler as c}from"../../internal/keys.js";import{controlHeightClasses as d,controlTextLeadingClasses as p,cx as m,disabledClasses as u,fieldReadOnlyClasses as f,fieldRestClasses as h,focusWithinRingClasses as g,forcedHighlightedClasses as v,gapClasses as x,glassClasses as b,hasContent as y,iconClasses as N,metaTextClasses as j,paddingXClasses as w,radiusClasses as S,stackGapClasses as I,surfaceSlots as z,transitionClasses as P}from"../../internal/styles.js";const V=/* @__PURE__ */["group relative flex w-full cursor-pointer items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",P,g,N].join(" "),k=/* @__PURE__ */[b,"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain","min-w-[var(--anchor-width)] border bg-(--plass-glass-press) p-1","[border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]","[outline:none]","[transition:opacity_var(--plass-duration)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),O=/* @__PURE__ */["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--plass-radius-xs) py-1.5 pe-2 ps-7",P,"data-[highlighted]:bg-(--p-soft-hover) data-[highlighted]:text-(--p-accent)",v,"data-[selected]:font-semibold data-[selected]:text-(--p-accent)","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","[outline:none]"].join(" ");export const PlSelect=/* @__PURE__ */l.forwardRef(function PlSelect({variant:g="glass",size:v,color:b,density:N,elevation:P=0,items:$,value:_,defaultValue:C,onValueChange:R,placeholder:T,label:q,description:B,error:D,invalid:E,startIcon:K,fullWidth:M=!1,disabled:W=!1,readOnly:L=!1,required:A=!1,name:F,id:G,className:H,hotKeys:J,classNames:Q,style:U,...X},Y){const Z=t(),ee=v??Z.size??"md",ae=b??Z.color??"primary",le=N??Z.density??"default",te=y(D),se=E??te,re=se?"danger":ae,ie=l.useMemo(()=>$.map(e=>({label:e.label??String(e.value),value:e.value})),[$]),[ne,oe]=l.useState(!1);l.useEffect(()=>{L&&oe(!1)},[L]);const ce=l.useMemo(()=>M?[]:[...$.map(e=>e.label??String(e.value)),...y(T)?[T]:[]],[M,$,T]);return a(r.Root,{disabled:W,invalid:se,className:["flex-col align-top",I[ee],M?"flex w-full":"inline-flex",H??""].filter(Boolean).join(" "),style:{...z(re,P),...U},...X,children:[q?e(r.Label,{className:m(j[ee],"font-semibold",W?"text-(--plass-muted-fg)":"text-(--plass-fg)",Q?.label),children:q}):null,a(s.Root,{id:G,name:F,items:ie,value:_,defaultValue:C,onValueChange:e=>R?.(e),disabled:W,readOnly:L,required:A,open:ne&&!L,onOpenChange:e=>oe(e&&!L),children:[a(s.Trigger,{ref:Y,onKeyDown:c(J,void 0),className:[V,d[ee],p[ee],S[ee],x[ee],w[le][ee],W?u[g]:L?`${f[g]} cursor-default`:h[g],Q?.control].filter(Boolean).join(" "),children:[K?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:K}):null,a("span",{className:"flex min-w-0 flex-1 flex-col",children:[e(s.Value,{className:["w-full truncate text-start","data-[placeholder]:text-(--plass-muted-fg)"].join(" "),placeholder:T}),e(o,{samples:ce})]}),e(s.Icon,{className:["flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","data-[popup-open]:rotate-180"].join(" "),children:e(n,{})})]}),e(s.Portal,{children:e(s.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",sideOffset:6,alignItemWithTrigger:!1,children:e(s.Popup,{className:`${k} ${S[ee]} ${p[ee]}`,style:z(re,3),children:$.map(l=>a(s.Item,{value:l.value,disabled:l.disabled,className:O,children:[e(s.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(i,{})}),e(s.ItemText,{className:"truncate",children:l.label??String(l.value)})]},String(l.value)))})})})]}),B?e(r.Description,{className:m(j[ee],"text-(--plass-muted-fg)",Q?.description),children:B}):null,e(r.Error,te?{match:!0,className:m(j[ee],"text-(--p-accent)",Q?.error),children:D}:{className:m(j[ee],"text-(--p-accent)",Q?.error)})]})});
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{useDefaults as t}from"../../internal/defaults.js";import{Select as s}from"@base-ui/react/select";import{Field as r}from"@base-ui/react/field";import{CheckIcon as n,ChevronIcon as i}from"../../internal/icons.js";import{WidthSizer as o}from"../../internal/sizer.js";import{glowPointerMove as c}from"../../internal/glow.js";import{FieldNotch as d,notchShellStyle as m}from"../../internal/notch.js";import{hotKeyHandler as p}from"../../internal/keys.js";import{controlHeightClasses as u,controlTextLeadingClasses as f,cx as h,disabledClasses as g,fieldReadOnlyClasses as v,fieldRestClasses as b,focusWithinRingClasses as x,forcedHighlightedClasses as y,gapClasses as j,glassClasses as N,hasContent as w,iconClasses as P,metaTextClasses as S,paddingXClasses as z,radiusClasses as I,stackGapClasses as O,surfaceSlots as V,transitionClasses as k}from"../../internal/styles.js";const $=/* @__PURE__ */["group relative flex w-full cursor-pointer items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",k,P].join(" "),_=x,C=/* @__PURE__ */[N,"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain","min-w-[var(--anchor-width)] border bg-(--plass-glass-press) p-1","[border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]","[outline:none]","[transition:opacity_var(--plass-duration)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),M=/* @__PURE__ */["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--plass-radius-xs) py-1.5 pe-2 ps-7",k,"data-[highlighted]:bg-(--p-soft-hover) data-[highlighted]:text-(--p-accent)",y,"data-[selected]:font-semibold data-[selected]:text-(--p-accent)","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","[outline:none]"].join(" ");export const PlSelect=/* @__PURE__ */l.forwardRef(function PlSelect({variant:x="glass",size:y,color:N,density:P,elevation:k=0,items:R,value:T,defaultValue:q,onValueChange:B,placeholder:D,label:E,labelPlacement:K,description:W,error:L,invalid:A,startIcon:F,fullWidth:G=!1,disabled:H=!1,readOnly:J=!1,required:Q=!1,name:U,id:X,className:Y,hotKeys:Z,classNames:ee,style:ae,...le},te){const se=t(),re=y??se.size??"md",ne=N??se.color??"primary",ie=P??se.density??"default",oe="notch"===(K??se.labelPlacement??"top")&&w(E),ce=w(L),de=A??ce,me=de?"danger":ne,pe=!H&&!J,ue=l.useMemo(()=>R.map(e=>({label:e.label??String(e.value),value:e.value})),[R]),[fe,he]=l.useState(!1);l.useEffect(()=>{J&&he(!1)},[J]);const ge=l.useMemo(()=>G?[]:[...R.map(e=>e.label??String(e.value)),...w(D)?[D]:[]],[G,R,D]),ve=e(r.Label,{className:h(S[re],"font-semibold",H?"text-(--plass-muted-fg)":"text-(--plass-fg)",ee?.label),children:E});return a(r.Root,{disabled:H,invalid:de,className:["flex-col align-top",O[re],G?"flex w-full":"inline-flex",Y??""].filter(Boolean).join(" "),style:{...V(me,k),...ae},...le,children:[w(E)&&!oe?ve:null,a(s.Root,{id:X,name:U,items:ue,value:T,defaultValue:q,onValueChange:e=>B?.(e),disabled:H,readOnly:J,required:Q,open:fe&&!J,onOpenChange:e=>he(e&&!J),children:[e(d,{notched:oe,size:re,density:ie,variant:x,disabled:H,readOnly:J,label:ve,children:a(s.Trigger,{ref:te,onKeyDown:p(Z,void 0),onPointerMove:c(pe),style:oe?m:void 0,className:[$,oe?"":_,u[re],f[re],I[re],j[re],z[ie][re],H?g[x]:J?`${v[x]} cursor-default`:b[x],pe?"plass-glow":"",ee?.control].filter(Boolean).join(" "),children:[F?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:F}):null,a("span",{className:"flex min-w-0 flex-1 flex-col",children:[e(s.Value,{className:["w-full truncate text-start","data-[placeholder]:text-(--plass-muted-fg)"].join(" "),placeholder:D}),e(o,{samples:ge})]}),e(s.Icon,{className:["flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","data-[popup-open]:rotate-180"].join(" "),children:e(i,{})})]})}),e(s.Portal,{children:e(s.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",sideOffset:6,alignItemWithTrigger:!1,children:e(s.Popup,{className:`${C} ${I[re]} ${f[re]}`,style:V(me,3),children:R.map(l=>a(s.Item,{value:l.value,disabled:l.disabled,className:M,children:[e(s.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(n,{})}),e(s.ItemText,{className:"truncate",children:l.label??String(l.value)})]},String(l.value)))})})})]}),W?e(r.Description,{className:h("m-0",S[re],"text-(--plass-muted-fg)",ee?.description),children:W}):null,e(r.Error,ce?{match:!0,className:h(S[re],"text-(--p-accent)",ee?.error),children:L}:{className:h(S[re],"text-(--p-accent)",ee?.error)})]})});

package/dist/components/stepper/PlStepper.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as r}from"../../internal/defaults.js";import{bulletGapClasses as n,bulletSizeValues as s,bulletStatusClasses as a,connectorColorClasses as i,connectorStyleClasses as o,statusAt as c,titleStatusClasses as d}from"../../internal/steps.js";import{cx as m,focusRingClasses as p,hasContent as u,iconClasses as f,metaTextClasses as x,radiusClasses as h,sheetBodyClasses as v,sheetTitleClasses as b,surfaceSlots as N,transitionClasses as w}from"../../internal/styles.js";import{useLabels as y}from"../../internal/labels.js";import{useResponsiveValue as z}from"../../internal/responsive.js";const j=/* @__PURE__ */t.createContext(null),g=/* @__PURE__ */t.createContext({index:0,last:!1});function StepTick(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-[0.7em]",children:e("path",{d:"m3.5 8.5 3 3 6-7",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export const PlStepper=/* @__PURE__ */t.forwardRef(function PlStepper({active:n,defaultActive:s=0,onActiveChange:a,linear:i=!0,orientation:o,connector:c="solid",size:d,color:p,density:f,className:x,style:h,children:b,...w},y){const k=z(o,"horizontal"),C=r(),S=d??C.size??"md",P=p??C.color??"primary",$=f??C.density??"default",[A,I]=t.useState(s),L=n??A,R=t.useId(),T=t.useCallback(e=>{void 0===n&&I(e),a?.(e)},[n,a]),B=t.Children.toArray(b),M=B.length,W=t.useMemo(()=>({size:S,density:$,orientation:k,color:P,active:L,linear:i,connector:c,baseId:R,onSelect:T}),[S,$,k,P,L,i,c,R,T]),q="horizontal"===k,D=q?B[L]?.props?.children:null;return e(j.Provider,{value:W,children:l("div",{ref:y,className:m("flex w-full flex-col",x),style:{...N(P,0),...h},...w,children:[e("ol",{role:"list",className:m("flex w-full",q?"flex-row":"flex-col"),children:B.map((l,t)=>e(g.Provider,{value:{index:t,last:t===M-1},children:l},t))}),u(D)?e("div",{role:"group","aria-labelledby":`${R}-${L}`,className:m("mt-4",v[S]),children:D}):null]})})});export const PlStep=/* @__PURE__ */t.forwardRef(function PlStep({label:r,description:z,bullet:k,status:C,optional:S,disabled:P=!1,color:$,className:A,children:I,...L},R){const T=t.useContext(j),{index:B,last:M}=t.useContext(g),W=y(),q=T?.size??"md",D=T?.orientation??"horizontal",E=$??T?.color??"primary",F=T?.active??null,G=T?.connector??"solid",H=C??c(B,F),J="horizontal"===D,K=!P&&null!==T&&(!T.linear||B<=T.active),O="none"!==G&&!M,Q=e("span",{"aria-hidden":"true",className:m("relative z-10 flex shrink-0 items-center justify-center rounded-full","size-(--p-bullet) text-[calc(var(--p-bullet)*0.5)] leading-none font-semibold tabular-nums",a[H],w,f),children:k??("complete"===H?e(StepTick,{}):B+1)}),U=l("span",{className:m("flex min-w-0 flex-col",J?"items-center text-center":""),children:[e("span",{id:T?`${T.baseId}-${B}`:void 0,className:m("font-semibold",b[q],d[H]),children:r}),u(z)?e("span",{className:m("text-(--plass-muted-fg)",x[q]),children:z}):null,S?e("span",{className:m("text-(--plass-muted-fg) italic",x[q]),children:!0===S?W.optional:S}):null]}),V=l("span",{className:m("flex items-center",J?"flex-col":"flex-row",n[q]),children:[Q,J?U:null]}),X=K?l("button",{type:"button","aria-current":"current"===H?"step":void 0,onClick:()=>T?.onSelect(B),className:m("flex cursor-pointer items-center bg-transparent p-1",J?"flex-col":"flex-row",n[q],h[q],p,w,"hover:bg-(--p-soft)"),children:[J?V:Q,J?null:U]}):l("span",{"aria-current":"current"===H?"step":void 0,className:m("flex items-center p-1",J?"flex-col":"flex-row",n[q],P?"opacity-50":""),children:[J?V:Q,J?null:U]});return l("li",{ref:R,className:m("relative flex min-w-0",J?"flex-1 flex-col items-center":"flex-col",A),style:{"--p-bullet":s[q],...N(E,0),"--p-fill":`var(--plass-${E}-fill)`,"--p-on-solid":`var(--plass-${E}-on-solid)`},...L,children:[l("span",{className:m("flex w-full",J?"flex-row items-start":"flex-col"),children:[X,O?e("span",{"aria-hidden":"true",className:m(J?"mt-[calc(var(--p-bullet)/2+0.25rem)] h-0 flex-1 border-t":"ms-[calc(var(--p-bullet)/2+0.25rem)] w-0 flex-1 self-stretch border-s",o[G],i[H],w)}):null]}),!J&&B===F&&u(I)?e("div",{className:m("ms-[calc(var(--p-bullet)+0.75rem)] pt-2 pb-4",v[q]),children:I}):null]})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as r}from"../../internal/defaults.js";import{bulletGapClasses as n,bulletSizeValues as s,bulletStatusClasses as a,connectorColorClasses as i,connectorStyleClasses as o,statusAt as c,titleStatusClasses as d}from"../../internal/steps.js";import{cx as p,focusRingClasses as m,hasContent as u,iconClasses as f,metaTextClasses as x,radiusClasses as h,sheetBodyClasses as v,sheetTitleClasses as b,surfaceSlots as N,transitionClasses as y}from"../../internal/styles.js";import{useLabels as w}from"../../internal/labels.js";import{useResponsiveValue as z}from"../../internal/responsive.js";const g=/* @__PURE__ */t.createContext(null),j=/* @__PURE__ */t.createContext({index:0,last:!1});function StepTick(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"size-[0.7em]",children:e("path",{d:"m3.5 8.5 3 3 6-7",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export const PlStepper=/* @__PURE__ */t.forwardRef(function PlStepper({active:n,defaultActive:s=0,onActiveChange:a,linear:i=!0,orientation:o,connector:c="solid",size:d,color:m,density:f,className:x,style:h,children:b,...y},w){const k=z(o,"horizontal"),C=r(),S=d??C.size??"md",$=m??C.color??"primary",P=f??C.density??"default",[I,A]=t.useState(s),L=n??I,R=t.useId(),T=t.useCallback(e=>{void 0===n&&A(e),a?.(e)},[n,a]),B=t.Children.toArray(b),M=B.length,W=t.useMemo(()=>({size:S,density:P,orientation:k,color:$,active:L,linear:i,connector:c,baseId:R,onSelect:T}),[S,P,k,$,L,i,c,R,T]),q="horizontal"===k,D=q?B[L]?.props?.children:null;return e(g.Provider,{value:W,children:l("div",{ref:w,className:p("flex w-full flex-col",x),style:{...N($,0),...h},...y,children:[e("ol",{role:"list",className:p("m-0 flex w-full list-none p-0",q?"flex-row":"flex-col"),children:B.map((l,t)=>e(j.Provider,{value:{index:t,last:t===M-1},children:l},t))}),u(D)?e("div",{role:"group","aria-labelledby":`${R}-${L}`,className:p("mt-4",v[S]),children:D}):null]})})});export const PlStep=/* @__PURE__ */t.forwardRef(function PlStep({label:r,description:z,bullet:k,status:C,optional:S,disabled:$=!1,color:P,className:I,children:A,...L},R){const T=t.useContext(g),{index:B,last:M}=t.useContext(j),W=w(),q=T?.size??"md",D=T?.orientation??"horizontal",E=P??T?.color??"primary",F=T?.active??null,G=T?.connector??"solid",H=C??c(B,F),J="horizontal"===D,K=!$&&null!==T&&(!T.linear||B<=T.active),O="none"!==G&&!M,Q=e("span",{"aria-hidden":"true",className:p("relative z-10 flex shrink-0 items-center justify-center rounded-full","size-(--p-bullet) text-[calc(var(--p-bullet)*0.5)] leading-none font-semibold tabular-nums",a[H],y,f),children:k??("complete"===H?e(StepTick,{}):B+1)}),U=l("span",{className:p("flex min-w-0 flex-col",J?"items-center text-center":""),children:[e("span",{id:T?`${T.baseId}-${B}`:void 0,className:p("font-semibold",b[q],d[H]),children:r}),u(z)?e("span",{className:p("text-(--plass-muted-fg)",x[q]),children:z}):null,S?e("span",{className:p("text-(--plass-muted-fg) italic",x[q]),children:!0===S?W.optional:S}):null]}),V=l("span",{className:p("flex items-center",J?"flex-col":"flex-row",n[q]),children:[Q,J?U:null]}),X=K?l("button",{type:"button","aria-current":"current"===H?"step":void 0,onClick:()=>T?.onSelect(B),className:p("flex cursor-pointer items-center bg-transparent p-1",J?"flex-col":"flex-row",n[q],h[q],m,y,"hover:bg-(--p-soft)"),children:[J?V:Q,J?null:U]}):l("span",{"aria-current":"current"===H?"step":void 0,className:p("flex items-center p-1",J?"flex-col":"flex-row",n[q],$?"opacity-50":""),children:[J?V:Q,J?null:U]});return l("li",{ref:R,className:p("relative flex min-w-0",J?"flex-1 flex-col items-center":"flex-col",I),style:{"--p-bullet":s[q],...N(E,0),"--p-fill":`var(--plass-${E}-fill)`,"--p-on-solid":`var(--plass-${E}-on-solid)`},...L,children:[l("span",{className:p("flex w-full",J?"flex-row items-start":"flex-col"),children:[X,O?e("span",{"aria-hidden":"true",className:p(J?"mt-[calc(var(--p-bullet)/2+0.25rem)] h-0 flex-1 border-t":"ms-[calc(var(--p-bullet)/2+0.25rem)] w-0 flex-1 self-stretch border-s",o[G],i[H],y)}):null]}),!J&&B===F&&u(A)?e("div",{role:"group","aria-labelledby":T?`${T.baseId}-${B}`:void 0,className:p("ms-[calc(var(--p-bullet)+0.75rem)] pt-2 pb-4",v[q]),children:A}):null]})});

package/dist/components/switch/PlSwitch.js

@@ -1 +1 @@
-"use client";import{jsx as a,jsxs as e,Fragment as r}from"react/jsx-runtime";import*as t from"react";import{useDefaults as o}from"../../internal/defaults.js";import{Switch as s}from"@base-ui/react/switch";import{Field as l}from"@base-ui/react/field";import{controlSlots as c,cx as i,focusRingClasses as n,hasContent as d,metaTextClasses as h,tickRowTextClasses as m}from"../../internal/styles.js";const p={xs:"h-3.5 w-6",sm:"h-4 w-7",md:"h-5 w-9",lg:"h-6 w-11",xl:"h-7 w-13"},f={xs:"data-[checked]:start-[calc(100%-0.75rem)]",sm:"data-[checked]:start-[calc(100%-0.875rem)]",md:"data-[checked]:start-[calc(100%-1.125rem)]",lg:"data-[checked]:start-[calc(100%-1.375rem)]",xl:"data-[checked]:start-[calc(100%-1.625rem)]"},u=/* @__PURE__ */["relative inline-flex shrink-0 rounded-full","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition-property:background-color,background-image,box-shadow,filter]","[transition-duration:var(--plass-duration)]","[transition-timing-function:var(--plass-ease)]",n].join(" "),g=/* @__PURE__ */["forced-colors:border forced-colors:[border-color:CanvasText]","forced-colors:data-[checked]:[background-color:Highlight]"].join(" "),b=/* @__PURE__ */[g,"cursor-pointer bg-(--plass-track)","hover:brightness-[0.97] dark:hover:brightness-110","data-[checked]:[background-image:var(--p-fill)]","data-[checked]:[box-shadow:var(--p-lift)] data-[checked]:hover:brightness-105"].join(" "),x=/* @__PURE__ */[g,"cursor-default bg-(--plass-track) saturate-[0.55]","data-[checked]:[background-image:var(--p-fill)]","data-[checked]:shadow-none"].join(" "),k=/* @__PURE__ */["forced-colors:border forced-colors:[border-color:GrayText]","cursor-not-allowed bg-(--plass-track)","opacity-50 saturate-[0.35] shadow-none","data-[checked]:[background-image:var(--p-fill)]"].join(" "),w=/* @__PURE__ */["absolute inset-y-0.5 start-0.5 aspect-square rounded-full bg-white","[box-shadow:0_1px_2px_rgb(20_40_90/0.25)]","forced-colors:[background-color:CanvasText] forced-colors:data-[checked]:[background-color:HighlightText]","[transition:inset-inline-start_var(--plass-duration)_var(--plass-ease)]"].join(" ");export const PlSwitch=/* @__PURE__ */t.forwardRef(function PlSwitch({size:t,color:n,label:g,description:v,error:j,invalid:N,labelPlacement:y="end",disabled:_=!1,readOnly:T=!1,className:P,classNames:R,style:S,...$},z){const B=o(),C=t??B.size??"md",H=n??B.color??"primary",O=d(j),q=N??O,D=q?"danger":H,E=a("span",{className:"flex h-[1lh] shrink-0 items-center",children:a(s.Root,{ref:z,className:i(u,p[C],_?k:T?x:b,R?.control),disabled:_,readOnly:T,...$,children:a(s.Thumb,{className:`${w} ${f[C]}`})})}),F=g||v?e("span",{className:["flex min-w-0 flex-col gap-0.5","start"===y?"flex-1":""].filter(Boolean).join(" "),children:[g?a(l.Label,{className:i(_?"text-(--plass-muted-fg)":"cursor-pointer text-(--plass-fg)",R?.label),children:g}):null,v?a(l.Description,{className:i(h[C],"text-(--plass-muted-fg)",R?.description),children:v}):null]}):null;return e(l.Root,{disabled:_,invalid:q,className:["inline-flex flex-col gap-1 align-top",P??""].filter(Boolean).join(" "),style:{...c(D,0,"solid"),...S},children:[a("div",{className:`flex items-start gap-2.5 ${m[C]}`,children:e(r,"start"===y?{children:[F,E]}:{children:[E,F]})}),a(l.Error,O?{match:!0,className:i(h[C],"text-(--p-accent)",R?.error),children:j}:{className:i(h[C],"text-(--p-accent)",R?.error)})]})});
+"use client";import{jsx as a,jsxs as e,Fragment as r}from"react/jsx-runtime";import*as t from"react";import{useDefaults as o}from"../../internal/defaults.js";import{Switch as s}from"@base-ui/react/switch";import{Field as l}from"@base-ui/react/field";import{controlSlots as c,cx as i,focusRingClasses as n,hasContent as d,metaTextClasses as h,tickRowTextClasses as m}from"../../internal/styles.js";const p={xs:"h-3.5 w-6",sm:"h-4 w-7",md:"h-5 w-9",lg:"h-6 w-11",xl:"h-7 w-13"},f={xs:"data-[checked]:start-[calc(100%-0.75rem)]",sm:"data-[checked]:start-[calc(100%-0.875rem)]",md:"data-[checked]:start-[calc(100%-1.125rem)]",lg:"data-[checked]:start-[calc(100%-1.375rem)]",xl:"data-[checked]:start-[calc(100%-1.625rem)]"},u=/* @__PURE__ */["relative inline-flex shrink-0 rounded-full","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition-property:background-color,background-image,box-shadow,filter]","[transition-duration:var(--plass-duration)]","[transition-timing-function:var(--plass-ease)]",n].join(" "),g=/* @__PURE__ */["forced-colors:border forced-colors:[border-color:CanvasText]","forced-colors:data-[checked]:[background-color:Highlight]"].join(" "),b=/* @__PURE__ */[g,"cursor-pointer bg-(--plass-track)","hover:brightness-[0.97] dark:hover:brightness-110","data-[checked]:[background-image:var(--p-fill)]","data-[checked]:[box-shadow:var(--p-lift)] data-[checked]:hover:brightness-105"].join(" "),x=/* @__PURE__ */[g,"cursor-default bg-(--plass-track) saturate-[0.55]","data-[checked]:[background-image:var(--p-fill)]","data-[checked]:shadow-none"].join(" "),k=/* @__PURE__ */["forced-colors:border forced-colors:[border-color:GrayText]","cursor-not-allowed bg-(--plass-track)","opacity-50 saturate-[0.35] shadow-none","data-[checked]:[background-image:var(--p-fill)]"].join(" "),w=/* @__PURE__ */["absolute inset-y-0.5 start-0.5 aspect-square rounded-full bg-white","[box-shadow:0_1px_2px_rgb(20_40_90/0.25)]","forced-colors:[background-color:CanvasText] forced-colors:data-[checked]:[background-color:HighlightText]","[transition:inset-inline-start_var(--plass-duration)_var(--plass-ease)]"].join(" ");export const PlSwitch=/* @__PURE__ */t.forwardRef(function PlSwitch({size:t,color:n,label:g,description:v,error:j,invalid:N,labelPlacement:y="end",disabled:_=!1,readOnly:T=!1,className:P,classNames:R,style:S,...$},z){const B=o(),C=t??B.size??"md",H=n??B.color??"primary",O=d(j),q=N??O,D=q?"danger":H,E=a("span",{className:"flex h-[1lh] shrink-0 items-center",children:a(s.Root,{ref:z,className:i(u,p[C],_?k:T?x:b,R?.control),disabled:_,readOnly:T,...$,children:a(s.Thumb,{className:`${w} ${f[C]}`})})}),F=g||v?e("span",{className:["flex min-w-0 flex-col gap-0.5","start"===y?"flex-1":""].filter(Boolean).join(" "),children:[g?a(l.Label,{className:i(_?"text-(--plass-muted-fg)":"cursor-pointer text-(--plass-fg)",R?.label),children:g}):null,v?a(l.Description,{className:i("m-0",h[C],"text-(--plass-muted-fg)",R?.description),children:v}):null]}):null;return e(l.Root,{disabled:_,invalid:q,className:["inline-flex flex-col gap-1 align-top",P??""].filter(Boolean).join(" "),style:{...c(D,0,"solid"),...S},children:[a("div",{className:`flex items-start gap-2.5 ${m[C]}`,children:e(r,"start"===y?{children:[F,E]}:{children:[E,F]})}),a(l.Error,O?{match:!0,className:i(h[C],"text-(--p-accent)",R?.error),children:j}:{className:i(h[C],"text-(--p-accent)",R?.error)})]})});

package/dist/components/text-field/PlTextField.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PlassElevation, PlassFieldClassNames, PlassHotKeys, PlassStyleProps } from '../../types.js';
+import type { PlassElevation, PlassFieldClassNames, PlassHotKeys, PlassFieldLabelPlacement, PlassStyleProps } from '../../types.js';
 /** How the multiline control may be resized by the user. Ignored when single line. */
 export type PlTextFieldResize = 'none' | 'vertical' | 'horizontal' | 'both';
 /**
@@ -43,12 +43,22 @@ export interface PlTextFieldProps extends PlassStyleProps, NativeControlProps {
      */
     resize?: PlTextFieldResize;
     /**
-     * Label above the control, wired to it by Base UI's Field. There is no
-     * floating variant on purpose: a floating label needs a `transform` on the
-     * thing being typed into, and a label that moves under the caret is the one
-     * effect this library rules out on a control.
+     * The name of what the field holds, wired to the control by Base UI's Field.
+     * `labelPlacement` decides whether it sits above the box or in its top edge.
+     *
+     * There is no floating variant on purpose, and a notch is not one: a floating
+     * label is animated out of the control as the caret arrives, which needs a
+     * `transform` on the thing being typed into, and a label that moves under the
+     * caret is the one effect this library rules out on a control. The notch is
+     * where it always was.
      */
     label?: React.ReactNode;
+    /**
+     * Where the `label` goes — above the control, or in its top edge.
+     * Falls back to the nearest `PlassProvider`, then to `top`.
+     * @default 'top'
+     */
+    labelPlacement?: PlassFieldLabelPlacement;
     /** Helper text below the control. */
     description?: React.ReactNode;
     /** Error message below the control. Its presence also turns the field invalid. */

package/dist/components/text-field/PlTextField.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{useDefaults as s}from"../../internal/defaults.js";import{Field as r}from"@base-ui/react/field";import{Input as n}from"@base-ui/react/input";import{Spinner as i}from"../../internal/icons.js";import{hotKeyHandler as a}from"../../internal/keys.js";import{controlHeightClasses as o,controlTextLeadingClasses as c,cx as m,disabledClasses as d,fieldReadOnlyClasses as p,fieldRestClasses as f,focusWithinRingClasses as u,gapClasses as x,hasContent as h,iconClasses as g,metaTextClasses as y,paddingXClasses as $,radiusClasses as b,stackGapClasses as w,surfaceSlots as N,transitionClasses as j}from"../../internal/styles.js";const v={xs:`${x.xs} ${b.xs} ${c.xs}`,sm:`${x.sm} ${b.sm} ${c.sm}`,md:`${x.md} ${b.md} ${c.md}`,lg:`${x.lg} ${b.lg} ${c.lg}`,xl:`${x.xl} ${b.xl} ${c.xl}`},z={xs:"min-h-6 py-[3px]",sm:"min-h-8 py-[6px]",md:"min-h-10 py-[9px]",lg:"min-h-12 py-[11px]",xl:"min-h-14 py-[13px]"},k={none:"resize-none",vertical:"resize-y",horizontal:"resize-x",both:"resize"},D=/* @__PURE__ */["group relative flex w-full cursor-text","[-webkit-tap-highlight-color:transparent]",j,u,g].join(" "),K=f,P=p;export const PlTextField=/* @__PURE__ */l.forwardRef(function PlTextField({variant:c="glass",size:p,color:f,density:u,elevation:x=0,multiline:g=!1,rows:b=3,resize:j="vertical",label:R,description:T,error:B,invalid:F,startIcon:I,endIcon:O,loading:C=!1,fullWidth:E=!1,readOnly:L=!1,disabled:W=!1,type:q="text",hotKeys:A,onKeyDown:G,className:H,classNames:J,style:M,...Q},S){const U=s(),V=p??U.size??"md",X=f??U.color??"primary",Y=u??U.density??"default",Z=h(B),_=F??Z,ee=_?"danger":X,te=l.useRef(null),le=l.useCallback(e=>{te.current=e,"function"==typeof S?S(e):S&&(S.current=e)},[S]),se=[D,v[V],g?`${z[V]} items-start`:`${o[V]} items-center`,$[Y][V],W?d[c]:L?P[c]:K[c]].filter(Boolean).join(" "),re=["min-w-0 flex-1 bg-transparent [font:inherit] text-inherit","[outline:none]","placeholder:text-(--plass-muted-fg)","caret-(--p-accent) selection:bg-(--p-soft-press)","disabled:cursor-not-allowed",g?`block ${k[j]}`:"self-stretch"].join(" "),ne="inline-flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg) transition-[color] duration-(--plass-duration) group-focus-within:text-(--p-accent)";return t(r.Root,{disabled:W,invalid:_,className:["flex-col align-top",w[V],E?"flex w-full":"inline-flex",H??""].filter(Boolean).join(" "),style:{...N(ee,x),...M},children:[R?e(r.Label,{className:m(y[V],"font-semibold",W?"text-(--plass-muted-fg)":"text-(--plass-fg)",J?.label),children:R}):null,t("span",{className:m(se,J?.control),onPointerDown:e=>{e.target!==e.currentTarget||W||(e.preventDefault(),te.current?.focus())},children:[I?e("span",{className:ne,children:I}):null,e(n,{ref:le,className:re,disabled:W,readOnly:L,"aria-busy":C||void 0,"data-loading":C||void 0,onKeyDown:a(A,G),...g?{render:e("textarea",{rows:b})}:{type:q},...Q}),C?e("span",{className:ne,children:e(i,{})}):O?e("span",{className:ne,children:O}):null]}),T?e(r.Description,{className:m(y[V],"text-(--plass-muted-fg)",J?.description),children:T}):null,e(r.Error,Z?{match:!0,className:m(y[V],"text-(--p-accent)",J?.error),children:B}:{className:m(y[V],"text-(--p-accent)",J?.error)})]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{useDefaults as n}from"../../internal/defaults.js";import{Field as r}from"@base-ui/react/field";import{Input as s}from"@base-ui/react/input";import{Spinner as i}from"../../internal/icons.js";import{glowPointerMove as a}from"../../internal/glow.js";import{FieldNotch as o,notchShellStyle as c}from"../../internal/notch.js";import{hotKeyHandler as m}from"../../internal/keys.js";import{controlHeightClasses as d,controlTextLeadingClasses as p,cx as f,disabledClasses as u,fieldReadOnlyClasses as x,fieldRestClasses as h,focusWithinRingClasses as g,gapClasses as y,hasContent as b,iconClasses as $,metaTextClasses as w,paddingXClasses as j,radiusClasses as v,stackGapClasses as N,surfaceSlots as z,transitionClasses as P}from"../../internal/styles.js";const k={xs:`${y.xs} ${v.xs} ${p.xs}`,sm:`${y.sm} ${v.sm} ${p.sm}`,md:`${y.md} ${v.md} ${p.md}`,lg:`${y.lg} ${v.lg} ${p.lg}`,xl:`${y.xl} ${v.xl} ${p.xl}`},D={xs:"min-h-6 py-[3px]",sm:"min-h-8 py-[6px]",md:"min-h-10 py-[9px]",lg:"min-h-12 py-[11px]",xl:"min-h-14 py-[13px]"},K={none:"resize-none",vertical:"resize-y",horizontal:"resize-x",both:"resize"},O=/* @__PURE__ */["group relative flex w-full cursor-text","[-webkit-tap-highlight-color:transparent]",P,$].join(" "),R=g,T=h,B=x;export const PlTextField=/* @__PURE__ */l.forwardRef(function PlTextField({variant:p="glass",size:x,color:h,density:g,elevation:y=0,multiline:$=!1,rows:v=3,resize:P="vertical",label:F,labelPlacement:I,description:C,error:E,invalid:L,startIcon:M,endIcon:W,loading:q=!1,fullWidth:A=!1,readOnly:G=!1,disabled:H=!1,type:J="text",hotKeys:Q,onKeyDown:S,className:U,classNames:V,style:X,...Y},Z){const _=n(),ee=x??_.size??"md",te=h??_.color??"primary",le=g??_.density??"default",ne="notch"===(I??_.labelPlacement??"top")&&b(F),re=b(E),se=L??re,ie=se?"danger":te,ae=l.useRef(null),oe=l.useCallback(e=>{ae.current=e,"function"==typeof Z?Z(e):Z&&(Z.current=e)},[Z]),ce=!H&&!G,me=[O,ne?"":R,k[ee],$?`${D[ee]} items-start`:`${d[ee]} items-center`,j[le][ee],H?u[p]:G?B[p]:T[p],ce?"plass-glow":""].filter(Boolean).join(" "),de=["min-w-0 flex-1 bg-transparent [font:inherit] text-inherit","[outline:none]","placeholder:text-(--plass-muted-fg)","caret-(--p-accent) selection:bg-(--p-soft-press)","disabled:cursor-not-allowed",$?`block ${K[P]}`:"self-stretch"].join(" "),pe="inline-flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg) transition-[color] duration-(--plass-duration) group-focus-within:text-(--p-accent)",fe=e(r.Label,{className:f(w[ee],"font-semibold",H?"text-(--plass-muted-fg)":"text-(--plass-fg)",V?.label),children:F});return t(r.Root,{disabled:H,invalid:se,className:["flex-col align-top",N[ee],A?"flex w-full":"inline-flex",U??""].filter(Boolean).join(" "),style:{...z(ie,y),...X},children:[b(F)&&!ne?fe:null,e(o,{notched:ne,size:ee,density:le,variant:p,disabled:H,readOnly:G,label:fe,children:t("span",{className:f(me,V?.control),style:ne?c:void 0,onPointerMove:a(ce),onPointerDown:e=>{e.target!==e.currentTarget||H||(e.preventDefault(),ae.current?.focus())},children:[M?e("span",{className:pe,children:M}):null,e(s,{ref:oe,className:de,disabled:H,readOnly:G,"aria-busy":q||void 0,"data-loading":q||void 0,onKeyDown:m(Q,S),...$?{render:e("textarea",{rows:v})}:{type:J},...Y}),q?e("span",{className:pe,children:e(i,{})}):W?e("span",{className:pe,children:W}):null]})}),C?e(r.Description,{className:f("m-0",w[ee],"text-(--plass-muted-fg)",V?.description),children:C}):null,e(r.Error,re?{match:!0,className:f(w[ee],"text-(--p-accent)",V?.error),children:E}:{className:f(w[ee],"text-(--p-accent)",V?.error)})]})});

package/dist/components/timeline/PlTimeline.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as r}from"../../internal/defaults.js";import{useRender as s}from"@base-ui/react/use-render";import{cx as a,hasContent as n,iconClasses as i,metaTextClasses as o,sheetBodyClasses as c,sheetTitleClasses as p,surfaceSlots as d,transitionClasses as m}from"../../internal/styles.js";import{bulletGapClasses as u,bulletSizeValues as f,bulletStatusClasses as x,connectorColorClasses as b,connectorStyleClasses as v,statusAt as h,titleStatusClasses as y}from"../../internal/steps.js";import{useResponsiveValue as N}from"../../internal/responsive.js";const g=/* @__PURE__ */t.createContext(null),j=/* @__PURE__ */t.createContext({index:0,last:!1}),z={default:{xs:"pb-5",sm:"pb-6",md:"pb-7",lg:"pb-8",xl:"pb-10"},compact:{xs:"pb-3",sm:"pb-3.5",md:"pb-4",lg:"pb-5",xl:"pb-6"}},w={default:{xs:"pe-5",sm:"pe-6",md:"pe-7",lg:"pe-8",xl:"pe-10"},compact:{xs:"pe-3",sm:"pe-3.5",md:"pe-4",lg:"pe-5",xl:"pe-6"}};export const PlTimelineItem=/* @__PURE__ */t.forwardRef(function PlTimelineItem({title:r,meta:s,bullet:N,status:P,color:C,connector:T="solid",className:_,children:k,...I},R){const $=t.useContext(g),{index:A,last:E}=t.useContext(j),M=$?.size??"md",V=$?.density??"default",q=$?.orientation??"vertical",B=C??$?.color??"primary",D=P??h(A,$?.active??null),F="horizontal"===q,G="none"!==T&&!E,H=e("span",{"aria-hidden":"true",className:a("relative z-10 flex shrink-0 items-center justify-center rounded-full","size-(--p-bullet) text-[calc(var(--p-bullet)*0.5)] leading-none font-semibold tabular-nums",x[D],m,i),children:N}),J=G?e("span",{"aria-hidden":"true",className:a("pointer-events-none absolute",F?"top-[calc(var(--p-bullet)/2_-_1px)] end-0 start-(--p-bullet) border-t-2":"top-(--p-bullet) bottom-0 start-[calc(var(--p-bullet)/2_-_1px)] border-s-2",v[T],b[D],m)}):null,K=l("div",{className:a("flex min-w-0 flex-col gap-0.5",F?"mt-2":""),children:[n(r)||n(s)?l("div",{className:"flex flex-wrap items-baseline gap-x-2",children:[n(r)?e("span",{className:a("font-semibold",p[M],y[D],m),children:r}):null,n(s)?e("span",{className:a("text-(--plass-muted-fg)",o[M]),children:s}):null]}):null,n(k)?e("div",{className:a("text-(--plass-muted-fg)",c[M]),children:k}):null]});return l("li",{ref:R,"aria-current":"current"===D?"step":void 0,"data-status":D,className:a("relative",F?a("flex min-w-0 flex-1 flex-col",E?"":w[V][M]):a("flex",u[M],E?"":z[V][M]),_),style:{"--p-bullet":f[M],...d(B,0),"--p-fill":`var(--plass-${B}-fill)`,"--p-on-solid":`var(--plass-${B}-on-solid)`},...I,children:[J,H,K]})});export const PlTimeline=/* @__PURE__ */t.forwardRef(function PlTimeline({active:l,size:n,color:i,density:o,orientation:c,render:p,className:m,style:u,children:f,...x},b){const v=N(c,"vertical"),h=r(),y=n??h.size??"md",z=i??h.color??"primary",w=o??h.density??"default",P=t.Children.toArray(f),C=P.length,T=t.useMemo(()=>({size:y,density:w,orientation:v,color:z,active:l??null}),[y,w,v,z,l]),_=s({render:p??e("ol",{}),ref:b,props:{role:"list",className:a("flex","horizontal"===v?"flex-row":"flex-col",m),style:{...d(z,0),...u},children:P.map((l,r)=>e(j.Provider,{value:{index:r,last:r===C-1},children:l},t.isValidElement(l)?l.key??r:r)),...x}});return e(g.Provider,{value:T,children:_})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as r}from"../../internal/defaults.js";import{useRender as s}from"@base-ui/react/use-render";import{cx as n,hasContent as a,iconClasses as i,metaTextClasses as o,sheetBodyClasses as c,sheetTitleClasses as p,surfaceSlots as m,transitionClasses as d}from"../../internal/styles.js";import{bulletGapClasses as u,bulletSizeValues as f,bulletStatusClasses as x,connectorColorClasses as b,connectorStyleClasses as v,statusAt as h,titleStatusClasses as y}from"../../internal/steps.js";import{useResponsiveValue as N}from"../../internal/responsive.js";const g=/* @__PURE__ */t.createContext(null),j=/* @__PURE__ */t.createContext({index:0,last:!1}),z={default:{xs:"pb-5",sm:"pb-6",md:"pb-7",lg:"pb-8",xl:"pb-10"},compact:{xs:"pb-3",sm:"pb-3.5",md:"pb-4",lg:"pb-5",xl:"pb-6"}},w={default:{xs:"pe-5",sm:"pe-6",md:"pe-7",lg:"pe-8",xl:"pe-10"},compact:{xs:"pe-3",sm:"pe-3.5",md:"pe-4",lg:"pe-5",xl:"pe-6"}};export const PlTimelineItem=/* @__PURE__ */t.forwardRef(function PlTimelineItem({title:r,meta:s,bullet:N,status:P,color:C,connector:T="solid",className:_,children:k,...I},R){const $=t.useContext(g),{index:A,last:E}=t.useContext(j),M=$?.size??"md",V=$?.density??"default",q=$?.orientation??"vertical",B=C??$?.color??"primary",D=P??h(A,$?.active??null),F="horizontal"===q,G="none"!==T&&!E,H=e("span",{"aria-hidden":"true",className:n("relative z-10 flex shrink-0 items-center justify-center rounded-full","size-(--p-bullet) text-[calc(var(--p-bullet)*0.5)] leading-none font-semibold tabular-nums",x[D],d,i),children:N}),J=G?e("span",{"aria-hidden":"true",className:n("pointer-events-none absolute",F?"top-[calc(var(--p-bullet)/2_-_1px)] end-0 start-(--p-bullet) border-t-2":"top-(--p-bullet) bottom-0 start-[calc(var(--p-bullet)/2_-_1px)] border-s-2",v[T],b[D],d)}):null,K=l("div",{className:n("flex min-w-0 flex-col gap-0.5",F?"mt-2":""),children:[a(r)||a(s)?l("div",{className:"flex flex-wrap items-baseline gap-x-2",children:[a(r)?e("span",{className:n("font-semibold",p[M],y[D],d),children:r}):null,a(s)?e("span",{className:n("text-(--plass-muted-fg)",o[M]),children:s}):null]}):null,a(k)?e("div",{className:n("text-(--plass-muted-fg)",c[M]),children:k}):null]});return l("li",{ref:R,"aria-current":"current"===D?"step":void 0,"data-status":D,className:n("relative",F?n("flex min-w-0 flex-1 flex-col",E?"":w[V][M]):n("flex",u[M],E?"":z[V][M]),_),style:{"--p-bullet":f[M],...m(B,0),"--p-fill":`var(--plass-${B}-fill)`,"--p-on-solid":`var(--plass-${B}-on-solid)`},...I,children:[J,H,K]})});export const PlTimeline=/* @__PURE__ */t.forwardRef(function PlTimeline({active:l,size:a,color:i,density:o,orientation:c,render:p,className:d,style:u,children:f,...x},b){const v=N(c,"vertical"),h=r(),y=a??h.size??"md",z=i??h.color??"primary",w=o??h.density??"default",P=t.Children.toArray(f),C=P.length,T=t.useMemo(()=>({size:y,density:w,orientation:v,color:z,active:l??null}),[y,w,v,z,l]),_=s({render:p??e("ol",{}),ref:b,props:{role:"list",className:n("m-0 flex list-none p-0","horizontal"===v?"flex-row":"flex-col",d),style:{...m(z,0),...u},children:P.map((l,r)=>e(j.Provider,{value:{index:r,last:r===C-1},children:l},t.isValidElement(l)?l.key??r:r)),...x}});return e(g.Provider,{value:T,children:_})});

package/dist/components/toast/PlToast.js

@@ -1 +1 @@
-"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import*as e from"react";import{useDefaults as o}from"../../internal/defaults.js";import{useLabels as a}from"../../internal/labels.js";import{Toast as i}from"@base-ui/react/toast";import{CloseIcon as r,severityIcon as n}from"../../internal/icons.js";import{controlSlots as l,focusRingClasses as c,forcedFieldEdgeClasses as p,glassClasses as d,hasContent as m,iconClasses as f,metaTextClasses as u,radiusClasses as h,sheetBodyClasses as g,sheetHeaderGapClasses as v,sheetPaddingXClasses as x,sheetPaddingYClasses as b,sheetSectionGapClasses as y,sheetTitleClasses as w}from"../../internal/styles.js";const j={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 flex-col-reverse items-start","bottom-center":"bottom-0 flex-col-reverse items-center","bottom-end":"bottom-0 flex-col-reverse items-end"},N={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--plass-shadow-3),var(--p-lift)]",p].join(" "),glass:/* @__PURE__ */[d,"border text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--p-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]"].join(" "),ghost:/* @__PURE__ */[d,"text-(--plass-fg) bg-(--plass-glass-press)","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]"].join(" ")},T={solid:"",glass:"text-(--p-accent)",ghost:"text-(--p-accent)"};function toManagerOptions(t){const{color:s,variant:e,icon:o,className:a,style:i,actionLabel:r,onAction:n,...l}=t;return{...l,data:{color:s,variant:e,icon:o,className:a,style:i},actionProps:void 0===r?void 0:{children:r,onClick:n}}}export function usePlToast(){const t=i.useToastManager();return e.useMemo(()=>({add:s=>t.add(toManagerOptions(s)),close:s=>t.close(s),update:(s,e)=>t.update(s,toManagerOptions(e)),promise:(s,e)=>t.promise(s,{loading:toManagerOptions(e.loading),success:t=>toManagerOptions("function"==typeof e.success?e.success(t):e.success),error:t=>toManagerOptions("function"==typeof e.error?e.error(t):e.error)}),toasts:t.toasts}),[t])}function ToastItem({toast:e,variant:o,color:a,size:p,density:d,closeLabel:j,swipeDirection:M}){const z=e.data?.variant??o??"glass",O=e.data?.color??a,P=void 0===e.data?.icon?n(O):e.data.icon,k=T[z],$=m(e.title);return s(i.Root,{toast:e,swipeDirection:M,className:["pointer-events-auto flex w-full items-start",x[d??"default"][p],b[d??"default"][p],h[p],y[p],g[p],N[z],f,"[transition:opacity_var(--plass-duration)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0","data-[limited]:hidden",c,"[outline:none]",e.data?.className??""].filter(Boolean).join(" "),style:{...l(O,3,z),...e.data?.style},children:[m(P)?t("span",{className:`flex h-[1lh] shrink-0 items-center ${k}`,children:P}):null,s("div",{className:`flex min-w-0 flex-1 flex-col ${v[p]}`,children:[t(i.Title,{className:`plass-title font-semibold ${w[p]} ${k}`}),t(i.Description,{className:$&&"solid"!==z?"text-(--plass-muted-fg)":""})]}),t(i.Action,{className:["flex h-[1lh] shrink-0 cursor-pointer items-center rounded-full px-2","font-medium underline-offset-2",k||"text-(--p-on-solid)","hover:underline",c,u[p]].join(" ")}),t("span",{className:"flex h-[1lh] shrink-0 items-center",children:t(i.Close,{"aria-label":j,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",c].join(" "),children:t(r,{})})})]})}function ToastViewport(s){const{toasts:e}=i.useToastManager(),o=a(),{position:r,width:n,...l}=s,c=[r.startsWith("top")?"up":"down","left","right"];return t(i.Portal,{children:t(i.Viewport,{"aria-label":o.notifications,className:["plass-portal pointer-events-none fixed inset-x-0 z-(--plass-z-portal) flex flex-col gap-2 p-4",j[r]].join(" "),children:e.map(s=>t("div",{className:"w-full",style:{maxWidth:"number"==typeof n?`${n}px`:n},children:t(ToastItem,{toast:s,swipeDirection:c,...l})},s.id))})})}export function PlToastProvider({variant:e="glass",size:r,color:n,density:l,position:c="bottom-end",timeout:p=5e3,limit:d=3,width:m=380,closeLabel:f,children:u}){const h=o(),g=a(),v=f??g.close,x=r??h.size??"md",b=n??h.color??"primary",y=l??h.density??"default";return s(i.Provider,{timeout:p,limit:d,children:[u,t(ToastViewport,{position:c,variant:e,size:x,color:b,density:y,width:m,closeLabel:v})]})}
+"use client";import{jsx as t,jsxs as s}from"react/jsx-runtime";import*as e from"react";import{useDefaults as o}from"../../internal/defaults.js";import{useLabels as a}from"../../internal/labels.js";import{Toast as i}from"@base-ui/react/toast";import{CloseIcon as r,severityIcon as n}from"../../internal/icons.js";import{controlSlots as l,focusRingClasses as c,forcedFieldEdgeClasses as p,glassClasses as d,hasContent as m,iconClasses as f,metaTextClasses as u,radiusClasses as h,sheetBodyClasses as g,sheetHeaderGapClasses as v,sheetPaddingXClasses as x,sheetPaddingYClasses as b,sheetSectionGapClasses as y,sheetTitleClasses as w}from"../../internal/styles.js";const j={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 flex-col-reverse items-start","bottom-center":"bottom-0 flex-col-reverse items-center","bottom-end":"bottom-0 flex-col-reverse items-end"},N={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--plass-shadow-3),var(--p-lift)]",p].join(" "),glass:/* @__PURE__ */[d,"border text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--p-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]"].join(" "),ghost:/* @__PURE__ */[d,"text-(--plass-fg) bg-(--plass-glass-press)","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]"].join(" ")},T={solid:"",glass:"text-(--p-accent)",ghost:"text-(--p-accent)"};function toManagerOptions(t){const{color:s,variant:e,icon:o,className:a,style:i,actionLabel:r,onAction:n,...l}=t;return{...l,data:{color:s,variant:e,icon:o,className:a,style:i},actionProps:void 0===r?void 0:{children:r,onClick:n}}}export function usePlToast(){const t=i.useToastManager();return e.useMemo(()=>({add:s=>t.add(toManagerOptions(s)),close:s=>t.close(s),update:(s,e)=>t.update(s,toManagerOptions(e)),promise:(s,e)=>t.promise(s,{loading:toManagerOptions(e.loading),success:t=>toManagerOptions("function"==typeof e.success?e.success(t):e.success),error:t=>toManagerOptions("function"==typeof e.error?e.error(t):e.error)}),toasts:t.toasts}),[t])}function ToastItem({toast:e,variant:o,color:a,size:p,density:d,closeLabel:j,swipeDirection:M}){const z=e.data?.variant??o??"glass",O=e.data?.color??a,P=void 0===e.data?.icon?n(O):e.data.icon,k=T[z],$=m(e.title);return s(i.Root,{toast:e,swipeDirection:M,className:["pointer-events-auto flex w-full items-start",x[d??"default"][p],b[d??"default"][p],h[p],y[p],g[p],N[z],f,"[transition:opacity_var(--plass-duration)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0","data-[limited]:hidden",c,"[outline:none]",e.data?.className??""].filter(Boolean).join(" "),style:{...l(O,3,z),...e.data?.style},children:[m(P)?t("span",{className:`flex h-[1lh] shrink-0 items-center ${k}`,children:P}):null,s("div",{className:`flex min-w-0 flex-1 flex-col ${v[p]}`,children:[t(i.Title,{className:`plass-title m-0 font-semibold ${w[p]} ${k}`}),t(i.Description,{className:$&&"solid"!==z?"m-0 text-(--plass-muted-fg)":"m-0"})]}),t(i.Action,{className:["flex h-[1lh] shrink-0 cursor-pointer items-center rounded-full px-2","font-medium underline-offset-2",k||"text-(--p-on-solid)","hover:underline",c,u[p]].join(" ")}),t("span",{className:"flex h-[1lh] shrink-0 items-center",children:t(i.Close,{"aria-label":j,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",c].join(" "),children:t(r,{})})})]})}function ToastViewport(s){const{toasts:e}=i.useToastManager(),o=a(),{position:r,width:n,...l}=s,c=[r.startsWith("top")?"up":"down","left","right"];return t(i.Portal,{children:t(i.Viewport,{"aria-label":o.notifications,className:["plass-portal pointer-events-none fixed inset-x-0 z-(--plass-z-portal) flex flex-col gap-2 p-4",j[r]].join(" "),children:e.map(s=>t("div",{className:"w-full",style:{maxWidth:"number"==typeof n?`${n}px`:n},children:t(ToastItem,{toast:s,swipeDirection:c,...l})},s.id))})})}export function PlToastProvider({variant:e="glass",size:r,color:n,density:l,position:c="bottom-end",timeout:p=5e3,limit:d=3,width:m=380,closeLabel:f,children:u}){const h=o(),g=a(),v=f??g.close,x=r??h.size??"md",b=n??h.color??"primary",y=l??h.density??"default";return s(i.Provider,{timeout:p,limit:d,children:[u,t(ToastViewport,{position:c,variant:e,size:x,color:b,density:y,width:m,closeLabel:v})]})}

package/dist/components/toggle/PlToggle.js

@@ -1 +1 @@
-"use client";import{jsxs as s}from"react/jsx-runtime";import*as e from"react";import{followPointer as o}from"../../internal/glow.js";import{useDefaults as l}from"../../internal/defaults.js";import{Toggle as a}from"@base-ui/react/toggle";import{ButtonGroupContext as r}from"../../internal/button-group.js";import{controlHeightClasses as t,controlSlots as i,controlSquareClasses as p,controlTextClasses as g,disabledClasses as n,focusRingClasses as v,forcedEdgeClasses as d,forcedPressedClasses as h,gapClasses as x,glassClasses as c,hasContent as m,iconClasses as b,paddingXClasses as f,radiusClasses as $,transitionClasses as u}from"../../internal/styles.js";const w={xs:`${t.xs} ${x.xs} ${$.xs} ${g.xs}`,sm:`${t.sm} ${x.sm} ${$.sm} ${g.sm}`,md:`${t.md} ${x.md} ${$.md} ${g.md}`,lg:`${t.lg} ${x.lg} ${$.lg} ${g.lg}`,xl:`${t.xl} ${x.xl} ${$.xl} ${g.xl}`},j={xs:`${p.xs} px-0`,sm:`${p.sm} px-0`,md:`${p.md} px-0`,lg:`${p.lg} px-0`,xl:`${p.xl} px-0`},y=/* @__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]",u,v,b].join(" "),P={solid:/* @__PURE__ */[c,"text-(--plass-muted-fg) bg-(--plass-glass-hover)","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]",d].join(" "),glass:/* @__PURE__ */[c,"border text-(--plass-muted-fg) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--plass-muted-fg) bg-transparent"},k={solid:/* @__PURE__ */["hover:bg-(--plass-glass-press) hover:text-(--plass-fg)","hover:[box-shadow:var(--p-elev-hover),var(--plass-gloss-glass)]","active:[box-shadow:var(--p-elev-press),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */["hover:bg-(--plass-glass-hover) hover:text-(--plass-fg) 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-(--plass-glass-hover) hover:text-(--plass-fg) active:bg-(--plass-glass-press)"},z={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",h].join(" "),glass:/* @__PURE__ */[c,"border text-(--p-accent) bg-(--p-soft)","[border-color:var(--p-line-hover)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]",h].join(" "),ghost:`text-(--p-accent) bg-(--p-soft) ${h}`},C={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:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)",ghost:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)"};export const PlToggle=/* @__PURE__ */e.forwardRef(function PlToggle({variant:t,size:p,color:g,density:v,elevation:d,pressed:h,defaultPressed:x,onPressedChange:c,value:b,startIcon:$,endIcon:u,fullWidth:T=!1,disabled:I,className:M,style:N,children:B,onPointerMove:R,...W},q){const A=l(),D=e.useContext(r),E=t??D?.variant??"glass",F=p??D?.size??A.size??"md",G=g??D?.color??A.color??"primary",H=v??D?.density??A.density??"default",J=d??D?.elevation??0,K=I??D?.disabled??!1,L=!m(B);return s(a,{ref:q,value:b,pressed:h,defaultPressed:x,onPressedChange:s=>c?.(s),disabled:K,className:s=>[y,w[F],L?j[F]:f[H][F],K?n[E]:s.pressed?`${z[E]} ${C[E]}`:`${P[E]} ${k[E]}`,K?"":"plass-glow cursor-pointer",T?"w-full":"",M??""].filter(Boolean).join(" "),style:{...i(G,J,E),...N},onPointerMove:s=>{o(s),R?.(s)},...W,children:[$,B,u]})});
+"use client";import{jsxs as s}from"react/jsx-runtime";import*as e from"react";import{glowPointerMove as o}from"../../internal/glow.js";import{useDefaults as l}from"../../internal/defaults.js";import{Toggle as a}from"@base-ui/react/toggle";import{ButtonGroupContext as r}from"../../internal/button-group.js";import{controlHeightClasses as t,controlSlots as i,controlSquareClasses as p,controlTextClasses as g,disabledClasses as n,focusRingClasses as v,forcedEdgeClasses as d,forcedPressedClasses as h,gapClasses as x,glassClasses as c,hasContent as m,iconClasses as b,paddingXClasses as f,radiusClasses as $,transitionClasses as u}from"../../internal/styles.js";const w={xs:`${t.xs} ${x.xs} ${$.xs} ${g.xs}`,sm:`${t.sm} ${x.sm} ${$.sm} ${g.sm}`,md:`${t.md} ${x.md} ${$.md} ${g.md}`,lg:`${t.lg} ${x.lg} ${$.lg} ${g.lg}`,xl:`${t.xl} ${x.xl} ${$.xl} ${g.xl}`},j={xs:`${p.xs} px-0`,sm:`${p.sm} px-0`,md:`${p.md} px-0`,lg:`${p.lg} px-0`,xl:`${p.xl} px-0`},y=/* @__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]",u,v,b].join(" "),P={solid:/* @__PURE__ */[c,"text-(--plass-muted-fg) bg-(--plass-glass-hover)","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]",d].join(" "),glass:/* @__PURE__ */[c,"border text-(--plass-muted-fg) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--plass-muted-fg) bg-transparent"},k={solid:/* @__PURE__ */["hover:bg-(--plass-glass-press) hover:text-(--plass-fg)","hover:[box-shadow:var(--p-elev-hover),var(--plass-gloss-glass)]","active:[box-shadow:var(--p-elev-press),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */["hover:bg-(--plass-glass-hover) hover:text-(--plass-fg) 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-(--plass-glass-hover) hover:text-(--plass-fg) active:bg-(--plass-glass-press)"},z={solid:/* @__PURE__ */["text-(--p-on-solid) [background-image:var(--p-fill)]","[box-shadow:var(--p-elev),var(--p-lift)]",h].join(" "),glass:/* @__PURE__ */[c,"border text-(--p-accent) bg-(--p-soft)","[border-color:var(--p-line-hover)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]",h].join(" "),ghost:`text-(--p-accent) bg-(--p-soft) ${h}`},C={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:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)",ghost:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)"};export const PlToggle=/* @__PURE__ */e.forwardRef(function PlToggle({variant:t,size:p,color:g,density:v,elevation:d,pressed:h,defaultPressed:x,onPressedChange:c,value:b,startIcon:$,endIcon:u,fullWidth:T=!1,disabled:I,className:M,style:N,children:B,onPointerMove:R,...W},q){const A=l(),D=e.useContext(r),E=t??D?.variant??"glass",F=p??D?.size??A.size??"md",G=g??D?.color??A.color??"primary",H=v??D?.density??A.density??"default",J=d??D?.elevation??0,K=I??D?.disabled??!1,L=!m(B);return s(a,{ref:q,value:b,pressed:h,defaultPressed:x,onPressedChange:s=>c?.(s),disabled:K,className:s=>[y,w[F],L?j[F]:f[H][F],K?n[E]:s.pressed?`${z[E]} ${C[E]}`:`${P[E]} ${k[E]}`,K?"":"plass-glow cursor-pointer",T?"w-full":"",M??""].filter(Boolean).join(" "),style:{...i(G,J,E),...N},onPointerMove:o(!K,R),...W,children:[$,B,u]})});

package/dist/components/tree-select/PlTreeSelect.js

@@ -1 +1 @@
-"use client";import{jsxs as e,jsx as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as n}from"../../internal/defaults.js";import{useLabels as r}from"../../internal/labels.js";import{PickerShell as a}from"../../internal/picker.js";import{searchHaystack as i,searchText as o}from"../../internal/search.js";import{cx as s,metaTextClasses as d}from"../../internal/styles.js";import{PlTextField as c}from"../text-field/PlTextField.js";import{PlTree as f}from"../tree/PlTree.js";function flatten(e,l=new Map){for(const t of e)l.set(t.id,t),t.children&&flatten(t.children,l);return l}function haystackOf(e){return i([e.searchLabel??("string"==typeof e.label?e.label:e.id)])}function filterTree(e,l){const t=[];for(const n of e){const e=n.children?filterTree(n.children,l):void 0,r=haystackOf(n).includes(l);(r||e&&e.length>0)&&t.push(r?n:{...n,children:e})}return t}function branchIds(e,l=[]){for(const t of e)t.children&&t.children.length>0&&(l.push(t.id),branchIds(t.children,l));return l}export const PlTreeSelect=/* @__PURE__ */t.forwardRef(function PlTreeSelect({items:i,value:h,defaultValue:m,onValueChange:u,multiple:p=!1,selectableBranches:g=!1,expanded:b,defaultExpanded:v,onExpandedChange:y,open:x,defaultOpen:j,onOpenChange:C,placeholder:O,clearable:S=!1,closeOnSelect:T,searchable:w=!1,searchLabel:z,emptyLabel:M,format:P,name:k,size:E,color:I,density:L,readOnly:N=!1,disabled:V=!1,...F},R){const B=n(),W=E??B.size??"md",q=I??B.color??"primary",A=L??B.density??"default",D=r(),G=z??D.search,H=M??D.empty,[J,K]=t.useState(m??[]),Q=h??J,[U,X]=t.useState(j??!1),Y=x??U,[Z,$]=t.useState(""),_=o(Z),ee=t.useMemo(()=>flatten(i),[i]),le=t.useMemo(()=>""===_?i:filterTree(i,_),[i,_]),te=""!==_,[ne,re]=t.useState(v??[]),ae=t.useMemo(()=>te?branchIds(le):void 0,[te,le])??b??ne,setOpen=e=>{e&&(V||N)||(void 0===x&&X(e),e||$(""),C?.(e))},commit=e=>{void 0===h&&K(e),u?.(e)},isSelectable=e=>!e.disabled&&(e.selectable??(!(e.children&&e.children.length>0)||g)),ie=Q.map(e=>ee.get(e)).filter(e=>void 0!==e),oe=0===ie.length?O??"":P?P(ie):ie.map((l,n)=>e(t.Fragment,{children:[0===n?null:", ",l.label]},l.id));return l(a,{...F,size:W,color:q,density:A,readOnly:N,disabled:V,triggerRef:R,display:oe,empty:0===ie.length,clearable:S,onClear:()=>commit([]),open:Y,onOpenChange:setOpen,labels:D,name:k,formValue:p?Q:Q[0]??"",children:e("div",{className:"flex max-h-80 w-64 flex-col gap-1.5 overflow-hidden",children:[w?l(c,{size:W,color:q,density:A,variant:"ghost",fullWidth:!0,placeholder:G,"aria-label":G,value:Z,onChange:e=>$(e.target.value)}):null,l("div",{className:"min-h-0 flex-1 overflow-y-auto overscroll-contain",children:0===le.length?l("p",{className:s("px-1.5 py-1 text-(--plass-muted-fg)",d[W]),children:H}):l(f,{items:le,size:W,color:q,density:A,selection:p?"multiple":"single",selected:Q,onSelectedChange:e=>{if(!p){const l=1===e.length?ee.get(e[0]):void 0;if(!l||!isSelectable(l))return;return commit([l.id]),void((T??!0)&&setOpen(!1))}const l=e.filter(e=>{const l=ee.get(e);return void 0!==l&&isSelectable(l)});(l.length!==Q.length||l.some((e,l)=>e!==Q[l]))&&(commit(l),T&&setOpen(!1))},expanded:ae,onExpandedChange:e=>{te||(void 0===b&&re(e),y?.(e))}})})]})})});
+"use client";import{jsxs as e,jsx as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as n}from"../../internal/defaults.js";import{useLabels as r}from"../../internal/labels.js";import{PickerShell as a}from"../../internal/picker.js";import{searchHaystack as i,searchText as o}from"../../internal/search.js";import{cx as s,metaTextClasses as d}from"../../internal/styles.js";import{PlTextField as c}from"../text-field/PlTextField.js";import{PlTree as f}from"../tree/PlTree.js";function flatten(e,l=new Map){for(const t of e)l.set(t.id,t),t.children&&flatten(t.children,l);return l}function haystackOf(e){return i([e.searchLabel??("string"==typeof e.label?e.label:e.id)])}function filterTree(e,l){const t=[];for(const n of e){const e=n.children?filterTree(n.children,l):void 0,r=haystackOf(n).includes(l);(r||e&&e.length>0)&&t.push(r?n:{...n,children:e})}return t}function branchIds(e,l=[]){for(const t of e)t.children&&t.children.length>0&&(l.push(t.id),branchIds(t.children,l));return l}export const PlTreeSelect=/* @__PURE__ */t.forwardRef(function PlTreeSelect({items:i,value:h,defaultValue:m,onValueChange:u,multiple:p=!1,selectableBranches:g=!1,expanded:b,defaultExpanded:v,onExpandedChange:y,open:x,defaultOpen:j,onOpenChange:C,placeholder:O,clearable:S=!1,closeOnSelect:T,searchable:w=!1,searchLabel:z,emptyLabel:M,format:P,name:k,size:E,color:I,density:L,readOnly:N=!1,disabled:V=!1,...F},R){const B=n(),W=E??B.size??"md",q=I??B.color??"primary",A=L??B.density??"default",D=r(),G=z??D.search,H=M??D.empty,[J,K]=t.useState(m??[]),Q=h??J,[U,X]=t.useState(j??!1),Y=x??U,[Z,$]=t.useState(""),_=o(Z),ee=t.useMemo(()=>flatten(i),[i]),le=t.useMemo(()=>""===_?i:filterTree(i,_),[i,_]),te=""!==_,[ne,re]=t.useState(v??[]),ae=t.useMemo(()=>te?branchIds(le):void 0,[te,le])??b??ne,setOpen=e=>{e&&(V||N)||(void 0===x&&X(e),e||$(""),C?.(e))},commit=e=>{void 0===h&&K(e),u?.(e)},isSelectable=e=>!e.disabled&&(e.selectable??(!(e.children&&e.children.length>0)||g)),ie=Q.map(e=>ee.get(e)).filter(e=>void 0!==e),oe=0===ie.length?O??"":P?P(ie):ie.map((l,n)=>e(t.Fragment,{children:[0===n?null:", ",l.label]},l.id));return l(a,{...F,size:W,color:q,density:A,readOnly:N,disabled:V,triggerRef:R,display:oe,empty:0===ie.length,clearable:S,onClear:()=>commit([]),open:Y,onOpenChange:setOpen,labels:D,name:k,formValue:p?Q:Q[0]??"",children:e("div",{className:"flex max-h-80 w-64 flex-col gap-1.5 overflow-hidden",children:[w?l(c,{size:W,color:q,density:A,variant:"ghost",fullWidth:!0,placeholder:G,"aria-label":G,value:Z,onChange:e=>$(e.target.value)}):null,l("div",{className:"min-h-0 flex-1 overflow-y-auto overscroll-contain",children:0===le.length?l("p",{className:s("m-0 px-1.5 py-1 text-(--plass-muted-fg)",d[W]),children:H}):l(f,{items:le,size:W,color:q,density:A,selection:p?"multiple":"single",selected:Q,onSelectedChange:e=>{if(!p){const l=1===e.length?ee.get(e[0]):void 0;if(!l||!isSelectable(l))return;return commit([l.id]),void((T??!0)&&setOpen(!1))}const l=e.filter(e=>{const l=ee.get(e);return void 0!==l&&isSelectable(l)});(l.length!==Q.length||l.some((e,l)=>e!==Q[l]))&&(commit(l),T&&setOpen(!1))},expanded:ae,onExpandedChange:e=>{te||(void 0===b&&re(e),y?.(e))}})})]})})});

package/dist/components/typography/PlTypography.js

@@ -1 +1 @@
-"use client";import*as e from"react";import{useRender as t}from"@base-ui/react/use-render";const r={h1:"text-[1.875rem]/[2.25rem] tracking-[-0.02em]",h2:"text-[1.5rem]/[1.875rem] tracking-[-0.015em]",h3:"text-[1.25rem]/[1.625rem] tracking-[-0.01em]",h4:"text-[1.0625rem]/[1.5rem]",h5:"text-[0.9375rem]/[1.375rem]",h6:"text-[0.8125rem]/[1.25rem]",lead:"text-[1.0625rem]/[1.75rem]",body:"text-[0.8125rem]/[1.375rem]",caption:"text-[0.75rem]/[1.125rem]",overline:"text-[0.6875rem]/[1rem] tracking-[0.08em] uppercase"},m={h1:"semibold",h2:"semibold",h3:"semibold",h4:"semibold",h5:"semibold",h6:"semibold",lead:"regular",body:"regular",caption:"regular",overline:"medium"},l={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",lead:"p",body:"p",caption:"span",overline:"span"},n=new Set(["caption","overline"]),o={h1:"mb-4",h2:"mb-3.5",h3:"mb-3",h4:"mb-2.5",h5:"mb-2",h6:"mb-2",lead:"mb-4",body:"mb-3",caption:"mb-2",overline:"mb-2"},a={regular:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},s={start:"text-start",center:"text-center",end:"text-end",justify:"text-justify"};function clampClasses(e){return 1===e?"block truncate":"line-clamp-(--p-lines)"}export const PlTypography=/* @__PURE__ */e.forwardRef(function PlTypography({level:i="body",color:c,weight:h,align:d,lines:p,gutter:b=!1,render:u,className:x,style:f,children:g,...y},v){const k=p&&p>=1?Math.floor(p):void 0,j=[r[i],a[h??m[i]],d?s[d]:"",k?clampClasses(k):"",b?o[i]:"",c?"text-(--p-accent)":n.has(i)?"text-(--plass-muted-fg)":"text-(--plass-fg)",x??""].filter(Boolean).join(" ");return t({render:u??e.createElement(l[i]),ref:v,props:{className:j,style:c||k&&k>1?{...c?{"--p-accent":`var(--plass-${c}-accent)`}:null,...k&&k>1?{"--p-lines":k}:null,...f}:f,children:g,...y}})});
+"use client";import*as e from"react";import{useRender as t}from"@base-ui/react/use-render";const r={h1:"text-[1.875rem]/[2.25rem] tracking-[-0.02em]",h2:"text-[1.5rem]/[1.875rem] tracking-[-0.015em]",h3:"text-[1.25rem]/[1.625rem] tracking-[-0.01em]",h4:"text-[1.0625rem]/[1.5rem]",h5:"text-[0.9375rem]/[1.375rem]",h6:"text-[0.8125rem]/[1.25rem]",lead:"text-[1.0625rem]/[1.75rem]",body:"text-[0.8125rem]/[1.375rem]",caption:"text-[0.75rem]/[1.125rem]",overline:"text-[0.6875rem]/[1rem] tracking-[0.08em] uppercase"},m={h1:"semibold",h2:"semibold",h3:"semibold",h4:"semibold",h5:"semibold",h6:"semibold",lead:"regular",body:"regular",caption:"regular",overline:"medium"},l={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",lead:"p",body:"p",caption:"span",overline:"span"},n=new Set(["caption","overline"]),o={h1:"mb-4",h2:"mb-3.5",h3:"mb-3",h4:"mb-2.5",h5:"mb-2",h6:"mb-2",lead:"mb-4",body:"mb-3",caption:"mb-2",overline:"mb-2"},a={regular:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},s={start:"text-start",center:"text-center",end:"text-end",justify:"text-justify"};function clampClasses(e){return 1===e?"block truncate":"line-clamp-(--p-lines)"}export const PlTypography=/* @__PURE__ */e.forwardRef(function PlTypography({level:i="body",color:c,weight:h,align:d,lines:p,gutter:b=!1,render:u,className:x,style:f,children:g,...y},v){const k=p&&p>=1?Math.floor(p):void 0,j=["m-0",r[i],a[h??m[i]],d?s[d]:"",k?clampClasses(k):"",b?o[i]:"",c?"text-(--p-accent)":n.has(i)?"text-(--plass-muted-fg)":"text-(--plass-fg)",x??""].filter(Boolean).join(" ");return t({render:u??e.createElement(l[i]),ref:v,props:{className:j,style:c||k&&k>1?{...c?{"--p-accent":`var(--plass-${c}-accent)`}:null,...k&&k>1?{"--p-lines":k}:null,...f}:f,children:g,...y}})});

package/dist/components/window-pane/PlWindowPane.d.ts

@@ -74,8 +74,8 @@ export interface PlWindowPaneProps extends Omit<React.ComponentPropsWithoutRef<'
      *
      * What being in front looks like is the system's: coloured traffic lights on
      * macOS against grey ones, an accent title bar and an accent border on
-     * Windows 10, a tinted header bar on GNOME — and, on all four, a window one
-     * step further off the page than the ones behind it.
+     * Windows 10, a tinted header bar on GNOME — and, on every one of them, a
+     * window one step further off the page than the ones behind it.
      */
     active?: boolean;
     /**
@@ -156,7 +156,7 @@ export interface PlWindowPaneProps extends Omit<React.ComponentPropsWithoutRef<'
     children?: React.ReactNode;
 }
 /**
- * A window, drawn the way one of four systems draws it, with anything at all
+ * A window, drawn the way one of eight systems draws it, with anything at all
  * inside it.
  *
  * It is not a real window and does not pretend to be one: there is no desktop,

package/dist/internal/animate.d.ts

@@ -171,31 +171,6 @@ export interface AnimationRun {
      */
     handlers: React.HTMLAttributes<HTMLElement>;
 }
-/**
- * Starts, restarts and holds an animation.
- *
- * Two things here are less obvious than they look.
- *
- * **Waiting is `animation-play-state: paused`, not a second class.** An element
- * that has not been triggered yet has to already look like its own first frame,
- * or a `visible` fade would be fully drawn until it scrolled into view and then
- * blink out to start. With `fill-mode: both` a paused animation shows exactly
- * that frame, so waiting and running are one animation in two states rather
- * than two states to keep in step.
- *
- * **Restarting reaches for the DOM.** There is no way to rewind a CSS animation
- * from React: re-rendering with the same class changes nothing, and a `key`
- * would restart the animation by unmounting the children, taking their state
- * with it. Clearing `animation-name`, reading a layout property to force the
- * style to settle, and putting it back is the one move that rewinds the element
- * and leaves everything inside it alone.
- *
- * **`visible` is measured rather than observed.** Two observers report and
- * neither decides: what they say is that the view has moved, and the answer is
- * then read off the element's own resting box. An `IntersectionObserver` sees
- * the element where its first frame is holding it, which for a slide is a
- * screen from where it lives, so the box it reports on is the wrong box.
- */
 export declare function useAnimationRun({ trigger, play, once, threshold, paused, infinite, nonce }: AnimationRunOptions): AnimationRun;
 export interface StaggerPosition extends Required<PlassAnimateStaggerProps> {
     index: number;

package/dist/internal/animate.js

@@ -1 +1 @@
-import*as e from"react";import{cx as t}from"./styles.js";export const animationClasses={fade:"plass-anim-fade",grow:"plass-anim-scale",slide:"plass-anim-slide",zoom:"plass-anim-scale",rotate:"plass-anim-rotate",blink:"plass-anim-blink",reveal:"plass-anim-reveal"};export const animBaseClass="plass-anim";export function lengthValue(e){return"number"==typeof e?`${e}px`:e}export function repeatValue(e){return"infinite"===e?"infinite":String(e)}export function isInfinite(e){return"infinite"===e}export function directionValue(e,t){return"out"===e?t?"alternate-reverse":"reverse":t?"alternate":"normal"}export const defaultViewRange="entry 0% cover 45%";export function animationSlots(e){const t={"--p-anim-duration":`${e.duration}ms`,"--p-anim-delay":`${e.delay}ms`,"--p-anim-repeat":repeatValue(e.repeat),"--p-anim-direction":directionValue(e.mode??"in",e.alternate)};return e.easing&&(t["--p-anim-ease"]=e.easing),"view"===e.timeline&&(t["--p-anim-timeline"]="view()",t["--p-anim-range"]=e.range??defaultViewRange),void 0!==e.opacity&&(t["--p-anim-opacity"]=String(e.opacity)),void 0!==e.scale&&(t["--p-anim-scale"]=String(e.scale)),void 0!==e.x&&(t["--p-anim-x"]=e.x),void 0!==e.y&&(t["--p-anim-y"]=e.y),void 0!==e.angle&&(t["--p-anim-angle"]=e.angle),void 0!==e.angleTo&&(t["--p-anim-angle-to"]=e.angleTo),void 0!==e.clip&&(t["--p-anim-clip"]=e.clip),t}export function revealClip(e){switch(e){case"top":return"inset(0 0 100% 0)";case"bottom":return"inset(100% 0 0 0)";case"right":return"inset(0 0 0 100%)";default:return"inset(0 100% 0 0)"}}export function slideOffsets(e,t){const n=lengthValue(t),r="number"==typeof t?-t+"px":`calc(-1 * ${n})`;switch(e){case"top":return{x:"0px",y:r};case"bottom":return{x:"0px",y:n};case"left":return{x:r,y:"0px"};default:return{x:n,y:"0px"}}}function viewportRect(){const e=document.documentElement;return new DOMRect(0,0,e.clientWidth,e.clientHeight)}function holds(e,t){return null!==e&&t instanceof Node&&e.contains(t)}export function useAnimationRun({trigger:t,play:n,once:r,threshold:i,paused:a,infinite:o,nonce:s}){const l=e.useRef(null),[c,u]=e.useState("mount"===t),[m,p]=e.useState(0),f=e.useCallback(()=>{u(!0),p(e=>e+1)},[]);e.useLayoutEffect(()=>{const e=l.current;if(!e||0===m)return;const t=[e];for(const n of e.querySelectorAll(".plass-anim, .plass-marquee-track"))n.closest("[data-plass-animation]")===e&&t.push(n);for(const e of t)e.style.animationName="none";e.offsetWidth;for(const e of t)e.style.animationName=""},[m]);const d=e.useRef("mount"!==t);e.useEffect(()=>{d.current=!c},[c]),e.useEffect(()=>{if("visible"!==t)return;const e=l.current;if(!e||"undefined"==typeof IntersectionObserver)return void u(!0);const n=[],a=e.parentElement;let o=a?null:viewportRect();const check=()=>{if(!o)return;const t=function visibleShare(e,t){const n=e.width*e.height;if(n<=0)return 0;const r=Math.min(e.right,t.right)-Math.max(e.left,t.left),i=Math.min(e.bottom,t.bottom)-Math.max(e.top,t.top);return Math.max(0,r)*Math.max(0,i)/n}(function restingRect(e,t){if(!t)return e.getBoundingClientRect();const n=e.style.animationName;e.style.animationName="none";const r=e.getBoundingClientRect();return e.style.animationName=n,r}(e,d.current),o);if(t>0&&t>=i){if(f(),r)for(const e of n)e.disconnect()}else r||u(!1)},s=function measureSteps(e){const t=Array.from({length:21},(e,t)=>t/20);return e>0&&e<1?[...t,e]:t}(i);if(a){const e=new IntersectionObserver(([e])=>{o=function clipRect(e){const t=e.boundingClientRect;return t.width*t.height>0?e.intersectionRect:e.rootBounds??viewportRect()}(e),check()},{threshold:s});n.push(e),e.observe(a)}const c=new IntersectionObserver(check,{threshold:s});return n.push(c),c.observe(e),()=>{for(const e of n)e.disconnect()}},[t,r,i,f]);const g=e.useRef(s);e.useEffect(()=>{Object.is(s,g.current)||(g.current=s,f())},[s,f]),e.useEffect(()=>{"manual"===t&&(n?f():u(!1))},[t,n,f]);const h="hover"===t?{onPointerEnter:f,onFocus:e=>{holds(l.current,e.relatedTarget)||f()},onPointerLeave:()=>{o&&u(!1)},onBlur:e=>{o&&!holds(l.current,e.relatedTarget)&&u(!1)}}:{};return{ref:e.useCallback(e=>{l.current=e},[]),state:c&&!a?"running":"paused",started:c,runs:m,handlers:h}}export function staggerSlots(e,{index:t,count:n,stagger:r,durationStep:i,reverse:a}){const o=a?n-1-t:t;return{...e,delay:e.delay+o*r,duration:Math.max(0,e.duration+o*i)}}export function animateChildren(n,r,i){const a=e.Children.toArray(n);return a.map((n,o)=>{const s=i(o,a.length);if(!e.isValidElement(n))return e.createElement("span",{key:o,className:r,style:s},n);const l=n.props;return e.cloneElement(n,{className:t(r,l.className),style:{...s,...l.style}})})}export function useAnimateElement(e){const{effect:t,trigger:n,play:r,once:i,threshold:a,paused:o,infinite:s,nonce:l,stagger:c=0,durationStep:u=0,reverse:m=!1,origin:p,children:f,...d}=e,g=useAnimationRun({trigger:"view"===d.timeline?"mount":n,play:r,once:i,threshold:a,paused:o,infinite:s,nonce:l}),h=t?`plass-anim ${animationClasses[t]}`:"",y=0!==c&&null!==t,v=void 0===p?null:{transformOrigin:p};return{ref:g.ref,className:y?"":h,style:{...v,...y?null:animationSlots(d),"--p-anim-state":g.state},props:{...g.handlers,"data-plass-animation":t??void 0,"data-state":g.state},children:y?animateChildren(f,h,(e,t)=>({...v,...animationSlots(staggerSlots(d,{index:e,count:t,stagger:c,durationStep:u,reverse:m}))})):f}}
+import*as e from"react";import{cx as t}from"./styles.js";export const animationClasses={fade:"plass-anim-fade",grow:"plass-anim-scale",slide:"plass-anim-slide",zoom:"plass-anim-scale",rotate:"plass-anim-rotate",blink:"plass-anim-blink",reveal:"plass-anim-reveal"};export const animBaseClass="plass-anim";export function lengthValue(e){return"number"==typeof e?`${e}px`:e}export function repeatValue(e){return"infinite"===e?"infinite":String(e)}export function isInfinite(e){return"infinite"===e}export function directionValue(e,t){return"out"===e?t?"alternate-reverse":"reverse":t?"alternate":"normal"}export const defaultViewRange="entry 0% cover 45%";export function animationSlots(e){const t={"--p-anim-duration":`${e.duration}ms`,"--p-anim-delay":`${e.delay}ms`,"--p-anim-repeat":repeatValue(e.repeat),"--p-anim-direction":directionValue(e.mode??"in",e.alternate)};return e.easing&&(t["--p-anim-ease"]=e.easing),"view"===e.timeline&&(t["--p-anim-timeline"]="view()",t["--p-anim-range"]=e.range??defaultViewRange),void 0!==e.opacity&&(t["--p-anim-opacity"]=String(e.opacity)),void 0!==e.scale&&(t["--p-anim-scale"]=String(e.scale)),void 0!==e.x&&(t["--p-anim-x"]=e.x),void 0!==e.y&&(t["--p-anim-y"]=e.y),void 0!==e.angle&&(t["--p-anim-angle"]=e.angle),void 0!==e.angleTo&&(t["--p-anim-angle-to"]=e.angleTo),void 0!==e.clip&&(t["--p-anim-clip"]=e.clip),t}export function revealClip(e){switch(e){case"top":return"inset(0 0 100% 0)";case"bottom":return"inset(100% 0 0 0)";case"right":return"inset(0 0 0 100%)";default:return"inset(0 100% 0 0)"}}export function slideOffsets(e,t){const n=lengthValue(t),r="number"==typeof t?-t+"px":`calc(-1 * ${n})`;switch(e){case"top":return{x:"0px",y:r};case"bottom":return{x:"0px",y:n};case"left":return{x:r,y:"0px"};default:return{x:n,y:"0px"}}}function viewportRect(){const e=document.documentElement;return new DOMRect(0,0,e.clientWidth,e.clientHeight)}function holds(e,t){return null!==e&&t instanceof Node&&e.contains(t)}const n="data-plass-rewind";export function useAnimationRun({trigger:t,play:r,once:i,threshold:a,paused:o,infinite:s,nonce:l}){const c=e.useRef(null),[u,m]=e.useState("mount"===t),[p,f]=e.useState(0),d=e.useCallback(()=>{m(!0),f(e=>e+1)},[]);e.useLayoutEffect(()=>{const e=c.current;if(!e||0===p)return;const t=[e];for(const n of e.querySelectorAll(".plass-anim, .plass-marquee-track"))n.closest("[data-plass-animation]")===e&&t.push(n);e.setAttribute(n,"");for(const e of t)e.style.animationName="none";e.offsetWidth;for(const e of t)e.style.animationName="";e.removeAttribute(n)},[p]);const g=e.useRef("mount"!==t);e.useEffect(()=>{g.current=!u},[u]),e.useEffect(()=>{if("visible"!==t)return;const e=c.current;if(!e||"undefined"==typeof IntersectionObserver)return void m(!0);const n=[],r=e.parentElement;let o=r?null:viewportRect();const check=()=>{if(!o)return;const t=function visibleShare(e,t){const n=e.width*e.height;if(n<=0)return 0;const r=Math.min(e.right,t.right)-Math.max(e.left,t.left),i=Math.min(e.bottom,t.bottom)-Math.max(e.top,t.top);return Math.max(0,r)*Math.max(0,i)/n}(function restingRect(e,t){if(!t)return e.getBoundingClientRect();const n=e.style.animationName;e.style.animationName="none";const r=e.getBoundingClientRect();return e.style.animationName=n,r}(e,g.current),o);if(t>0&&t>=a){if(d(),i)for(const e of n)e.disconnect()}else i||m(!1)},s=function measureSteps(e){const t=Array.from({length:21},(e,t)=>t/20);return e>0&&e<1?[...t,e]:t}(a);if(r){const e=new IntersectionObserver(([e])=>{o=function clipRect(e){const t=e.boundingClientRect;return t.width*t.height>0?e.intersectionRect:e.rootBounds??viewportRect()}(e),check()},{threshold:s});n.push(e),e.observe(r)}const l=new IntersectionObserver(check,{threshold:s});return n.push(l),l.observe(e),()=>{for(const e of n)e.disconnect()}},[t,i,a,d]);const h=e.useRef(l);e.useEffect(()=>{Object.is(l,h.current)||(h.current=l,d())},[l,d]),e.useEffect(()=>{"manual"===t&&(r?d():m(!1))},[t,r,d]);const y="hover"===t?{onPointerEnter:d,onFocus:e=>{holds(c.current,e.relatedTarget)||d()},onPointerLeave:()=>{s&&m(!1)},onBlur:e=>{s&&!holds(c.current,e.relatedTarget)&&m(!1)}}:{};return{ref:e.useCallback(e=>{c.current=e},[]),state:u&&!o?"running":"paused",started:u,runs:p,handlers:y}}export function staggerSlots(e,{index:t,count:n,stagger:r,durationStep:i,reverse:a}){const o=a?n-1-t:t;return{...e,delay:e.delay+o*r,duration:Math.max(0,e.duration+o*i)}}export function animateChildren(n,r,i){const a=e.Children.toArray(n);return a.map((n,o)=>{const s=i(o,a.length);if(!e.isValidElement(n))return e.createElement("span",{key:o,className:r,style:s},n);const l=n.props;return e.cloneElement(n,{className:t(r,l.className),style:{...s,...l.style}})})}export function useAnimateElement(e){const{effect:t,trigger:n,play:r,once:i,threshold:a,paused:o,infinite:s,nonce:l,stagger:c=0,durationStep:u=0,reverse:m=!1,origin:p,children:f,...d}=e,g=useAnimationRun({trigger:"view"===d.timeline?"mount":n,play:r,once:i,threshold:a,paused:o,infinite:s,nonce:l}),h=t?`plass-anim ${animationClasses[t]}`:"",y=0!==c&&null!==t,v=void 0===p?null:{transformOrigin:p};return{ref:g.ref,className:y?"":h,style:{...v,...y?null:animationSlots(d),"--p-anim-state":g.state},props:{...g.handlers,"data-plass-animation":t??void 0,"data-state":g.state},children:y?animateChildren(f,h,(e,t)=>({...v,...animationSlots(staggerSlots(d,{index:e,count:t,stagger:c,durationStep:u,reverse:m}))})):f}}

package/dist/internal/chart-frame.d.ts

@@ -261,23 +261,6 @@ interface DataTableProps {
     format: (value: number) => string;
     locale?: string;
 }
-/**
- * The chart, as a table, for the readers a drawing does not reach.
- *
- * Not an option and not a toggle. A tooltip that is the only way to a number
- * gates that number behind a pointer, and an SVG with an `aria-label` on it
- * says "revenue by month" and then says nothing else at all. This is the same
- * data in the one form every assistive technology already reads, so the picture
- * is free to be a picture.
- *
- * It is clipped rather than `display: none`, for the reason `srOnlyClasses`
- * gives: the second one takes it off the accessibility tree along with the
- * screen, which would leave the chart exactly as mute as before.
- *
- * Memoised, because it is a row for every category and none of it changes when
- * the pointer or a key moves the active column, which re-renders the chart
- * around it every time.
- */
 declare const ChartDataTable: React.MemoExoticComponent<({ id, caption, corner, categories, series, values, format, locale }: DataTableProps) => React.JSX.Element>;
 interface SurfaceProps extends Omit<PlBoxProps, 'children'> {
     legend: React.ReactNode;
@@ -334,6 +317,8 @@ export interface CartesianLayout {
     visible: readonly boolean[];
     /** And what colour each one is, by its original index. */
     colors: readonly string[];
+    /** Which of them are drawn as a dashed line, in the same order. */
+    dashed: readonly boolean[];
     scale: ValueScale;
     band: BandScale;
     /** Bars run along the category axis rather than across it. */

package/dist/internal/chart-frame.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as t,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{PlBox as n}from"../components/box/PlBox.js";import{bandScale as s,categoryAt as i,categoryCount as r,categoriesAreDates as o,categoryExtent as c,chartFontSizes as d,compactNumber as u,extentOf as h,fitCategoryLabels as m,fitsLast as p,formatCategory as f,formatTimeTicks as x,markerRadii as g,plotHeights as v,seriesColor as b,showsTick as y,textWidth as k,tickStride as w,toValues as M,timeScale as C,valueScale as N,writeChartValue as S}from"./chart.js";import{useDefaults as z}from"./defaults.js";import{usePlElementSize as P}from"../hooks/usePlElementSize.js";import{useLabels as A}from"./labels.js";import{cx as j,glassClasses as B,hasContent as W,metaTextClasses as _,srOnlyClasses as T,transitionClasses as L}from"./styles.js";const $=[];function useMeasuredWidth(e){return P(e)?.width??0}export const markTransitionClasses=["[transition:opacity_var(--plass-duration)_var(--plass-ease),","r_var(--plass-duration)_var(--plass-ease),","scale_var(--plass-duration)_var(--plass-ease)]"].join("");function useVisibility(e){const[t,l]=a.useState(()=>{const t=new Set;return e.forEach((e,l)=>{e.hidden&&t.add(l)}),t}),[n,s]=a.useState(null),i=a.useCallback(e=>{l(t=>{const l=new Set(t);return l.has(e)?l.delete(e):l.add(e),l})},[]);return{visible:e.map((e,l)=>!t.has(l)),hovered:n,toggle:i,setHovered:s}}const I={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse rtl:flex-row",right:"flex-row rtl:flex-row-reverse"},R={start:"justify-start",center:"justify-center",end:"justify-end"};function ChartLegendBar({series:a,colors:n,options:s,visibility:i,size:r,values:o,swatch:c}){const d=!1!==s.interactive,u="left"===s.side||"right"===s.side;return e("ul",{className:j("flex list-none flex-wrap items-center gap-x-3 gap-y-1 p-0",u?"min-w-0 flex-col items-start":"",R[s.align??"center"],_[r]),children:a.map((a,s)=>{const r=i.visible[s],u=null!==i.hovered&&i.hovered!==s,h=a.name??`${s+1}`,m=r?n[s]:`color-mix(in oklab, ${n[s]} 40%, transparent)`,p=l(t,{children:[e("span",c?{"aria-hidden":"true",className:"flex size-2.5 shrink-0 items-center justify-center",children:c(s,m)}:{"aria-hidden":"true",className:`size-2.5 shrink-0 rounded-[0.1875rem] ${L}`,style:{backgroundColor:m}}),e("span",{className:"min-w-0 truncate",children:h}),o?.[s]?e("span",{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:o[s]}):null]});return e("li",{className:"min-w-0",children:d?e("button",{type:"button","aria-pressed":r,onClick:()=>i.toggle(s),onPointerEnter:()=>i.setHovered(s),onPointerLeave:()=>i.setHovered(null),onFocus:()=>i.setHovered(s),onBlur:()=>i.setHovered(null),className:j("flex min-w-0 cursor-pointer items-center gap-1.5 rounded-(--plass-radius-xs)","px-1 py-0.5 text-(--plass-fg)","[transition-property:background-color,color,opacity]","[transition-duration:var(--plass-duration)]","[transition-timing-function:var(--plass-ease)]","hover:bg-(--p-soft)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-1",r?"":"text-(--plass-muted-fg) line-through",u?"opacity-55":""),children:p}):e("span",{className:j("flex min-w-0 items-center gap-1.5 px-1 py-0.5 text-(--plass-fg)",r?"":"text-(--plass-muted-fg) line-through"),children:p})},a.name??s)})})}function ChartScaleLegend({steps:a,from:n,to:s,middle:i,align:r,vertical:o,size:c}){return e("div",{className:j("flex",o?"":R[r]),children:l("div",{className:j("grid grid-cols-[auto_auto_auto] items-center gap-x-2",_[c]),children:[e("span",{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:n}),e("span",{"aria-hidden":"true",className:j("flex h-2.5 overflow-hidden rounded-[0.1875rem]",o?"w-20":"w-24"),children:a.map(t=>e("span",{className:"h-full flex-1",style:{backgroundColor:t}},t))}),e("span",{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:s}),i?l(t,{children:[e("span",{}),e("span",{className:"text-center tabular-nums text-(--plass-muted-fg)",children:i}),e("span",{})]}):null]})})}function ChartTooltipPanel({heading:t,items:a,x:n,y:s,flip:i,size:r}){return l("div",{"data-plass-tooltip":"",className:j("pointer-events-none absolute z-10 max-w-56 min-w-24","rounded-(--plass-radius-sm) border p-2",B,"bg-(--plass-glass-press) [border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]",_[r]),style:i?{right:`calc(100% - ${n}px + 10px)`,top:s}:{left:n+10,top:s},children:[e("div",{className:"mb-1 font-medium text-(--plass-fg)",children:t}),e("ul",{className:"flex list-none flex-col gap-0.5 p-0",children:a.map(t=>l("li",{className:"flex items-center gap-1.5",children:[e("span",{"aria-hidden":"true",className:"size-2 shrink-0 rounded-[0.125rem]",style:{backgroundColor:t.color}}),t.name?e("span",{className:"min-w-0 flex-1 truncate text-(--plass-muted-fg)",children:t.name}):null,e("span",{className:"ms-auto shrink-0 font-medium tabular-nums text-(--plass-fg)",children:t.label??t.formatted})]},t.seriesIndex))})]})}function ChartStatus({heading:n,items:s}){return e("span",{role:"status","aria-live":"polite",className:T,children:0===s.length?null:l(t,{children:[W(n)?l(t,{children:[n,", "]}):null,s.map((e,t)=>l(a.Fragment,{children:[t>0?", ":null,e.name?`${e.name}: `:null,e.label??e.formatted]},e.seriesIndex))]})})}const V=/* @__PURE__ */a.memo(function ChartDataTable({id:t,caption:a,corner:n,categories:s,series:i,values:r,format:o,locale:c}){return l("table",{id:t,className:T,children:[a?e("caption",{children:a}):null,e("thead",{children:l("tr",{children:[e("th",{scope:"col",children:n??""}),i.map((t,l)=>e("th",{scope:"col",children:t.name??l+1},t.name??l))]})}),e("tbody",{children:s.map((t,a)=>l("tr",{children:[e("th",{scope:"row",children:f(t,c)}),i.map((t,l)=>{const n=r[l]?.[a];return e("td",void 0!==n?.label?{children:n.label}:{children:null==n?.value?"":o(n.value)},t.name??l)})]},a))})]})});function ChartSurface({legend:t,legendSide:a,children:s,table:i,className:r,...o}){return l(n,{...o,className:j("relative flex gap-3",I[a],r??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:s}),t,i]})}export function CartesianChart({series:t,categories:n,xAxis:p,yAxis:y,horizontal:w=!1,stacked:P=!1,includeZero:B=!0,bandRatio:W=1,inset:T=!1,headroom:L=0,markInset:I=0,xScale:R="band",marks:E,markRadius:F=24,table:H,swatch:D,scale:X,markTooltip:Y,height:Z,format:K,locale:U,label:q,legend:G,tooltip:J,empty:O,size:Q,variant:ee="ghost",padded:te=!1,className:le,children:ae,...ne}){const se=z(),ie=Q??se.size??"md",re=U??se.locale,oe=a.useRef(null),ce=useMeasuredWidth(oe),de=A(),ue=a.useId(),he=useVisibility(t),[me,pe]=a.useState(null),[fe,xe]=a.useState(null),[ge,ve]=a.useState(null),be=a.useCallback(e=>S(e,K,re),[K,re]),ye=a.useMemo(()=>M(t),[t]),ke=a.useMemo(()=>t.map((e,t)=>b(e,t)),[t]),we=r(t),Me=a.useMemo(()=>Array.from({length:we},(e,t)=>i(t,n,ye)),[we,n,ye]),Ce=ye.filter((e,t)=>he.visible[t]),Ne=h(Ce,P),Se="number"==typeof Z?Z:void 0===Z?v[ie]:null,ze=d[ie],Pe=y,Ae=p,je=X??N(Ne,{min:Pe?.min,max:Pe?.max,tickCount:Pe?.tickCount,includeZero:B}),Be="value"===R?c(Ce,n):null,We="value"===R&&o(ye,n),_e="value"!==R?null:We?C(Be,{min:Ae?.min,max:Ae?.max,tickCount:Ae?.tickCount}):N(Be,{min:Ae?.min,max:Ae?.max,tickCount:Ae?.tickCount,includeZero:!1}),Te=_e&&"unit"in _e?x(_e.ticks,_e.unit,re):null,Le=je.ticks.map((e,t)=>Pe?.tickFormat?String(Pe.tickFormat(e,t)):be(e)),$e=Ae?.tickFormat,Ie=a.useMemo(()=>Me.map((e,t)=>$e?String($e(e,t)):f(e,re)),[Me,$e,re]),Re=_e?_e.ticks.map((e,t)=>$e?String($e(We?new Date(e):e,t)):Te?.[t]??u(e,re)):Ie,Ve=Le.reduce((e,t)=>Math.max(e,k(t,ze)),0),Ee=ze+6,Fe=Pe?.hidden?0:Ve+10+(Pe?.label?Ee:0),He=(ce-(w?0:Fe)-16)/Math.max(1,we),De=null!==_e,Xe=a.useMemo(()=>m(Re,{horizontal:w,slot:He,fontSize:ze,ticks:De}),[Re,w,He,ze,De]),Ye=a.useMemo(()=>Xe.reduce((e,t)=>Math.max(e,k(t,ze)),0),[Xe,ze]),Ze=w?Ae?.hidden?0:Ye+10+(Ae?.label?Ee:0):Fe,Ke=w?Pe?.hidden?0:ze+12+(Pe?.label?Ee:0):Ae?.hidden?0:ze+12+(Ae?.label?Ee:0),Ue=(w?Ae:Pe)?.thickness??Ze,qe=(w?Pe:Ae)?.thickness??Ke,Ge=(w||_e?12:Math.max(8,Xe.length?Ye/2:8))+I,Je=g[ie]+4+L+I,Oe=Se??0,Qe={left:Ue+I,top:Je,width:Math.max(0,ce-Ue-I-Ge),height:Math.max(0,Oe-Je-qe-I)},et=w?Qe.height:Qe.width,tt=s(T?Math.max(1,we-1):we,et,W),lt=a.useCallback(e=>T?we<=1?et/2:et*e/(we-1):tt.centre(e),[T,we,et,tt]),at=a.useCallback(e=>w?Qe.left+je.fraction(e)*Qe.width:Qe.top+(1-je.fraction(e))*Qe.height,[w,Qe.left,Qe.top,Qe.width,Qe.height,je]),nt=a.useCallback((e,t)=>w?{x:at(t),y:Qe.top+lt(e)}:{x:Qe.left+lt(e),y:at(t)},[w,at,lt,Qe.left,Qe.top]),st=a.useCallback(e=>w?Qe.top+(1-(_e?.fraction(e)??0))*Qe.height:Qe.left+(_e?.fraction(e)??0)*Qe.width,[w,Qe.left,Qe.top,Qe.width,Qe.height,_e]),it=at(Math.min(Math.max(0,je.min),je.max)),rt={plot:Qe,values:ye,visible:he.visible,colors:ke,scale:je,band:tt,horizontal:w,valuePx:at,categoryPx:lt,point:nt,categoryScale:_e,categoryValuePx:st,zeroPx:it,categories:Me,format:be,size:ie},ot=E?E(rt):$,ct=!1===J?{mode:"none"}:!0===J||void 0===J?{}:J,dt=ct.mode??(E?"item":"index"),ut=null===fe?null:ot[fe]??null,ht=E?ut?ut.index:null:me,mt=E?ot.length:we,clearActive=()=>{pe(null),xe(null),ve(null)},goTo=e=>{const t=null===e?null:Math.min(mt-1,Math.max(0,e));E?xe(t):pe(t)},step=e=>{ve(null),goTo(((E?fe:me)??(e>0?-1:mt))+e)},pt=null===ht?[]:t.flatMap((e,t)=>{if(!he.visible[t]||ut&&ut.series!==t)return[];const l=ye[t]?.[ht];return l&&null!==l.value?[{seriesIndex:t,name:e.name,color:l.color??ke[t],value:l.value,formatted:be(l.value),label:l.label}]:[]}),ft=ut&&Y?Y(ut):null,xt=ft?ft.items:"item"===dt&&pt.length>1&&null!==ge?[pt.reduce((e,t)=>Math.abs(at(t.value??0)-ge)<Math.abs(at(e.value??0)-ge)?t:e)]:pt,gt=ut?ye[ut.series]?.[ut.index]?.x??n?.[ut.index]??ut.index:void 0,vt=ut?ut.x:w?at(xt[0]?.value??0):Qe.left+lt(ht??0),bt=ut?ut.y:w?Qe.top+lt(ht??0):Qe.top,yt=ut?(ut.x-Qe.left)/Math.max(1,Qe.width)>.6:(w?je.fraction(xt[0]?.value??0):lt(ht??0)/Math.max(1,et))>.6,kt=!1===G?{interactive:!1}:!0===G||void 0===G?{}:G,wt=!0===G||!1!==G&&t.length>1,Mt=kt.side??"bottom",Ct={...rt,hovered:he.hovered,activeIndex:ht,marks:ot,activeMark:ut},Nt=0===we||null===Ne||"value"===R&&null===Be;return l(ChartSurface,{...ne,size:ie,variant:ee,padded:te,className:le,legendSide:Mt,legend:wt?e(ChartLegendBar,{series:t,colors:ke,options:kt,visibility:he,size:ie,swatch:D,values:kt.showValue&&null!==ht?t.map((e,t)=>{const l=ye[t]?.[ht]?.value;return null==l?void 0:be(l)}):void 0}):null,table:Nt?null:H?.(ue)??e(V,{id:ue,caption:q,corner:Ae?.label,categories:Me,series:t,values:ye,format:be,locale:re}),children:[l("div",{ref:oe,role:"img",tabIndex:Nt?void 0:0,"aria-label":q??de.chart,"aria-describedby":Nt?void 0:ue,onPointerMove:e=>{"none"!==dt&&(E?xe(((e,t)=>{const l=oe.current;if(!l||0===ot.length)return null;const a=l.getBoundingClientRect(),n=e-a.left,s=t-a.top;let i=null,r=1/0,o=1/0;return ot.forEach((e,t)=>{const l=Math.hypot(e.x-n,e.y-s),a=void 0===e.rx?Math.max(0,l-e.r):Math.hypot(Math.max(0,Math.abs(e.x-n)-e.rx),Math.max(0,Math.abs(e.y-s)-(e.ry??e.rx)));a<=F&&(a<r||a===r&&l<o)&&(r=a,o=l,i=t)}),i})(e.clientX,e.clientY)):pe(((e,t)=>{const l=oe.current;if(!l||0===we)return null;const a=l.getBoundingClientRect(),n=w?t-a.top-Qe.top:e-a.left-Qe.left;if(n<-tt.step||n>et+tt.step)return null;const s=T?we<=1?0:Math.round(n/et*(we-1)):Math.floor(n/tt.step);return Math.min(we-1,Math.max(0,s))})(e.clientX,e.clientY)),"item"!==dt||E||ve(((e,t)=>{const l=oe.current;if(!l)return null;const a=l.getBoundingClientRect();return w?e-a.left:t-a.top})(e.clientX,e.clientY)))},onPointerLeave:clearActive,onKeyDown:"none"===dt?void 0:e=>{const t=w?"ArrowDown":"ArrowRight",l=w?"ArrowUp":"ArrowLeft";if(e.key===t)step(1);else if(e.key===l)step(-1);else if("Home"===e.key)goTo(0);else if("End"===e.key)goTo(mt-1);else{if("Escape"!==e.key)return;clearActive()}e.preventDefault()},onBlur:clearActive,className:j("relative w-full","rounded-(--plass-radius-xs)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-2"),style:{height:Se??Z},children:[Nt?e("div",{className:j("flex h-full items-center justify-center text-(--plass-muted-fg)",_[ie]),children:O??de.empty}):ce>0?l("svg",{width:ce,height:Oe||"100%",viewBox:`0 0 ${ce} ${Oe}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(ChartAxes,{plot:Qe,scale:je,band:tt,horizontal:w,inset:T,categoryPx:lt,valuePx:at,tickTexts:Le,categoryTexts:Xe,categoryScale:_e,categoryValuePx:st,valueAxis:Pe,categoryAxis:Ae,fontSize:ze,zeroPx:it}),null===ht||E||"index"!==dt||!1===ct.crosshair?null:(()=>{const t=lt(ht);return e("line",w?{x1:Qe.left,x2:Qe.left+Qe.width,y1:Qe.top+t,y2:Qe.top+t,stroke:"var(--plass-chart-baseline)",strokeWidth:1}:{x1:Qe.left+t,x2:Qe.left+t,y1:Qe.top,y2:Qe.top+Qe.height,stroke:"var(--plass-chart-baseline)",strokeWidth:1})})(),ae(Ct)]}):null,null!==ht&&xt.length>0&&"none"!==dt?ct.render?e("div",{className:"pointer-events-none absolute z-10",style:yt?{right:`calc(100% - ${vt}px + 10px)`,top:bt}:{left:vt+10,top:bt},children:ct.render({index:ht,category:gt??Me[ht],items:xt})}):e(ChartTooltipPanel,{heading:ft?ft.heading:f(gt??Me[ht],re),items:xt,x:vt,y:bt,flip:yt,size:ie}):null]}),"none"===dt?null:e(ChartStatus,{heading:null===ht?void 0:ft?.heading??f(gt??Me[ht],re),items:xt})]})}function ChartAxes({plot:a,scale:n,horizontal:s,categoryPx:i,valuePx:r,tickTexts:o,categoryTexts:c,categoryScale:d,categoryValuePx:u,valueAxis:h,categoryAxis:m,fontSize:f,zeroPx:x}){const g=!1!==h?.grid&&!h?.hidden,v=!m?.hidden&&(m?.grid??null!==d),categoryAlong=e=>d?u(d.ticks[e]):(s?a.top:a.left)+i(e),b=w(c.length,s?a.height:a.width,s?1.8*f:Math.max(...c.map(e=>k(e,f)),1)+12),M=w(n.ticks.length,s?a.width:a.height,s?Math.max(...o.map(e=>k(e,f)),1)+16:2*f),C=c.length>1?Math.abs(categoryAlong(1)-categoryAlong(0)):a.width,N=n.ticks.length>1?Math.abs(r(n.ticks[1])-r(n.ticks[0])):a.height,S=p(c.length,b,C,s?1.8*f:k(c[c.length-1]??"",f)),z=p(n.ticks.length,M,N,s?k(o[o.length-1]??"",f):1.6*f);return l("g",{children:[n.ticks.map((t,i)=>{const c=r(t),d=Math.abs(t)<1e-9;return l("g",{children:[g?e("line",s?{x1:c,x2:c,y1:a.top,y2:a.top+a.height,stroke:d?"var(--plass-chart-baseline)":"var(--plass-chart-grid)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:c,y2:c,stroke:d?"var(--plass-chart-baseline)":"var(--plass-chart-grid)",strokeWidth:1}):null,h?.hidden||!y(i,n.ticks.length,M,z)?null:e("text",s?{x:c,y:a.top+a.height+f+6,textAnchor:0===i?"start":i===n.ticks.length-1?"end":"middle",fontSize:f,fill:"var(--plass-muted-fg)",className:"tabular-nums",children:o[i]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:f,fill:"var(--plass-muted-fg)",className:"tabular-nums",children:o[i]})]},t)}),m?.hidden?null:l(t,{children:[e("line",s?{x1:x,x2:x,y1:a.top,y2:a.top+a.height,stroke:"var(--plass-chart-axis)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:x,y2:x,stroke:"var(--plass-chart-axis)",strokeWidth:1}),c.map((t,n)=>{const i=categoryAlong(n),r=y(n,c.length,b,S);return r||!s&&v?s?e("text",{x:a.left-8,y:i,textAnchor:"end",dominantBaseline:"central",fontSize:f,fill:"var(--plass-muted-fg)",className:d?"tabular-nums":void 0,children:t},n):l("g",{children:[v?e("line",{x1:i,x2:i,y1:a.top,y2:a.top+a.height,stroke:"var(--plass-chart-grid)",strokeWidth:1}):null,r?e("text",{x:i,y:a.top+a.height+f+6,textAnchor:d?0===n?"start":n===c.length-1?"end":"middle":"middle",fontSize:f,fill:"var(--plass-muted-fg)",className:d?"tabular-nums":void 0,children:t}):null]},n):null})]}),h?.label?e("text",{x:s?a.left+a.width:a.left,y:s?a.top+a.height+2*f+12:a.top-8,textAnchor:s?"end":"start",fontSize:f,fill:"var(--plass-muted-fg)",fontWeight:500,children:h.label}):null,m?.label&&!s?e("text",{x:a.left+a.width,y:a.top+a.height+2*f+12,textAnchor:"end",fontSize:f,fill:"var(--plass-muted-fg)",fontWeight:500,children:m.label}):null]})}export{V as ChartDataTable,ChartLegendBar,ChartScaleLegend,ChartStatus,ChartSurface,ChartTooltipPanel,useMeasuredWidth,useVisibility};
+"use client";import{jsx as e,Fragment as t,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{PlBox as n}from"../components/box/PlBox.js";import{bandScale as s,categoryAt as i,categoryCount as r,categoriesAreDates as o,categoryExtent as c,chartFontSizes as d,compactNumber as u,extentOf as h,fitCategoryLabels as m,fitsLast as p,formatCategory as f,formatTimeTicks as x,markerRadii as g,plotHeights as v,seriesColor as b,showsTick as y,textWidth as k,tickStride as w,toValues as M,timeScale as C,valueScale as N,writeChartValue as S}from"./chart.js";import{useDefaults as z}from"./defaults.js";import{usePlElementSize as P}from"../hooks/usePlElementSize.js";import{useLabels as A}from"./labels.js";import{cx as j,glassClasses as B,hasContent as W,metaTextClasses as _,srOnlyClasses as T,transitionClasses as $}from"./styles.js";const I=[];function useMeasuredWidth(e){return P(e)?.width??0}export const markTransitionClasses=["[transition:opacity_var(--plass-duration)_var(--plass-ease),","r_var(--plass-duration)_var(--plass-ease),","scale_var(--plass-duration)_var(--plass-ease)]"].join("");function useVisibility(e){const[t,l]=a.useState(()=>{const t=new Set;return e.forEach((e,l)=>{e.hidden&&t.add(l)}),t}),[n,s]=a.useState(null),i=a.useCallback(e=>{l(t=>{const l=new Set(t);return l.has(e)?l.delete(e):l.add(e),l})},[]);return{visible:e.map((e,l)=>!t.has(l)),hovered:n,toggle:i,setHovered:s}}const L={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse rtl:flex-row",right:"flex-row rtl:flex-row-reverse"},F={start:"justify-start",center:"justify-center",end:"justify-end"};function ChartLegendBar({series:a,colors:n,options:s,visibility:i,size:r,values:o,swatch:c}){const d=!1!==s.interactive,u="left"===s.side||"right"===s.side;return e("ul",{className:j("m-0 flex list-none flex-wrap items-center gap-x-3 gap-y-1 p-0",u?"min-w-0 flex-col items-start":"",F[s.align??"center"],_[r]),children:a.map((a,s)=>{const r=i.visible[s],u=null!==i.hovered&&i.hovered!==s,h=a.name??`${s+1}`,m=r?n[s]:`color-mix(in oklab, ${n[s]} 40%, transparent)`,p=l(t,{children:[e("span",c?{"aria-hidden":"true",className:"flex size-2.5 shrink-0 items-center justify-center",children:c(s,m)}:{"aria-hidden":"true",className:`size-2.5 shrink-0 rounded-[0.1875rem] ${$}`,style:{backgroundColor:m}}),e("span",{className:"min-w-0 truncate",children:h}),o?.[s]?e("span",{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:o[s]}):null]});return e("li",{className:"min-w-0",children:d?e("button",{type:"button","aria-pressed":r,onClick:()=>i.toggle(s),onPointerEnter:()=>i.setHovered(s),onPointerLeave:()=>i.setHovered(null),onFocus:()=>i.setHovered(s),onBlur:()=>i.setHovered(null),className:j("flex min-w-0 cursor-pointer items-center gap-1.5 rounded-(--plass-radius-xs)","px-1 py-0.5 text-(--plass-fg)","[transition-property:background-color,color,opacity]","[transition-duration:var(--plass-duration)]","[transition-timing-function:var(--plass-ease)]","hover:bg-(--p-soft)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-1",r?"":"text-(--plass-muted-fg) line-through",u?"opacity-55":""),children:p}):e("span",{className:j("flex min-w-0 items-center gap-1.5 px-1 py-0.5 text-(--plass-fg)",r?"":"text-(--plass-muted-fg) line-through"),children:p})},a.name??s)})})}function ChartScaleLegend({steps:a,from:n,to:s,middle:i,align:r,vertical:o,size:c}){return e("div",{className:j("flex",o?"":F[r]),children:l("div",{className:j("grid grid-cols-[auto_auto_auto] items-center gap-x-2",_[c]),children:[e("span",{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:n}),e("span",{"aria-hidden":"true",className:j("flex h-2.5 overflow-hidden rounded-[0.1875rem]",o?"w-20":"w-24"),children:a.map(t=>e("span",{className:"h-full flex-1",style:{backgroundColor:t}},t))}),e("span",{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:s}),i?l(t,{children:[e("span",{}),e("span",{className:"text-center tabular-nums text-(--plass-muted-fg)",children:i}),e("span",{})]}):null]})})}function ChartTooltipPanel({heading:t,items:a,x:n,y:s,flip:i,size:r}){return l("div",{"data-plass-tooltip":"",className:j("pointer-events-none absolute z-10 max-w-56 min-w-24","rounded-(--plass-radius-sm) border p-2",B,"bg-(--plass-glass-press) [border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]",_[r]),style:i?{right:`calc(100% - ${n}px + 10px)`,top:s}:{left:n+10,top:s},children:[e("div",{className:"mb-1 font-medium text-(--plass-fg)",children:t}),e("ul",{className:"m-0 flex list-none flex-col gap-0.5 p-0",children:a.map(t=>l("li",{className:"flex items-center gap-1.5",children:[e("span",{"aria-hidden":"true",className:"size-2 shrink-0 rounded-[0.125rem]",style:{backgroundColor:t.color}}),t.name?e("span",{className:"min-w-0 flex-1 truncate text-(--plass-muted-fg)",children:t.name}):null,e("span",{className:"ms-auto shrink-0 font-medium tabular-nums text-(--plass-fg)",children:t.label??t.formatted})]},t.seriesIndex))})]})}function ChartStatus({heading:n,items:s}){return e("span",{role:"status","aria-live":"polite",className:T,children:0===s.length?null:l(t,{children:[W(n)?l(t,{children:[n,", "]}):null,s.map((e,t)=>l(a.Fragment,{children:[t>0?", ":null,e.name?`${e.name}: `:null,e.label??e.formatted]},e.seriesIndex))]})})}const R=/* @__PURE__ */a.memo(function ChartDataTable({id:t,caption:a,corner:n,categories:s,series:i,values:r,format:o,locale:c}){return l("table",{id:t,className:T,children:[a?e("caption",{children:a}):null,e("thead",{children:l("tr",{children:[e("th",{scope:"col",children:n??""}),i.map((t,l)=>e("th",{scope:"col",children:t.name??l+1},t.name??l))]})}),e("tbody",{children:s.map((t,a)=>l("tr",{children:[e("th",{scope:"row",children:f(t,c)}),i.map((t,l)=>{const n=r[l]?.[a];return e("td",void 0!==n?.label?{children:n.label}:{children:null==n?.value?"":o(n.value)},t.name??l)})]},a))})]})});function ChartSurface({legend:t,legendSide:a,children:s,table:i,className:r,...o}){return l(n,{...o,className:j("relative flex gap-3",L[a],r??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:s}),t,i]})}export function CartesianChart({series:n,categories:p,xAxis:y,yAxis:w,horizontal:P=!1,stacked:B=!1,includeZero:W=!0,bandRatio:$=1,inset:L=!1,headroom:F=0,markInset:V=0,xScale:E="band",marks:H,markRadius:D=24,table:X,swatch:Y,scale:Z,markTooltip:K,height:U,format:q,locale:G,label:J,legend:O,tooltip:Q,empty:ee,size:te,variant:le="ghost",padded:ae=!1,className:ne,children:se,...ie}){const re=z(),oe=te??re.size??"md",ce=G??re.locale,de=a.useRef(null),ue=useMeasuredWidth(de),he=A(),me=a.useId(),pe=a.useId(),fe=useVisibility(n),[xe,ge]=a.useState(null),[ve,be]=a.useState(null),[ye,ke]=a.useState(null),we=a.useCallback(e=>S(e,q,ce),[q,ce]),Me=a.useMemo(()=>M(n),[n]),Ce=a.useMemo(()=>n.map((e,t)=>b(e,t)),[n]),Ne=a.useMemo(()=>n.map(e=>!0===e.dashed),[n]),Se=r(n),ze=a.useMemo(()=>Array.from({length:Se},(e,t)=>i(t,p,Me)),[Se,p,Me]),Pe=Me.filter((e,t)=>fe.visible[t]),Ae=h(Pe,B),je=a.useMemo(()=>n.flatMap((e,t)=>{if(!fe.visible[t])return[];const l=[...Me[t]??[]].reverse().find(e=>null!==e.value),a=e.name??`${t+1}`;return void 0===l?[{name:a,said:null}]:[{name:a,said:l.label??we(l.value)}]}),[n,Me,fe.visible,we]),Be="number"==typeof U?U:void 0===U?v[oe]:null,We=d[oe],_e=w,Te=y,$e=Z??N(Ae,{min:_e?.min,max:_e?.max,tickCount:_e?.tickCount,includeZero:W}),Ie="value"===E?c(Pe,p):null,Le="value"===E&&o(Me,p),Fe="value"!==E?null:Le?C(Ie,{min:Te?.min,max:Te?.max,tickCount:Te?.tickCount}):N(Ie,{min:Te?.min,max:Te?.max,tickCount:Te?.tickCount,includeZero:!1}),Re=Fe&&"unit"in Fe?x(Fe.ticks,Fe.unit,ce):null,Ve=$e.ticks.map((e,t)=>_e?.tickFormat?String(_e.tickFormat(e,t)):we(e)),Ee=Te?.tickFormat,He=a.useMemo(()=>ze.map((e,t)=>Ee?String(Ee(e,t)):f(e,ce)),[ze,Ee,ce]),De=Fe?Fe.ticks.map((e,t)=>Ee?String(Ee(Le?new Date(e):e,t)):Re?.[t]??u(e,ce)):He,Xe=Ve.reduce((e,t)=>Math.max(e,k(t,We)),0),Ye=We+6,Ze=_e?.hidden?0:Xe+10+(_e?.label?Ye:0),Ke=(ue-(P?0:Ze)-16)/Math.max(1,Se),Ue=null!==Fe,qe=a.useMemo(()=>m(De,{horizontal:P,slot:Ke,fontSize:We,ticks:Ue}),[De,P,Ke,We,Ue]),Ge=a.useMemo(()=>qe.reduce((e,t)=>Math.max(e,k(t,We)),0),[qe,We]),Je=P?Te?.hidden?0:Ge+10+(Te?.label?Ye:0):Ze,Oe=P?_e?.hidden?0:We+12+(_e?.label?Ye:0):Te?.hidden?0:We+12+(Te?.label?Ye:0),Qe=(P?Te:_e)?.thickness??Je,et=(P?_e:Te)?.thickness??Oe,tt=(P||Fe?12:Math.max(8,qe.length?Ge/2:8))+V,lt=g[oe]+4+F+V,at=Be??0,nt={left:Qe+V,top:lt,width:Math.max(0,ue-Qe-V-tt),height:Math.max(0,at-lt-et-V)},st=P?nt.height:nt.width,it=s(L?Math.max(1,Se-1):Se,st,$),rt=a.useCallback(e=>L?Se<=1?st/2:st*e/(Se-1):it.centre(e),[L,Se,st,it]),ot=a.useCallback(e=>P?nt.left+$e.fraction(e)*nt.width:nt.top+(1-$e.fraction(e))*nt.height,[P,nt.left,nt.top,nt.width,nt.height,$e]),ct=a.useCallback((e,t)=>P?{x:ot(t),y:nt.top+rt(e)}:{x:nt.left+rt(e),y:ot(t)},[P,ot,rt,nt.left,nt.top]),dt=a.useCallback(e=>P?nt.top+(1-(Fe?.fraction(e)??0))*nt.height:nt.left+(Fe?.fraction(e)??0)*nt.width,[P,nt.left,nt.top,nt.width,nt.height,Fe]),ut=ot(Math.min(Math.max(0,$e.min),$e.max)),ht={plot:nt,values:Me,visible:fe.visible,colors:Ce,dashed:Ne,scale:$e,band:it,horizontal:P,valuePx:ot,categoryPx:rt,point:ct,categoryScale:Fe,categoryValuePx:dt,zeroPx:ut,categories:ze,format:we,size:oe},mt=H?H(ht):I,pt=!1===Q?{mode:"none"}:!0===Q||void 0===Q?{}:Q,ft=pt.mode??(H?"item":"index"),xt=null===ve?null:mt[ve]??null,gt=H?xt?xt.index:null:xe,vt=H?mt.length:Se,clearActive=()=>{ge(null),be(null),ke(null)},goTo=e=>{const t=null===e?null:Math.min(vt-1,Math.max(0,e));H?be(t):ge(t)},step=e=>{ke(null),goTo(((H?ve:xe)??(e>0?-1:vt))+e)},bt=null===gt?[]:n.flatMap((e,t)=>{if(!fe.visible[t]||xt&&xt.series!==t)return[];const l=Me[t]?.[gt];return l&&null!==l.value?[{seriesIndex:t,name:e.name,color:l.color??Ce[t],value:l.value,formatted:we(l.value),label:l.label}]:[]}),yt=xt&&K?K(xt):null,kt=yt?yt.items:"item"===ft&&bt.length>1&&null!==ye?[bt.reduce((e,t)=>Math.abs(ot(t.value??0)-ye)<Math.abs(ot(e.value??0)-ye)?t:e)]:bt,wt=xt?Me[xt.series]?.[xt.index]?.x??p?.[xt.index]??xt.index:void 0,Mt=xt?xt.x:P?ot(kt[0]?.value??0):nt.left+rt(gt??0),Ct=xt?xt.y:P?nt.top+rt(gt??0):nt.top,Nt=xt?(xt.x-nt.left)/Math.max(1,nt.width)>.6:(P?$e.fraction(kt[0]?.value??0):rt(gt??0)/Math.max(1,st))>.6,St=!1===O?{interactive:!1}:!0===O||void 0===O?{}:O,zt=!0===O||!1!==O&&n.length>1,Pt=St.side??"bottom",At={...ht,hovered:fe.hovered,activeIndex:gt,marks:mt,activeMark:xt},jt=0===Se||null===Ae||"value"===E&&null===Ie;return l(ChartSurface,{...ie,size:oe,variant:le,padded:ae,className:ne,legendSide:Pt,legend:zt?e(ChartLegendBar,{series:n,colors:Ce,options:St,visibility:fe,size:oe,swatch:Y,values:St.showValue&&null!==gt?n.map((e,t)=>{const l=Me[t]?.[gt]?.value;return null==l?void 0:we(l)}):void 0}):null,table:jt?null:X?.(me)??e(R,{id:me,caption:J,corner:Te?.label,categories:ze,series:n,values:Me,format:we,locale:ce}),children:[l("div",{ref:de,role:"img",tabIndex:jt?void 0:0,"aria-label":J??he.chart,"aria-describedby":jt?void 0:pe,onPointerMove:e=>{"none"!==ft&&(H?be(((e,t)=>{const l=de.current;if(!l||0===mt.length)return null;const a=l.getBoundingClientRect(),n=e-a.left,s=t-a.top;let i=null,r=1/0,o=1/0;return mt.forEach((e,t)=>{const l=Math.hypot(e.x-n,e.y-s),a=void 0===e.rx?Math.max(0,l-e.r):Math.hypot(Math.max(0,Math.abs(e.x-n)-e.rx),Math.max(0,Math.abs(e.y-s)-(e.ry??e.rx)));a<=D&&(a<r||a===r&&l<o)&&(r=a,o=l,i=t)}),i})(e.clientX,e.clientY)):ge(((e,t)=>{const l=de.current;if(!l||0===Se)return null;const a=l.getBoundingClientRect(),n=P?t-a.top-nt.top:e-a.left-nt.left;if(n<-it.step||n>st+it.step)return null;const s=L?Se<=1?0:Math.round(n/st*(Se-1)):Math.floor(n/it.step);return Math.min(Se-1,Math.max(0,s))})(e.clientX,e.clientY)),"item"!==ft||H||ke(((e,t)=>{const l=de.current;if(!l)return null;const a=l.getBoundingClientRect();return P?e-a.left:t-a.top})(e.clientX,e.clientY)))},onPointerLeave:clearActive,onKeyDown:"none"===ft?void 0:e=>{const t=P?"ArrowDown":"ArrowRight",l=P?"ArrowUp":"ArrowLeft";if(e.key===t)step(1);else if(e.key===l)step(-1);else if("Home"===e.key)goTo(0);else if("End"===e.key)goTo(vt-1);else{if("Escape"!==e.key)return;clearActive()}e.preventDefault()},onBlur:clearActive,className:j("relative w-full","rounded-(--plass-radius-xs)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-2"),style:{height:Be??U},children:[jt?e("div",{className:j("flex h-full items-center justify-center text-(--plass-muted-fg)",_[oe]),children:ee??he.empty}):ue>0?l("svg",{width:ue,height:at||"100%",viewBox:`0 0 ${ue} ${at}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(ChartAxes,{plot:nt,scale:$e,band:it,horizontal:P,inset:L,categoryPx:rt,valuePx:ot,tickTexts:Ve,categoryTexts:qe,categoryScale:Fe,categoryValuePx:dt,valueAxis:_e,categoryAxis:Te,fontSize:We,zeroPx:ut}),null===gt||H||"index"!==ft||!1===pt.crosshair?null:(()=>{const t=rt(gt);return e("line",P?{x1:nt.left,x2:nt.left+nt.width,y1:nt.top+t,y2:nt.top+t,stroke:"var(--plass-chart-baseline)",strokeWidth:1}:{x1:nt.left+t,x2:nt.left+t,y1:nt.top,y2:nt.top+nt.height,stroke:"var(--plass-chart-baseline)",strokeWidth:1})})(),se(At)]}):null,null!==gt&&kt.length>0&&"none"!==ft?pt.render?e("div",{className:"pointer-events-none absolute z-10",style:Nt?{right:`calc(100% - ${Mt}px + 10px)`,top:Ct}:{left:Mt+10,top:Ct},children:pt.render({index:gt,category:wt??ze[gt],items:kt})}):e(ChartTooltipPanel,{heading:yt?yt.heading:f(wt??ze[gt],ce),items:kt,x:Mt,y:Ct,flip:Nt,size:oe}):null]}),jt?null:e("span",{id:pe,className:T,children:je.map((e,n)=>l(a.Fragment,{children:[n>0?", ":null,null===e.said?e.name:l(t,{children:[e.name," ",e.said]})]},n))}),"none"===ft?null:e(ChartStatus,{heading:null===gt?void 0:yt?.heading??f(wt??ze[gt],ce),items:kt})]})}function ChartAxes({plot:a,scale:n,horizontal:s,categoryPx:i,valuePx:r,tickTexts:o,categoryTexts:c,categoryScale:d,categoryValuePx:u,valueAxis:h,categoryAxis:m,fontSize:f,zeroPx:x}){const g=!1!==h?.grid&&!h?.hidden,v=!m?.hidden&&(m?.grid??null!==d),categoryAlong=e=>d?u(d.ticks[e]):(s?a.top:a.left)+i(e),b=w(c.length,s?a.height:a.width,s?1.8*f:Math.max(...c.map(e=>k(e,f)),1)+12),M=w(n.ticks.length,s?a.width:a.height,s?Math.max(...o.map(e=>k(e,f)),1)+16:2*f),C=c.length>1?Math.abs(categoryAlong(1)-categoryAlong(0)):a.width,N=n.ticks.length>1?Math.abs(r(n.ticks[1])-r(n.ticks[0])):a.height,S=p(c.length,b,C,s?1.8*f:k(c[c.length-1]??"",f)),z=p(n.ticks.length,M,N,s?k(o[o.length-1]??"",f):1.6*f);return l("g",{children:[n.ticks.map((t,i)=>{const c=r(t),d=Math.abs(t)<1e-9;return l("g",{children:[g?e("line",s?{x1:c,x2:c,y1:a.top,y2:a.top+a.height,stroke:d?"var(--plass-chart-baseline)":"var(--plass-chart-grid)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:c,y2:c,stroke:d?"var(--plass-chart-baseline)":"var(--plass-chart-grid)",strokeWidth:1}):null,h?.hidden||!y(i,n.ticks.length,M,z)?null:e("text",s?{x:c,y:a.top+a.height+f+6,textAnchor:0===i?"start":i===n.ticks.length-1?"end":"middle",fontSize:f,fill:"var(--plass-muted-fg)",className:"tabular-nums",children:o[i]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:f,fill:"var(--plass-muted-fg)",className:"tabular-nums",children:o[i]})]},t)}),m?.hidden?null:l(t,{children:[e("line",s?{x1:x,x2:x,y1:a.top,y2:a.top+a.height,stroke:"var(--plass-chart-axis)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:x,y2:x,stroke:"var(--plass-chart-axis)",strokeWidth:1}),c.map((t,n)=>{const i=categoryAlong(n),r=y(n,c.length,b,S);return r||!s&&v?s?e("text",{x:a.left-8,y:i,textAnchor:"end",dominantBaseline:"central",fontSize:f,fill:"var(--plass-muted-fg)",className:d?"tabular-nums":void 0,children:t},n):l("g",{children:[v?e("line",{x1:i,x2:i,y1:a.top,y2:a.top+a.height,stroke:"var(--plass-chart-grid)",strokeWidth:1}):null,r?e("text",{x:i,y:a.top+a.height+f+6,textAnchor:d?0===n?"start":n===c.length-1?"end":"middle":"middle",fontSize:f,fill:"var(--plass-muted-fg)",className:d?"tabular-nums":void 0,children:t}):null]},n):null})]}),h?.label?e("text",{x:s?a.left+a.width:a.left,y:s?a.top+a.height+2*f+12:a.top-8,textAnchor:s?"end":"start",fontSize:f,fill:"var(--plass-muted-fg)",fontWeight:500,children:h.label}):null,m?.label&&!s?e("text",{x:a.left+a.width,y:a.top+a.height+2*f+12,textAnchor:"end",fontSize:f,fill:"var(--plass-muted-fg)",fontWeight:500,children:m.label}):null]})}export{R as ChartDataTable,ChartLegendBar,ChartScaleLegend,ChartStatus,ChartSurface,ChartTooltipPanel,useMeasuredWidth,useVisibility};

package/dist/internal/chart-line.js

@@ -1 +1 @@
-import{jsx as l,jsxs as e}from"react/jsx-runtime";import{areaPath as r,chartFontSizes as t,dimmedByHover as o,labelledPoints as n,linePath as a,lineWidths as s,markerRadii as i,markGap as c}from"./chart.js";import{markTransitionClasses as u}from"./chart-frame.js";export function LineSeries({context:f,curve:p,filled:d,stacked:m,markers:x,valueLabels:h,connectNulls:k,gradient:v,idPrefix:$}){const{values:y,visible:b,colors:g,hovered:j,activeIndex:C,plot:L,point:N,zeroPx:W,size:z,format:B}=f,E=s[z],G=i[z],P=b.indexOf(!0),S=[],w=[];return y.forEach((l,e)=>{const r=l.map((l,e)=>w[e]??0);S.push(r),m&&b[e]&&l.forEach((l,e)=>{w[e]=(w[e]??0)+(l.value??0)})}),e("g",{children:[e("defs",{children:[v?g.map((r,t)=>e("linearGradient",{id:`${$}-stroke-${t}`,x1:"0",y1:"0",x2:"1",y2:"0",children:[l("stop",{offset:"0%",stopColor:`color-mix(in oklab, ${r} 45%, transparent)`}),l("stop",{offset:"100%",stopColor:r})]},`stroke-${t}`)):null,d&&!m?g.map((r,t)=>e("linearGradient",{id:`${$}-fill-${t}`,x1:"0",y1:"0",x2:"0",y2:"1",children:[l("stop",{offset:"0%",stopColor:`color-mix(in oklab, ${r} 28%, transparent)`}),l("stop",{offset:"100%",stopColor:`color-mix(in oklab, ${r} 2%, transparent)`})]},`fill-${t}`)):null]}),y.map((s,i)=>{if(!b[i])return null;const f=g[i],y=o(j,i,b),w=s.map((l,e)=>{if(null===l.value)return null;const r=m?S[i][e]+l.value:l.value;return N(e,r)}),A=k?w.filter(Boolean):w,I=s.map((l,e)=>null===l.value?null:m?N(e,S[i][e]):{x:N(e,l.value).x,y:W}),O=d&&m,q=n(s,h);return e("g",{opacity:y?.28:1,className:u,children:[d?l("path",{d:r(A,k?I.filter(Boolean):I,p),fill:m?`color-mix(in oklab, ${f} 70%, transparent)`:`url(#${$}-fill-${i})`,stroke:"none"}):null,O&&i!==P?l("path",{d:a(k?I.filter(Boolean):I,p),fill:"none",stroke:"var(--plass-chart-gap)",strokeWidth:c}):null,O?null:l("path",{d:a(A,p),fill:"none",stroke:v?`url(#${$}-stroke-${i})`:f,strokeWidth:E,strokeLinecap:"round",strokeLinejoin:"round"}),w.map((e,r)=>e&&("all"===x||"auto"===x&&s.length<=14||r===C)?l("circle",{cx:e.x,cy:e.y,r:r===C?G+1:G,fill:s[r].color??f,stroke:"var(--plass-chart-gap)",strokeWidth:c,className:u},r):null),"none"===h?null:w.map((e,r)=>{const o=s[r].value;return e&&null!==o&&q(r)?l("text",{x:e.x,y:e.y-G-5,textAnchor:e.x>L.left+L.width-24?"end":e.x<L.left+24?"start":"middle",fontSize:t[z],fontWeight:500,fill:"var(--plass-fg)",className:"tabular-nums",children:s[r].label??B(o)},`label-${r}`):null})]},i)})]})}
+import{jsx as l,jsxs as e}from"react/jsx-runtime";import{areaPath as r,chartFontSizes as t,dimmedByHover as o,labelledPoints as a,linePath as n,lineDash as s,lineWidths as i,markerRadii as c,markGap as u}from"./chart.js";import{markTransitionClasses as f}from"./chart-frame.js";export function LineSeries({context:p,curve:d,filled:m,stacked:x,markers:h,valueLabels:k,connectNulls:v,gradient:$,idPrefix:y}){const{values:b,visible:g,colors:j,dashed:C,hovered:L,activeIndex:N,plot:W,point:z,zeroPx:B,size:E,format:G}=p,P=i[E],S=c[E],w=g.indexOf(!0),A=[],D=[];return b.forEach((l,e)=>{const r=l.map((l,e)=>D[e]??0);A.push(r),x&&g[e]&&l.forEach((l,e)=>{D[e]=(D[e]??0)+(l.value??0)})}),e("g",{children:[e("defs",{children:[$?j.map((r,t)=>e("linearGradient",{id:`${y}-stroke-${t}`,x1:"0",y1:"0",x2:"1",y2:"0",children:[l("stop",{offset:"0%",stopColor:`color-mix(in oklab, ${r} 45%, transparent)`}),l("stop",{offset:"100%",stopColor:r})]},`stroke-${t}`)):null,m&&!x?j.map((r,t)=>e("linearGradient",{id:`${y}-fill-${t}`,x1:"0",y1:"0",x2:"0",y2:"1",children:[l("stop",{offset:"0%",stopColor:`color-mix(in oklab, ${r} 28%, transparent)`}),l("stop",{offset:"100%",stopColor:`color-mix(in oklab, ${r} 2%, transparent)`})]},`fill-${t}`)):null]}),b.map((i,c)=>{if(!g[c])return null;const p=j[c],b=o(L,c,g),D=i.map((l,e)=>{if(null===l.value)return null;const r=x?A[c][e]+l.value:l.value;return z(e,r)}),I=v?D.filter(Boolean):D,O=i.map((l,e)=>null===l.value?null:x?z(e,A[c][e]):{x:z(e,l.value).x,y:B}),q=m&&x,F=a(i,k);return e("g",{opacity:b?.28:1,className:f,children:[m?l("path",{d:r(I,v?O.filter(Boolean):O,d),fill:x?`color-mix(in oklab, ${p} 70%, transparent)`:`url(#${y}-fill-${c})`,stroke:"none"}):null,q&&c!==w?l("path",{d:n(v?O.filter(Boolean):O,d),fill:"none",stroke:"var(--plass-chart-gap)",strokeWidth:u}):null,q?null:l("path",{d:n(I,d),fill:"none",stroke:$?`url(#${y}-stroke-${c})`:p,strokeWidth:P,strokeDasharray:C[c]?s:void 0,strokeLinecap:"round",strokeLinejoin:"round"}),D.map((e,r)=>e&&("all"===h||"auto"===h&&i.length<=14||r===N)?l("circle",{cx:e.x,cy:e.y,r:r===N?S+1:S,fill:i[r].color??p,stroke:"var(--plass-chart-gap)",strokeWidth:u,className:f},r):null),"none"===k?null:D.map((e,r)=>{const o=i[r].value;return e&&null!==o&&F(r)?l("text",{x:e.x,y:e.y-S-5,textAnchor:e.x>W.left+W.width-24?"end":e.x<W.left+24?"start":"middle",fontSize:t[E],fontWeight:500,fill:"var(--plass-fg)",className:"tabular-nums",children:i[r].label??G(o)},`label-${r}`):null})]},c)})]})}

package/dist/internal/chart.d.ts

@@ -42,6 +42,15 @@ export declare const sparklineHeights: Record<PlassSize, number>;
  * enough to hold a hue at 3:1.
  */
 export declare const lineWidths: Record<PlassSize, number>;
+/**
+ * The `stroke-dasharray` of a `dashed` series: a 6px dash and a 4px gap.
+ *
+ * Fixed rather than scaled by the line's weight, and the same two numbers the
+ * Flutter build cuts its path into: a dash pattern is read as a *rhythm*, and
+ * one that stretched with the size ladder would change what the line means
+ * between an `sm` chart and an `lg` one.
+ */
+export declare const lineDash = "6 4";
 /**
  * The radius of a marker. `md` is 4, so the dot is 8px across before its ring —
  * the floor below which a marker stops being something a pointer can find.