plass-ui 1.6.0 → 1.7.0

package/dist/components/chip/PlChip.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as s,jsxs as l}from"react/jsx-runtime";import*as o from"react";import{glowPointerMove as t}from"../../internal/glow.js";import{useDefaults as r}from"../../internal/defaults.js";import{useLabels as n}from"../../internal/labels.js";import{CloseIcon as a}from"../../internal/icons.js";import{textOf as i}from"../../internal/text.js";import{chipRemoveClasses as p,controlHeightClasses as d,controlSlots as c,controlTextClasses as m,disabledClasses as g,focusRingClasses as b,forcedEdgeClasses as f,gapClasses as h,glassClasses as v,hasContent as u,iconClasses as x,paddingXClasses as j,radiusClasses as w,transitionClasses as y}from"../../internal/styles.js";const k={xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"lg"},$={solid:`text-(--p-on-solid) [background-image:var(--p-fill)] [box-shadow:var(--p-elev)] ${f}`,glass:/* @__PURE__ */[v,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--p-accent) bg-(--p-soft)"},N={solid:"[box-shadow:var(--p-elev),var(--p-lift)]",glass:"bg-(--plass-glass-press) [border-color:var(--p-line-hover)]",ghost:"bg-(--p-soft-press)"},C={solid:"hover:brightness-105 active:brightness-95",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)] active:bg-(--plass-glass-press)",ghost:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)"},I=/* @__PURE__ */["relative inline-flex max-w-full shrink-0 items-center select-none","align-middle leading-none font-medium whitespace-nowrap","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",y,x].join(" "),P=/* @__PURE__ */["flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch rounded-[inherit]",b].join(" ");export const PlChip=/* @__PURE__ */o.forwardRef(function PlChip({variant:b="glass",size:f,color:v,density:x,elevation:y=0,startIcon:z,endIcon:B,count:M,onDelete:D,deleteLabel:F,selected:L=!1,disabled:R=!1,className:q,style:A,children:E,onClick:G,onPointerMove:H,...J},K){const O=r(),Q=n(),S=i(E).trim(),T=F??(S?Q.removeItem(S):Q.remove),U=f??O.size??"md",V=v??O.color??"primary",W=x??O.density??"default",X=Boolean(G)&&!R,Y=o.useId(),Z=o.useId(),_=k[U],ee=j[W][_],se=[I,d[_],m[_],h[_],w[_],R?g[b]:$[b],!R&&L?N[b]:"",X?`plass-glow ${C[b]}`:"",X?"ps-0":ee,D?"pe-1":X?"pe-0":"",q??""].filter(Boolean).join(" "),le=l(s,{children:[z,u(E)?e("span",{id:Z,className:"min-w-0 truncate leading-[normal]",children:E}):null,B,u(M)?e("span",{className:["ms-0.5 inline-flex shrink-0 items-center justify-center rounded-full px-1.5 py-px","text-[0.85em] leading-none font-semibold tabular-nums","solid"===b?"bg-(--plass-glow-on-fill) text-(--p-on-solid)":"bg-(--p-soft-press) text-(--p-accent)"].join(" "),children:M}):null]});return l("span",{ref:K,className:se,style:{...c(V,y,b),...A},"aria-disabled":!(!R||X)||void 0,onPointerMove:t(X,H),...J,children:[X?e("button",{type:"button","aria-pressed":L,className:`${P} ${h[_]} ${ee}`,onClick:G,children:le}):le,D?e("button",{type:"button",id:Y,"aria-label":T,"aria-labelledby":void 0===F&&!S&&u(E)?`${Y} ${Z}`:void 0,disabled:R,className:p,onClick:D,children:e(a,{})}):null]})});
+"use client";import{jsx as e,Fragment as s,jsxs as l}from"react/jsx-runtime";import*as o from"react";import{FadedContext as t}from"../../internal/form.js";import{glowPointerMove as r}from"../../internal/glow.js";import{useDefaults as n}from"../../internal/defaults.js";import{useLabels as a}from"../../internal/labels.js";import{CloseIcon as i}from"../../internal/icons.js";import{textOf as d}from"../../internal/text.js";import{chipRemoveClasses as p,controlHeightClasses as c,controlSlots as m,controlTextClasses as g,disabledClasses as b,disabledLookClasses as f,focusRingClasses as h,forcedEdgeClasses as u,gapClasses as v,glassClasses as x,hasContent as j,iconClasses as w,paddingXClasses as y,radiusClasses as k,transitionClasses as $}from"../../internal/styles.js";const C={xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"lg"},N={solid:`text-(--p-on-solid) [background-image:var(--p-fill)] [box-shadow:var(--p-elev)] ${u}`,glass:/* @__PURE__ */[x,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"text-(--p-accent) bg-(--p-soft)"},I={solid:"[box-shadow:var(--p-elev),var(--p-lift)]",glass:"bg-(--plass-glass-press) [border-color:var(--p-line-hover)]",ghost:"bg-(--p-soft-press)"},P={solid:"hover:brightness-105 active:brightness-95",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)] active:bg-(--plass-glass-press)",ghost:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)"},z=/* @__PURE__ */["relative inline-flex max-w-full shrink-0 items-center select-none","align-middle leading-none font-medium whitespace-nowrap","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",$,w].join(" "),B=/* @__PURE__ */["flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch rounded-[inherit]",h,"disabled:cursor-not-allowed"].join(" ");export const PlChip=/* @__PURE__ */o.forwardRef(function PlChip({variant:h="glass",size:u,color:x,density:w,elevation:$=0,startIcon:M,endIcon:D,count:F,onDelete:L,deleteLabel:R,selected:q=!1,disabled:A=!1,className:E,style:G,children:H,onClick:J,onPointerMove:K,...O},Q){const S=n(),T=a(),U=d(H).trim(),V=R??(U?T.removeItem(U):T.remove),W=u??S.size??"md",X=x??S.color??"primary",Y=w??S.density??"default",Z=o.useContext(t),_=Boolean(J),ee=_&&!A,se=o.useId(),le=o.useId(),oe=C[W],te=y[Y][oe],re=[z,c[oe],g[oe],v[oe],k[oe],A?(Z?f:b)[h]:N[h],!A&&q?I[h]:"",ee?`plass-glow ${P[h]}`:"",_?"ps-0":te,L?"pe-1":_?"pe-0":"",E??""].filter(Boolean).join(" "),ne=l(s,{children:[M,j(H)?e("span",{id:le,className:"min-w-0 truncate leading-[normal]",children:H}):null,D,j(F)?e("span",{className:["ms-0.5 inline-flex shrink-0 items-center justify-center rounded-full px-1.5 py-px","text-[0.85em] leading-none font-semibold tabular-nums","solid"===h?"bg-(--plass-glow-on-fill) text-(--p-on-solid)":"bg-(--p-soft-press) text-(--p-accent)"].join(" "),children:F}):null]});return l("span",{ref:Q,className:re,style:{...m(X,$,h),...G},"aria-disabled":!(!A||_)||void 0,onPointerMove:r(ee,K),...O,children:[_?e("button",{type:"button",disabled:A,"aria-pressed":q,className:`${B} ${v[oe]} ${te}`,onClick:J,children:ne}):ne,L?e("button",{type:"button",id:se,"aria-label":V,"aria-labelledby":void 0===R&&!U&&j(H)?`${se} ${le}`:void 0,disabled:A,className:p,onClick:L,children:e(i,{})}):null]})});

package/dist/components/collapsible/PlCollapsible.d.ts

@@ -39,6 +39,17 @@ export interface PlCollapsibleProps extends PlassStyleProps, Omit<React.Componen
     trigger?: React.ReactElement;
     /** The chevron at the end of the header, turned to report the state. @default true */
     indicator?: boolean;
+    /**
+     * Holds the header's title and subtitle to one line each, ellipsing whatever
+     * runs past.
+     *
+     * Off, as it is on a `PlAccordionItem`: a fold's title is a heading rather
+     * than a cell, and ellipsing one costs the reader the end of it with no
+     * tooltip and no way to see it. The place for it is a header carrying a name
+     * from a database beside a control.
+     * @default false
+     */
+    truncate?: boolean;
     /** Unavailable. The trigger stops answering and the panel stays as it is. */
     disabled?: boolean;
     /**

package/dist/components/collapsible/PlCollapsible.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{useDefaults as s}from"../../internal/defaults.js";import{Collapsible as a}from"@base-ui/react/collapsible";import{ChevronIcon as n}from"../../internal/icons.js";import{cx as i,focusRingInsetClasses as r,gapClasses as p,hasContent as o,iconClasses as d,metaTextClasses as c,radiusClasses as m,sheetBodyClasses as f,sheetHeaderGapClasses as h,sheetPaddingXClasses as u,sheetPaddingYClasses as x,sheetRestClasses as b,sheetTitleClasses as g,surfaceSlots as N,transitionClasses as v}from"../../internal/styles.js";const w={default:{xs:"pt-1.5",sm:"pt-2",md:"pt-3",lg:"pt-3.5",xl:"pt-4"},compact:{xs:"pt-1",sm:"pt-1.5",md:"pt-2",lg:"pt-2.5",xl:"pt-3"}},y={default:{xs:"pb-2.5",sm:"pb-3",md:"pb-5",lg:"pb-6",xl:"pb-7"},compact:{xs:"pb-2",sm:"pb-2.5",md:"pb-3.5",lg:"pb-4",xl:"pb-5"}};export const PlCollapsible=/* @__PURE__ */t.forwardRef(function PlCollapsible({variant:t="glass",size:j,color:k,density:C,elevation:O=0,open:_,defaultOpen:P=!1,onOpenChange:z,title:F,subtitle:M,startIcon:R,action:T,trigger:U,indicator:$=!0,disabled:I=!1,padded:q=!0,hiddenUntilFound:A=!1,keepMounted:B=!1,className:D,style:E,children:G,...H},J){const K=s(),L=j??K.size??"md",Q=k??K.color??"primary",S=C??K.density??"default",V=u[S][L],W=x[S][L];return l(a.Root,{ref:J,open:_,defaultOpen:P,onOpenChange:e=>z?.(e),disabled:I,className:i("flex flex-col overflow-hidden",m[L],b[t],v,D),style:{...N(Q,O),...E},...H,children:[U?e(a.Trigger,{render:U}):l("div",{className:"flex w-full items-center",children:[l(a.Trigger,{className:i("flex min-w-0 flex-1 cursor-pointer items-center text-start",V,W,p[L],v,d,r,"hover:bg-(--p-soft)","data-[panel-open]:bg-(--p-soft) data-[panel-open]:text-(--p-accent)","disabled:cursor-not-allowed disabled:bg-transparent disabled:opacity-50"),children:[o(R)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:R}):null,l("span",{className:i("flex min-w-0 flex-1 flex-col",h[L]),children:[o(F)?e("span",{className:i("plass-title truncate font-semibold",g[L]),children:F}):null,o(M)?e("span",{className:i("truncate text-(--plass-muted-fg)",c[L]),children:M}):null]}),$?e("span",{className:i("flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","data-[panel-open]:rotate-180"),children:e(n,{})}):null]}),o(T)?e("span",{className:i("flex shrink-0 items-center",V),children:T}):null]}),e(a.Panel,{hiddenUntilFound:A,keepMounted:B,className:i("h-(--collapsible-panel-height) overflow-hidden","[transition:height_var(--plass-duration-slow)_var(--plass-ease)]","data-[starting-style]:h-0 data-[ending-style]:h-0"),children:e("div",{className:i("min-w-0 text-(--plass-muted-fg)",f[L],q?V:"",q?U?`${w[S][L]} ${y[S][L]}`:y[S][L]:""),children:G})})]})});
+"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{Collapsible as a}from"@base-ui/react/collapsible";import{ChevronIcon as n}from"../../internal/icons.js";import{cx as i,focusRingInsetClasses as r,gapClasses as o,hasContent as d,iconClasses as p,metaTextClasses as c,radiusClasses as m,sheetBodyClasses as f,sheetHeaderGapClasses as u,sheetPaddingXClasses as h,sheetPaddingYClasses as x,sheetRestClasses as b,sheetTitleClasses as g,surfaceSlots as N,transitionClasses as v}from"../../internal/styles.js";const w={default:{xs:"pt-1.5",sm:"pt-2",md:"pt-3",lg:"pt-3.5",xl:"pt-4"},compact:{xs:"pt-1",sm:"pt-1.5",md:"pt-2",lg:"pt-2.5",xl:"pt-3"}},y={default:{xs:"pb-2.5",sm:"pb-3",md:"pb-5",lg:"pb-6",xl:"pb-7"},compact:{xs:"pb-2",sm:"pb-2.5",md:"pb-3.5",lg:"pb-4",xl:"pb-5"}};export const PlCollapsible=/* @__PURE__ */l.forwardRef(function PlCollapsible({variant:l="glass",size:j,color:k,density:C,elevation:O=0,open:_,defaultOpen:P=!1,onOpenChange:$,title:z,subtitle:F,startIcon:M,action:R,trigger:T,indicator:U=!0,truncate:I=!1,disabled:q=!1,padded:A=!0,hiddenUntilFound:B=!1,keepMounted:D=!1,className:E,style:G,children:H,...J},K){const L=s(),Q=j??L.size??"md",S=k??L.color??"primary",V=C??L.density??"default",W=h[V][Q],X=x[V][Q],Y=I?"truncate":"";return t(a.Root,{ref:K,open:_,defaultOpen:P,onOpenChange:e=>$?.(e),disabled:q,className:i("flex flex-col overflow-hidden",m[Q],b[l],v,E),style:{...N(S,O),...G},...J,children:[T?e(a.Trigger,{render:T}):t("div",{className:"flex w-full items-center",children:[t(a.Trigger,{className:i("flex min-w-0 flex-1 cursor-pointer items-center text-start",W,X,o[Q],v,p,r,"hover:bg-(--p-soft)","data-[panel-open]:bg-(--p-soft) data-[panel-open]:text-(--p-accent)","disabled:cursor-not-allowed disabled:bg-transparent disabled:opacity-50"),children:[d(M)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:M}):null,t("span",{className:i("flex min-w-0 flex-1 flex-col",u[Q]),children:[d(z)?e("span",{className:i("plass-title font-semibold",Y,g[Q]),children:z}):null,d(F)?e("span",{className:i("text-(--plass-muted-fg)",Y,c[Q]),children:F}):null]}),U?e("span",{className:i("flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[panel-open]:rotate-180"),children:e(n,{})}):null]}),d(R)?e("span",{className:i("flex shrink-0 items-center",W),children:R}):null]}),e(a.Panel,{hiddenUntilFound:B,keepMounted:D,className:i("h-(--collapsible-panel-height) overflow-hidden","[transition:height_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:h-0 data-[ending-style]:h-0"),children:e("div",{className:i("min-w-0 text-(--plass-muted-fg)",f[Q],A?`${W} ${w[V][Q]} ${y[V][Q]}`:""),children:H})})]})});

package/dist/components/color-picker/PlColorPicker.d.ts

@@ -55,7 +55,9 @@ export interface PlColorPickerProps extends PlassStyleProps, Omit<React.Componen
     /** The name of what the control holds. */
     label?: React.ReactNode;
     /**
-     * Where the `label` goes — above the trigger, or in its top edge.
+     * Where the `label` goes — above the trigger, or in its top edge. `float`
+     * puts it in the edge as well: the swatch at the trigger's start is where a
+     * floating label would rest.
      * Falls back to the nearest `PlassProvider`, then to `top`.
      * @default 'top'
      */

package/dist/components/color-picker/PlColorPicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{useDefaults as l}from"../../internal/defaults.js";import{defaultPickerLabels as s}from"../../internal/calendar.js";import{PickerShell as o}from"../../internal/picker.js";import{useFieldsetDisabled as t,useFormReport as n}from"../../internal/form.js";import{CheckIcon as i}from"../../internal/icons.js";import{checkerBackground as d,clamp as c,cssColor as h,defaultSwatches as u,formatColor as f,parseColor as p,readableInk as m}from"../../internal/color.js";import{controlTextClasses as v,cx as b,focusRingClasses as g,metaTextClasses as x,radiusClasses as y,stackGapClasses as w,surfaceSlots as C}from"../../internal/styles.js";export const defaultColorPickerLabels={area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Swatches",clear:"Clear",empty:"Pick a colour"};const k={xs:"w-40",sm:"w-44",md:"w-52",lg:"w-60",xl:"w-72"},N={xs:"h-24",sm:"h-28",md:"h-32",lg:"h-40",xl:"h-48"},P={xs:"h-2.5",sm:"h-3",md:"h-3.5",lg:"h-4",xl:"h-5"},j={xs:"gap-1.5",sm:"gap-2",md:"gap-2.5",lg:"gap-3",xl:"gap-3.5"},S={xs:10,sm:12,md:14,lg:16,xl:18},_=/* @__PURE__ */["relative overflow-hidden border","[border-color:var(--plass-border)]","[box-shadow:var(--plass-gloss-glass)]"].join(" "),O=/* @__PURE__ */["pointer-events-none absolute rounded-full border-2 border-white","[box-shadow:0_0_0_1px_rgba(0,0,0,0.35),0_1px_3px_rgba(0,0,0,0.4)]"].join(" ");function fractionsOf(e){const a=e.currentTarget.getBoundingClientRect();return{x:0===a.width?0:c((e.clientX-a.left)/a.width,0,1),y:0===a.height?0:c((e.clientY-a.top)/a.height,0,1)}}function arrowStep(e){const a=e.shiftKey?10:1;switch(e.key){case"ArrowLeft":return{x:-a,y:0};case"ArrowRight":return{x:a,y:0};case"ArrowUp":return{x:0,y:a};case"ArrowDown":return{x:0,y:-a};default:return null}}function ColorPanel({hsv:r,alphaValue:l,onChange:s,text:o,onTextChange:t,withAlpha:n,swatches:u,editable:v,size:w,inert:C,invalid:$,labels:z,className:I}){const T=S[w],D=-T/2,M=h({h:r.h,s:100,v:100}),A=h(r),L=u?u.flatMap(e=>{const a=p(e);return a?[{swatch:e,parsed:a}]:[]}):[],track=e=>({onPointerDown:a=>{C||(a.currentTarget.setPointerCapture(a.pointerId),e(a))},onPointerMove:a=>{!C&&a.currentTarget.hasPointerCapture(a.pointerId)&&e(a)}}),railProps=(e,a,r,l,s)=>({role:"slider",tabIndex:C?-1:0,"aria-label":e,"aria-valuemin":0,"aria-valuemax":r,"aria-valuenow":Math.round(a),"aria-orientation":"horizontal","aria-disabled":C||void 0,"aria-invalid":$||void 0,onKeyDown:e=>{if(C)return;if("Home"===e.key||"End"===e.key)return e.preventDefault(),void s("Home"===e.key?0:1);const a=arrowStep(e);a&&(e.preventDefault(),l(a.x+a.y))}});return a("div",{className:b("flex flex-col",k[w],j[w],I),children:[e("div",{...track(e=>{const{x:a,y:o}=fractionsOf(e);s({hsv:{h:r.h,s:100*a,v:100*(1-o)},alpha:l})}),role:"slider",tabIndex:C?-1:0,"aria-label":z.area,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(r.s),"aria-valuetext":`${Math.round(r.s)}%, ${Math.round(r.v)}%`,"aria-disabled":C||void 0,"aria-invalid":$||void 0,onKeyDown:e=>{const a=arrowStep(e);!C&&a&&(e.preventDefault(),s({hsv:{h:r.h,s:c(r.s+a.x,0,100),v:c(r.v+a.y,0,100)},alpha:l}))},className:b(_,N[w],y[w],g,C?"cursor-default":"cursor-crosshair touch-none"),style:{backgroundColor:M,backgroundImage:"linear-gradient(to top, #000000, rgba(0, 0, 0, 0)), linear-gradient(to right, #ffffff, rgba(255, 255, 255, 0))"},children:e("span",{className:O,style:{width:T,height:T,left:`${r.s}%`,top:100-r.v+"%",marginLeft:D,marginTop:D,backgroundColor:A}})}),e("div",{...track(e=>s({hsv:{...r,h:360*fractionsOf(e).x},alpha:l})),...railProps(z.hue,r.h,360,e=>s({hsv:{...r,h:(r.h+2*e+360)%360},alpha:l}),e=>s({hsv:{...r,h:360*e},alpha:l})),className:b(_,P[w],"rounded-full",g,C?"cursor-default":"cursor-pointer touch-none"),style:{backgroundImage:"linear-gradient(to right, #ff0000 0%, #ffff00 16.66%, #00ff00 33.33%, #00ffff 50%, #0000ff 66.66%, #ff00ff 83.33%, #ff0000 100%)"},children:e("span",{className:O,style:{width:T,height:T,left:r.h/360*100+"%",top:"50%",marginLeft:D,marginTop:D,backgroundColor:M}})}),n?a("div",{...track(e=>s({hsv:r,alpha:fractionsOf(e).x})),...railProps(z.alpha,100*l,100,e=>s({hsv:r,alpha:c(l+e/100,0,1)}),e=>s({hsv:r,alpha:e})),className:b(_,P[w],"rounded-full",g,C?"cursor-default":"cursor-pointer touch-none"),style:d,children:[e("span",{"aria-hidden":"true",className:"absolute inset-0",style:{backgroundImage:`linear-gradient(to right, ${h(r,0)}, ${A})`}}),e("span",{className:O,style:{width:T,height:T,left:100*l+"%",top:"50%",marginLeft:D,marginTop:D,backgroundColor:h(r,l)}})]}):null,v?a("div",{className:b("flex items-center",j[w]),children:[e("span",{"aria-hidden":"true",className:"shrink-0 rounded-full border [border-color:var(--plass-border)]",style:{width:T+6,height:T+6,...d},children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:h(r,l)}})}),e("input",{type:"text",value:o,readOnly:C,spellCheck:!1,autoComplete:"off","aria-label":z.value,onChange:e=>t(e.target.value),className:b("min-w-0 flex-1 border bg-transparent px-1.5 py-1 font-mono lowercase","[border-color:var(--plass-border)]",y.xs,x[w],"text-(--plass-fg)","[outline:none] focus-visible:[outline:2px_solid_var(--p-ring)]","focus-visible:[outline-offset:0px]")})]}):null,L.length>0?e("div",{role:"group","aria-label":z.swatches,className:"grid grid-cols-8 gap-1",children:L.map(({swatch:a,parsed:o})=>{const t=f(o.hsv,o.alpha,"hex")===f(r,l,"hex");return e("button",{type:"button",disabled:C,"aria-label":a,"aria-pressed":t,onClick:()=>s(o),className:b("flex aspect-square items-center justify-center rounded-full border","[border-color:var(--plass-border)]","[transition:box-shadow_var(--plass-duration)_var(--plass-ease)]",g,"[outline:none]",C?"cursor-default":"cursor-pointer hover:[box-shadow:var(--plass-shadow-1)]","[&_svg]:size-3"),style:{backgroundColor:h(o.hsv,o.alpha)},children:t?e("span",{style:{color:m(o.hsv)},children:e(i,{})}):null},a)})}):null]})}function widthSamples(e,a){return"hex"===e?[a?"#ffffffff":"#ffffff"]:"rgb"===e?[a?"rgba(255, 255, 255, 0.55)":"rgb(255, 255, 255)"]:[a?"hsla(360, 100%, 100%, 0.55)":"hsl(360, 100%, 100%)"]}const $={h:217,s:87,v:82};export const PlColorPicker=/* @__PURE__ */r.forwardRef(function PlColorPicker({value:i,defaultValue:c="#1a58d1",onValueChange:m,format:g="hex",alpha:y=!1,swatches:k=u,inline:N=!1,editable:P=!0,label:j,labelPlacement:S,description:_,error:O,invalid:z,required:I=!1,disabled:T=!1,readOnly:D=!1,fullWidth:M=!1,clearable:A=!1,name:L,open:V,defaultOpen:q=!1,onOpenChange:B,labels:H,variant:K="glass",size:R,color:E,density:W,elevation:U=0,className:X,classNames:Y,style:F,...G},J){const Q=l(),Z=R??Q.size??"md",ee=E??Q.color??"primary",ae=W??Q.density??"default",re=r.useMemo(()=>({...defaultColorPickerLabels,...H}),[H]),[le,se]=r.useState(c),oe=i??le,[te,ne]=r.useState(q),ie=V??te,[de,ce]=r.useState(()=>p(oe)??{hsv:$,alpha:1}),[he,ue]=r.useState(()=>oe),fe=f(de.hsv,y?de.alpha:1,g),pe=""===oe;r.useEffect(()=>{const e=p(oe);e?f(e.hsv,y?e.alpha:1,g)!==fe&&(ue(oe),ce(e)):ue(oe)},[oe,fe,y,g]);const commit=(e,a)=>{ce(e);const r=f(e.hsv,y?e.alpha:1,g);ue(a??r),void 0===i&&se(r),m?.(r)},[me,ve]=r.useState(null),be=r.useCallback(e=>{ve(e),"function"==typeof J?J(e):J&&(J.current=e)},[J]),ge=t(me),xe=T||ge,ye=xe||D,we=z??Boolean(O),Ce=r.useId(),ke=e(ColorPanel,{hsv:de.hsv,alphaValue:de.alpha,onChange:commit,text:he,onTextChange:e=>{ue(e);const a=p(e);a&&commit(a,e)},withAlpha:y,swatches:k,editable:P,size:Z,inert:ye,invalid:N&&we,labels:re,className:N?Y?.control:void 0});n(L,()=>pe?"":fe,N&&!xe);const Ne=L?e("input",{type:"hidden",name:L,value:pe?"":fe,disabled:xe}):null;if(N){const r=we?"danger":ee,l=[_?`${Ce}-description`:null,O?`${Ce}-error`:null].filter(Boolean).join(" ")||void 0;return a("div",{ref:be,role:"group","aria-labelledby":j?`${Ce}-label`:void 0,"aria-describedby":l,className:b("flex flex-col",w[Z],X),style:{...C(r,U),...F},...G,children:[j?e("span",{id:`${Ce}-label`,className:b(x[Z],"font-semibold",xe?"text-(--plass-muted-fg)":"text-(--plass-fg)",Y?.label),children:j}):null,ke,_?e("span",{id:`${Ce}-description`,className:b(x[Z],"text-(--plass-muted-fg)",Y?.description),children:_}):null,O?e("span",{id:`${Ce}-error`,className:b(x[Z],"text-(--p-accent)",Y?.error),children:O}):null,Ne]})}return e("div",{ref:J,className:M?"w-full":"inline-block",...G,children:e(o,{variant:K,size:Z,color:ee,density:ae,elevation:U,style:F,label:j,labelPlacement:S,description:_,error:O,invalid:z,required:I,disabled:T,readOnly:D,fullWidth:M,className:X,classNames:Y,startIcon:e("span",{"aria-hidden":"true",className:"block size-[1.15em] shrink-0 rounded-full border [border-color:var(--plass-border)]",style:d,children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:pe?"transparent":h(de.hsv,y?de.alpha:1)}})}),display:pe?re.empty:fe,samples:widthSamples(g,y),empty:pe,clearable:A,onClear:()=>{void 0===i&&se(""),ue(""),m?.("")},open:ie,onOpenChange:e=>{void 0===V&&ne(e),B?.(e)},labels:{...s,clear:re.clear},name:L,formValue:pe?"":fe,children:e("div",{className:v[Z],children:ke})})})});
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{useDefaults as l}from"../../internal/defaults.js";import{defaultPickerLabels as s}from"../../internal/calendar.js";import{PickerShell as o}from"../../internal/picker.js";import{useDisabled as n,useFieldsetDisabled as t,useFormReport as i}from"../../internal/form.js";import{CheckIcon as d}from"../../internal/icons.js";import{checkerBackground as c,clamp as h,cssColor as u,defaultSwatches as f,formatColor as p,parseColor as m,readableInk as v}from"../../internal/color.js";import{controlTextClasses as b,cx as g,fieldDescriptionClasses as x,focusRingClasses as y,metaTextClasses as w,radiusClasses as C,stackGapClasses as k,surfaceSlots as N}from"../../internal/styles.js";export const defaultColorPickerLabels={area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Swatches",clear:"Clear",empty:"Pick a colour"};const P={xs:"w-40",sm:"w-44",md:"w-52",lg:"w-60",xl:"w-72"},j={xs:"h-24",sm:"h-28",md:"h-32",lg:"h-40",xl:"h-48"},O={xs:"h-2.5",sm:"h-3",md:"h-3.5",lg:"h-4",xl:"h-5"},S={xs:"gap-1.5",sm:"gap-2",md:"gap-2.5",lg:"gap-3",xl:"gap-3.5"},_={xs:10,sm:12,md:14,lg:16,xl:18},$=/* @__PURE__ */["relative overflow-hidden border","[border-color:var(--plass-border)]","[box-shadow:var(--plass-gloss-glass)]"].join(" "),z=/* @__PURE__ */["pointer-events-none absolute rounded-full border-2 border-white","[box-shadow:0_0_0_1px_rgba(0,0,0,0.35),0_1px_3px_rgba(0,0,0,0.4)]"].join(" ");function fractionsOf(e){const a=e.currentTarget.getBoundingClientRect();return{x:0===a.width?0:h((e.clientX-a.left)/a.width,0,1),y:0===a.height?0:h((e.clientY-a.top)/a.height,0,1)}}function arrowStep(e){const a=e.shiftKey?10:1;switch(e.key){case"ArrowLeft":return{x:-a,y:0};case"ArrowRight":return{x:a,y:0};case"ArrowUp":return{x:0,y:a};case"ArrowDown":return{x:0,y:-a};default:return null}}function ColorPanel({hsv:r,alphaValue:l,onChange:s,text:o,onTextChange:n,withAlpha:t,swatches:i,editable:f,size:b,disabled:x,readOnly:k,invalid:N,labels:I,className:T}){const D=x||k,M=_[b],A=-M/2,L=u({h:r.h,s:100,v:100}),V=u(r),q=i?i.flatMap(e=>{const a=m(e);return a?[{swatch:e,parsed:a}]:[]}):[],track=e=>({onPointerDown:a=>{D||(a.currentTarget.setPointerCapture(a.pointerId),e(a))},onPointerMove:a=>{!D&&a.currentTarget.hasPointerCapture(a.pointerId)&&e(a)}}),railProps=(e,a,r,l,s)=>({role:"slider",tabIndex:D?-1:0,"aria-label":e,"aria-valuemin":0,"aria-valuemax":r,"aria-valuenow":Math.round(a),"aria-orientation":"horizontal","aria-disabled":D||void 0,"aria-invalid":N||void 0,onKeyDown:e=>{if(D)return;if("Home"===e.key||"End"===e.key)return e.preventDefault(),void s("Home"===e.key?0:1);const a=arrowStep(e);a&&(e.preventDefault(),l(a.x+a.y))}});return a("div",{className:g("flex flex-col",P[b],S[b],T),children:[e("div",{...track(e=>{const{x:a,y:o}=fractionsOf(e);s({hsv:{h:r.h,s:100*a,v:100*(1-o)},alpha:l})}),role:"slider",tabIndex:D?-1:0,"aria-label":I.area,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(r.s),"aria-valuetext":`${Math.round(r.s)}%, ${Math.round(r.v)}%`,"aria-disabled":D||void 0,"aria-invalid":N||void 0,onKeyDown:e=>{const a=arrowStep(e);if(D||!a)return;e.preventDefault();const o=h(r.s+a.x,0,100),n=h(r.v+a.y,0,100);o===r.s&&n===r.v||s({hsv:{h:r.h,s:o,v:n},alpha:l})},className:g($,j[b],C[b],y,D?"cursor-default":"cursor-crosshair touch-none"),style:{backgroundColor:L,backgroundImage:"linear-gradient(to top, #000000, rgba(0, 0, 0, 0)), linear-gradient(to right, #ffffff, rgba(255, 255, 255, 0))"},children:e("span",{className:z,style:{width:M,height:M,left:`${r.s}%`,top:100-r.v+"%",marginLeft:A,marginTop:A,backgroundColor:V}})}),e("div",{...track(e=>s({hsv:{...r,h:360*fractionsOf(e).x},alpha:l})),...railProps(I.hue,r.h,360,e=>s({hsv:{...r,h:(r.h+2*e+360)%360},alpha:l}),e=>s({hsv:{...r,h:360*e},alpha:l})),className:g($,O[b],"rounded-full",y,D?"cursor-default":"cursor-pointer touch-none"),style:{backgroundImage:"linear-gradient(to right, #ff0000 0%, #ffff00 16.66%, #00ff00 33.33%, #00ffff 50%, #0000ff 66.66%, #ff00ff 83.33%, #ff0000 100%)"},children:e("span",{className:z,style:{width:M,height:M,left:r.h/360*100+"%",top:"50%",marginLeft:A,marginTop:A,backgroundColor:L}})}),t?a("div",{...track(e=>s({hsv:r,alpha:fractionsOf(e).x})),...railProps(I.alpha,100*l,100,e=>{const a=h(l+e/100,0,1);a!==l&&s({hsv:r,alpha:a})},e=>s({hsv:r,alpha:e})),className:g($,O[b],"rounded-full",y,D?"cursor-default":"cursor-pointer touch-none"),style:c,children:[e("span",{"aria-hidden":"true",className:"absolute inset-0",style:{backgroundImage:`linear-gradient(to right, ${u(r,0)}, ${V})`}}),e("span",{className:z,style:{width:M,height:M,left:100*l+"%",top:"50%",marginLeft:A,marginTop:A,backgroundColor:u(r,l)}})]}):null,f?a("div",{className:g("flex items-center",S[b]),children:[e("span",{"aria-hidden":"true",className:"shrink-0 rounded-full border [border-color:var(--plass-border)]",style:{width:M+6,height:M+6,...c},children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:u(r,l)}})}),e("input",{type:"text",value:o,disabled:x,readOnly:k,spellCheck:!1,autoComplete:"off","aria-label":I.value,onChange:e=>n(e.target.value),className:g("min-w-0 flex-1 border bg-transparent px-1.5 py-1 font-mono lowercase","[border-color:var(--plass-border)]",C.xs,w[b],"text-(--plass-fg)","[outline:none] focus-visible:[outline:2px_solid_var(--p-ring)]","focus-visible:[outline-offset:0px]")})]}):null,q.length>0?e("div",{role:"group","aria-label":I.swatches,className:"grid grid-cols-8 gap-1",children:q.map(({swatch:a,parsed:o})=>{const n=p(o.hsv,o.alpha,"hex")===p(r,l,"hex");return e("button",{type:"button",disabled:D,"aria-label":a,"aria-pressed":n,onClick:()=>s(o),className:g("flex aspect-square items-center justify-center rounded-full border","[border-color:var(--plass-border)]","[transition:box-shadow_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",y,"[outline:none]",D?"cursor-default":"cursor-pointer hover:[box-shadow:var(--plass-shadow-1)]","[&_svg]:size-3"),style:{backgroundColor:u(o.hsv,o.alpha)},children:n?e("span",{style:{color:v(o.hsv)},children:e(d,{})}):null},a)})}):null]})}function widthSamples(e,a){return"hex"===e?[a?"#ffffffff":"#ffffff"]:"rgb"===e?[a?"rgba(255, 255, 255, 0.55)":"rgb(255, 255, 255)"]:[a?"hsla(360, 100%, 100%, 0.55)":"hsl(360, 100%, 100%)"]}const I={h:217,s:87,v:82};export const PlColorPicker=/* @__PURE__ */r.forwardRef(function PlColorPicker({value:d,defaultValue:h="#1a58d1",onValueChange:v,format:y="hex",alpha:C=!1,swatches:P=f,inline:j=!1,editable:O=!0,label:S,labelPlacement:_,description:$,error:z,invalid:T,required:D=!1,disabled:M=!1,readOnly:A=!1,fullWidth:L=!1,clearable:V=!1,name:q,open:B,defaultOpen:H=!1,onOpenChange:K,labels:R,variant:E="glass",size:W,color:U,density:X,elevation:Y=0,className:F,classNames:G,style:J,...Q},Z){const ee=l(),ae=W??ee.size??"md",re=U??ee.color??"primary",le=X??ee.density??"default",se=r.useMemo(()=>({...defaultColorPickerLabels,...R}),[R]),[oe,ne]=r.useState(h),te=d??oe,[ie,de]=r.useState(H),ce=B??ie,[he,ue]=r.useState(()=>m(te)??{hsv:I,alpha:1}),[fe,pe]=r.useState(()=>te),me=p(he.hsv,C?he.alpha:1,y),ve=""===te;r.useEffect(()=>{const e=m(te);e?p(e.hsv,C?e.alpha:1,y)!==me&&(pe(te),ue(e)):pe(te)},[te,me,C,y]);const commit=(e,a)=>{ue(e);const r=p(e.hsv,C?e.alpha:1,y);pe(a??r),void 0===d&&ne(r),v?.(r)},[be,ge]=r.useState(null),xe=r.useCallback(e=>{ge(e),"function"==typeof Z?Z(e):Z&&(Z.current=e)},[Z]),ye=t(be),we=n(M)||ye,Ce=T??Boolean(z),ke=r.useId(),Ne=e(ColorPanel,{hsv:he.hsv,alphaValue:he.alpha,onChange:commit,text:fe,onTextChange:e=>{pe(e);const a=m(e);a&&commit(a,e)},withAlpha:C,swatches:P,editable:O,size:ae,disabled:we,readOnly:A,invalid:j&&Ce,labels:se,className:j?G?.control:void 0});i(q,()=>ve?"":me,j&&!we);const Pe=q?e("input",{type:"hidden",name:q,value:ve?"":me,disabled:we}):null;if(j){const r=Ce?"danger":re,l=[$?`${ke}-description`:null,z?`${ke}-error`:null].filter(Boolean).join(" ")||void 0;return a("div",{ref:xe,role:"group","aria-labelledby":S?`${ke}-label`:void 0,"aria-describedby":l,className:g("flex flex-col",k[ae],F),style:{...N(r,Y),...J},...Q,children:[S?e("span",{id:`${ke}-label`,className:g(w[ae],"font-semibold",we?"text-(--plass-muted-fg)":"text-(--plass-fg)",G?.label),children:S}):null,Ne,$?e("span",{id:`${ke}-description`,className:g(x(ae),G?.description),children:$}):null,z?e("span",{id:`${ke}-error`,className:g(w[ae],"text-(--p-accent)",G?.error),children:z}):null,Pe]})}return e("div",{ref:xe,className:L?"w-full":"inline-block",...Q,children:e(o,{variant:E,size:ae,color:re,density:le,elevation:Y,style:J,label:S,labelPlacement:_,description:$,error:z,invalid:T,required:D,disabled:M,readOnly:A,fullWidth:L,className:F,classNames:G,startIcon:e("span",{"aria-hidden":"true",className:"block size-[1.15em] shrink-0 rounded-full border [border-color:var(--plass-border)]",style:c,children:e("span",{className:"block size-full rounded-full",style:{backgroundColor:ve?"transparent":u(he.hsv,C?he.alpha:1)}})}),display:ve?se.empty:me,samples:widthSamples(y,C),empty:ve,clearable:V,onClear:()=>{void 0===d&&ne(""),pe(""),v?.("")},open:ce,onOpenChange:e=>{void 0===B&&de(e),K?.(e)},labels:{...s,clear:se.clear},name:q,formValue:ve?"":me,children:e("div",{className:b[ae],children:Ne})})})});

package/dist/components/combobox/PlCombobox.d.ts

@@ -43,7 +43,9 @@ export interface PlComboboxProps<Multiple extends boolean | undefined = false> e
     items: readonly PlComboboxOption[];
     /**
      * Whether more than one value may be held. The chosen ones become chips
-     * inside the field, and the input goes on filtering after each.
+     * inside the field, and the input goes on filtering after each. A row taken
+     * from a filtered list closes the list and empties the text, as Base UI does;
+     * a row taken with nothing typed leaves the list open for the next one.
      * @default false
      */
     multiple?: Multiple;
@@ -95,7 +97,10 @@ export interface PlComboboxProps<Multiple extends boolean | undefined = false> e
     /** The name of what the field holds, wired to it by Base UI's Field. */
     label?: React.ReactNode;
     /**
-     * Where the `label` goes — above the field, or in its top edge.
+     * Where the `label` goes — above the field, in its top edge, or inside it
+     * where the text would be typed until the field is focused or holds a value.
+     * With a `startIcon` a `float` label stays in the edge, because the icon is
+     * where it would rest.
      * Falls back to the nearest `PlassProvider`, then to `top`.
      * @default 'top'
      */
@@ -146,13 +151,14 @@ export interface PlComboboxProps<Multiple extends boolean | undefined = false> e
  * itself, offered as the last row rather than committed silently on blur.
  *
  * With `multiple` the chosen values become PlChips inside the field and the
- * input goes on filtering after each one, so a set of tags is built without the
- * field ever closing.
+ * input goes on filtering after each one. A row taken from a filtered list
+ * closes the list and empties the text, which is how Base UI 1.8.0 behaves,
+ * and a row taken with nothing typed leaves the list open for the next one.
  *
  * Base UI owns everything hard about this: the filtering and its collator, the
  * popup's positioning and flipping, the `combobox`/`listbox` wiring, arrow-key
  * navigation across both the list and the chips, and the hidden input that makes
  * the whole thing submit with a form.
  */
-export declare function PlCombobox<Multiple extends boolean | undefined = false>({ variant, size: sizeProp, color: colorProp, density: densityProp, elevation, items, multiple, value, defaultValue, onValueChange, onInputValueChange, allowCustom, customLabel, clearable, emptyMessage: emptyMessageProp, limit, placeholder, label, labelPlacement: labelPlacementProp, description, error, invalid, startIcon, fullWidth, disabled, readOnly, required, name, open, defaultOpen, onOpenChange, openLabel: openLabelProp, clearLabel: clearLabelProp, removeLabel: removeLabelProp, inputRef, id, className, hotKeys, classNames, style, ...props }: PlComboboxProps<Multiple>): React.JSX.Element;
+export declare function PlCombobox<Multiple extends boolean | undefined = false>({ variant, size: sizeProp, color: colorProp, density: densityProp, elevation, items, multiple, value, defaultValue, onValueChange, onInputValueChange, allowCustom, customLabel, clearable, emptyMessage: emptyMessageProp, limit, placeholder, label, labelPlacement: labelPlacementProp, description, error, invalid, startIcon, fullWidth, disabled: disabledProp, readOnly, required, name, open, defaultOpen, onOpenChange, openLabel: openLabelProp, clearLabel: clearLabelProp, removeLabel: removeLabelProp, inputRef, id, className, hotKeys, classNames, style, ...props }: PlComboboxProps<Multiple>): React.JSX.Element;
 export {};

package/dist/components/combobox/PlCombobox.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{useLabels as s}from"../../internal/labels.js";import{Combobox as n}from"@base-ui/react/combobox";import{Field as r}from"@base-ui/react/field";import{PlChip as i}from"../chip/PlChip.js";import{CheckIcon as o,ChevronIcon as c,CloseIcon as d,PlusIcon as m}from"../../internal/icons.js";import{hotKeyHandler as p}from"../../internal/keys.js";import{glowPointerMove as u}from"../../internal/glow.js";import{FieldNotch as h,notchShellStyle as b}from"../../internal/notch.js";import{chipRemoveClasses as f,controlHeightClasses as g,controlTextLeadingClasses as v,cx as x,disabledClasses as y,fieldReadOnlyClasses as w,fieldRestClasses as N,focusWithinRingClasses as C,forcedHighlightedClasses as j,gapClasses as L,glassClasses as I,hasContent as S,iconClasses as z,metaTextClasses as _,paddingXClasses as O,radiusClasses as P,stackGapClasses as V,surfaceSlots as A,transitionClasses as M}from"../../internal/styles.js";const k=/* @__PURE__ */["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",M,z].join(" "),R=C,T={xs:"min-h-6 py-0",sm:"min-h-8 py-0.5",md:"min-h-10 py-1",lg:"min-h-12 py-1.5",xl:"min-h-14 py-2"},q=/* @__PURE__ */[I,"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain","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(" "),E=/* @__PURE__ */["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--plass-radius-xs) py-1.5 pe-2 ps-7",M,"data-[highlighted]:bg-(--p-soft-hover) data-[highlighted]:text-(--p-accent)",j,"data-[selected]:font-semibold data-[selected]:text-(--p-accent)","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","[outline:none]"].join(" "),F=/* @__PURE__ */["inline-flex h-[1lh] shrink-0 cursor-pointer items-center justify-center","rounded-(--plass-radius-xs) text-(--plass-muted-fg)","[transition:color_var(--plass-duration)_var(--plass-ease)]","hover:text-(--p-accent)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:[outline-offset:1px]","disabled:cursor-not-allowed disabled:opacity-50"].join(" ");function toArray(e){return null==e?[]:Array.isArray(e)?e.slice():[e]}export function PlCombobox({variant:C="glass",size:j,color:I,density:z,elevation:M=0,items:$,multiple:D,value:K,defaultValue:G,onValueChange:H,onInputValueChange:W,allowCustom:B=!0,customLabel:J,clearable:Q=!1,emptyMessage:U,limit:X,placeholder:Y,label:Z,labelPlacement:ee,description:ae,error:le,invalid:te,startIcon:se,fullWidth:ne=!1,disabled:re=!1,readOnly:ie=!1,required:oe=!1,name:ce,open:de,defaultOpen:me,onOpenChange:pe,openLabel:ue,clearLabel:he,removeLabel:be,inputRef:fe,id:ge,className:ve,hotKeys:xe,classNames:ye,style:we,...Ne}){const Ce=t(),je=s(),Le=ue??je.open,Ie=he??je.clear,Se=U??je.empty,ze=be??je.removeItem,_e=j??Ce.size??"md",Oe=I??Ce.color??"primary",Pe=z??Ce.density??"default",Ve="notch"===(ee??Ce.labelPlacement??"top")&&S(Z),Ae=S(le),Me=te??Ae,ke=Me?"danger":Oe,Re=!0===D,Te=l.useMemo(()=>$.map(e=>({value:e.value,label:e.label??String(e.value),disabled:e.disabled})),[$]),[qe,Ee]=l.useState(()=>toArray(G)),Fe=void 0===K?qe:toArray(K),[$e,De]=l.useState(""),Ke=l.useMemo(()=>new Map(Te.map(e=>[e.value,e])),[Te]),Ge=l.useCallback(e=>Ke.get(e)??{value:e,label:String(e),custom:!0},[Ke]),He=$e.trim(),We=He.toLocaleLowerCase(),Be=""===He||Te.some(e=>e.label.toLocaleLowerCase()===We||String(e.value).toLocaleLowerCase()===We)||Fe.some(e=>String(e).toLocaleLowerCase()===We),Je=!B||ie||re||Be?null:He,Qe=l.useMemo(()=>null===Je?Te:[...Te,{value:Je,label:Je,custom:!0}],[Te,Je]),Ue=Re?Fe.map(Ge):Fe.length>0?Ge(Fe[0]):null,Xe=!re&&!ie,Ye=x(k,Ve?"":R,v[_e],P[_e],L[_e],Re?T[_e]:g[_e],`${O[Pe][_e]} pe-1.5`,re?y[C]:ie?w[C]:N[C],Xe?"plass-glow":""),Ze=/* @__PURE__ */["min-w-0 flex-1 self-stretch 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"].join(" "),renderInput=a=>e(n.Input,{ref:fe,placeholder:Y,onKeyDown:p(xe,void 0),className:x(Ze,Re&&"min-w-16",Re&&a&&"ms-1.5")}),ea=e(r.Label,{className:x(_[_e],"font-semibold",re?"text-(--plass-muted-fg)":"text-(--plass-fg)",ye?.label),children:Z});return a(r.Root,{disabled:re,invalid:Me,className:x("flex-col align-top",V[_e],ne?"flex w-full":"inline-flex",ve),style:{...A(ke,M),...we},...Ne,children:[S(Z)&&!Ve?ea:null,a(n.Root,{id:ge,name:ce,items:Qe,multiple:Re,value:Ue,onValueChange:e=>{!function commit(e){void 0===K&&Ee(e),H?.(Re?e:e[0]??null)}((null===e?[]:Array.isArray(e)?e:[e]).map(e=>e.value))},onInputValueChange:e=>{De(e),W?.(e)},open:de,defaultOpen:me,onOpenChange:e=>pe?.(e),autoHighlight:!0,itemToStringLabel:e=>e.label,itemToStringValue:e=>String(e.value),isItemEqualToValue:(e,a)=>e.value===a.value,limit:X,disabled:re,readOnly:ie,required:oe,children:[e(h,{notched:Ve,size:_e,density:Pe,variant:C,disabled:re,readOnly:ie,label:ea,children:a(n.InputGroup,{style:Ve?b:void 0,onPointerMove:u(Xe),className:x(Ye,ye?.control),children:[se?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:se}):null,Re?e(n.Chips,{className:"flex min-w-0 flex-1 flex-wrap items-center gap-1",children:e(n.Value,{children:t=>a(l.Fragment,{children:[t.map(a=>e(n.Chip,{render:e(i,{variant:"glass",size:_e,color:ke,density:"compact",disabled:re,endIcon:ie||re?null:e(n.ChipRemove,{"aria-label":ze(a.label),className:f,children:e(d,{})})}),children:a.label},String(a.value))),renderInput(t.length>0)]})})}):renderInput(!1),Q&&!ie?e(n.Clear,{"aria-label":Ie,className:F,children:e(d,{})}):null,e(n.Trigger,{"aria-label":Le,className:F,children:e(n.Icon,{className:x("flex items-center","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","data-[popup-open]:rotate-180"),children:e(c,{})})})]})}),e(n.Portal,{children:e(n.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",sideOffset:6,children:a(n.Popup,{className:x(q,P[_e],v[_e]),style:A(ke,3),children:[e(n.Empty,{className:"px-2 py-1.5 text-(--plass-muted-fg) empty:hidden",children:Se}),e(n.List,{children:t=>e(n.Item,{value:t,disabled:t.disabled,className:E,children:t.custom?a(l.Fragment,{children:[e("span",{className:"absolute start-1.5 flex size-4 items-center justify-center text-(--p-accent) [&_svg]:size-4",children:e(m,{})}),e("span",{className:"truncate",children:J?J(t.label):je.addCustom(t.label)})]}):a(l.Fragment,{children:[e(n.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(o,{})}),e("span",{className:"truncate",children:t.label})]})},`${t.custom?"custom:":""}${String(t.value)}`)})]})})})]}),ae?e(r.Description,{className:x("m-0",_[_e],"text-(--plass-muted-fg)",ye?.description),children:ae}):null,e(r.Error,Ae?{match:!0,className:x(_[_e],"text-(--p-accent)",ye?.error),children:le}:{className:x(_[_e],"text-(--p-accent)",ye?.error)})]})}
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{FadedContext as t,useDisabled as s}from"../../internal/form.js";import{useDefaults as n}from"../../internal/defaults.js";import{useLabels as r}from"../../internal/labels.js";import{Combobox as i}from"@base-ui/react/combobox";import{Field as o}from"@base-ui/react/field";import{PlChip as c}from"../chip/PlChip.js";import{CheckIcon as d,ChevronIcon as m,CloseIcon as p,PlusIcon as u}from"../../internal/icons.js";import{hotKeyHandler as h}from"../../internal/keys.js";import{useFieldLight as b}from"../../internal/glow.js";import{FieldNotch as f,floatControlClassName as g,notchShellStyle as v,resolveNotch as x}from"../../internal/notch.js";import{chipRemoveClasses as y,controlHeightClasses as w,controlTextLeadingClasses as N,cx as j,disabledClasses as C,fieldDescriptionClasses as L,fieldReadOnlyClasses as I,fieldRestClasses as S,fieldSlots as z,focusWithinRingClasses as _,forcedHighlightedClasses as O,gapClasses as P,glassClasses as V,hasContent as A,iconClasses as M,metaTextClasses as k,paddingXClasses as R,radiusClasses as F,stackGapClasses as T,surfaceSlots as $,targetClasses as q,transitionClasses as D}from"../../internal/styles.js";const E=/* @__PURE__ */["relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",D,M].join(" "),K=_,G={xs:"min-h-6 py-0",sm:"min-h-8 py-0.5",md:"min-h-10 py-1",lg:"min-h-12 py-1.5",xl:"min-h-14 py-2"},H=/* @__PURE__ */[V,"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain","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)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),W=/* @__PURE__ */["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--plass-radius-xs) py-1.5 pe-2 ps-7",D,"data-[highlighted]:bg-(--p-soft-hover) data-[highlighted]:text-(--p-accent)",O,"data-[selected]:font-semibold data-[selected]:text-(--p-accent)","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","[outline:none]"].join(" "),B=/* @__PURE__ */["inline-flex h-[1lh] shrink-0 cursor-pointer items-center justify-center","rounded-(--plass-radius-xs) text-(--plass-muted-fg)","[transition:color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","enabled:hover:text-(--p-accent)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:[outline-offset:1px]","disabled:cursor-not-allowed"].join(" "),J=/* @__PURE__ */j(q,B),Q=[];function toArray(e){return null==e?Q:Array.isArray(e)?e:[e]}export function PlCombobox({variant:_="glass",size:O,color:V,density:M,elevation:q=0,items:D,multiple:Q,value:U,defaultValue:X,onValueChange:Y,onInputValueChange:Z,allowCustom:ee=!0,customLabel:ae,clearable:le=!1,emptyMessage:te,limit:se,placeholder:ne,label:re,labelPlacement:ie,description:oe,error:ce,invalid:de,startIcon:me,fullWidth:pe=!1,disabled:ue=!1,readOnly:he=!1,required:be=!1,name:fe,open:ge,defaultOpen:ve,onOpenChange:xe,openLabel:ye,clearLabel:we,removeLabel:Ne,inputRef:je,id:Ce,className:Le,hotKeys:Ie,classNames:Se,style:ze,..._e}){const Oe=n(),Pe=s(ue),Ve=r(),Ae=ye??Ve.open,Me=we??Ve.clear,ke=te??Ve.empty,Re=Ne??Ve.removeItem,Fe=O??Oe.size??"md",Te=V??Oe.color??"primary",$e=M??Oe.density??"default",qe=ie??Oe.labelPlacement??"top",{notched:De,float:Ee}=x(qe,re,A(me)),Ke=A(ce),Ge=de??Ke,He=Ge?"danger":Te,We=!0===Q,Be=l.useMemo(()=>D.map(e=>({value:e.value,label:e.label??String(e.value),disabled:e.disabled})),[D]),[Je,Qe]=l.useState(()=>toArray(X)),Ue=void 0===U?Je:toArray(U),[Xe,Ye]=l.useState(""),Ze=l.useMemo(()=>new Map(Be.map(e=>[e.value,e])),[Be]),ea=l.useCallback(e=>Ze.get(e)??{value:e,label:String(e),custom:!0},[Ze]),aa=Xe.trim(),la=aa.toLocaleLowerCase(),ta=""===aa||Be.some(e=>e.label.toLocaleLowerCase()===la||String(e.value).toLocaleLowerCase()===la)||Ue.some(e=>String(e).toLocaleLowerCase()===la),sa=!ee||he||Pe||ta?null:aa,na=l.useMemo(()=>null===sa?Be:[...Be,{value:sa,label:sa,custom:!0}],[Be,sa]),ra=l.useMemo(()=>i.createItems(na,{getValue:e=>e.value,getLabel:e=>e.label}),[na]),ia=We?Ue:Ue[0]??null,oa=!Pe&&!he,ca=b(oa),da=j(E,De?"":K,N[Fe],F[Fe],P[Fe],We?G[Fe]:w[Fe],`${R[$e][Fe]} pe-1.5`,Pe?C[_]:he?I[_]:S[_],oa?"plass-glow":""),ma=/* @__PURE__ */["min-w-0 flex-1 self-stretch 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"].join(" "),renderInput=a=>e(i.Input,{ref:je,placeholder:Ee?ne||" ":ne,onKeyDown:h(Ie,void 0),className:j(ma,We&&"min-w-16",We&&a&&"ms-1.5",Ee&&!a&&g)}),pa=e(o.Label,{className:j(k[Fe],"font-semibold",Pe?"text-(--plass-muted-fg)":"text-(--plass-fg)",Se?.label),children:re});return a(o.Root,{disabled:Pe,invalid:Ge,className:j("flex-col align-top",T[Fe],pe?"flex w-full":"inline-flex",Le),style:{...z(He,q),...ze},..._e,children:[A(re)&&!De?pa:null,a(i.Root,{id:Ce,name:fe,items:ra,multiple:We,value:ia,onValueChange:e=>{const a=toArray(e);0===a.length&&0===Ue.length||function commit(e){void 0===U&&Qe(e),Y?.(We?e:e[0]??null)}(a)},onInputValueChange:e=>{Ye(e),Z?.(e)},open:ge,defaultOpen:ve,onOpenChange:e=>xe?.(e),autoHighlight:!0,itemToStringLabel:String,itemToStringValue:String,limit:se,disabled:Pe,readOnly:he,required:be,children:[e(f,{notched:De,size:Fe,density:$e,variant:_,disabled:Pe,readOnly:he,float:Ee,label:pa,children:a(i.InputGroup,{style:De?v:void 0,...ca,className:j(da,Se?.control),children:[me?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:me}):null,We?e(i.Chips,{className:"flex min-w-0 flex-1 flex-wrap items-center gap-1",children:e(t.Provider,{value:Pe,children:e(i.Value,{children:t=>a(l.Fragment,{children:[t.map(ea).map(a=>e(i.Chip,{render:e(c,{variant:"glass",size:Fe,color:He,density:"compact",disabled:Pe,endIcon:he||Pe?null:e(i.ChipRemove,{"aria-label":Re(a.label),className:y,children:e(p,{})})}),children:a.label},String(a.value))),renderInput(t.length>0)]})})})}):renderInput(!1),!le||he||Pe?null:e(i.Clear,{"aria-label":Me,className:J,children:e(p,{})}),e(i.Trigger,{"aria-label":Ae,"aria-labelledby":void 0,className:B,children:e(i.Icon,{className:j("flex items-center","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[popup-open]:rotate-180"),children:e(m,{})})})]})}),e(i.Portal,{children:e(i.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",sideOffset:6,children:a(i.Popup,{className:j(H,F[Fe],N[Fe]),style:$(He,3),children:[e(i.Empty,{className:"px-2 py-1.5 text-(--plass-muted-fg) empty:hidden",children:ke}),e(i.List,{children:t=>e(i.Item,{value:t.value,disabled:t.disabled,className:W,children:t.custom?a(l.Fragment,{children:[e("span",{className:"absolute start-1.5 flex size-4 items-center justify-center text-(--p-accent) [&_svg]:size-4",children:e(u,{})}),e("span",{className:"truncate",children:ae?ae(t.label):Ve.addCustom(t.label)})]}):a(l.Fragment,{children:[e(i.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(d,{})}),e("span",{className:"truncate",children:t.label})]})},`${t.custom?"custom:":""}${String(t.value)}`)})]})})})]}),oe?e(o.Description,{className:j(L(Fe),Se?.description),children:oe}):null,e(o.Error,Ke?{match:!0,className:j(k[Fe],"text-(--p-accent)",Se?.error),children:ce}:{className:j(k[Fe],"text-(--p-accent)",Se?.error)})]})}

package/dist/components/command-palette/PlCommandPalette.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as a from"react";import{useDefaults as t}from"../../internal/defaults.js";import{useLabels as l}from"../../internal/labels.js";import{Autocomplete as o}from"@base-ui/react/autocomplete";import{Dialog as r}from"@base-ui/react/dialog";import{PlHotKeys as i}from"../hot-keys/PlHotKeys.js";import{usePlHotKeys as n}from"../../hooks/usePlHotKeys.js";import{searchHaystack as c,searchText as p}from"../../internal/search.js";import{controlTextLeadingClasses as d,cx as m,forcedHighlightedClasses as u,glassClasses as h,hasContent as x,metaTextClasses as f,radiusClasses as g,surfaceSlots as y,toLength as b}from"../../internal/styles.js";const v=/* @__PURE__ */["fixed inset-0 z-(--plass-z-portal) bg-(--plass-scrim)","[backdrop-filter:blur(2px)] [-webkit-backdrop-filter:blur(2px)]","[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),w=/* @__PURE__ */[h,"relative flex w-full flex-col overflow-hidden","border text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]","[outline:none]","[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),k={xs:"max-w-sm",sm:"max-w-md",md:"max-w-xl",lg:"max-w-2xl",xl:"max-w-3xl"},N={xs:"h-9",sm:"h-10",md:"h-12",lg:"h-14",xl:"h-16"},j={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},P={xs:"px-2.5",sm:"px-3",md:"px-3.5",lg:"px-4",xl:"px-5"},z=/* @__PURE__ */["flex cursor-pointer items-center gap-3 select-none","[transition:background-color_var(--plass-duration)_var(--plass-ease)]","data-[highlighted]:bg-(--p-soft) data-[highlighted]:text-(--p-accent)",u,"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","data-[disabled]:saturate-[0.35]"].join(" ");function haystackOf(e){return c([e.label,e.group,...e.keywords??[]])}export function PlCommandPalette({items:c,open:u,defaultOpen:h=!1,onOpenChange:_,onSelect:C,shortcut:O="Mod+K",width:S,maxHeight:H=320,placeholder:M,emptyMessage:K,label:R,size:V,color:E,density:F,className:I,classNames:T,style:B}){const D=t(),L=l(),W=R??L.commandPalette,q=M??L.commandPalettePlaceholder,A=K??L.empty,G=V??D.size??"md",J=E??D.color??"primary",Q=F??D.density??"default",[U,X]=a.useState(h),[Y,Z]=a.useState(""),$=u??U,ee=a.useRef($);a.useEffect(()=>{ee.current&&!$&&Z(""),ee.current=$},[$]);const se=a.useCallback(e=>{void 0===u&&X(e),_?.(e)},[u,_]);n(!1===O?void 0:{[O]:()=>se(!0)},{whileTyping:!0});const ae=a.useMemo(()=>c.map(haystackOf),[c]),te=a.useMemo(()=>{const e=p(Y);return""===e?c:c.filter((s,a)=>ae[a].includes(e))},[c,ae,Y]),le=b(S),oe=b(H);return e(r.Root,{open:$,onOpenChange:se,children:s(r.Portal,{children:[e(r.Backdrop,{className:m("plass-portal",v,T?.backdrop)}),e(r.Viewport,{className:"plass-portal fixed inset-0 z-(--plass-z-portal) flex justify-center p-4 pt-[12vh]",children:e(r.Popup,{"aria-label":W,className:m(w,g[G],d[G],void 0===le?k[G]:"","self-start",I),style:{...y(J,3),...void 0===le?null:{maxWidth:le},...B},children:s(o.Root,{open:!0,mode:"list",items:te,filter:null,value:Y,onValueChange:e=>Z(e),itemToStringValue:e=>e.label,children:[e("div",{className:m("flex shrink-0 items-center border-b [border-color:var(--plass-glass-line)]",P[G]),children:e(o.Input,{autoFocus:!0,placeholder:q,className:m("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)",N[G])})}),e(o.List,{className:"min-h-0 flex-1 overflow-y-auto overscroll-contain p-1",style:{maxHeight:oe},children:(t,l)=>s(a.Fragment,{children:[t.group&&t.group!==te[l-1]?.group?e("div",{role:"presentation",className:m(P[G],"pt-2 pb-1 font-medium text-(--plass-muted-fg)",f[G]),children:t.group}):null,s(o.Item,{index:l,value:t,disabled:t.disabled,onClick:()=>(e=>{e.disabled||(e.onSelect?.(),C?.(e),se(!1))})(t),className:m(z,g[G],P[G],j["compact"===Q?"xs":G]),children:[x(t.icon)?e("span",{className:"flex h-[1lh] shrink-0 items-center [&_svg]:size-[1.15em]",children:t.icon}):null,s("span",{className:"flex min-w-0 flex-1 flex-col",children:[e("span",{className:"truncate",children:t.label}),x(t.description)?e("span",{className:m("truncate text-(--plass-muted-fg)",f[G]),children:t.description}):null]}),t.shortcut?e(i,{size:"xs",keys:t.shortcut,className:"shrink-0"}):null]})]},t.value)}),e(o.Empty,{className:m(P[G],"py-6 text-center text-(--plass-muted-fg)",f[G]),children:A})]})})})]})})}
+"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as a from"react";import{useDefaults as t}from"../../internal/defaults.js";import{useLabels as l}from"../../internal/labels.js";import{Autocomplete as o}from"@base-ui/react/autocomplete";import{Dialog as r}from"@base-ui/react/dialog";import{PlHotKeys as i}from"../hot-keys/PlHotKeys.js";import{usePlHotKeys as n}from"../../hooks/usePlHotKeys.js";import{searchHaystack as c,searchText as p}from"../../internal/search.js";import{controlTextLeadingClasses as d,cx as m,forcedHighlightedClasses as u,glassClasses as h,hasContent as x,metaTextClasses as f,radiusClasses as g,surfaceSlots as y,toLength as b,transitionClasses as v}from"../../internal/styles.js";const w=/* @__PURE__ */["fixed inset-0 z-(--plass-z-portal) bg-(--plass-scrim)","[backdrop-filter:blur(2px)] [-webkit-backdrop-filter:blur(2px)]","[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),k=/* @__PURE__ */[h,"relative flex w-full flex-col overflow-hidden","border text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]","[outline:none]","[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),N={xs:"max-w-sm",sm:"max-w-md",md:"max-w-xl",lg:"max-w-2xl",xl:"max-w-3xl"},j={xs:"h-9",sm:"h-10",md:"h-12",lg:"h-14",xl:"h-16"},P={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},z={xs:"px-2.5",sm:"px-3",md:"px-3.5",lg:"px-4",xl:"px-5"},C=/* @__PURE__ */["flex cursor-pointer items-center gap-3 select-none",v,"data-[highlighted]:bg-(--p-soft-hover) data-[highlighted]:text-(--p-accent)",u,"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","data-[disabled]:saturate-[0.35]"].join(" ");function haystackOf(e){return c([e.label,e.group,...e.keywords??[]])}export function PlCommandPalette({items:c,open:u,defaultOpen:h=!1,onOpenChange:v,onSelect:M,shortcut:O="Mod+K",width:S,maxHeight:_=320,placeholder:H,emptyMessage:K,label:R,size:V,color:E,density:F,className:I,classNames:T,style:B}){const D=t(),L=l(),W=R??L.commandPalette,q=H??L.commandPalettePlaceholder,A=K??L.empty,G=V??D.size??"md",J=E??D.color??"primary",Q=F??D.density??"default",[U,X]=a.useState(h),[Y,Z]=a.useState(""),$=u??U,ee=a.useRef($);a.useEffect(()=>{ee.current&&!$&&Z(""),ee.current=$},[$]);const se=a.useCallback(e=>{void 0===u&&X(e),v?.(e)},[u,v]);n(!1===O?void 0:{[O]:()=>se(!0)},{whileTyping:!0});const ae=a.useMemo(()=>c.map(haystackOf),[c]),te=a.useMemo(()=>{const e=p(Y);return""===e?c:c.filter((s,a)=>ae[a].includes(e))},[c,ae,Y]),le=a.useMemo(()=>te.length>100?te.slice(0,100):te,[te]),oe=te.length-le.length,re=b(S),ie=b(_);return e(r.Root,{open:$,onOpenChange:se,children:s(r.Portal,{children:[e(r.Backdrop,{className:m("plass-portal",w,T?.backdrop)}),e(r.Viewport,{className:"plass-portal fixed inset-0 z-(--plass-z-portal) flex justify-center p-4 pt-[12vh]",children:e(r.Popup,{"aria-label":W,className:m(k,g[G],d[G],void 0===re?N[G]:"","self-start",I),style:{...y(J,3),...void 0===re?null:{maxWidth:re},...B},children:s(o.Root,{open:!0,mode:"list",items:le,filter:null,value:Y,onValueChange:e=>Z(e),itemToStringValue:e=>e.label,children:[e("div",{className:m("flex shrink-0 items-center border-b [border-color:var(--plass-glass-line)]",z[G]),children:e(o.Input,{autoFocus:!0,placeholder:q,className:m("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)",j[G])})}),e(o.List,{className:"min-h-0 flex-1 overflow-y-auto overscroll-contain p-1",style:{maxHeight:ie},children:(t,l)=>s(a.Fragment,{children:[t.group&&t.group!==le[l-1]?.group?e("div",{role:"presentation",className:m(z[G],"pt-2 pb-1 font-medium text-(--plass-muted-fg)",f[G]),children:t.group}):null,s(o.Item,{index:l,value:t,disabled:t.disabled,onClick:()=>(e=>{e.disabled||(e.onSelect?.(),M?.(e),se(!1))})(t),className:m(C,g[G],z[G],P["compact"===Q?"xs":G]),children:[x(t.icon)?e("span",{className:"flex h-[1lh] shrink-0 items-center [&_svg]:size-[1.15em]",children:t.icon}):null,s("span",{className:"flex min-w-0 flex-1 flex-col",children:[e("span",{className:"truncate",children:t.label}),x(t.description)?e("span",{className:m("truncate text-(--plass-muted-fg)",f[G]),children:t.description}):null]}),t.shortcut?e(i,{size:"xs",keys:t.shortcut,className:"shrink-0"}):null]})]},t.value)}),oe>0?e("div",{className:m(z[G],"shrink-0 border-t py-2 text-(--plass-muted-fg) [border-color:var(--plass-glass-line)]",f[G]),children:L.chartMore(oe)}):null,e(o.Empty,{className:m(z[G],"py-6 text-center text-(--plass-muted-fg)",f[G]),children:A})]})})})]})})}

package/dist/components/confirm/PlConfirmProvider.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{PlButton as o}from"../button/PlButton.js";import{PlModal as t}from"../modal/PlModal.js";import{useLabels as i}from"../../internal/labels.js";const l=/* @__PURE__ */n.createContext(null);export function PlConfirmProvider({size:c,color:s,confirmLabel:u,cancelLabel:a,acknowledgeLabel:d,width:f,children:m}){const h=i(),[p,b]=n.useState(!1),[C,v]=n.useState(null),P=n.useRef(null),w=n.useRef([]),k=n.useRef(0),x=n.useCallback(e=>{const r=P.current;if(!r)return;r.resolve(e);const n=w.current.shift();if(n)return P.current=n,void v(n);P.current=null,b(!1)},[]),z=n.useCallback((e,r)=>new Promise(n=>{k.current+=1;const o={id:k.current,kind:e,options:r,resolve:n};P.current?w.current.push(o):(P.current=o,v(o),b(!0))}),[]),j=n.useMemo(()=>({confirm:e=>z("confirm",e),alert:e=>z("alert",e).then(()=>{})}),[z]);n.useEffect(()=>()=>{P.current?.resolve(!1),w.current.forEach(e=>e.resolve(!1)),P.current=null,w.current=[]},[]);const g=C?.options,L="alert"===C?.kind,F="confirm"===(g?.initialFocus??"cancel")||L;return r(l.Provider,{value:j,children:[m,e(t,{open:p,onOpenChange:e=>{e||x(!1)},size:g?.size??c,color:g?.color??s,width:g?.width??f,dismissible:g?.dismissible??!0,title:g?.title,description:g?.description,actions:r(n.Fragment,{children:[L?null:e(o,{variant:"ghost",color:"secondary",size:g?.size??c,autoFocus:!F,onClick:()=>x(!1),children:g?.cancelLabel??a??h.cancel}),e(o,{color:g?.color??s,size:g?.size??c,autoFocus:F,onClick:()=>x(!0),children:g?.confirmLabel??(L?d??h.acknowledge:u??h.confirm)})]},C?.id),children:g?.children})]})}export function usePlConfirm(){const e=n.useContext(l);if(!e)throw new Error("[plass-ui] usePlConfirm was called outside a <PlConfirmProvider>.");return e}
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{PlButton as o}from"../button/PlButton.js";import{PlModal as t}from"../modal/PlModal.js";import{useLabels as i}from"../../internal/labels.js";const l=/* @__PURE__ */n.createContext(null);export function PlConfirmProvider({size:c,color:s,confirmLabel:u,cancelLabel:a,acknowledgeLabel:d,width:f,children:m}){const h=i(),[p,C]=n.useState(!1),[b,v]=n.useState(null),w=n.useRef(null),P=n.useRef([]),k=n.useRef(0),x=n.useCallback(e=>{const r=w.current;if(!r)return;r.resolve(e);const n=P.current.shift();if(n)return w.current=n,void v(n);w.current=null,C(!1)},[]),z=n.useCallback((e,r)=>new Promise(n=>{k.current+=1;const o={id:k.current,kind:e,options:r,resolve:n};w.current?P.current.push(o):(w.current=o,v(o),C(!0))}),[]),j=n.useMemo(()=>({confirm:e=>z("confirm",e),alert:e=>z("alert",e).then(()=>{})}),[z]);n.useEffect(()=>()=>{w.current?.resolve(!1),P.current.forEach(e=>e.resolve(!1)),w.current=null,P.current=[]},[]);const g=b?.options,L="alert"===b?.kind,F="confirm"===(g?.initialFocus??"cancel")||L;return r(l.Provider,{value:j,children:[m,e(t,{open:p,onOpenChange:e=>{e||x(!1)},showClose:!1,size:g?.size??c,color:g?.color??s,width:g?.width??f,dismissible:g?.dismissible??!0,title:g?.title,description:g?.description,actions:r(n.Fragment,{children:[L?null:e(o,{variant:"ghost",color:"secondary",size:g?.size??c,autoFocus:!F,onClick:()=>x(!1),children:g?.cancelLabel??a??h.cancel}),e(o,{color:g?.color??s,size:g?.size??c,autoFocus:F,onClick:()=>x(!0),children:g?.confirmLabel??(L?d??h.acknowledge:u??h.confirm)})]},b?.id),children:g?.children})]})}export function usePlConfirm(){const e=n.useContext(l);if(!e)throw new Error("[plass-ui] usePlConfirm was called outside a <PlConfirmProvider>.");return e}

package/dist/components/data-table/PlDataTable.d.ts

@@ -107,7 +107,8 @@ export interface PlDataTableProps<Row> extends PlassStyleProps, Omit<React.Compo
      * It defaults to the row's position in `rows`, which survives a sort, a
      * search and a page, and does not survive `rows` changing: a row added at the
      * top moves every other row's key, so a selection made before it belongs to
-     * different rows after it.
+     * different rows after it. With `manual` paging the position is counted from
+     * the first row of the first page, since `rows` is only the page on screen.
      *
      * `index` here, and in every other callback, is that position in `rows`, not
      * the row's place on the screen.
@@ -115,6 +116,16 @@ export interface PlDataTableProps<Row> extends PlassStyleProps, Omit<React.Compo
     getRowKey?: (row: Row, index: number) => React.Key;
     /** Shown above the grid, and read out as the table's accessible name. */
     caption?: React.ReactNode;
+    /**
+     * The table's accessible name when there is no `caption` — "Invoices",
+     * "Exchange rates".
+     *
+     * It names the `<table>`, and the box the grid scrolls in too: a grid wider
+     * than its sheet, or taller than `maxHeight`, is a tab stop while it
+     * scrolls, and a stop is announced by its name. A caption is that name when
+     * there is one, and this is not read then.
+     */
+    label?: string;
     /** What to show instead of rows when there are none left to show. */
     empty?: React.ReactNode;
     /** Tints every other row. @default false */
@@ -213,4 +224,4 @@ export interface PlDataTableProps<Row> extends PlassStyleProps, Omit<React.Compo
  * Not a `forwardRef`, for `PlTable`'s reason: a component wrapped in
  * `React.forwardRef` loses its type parameter, and `Row` is the whole point.
  */
-export declare function PlDataTable<Row>({ variant, size: sizeProp, color: colorProp, density: densityProp, elevation, columns, rows, getRowKey, caption, empty: emptyProp, striped, hoverable, stickyHeader, maxHeight, onRowClick, sort: sortProp, defaultSort, onSortChange, searchable, search: searchProp, defaultSearch, onSearchChange, searchPlaceholder, selection, selected: selectedProp, defaultSelected, onSelectedChange, isRowSelectable, paging, pageSize, page: pageProp, defaultPage, onPageChange, rowCount, manual, loading, toolbar, footer, className, style, ...props }: PlDataTableProps<Row>): React.JSX.Element;
+export declare function PlDataTable<Row>({ variant, size: sizeProp, color: colorProp, density: densityProp, elevation, columns, rows, getRowKey, caption, label, empty: emptyProp, striped, hoverable, stickyHeader, maxHeight, onRowClick, sort: sortProp, defaultSort, onSortChange, searchable, search: searchProp, defaultSearch, onSearchChange, searchPlaceholder, selection, selected: selectedProp, defaultSelected, onSelectedChange, isRowSelectable, paging, pageSize, page: pageProp, defaultPage, onPageChange, rowCount, manual, loading, toolbar, footer, className, style, ...props }: PlDataTableProps<Row>): React.JSX.Element;

package/dist/components/data-table/PlDataTable.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{PlCheckbox as a}from"../checkbox/index.js";import{PlPagination as n}from"../pagination/index.js";import{PlSkeleton as l}from"../skeleton/index.js";import{PlTextField as s}from"../text-field/index.js";import{compareValues as o,keysBetween as i,nextSort as c,pageBounds as d}from"../../internal/data-table.js";import{useDefaults as u}from"../../internal/defaults.js";import{ChevronIcon as p}from"../../internal/icons.js";import{useLabels as m}from"../../internal/labels.js";import{searchHaystack as h,searchText as g}from"../../internal/search.js";import{controlTextLeadingClasses as f,cx as v,focusRingInsetClasses as y,gapClasses as b,hasContent as x,metaTextClasses as w,paddingXValues as k,radiusClasses as C,sheetRestClasses as N,srOnlyClasses as S,surfaceSlots as j}from"../../internal/styles.js";import{cellPaddingYValues as z,clickableRowClasses as M,headRule as P,rowClasses as $,rowRule as _,tableStyle as A}from"../../internal/table.js";const R={xs:"2rem",sm:"2.25rem",md:"2.75rem",lg:"3rem",xl:"3.5rem"},B=/* @__PURE__ */v("inline-flex items-center gap-1 [outline:none]","font-semibold whitespace-nowrap text-inherit","[background:none] [border:0] [padding:0] [margin:0] cursor-pointer","hover:text-(--plass-fg) [transition:color_var(--plass-duration)_var(--plass-ease)]",y);function SortMark({direction:t}){return e("span",{"aria-hidden":"true",className:v("[&_svg]:size-[1em] [&_svg]:shrink-0","[transition:opacity_var(--plass-duration)_var(--plass-ease),transform_var(--plass-duration)_var(--plass-ease)]",null===t?"opacity-30":"opacity-100","asc"===t?"rotate-180":""),children:e(p,{})})}export function PlDataTable({variant:p="glass",size:y,color:T,density:D,elevation:H=0,columns:K,rows:I,getRowKey:E,caption:q,empty:F,striped:G=!1,hoverable:J=!1,stickyHeader:L=!0,maxHeight:O,onRowClick:Q,sort:U,defaultSort:V=null,onSortChange:W,searchable:X=!1,search:Y,defaultSearch:Z="",onSearchChange:ee,searchPlaceholder:te,selection:re="none",selected:ae,defaultSelected:ne,onSelectedChange:le,isRowSelectable:se,paging:oe="scroll",pageSize:ie=10,page:ce,defaultPage:de=1,onPageChange:ue,rowCount:pe,manual:me,loading:he=!1,toolbar:ge,footer:fe,className:ve,style:ye,...be}){const xe=u(),we=m(),ke=y??xe.size??"md",Ce=T??xe.color??"primary",Ne=D??xe.density??"default",Se=F??we.empty,[je,ze]=r.useState(V),[Me,Pe]=r.useState(Z),[$e,_e]=r.useState(ne??[]),[Ae,Re]=r.useState(de),Be=void 0===U?je:U,Te=Y??Me,De=ae??$e,He=!me?.includes("sort"),Ke=!me?.includes("search"),Ie=!me?.includes("pages"),Ee=r.useCallback((e,t)=>E?E(e,t):t,[E]),qe=r.useCallback((e,t)=>e.value?e.value(t):t[e.key],[]),Fe=r.useMemo(()=>I.map((e,t)=>({row:e,index:t})),[I]),Ge=g(Te),Je=r.useMemo(()=>{if(!Ke||""===Ge)return Fe;const e=K.filter(e=>!e.unsearchable);return Fe.filter(({row:t})=>h(e.map(e=>qe(e,t))).includes(Ge))},[Fe,K,Ge,Ke,qe]),Le=r.useMemo(()=>{if(!He||null===Be)return Je;const e=K.find(e=>e.key===Be.key);if(!e)return Je;const t="asc"===Be.direction?1:-1;return[...Je].sort((r,a)=>e.compare?e.compare(r.row,a.row)*t:o(qe(e,r.row),qe(e,a.row),t))},[Je,K,Be,He,qe]),Oe=Ie?Le.length:pe??Le.length,Qe=Math.max(1,Math.ceil(Oe/ie)),Ue=Math.min(Math.max(ce??Ae,1),Qe),Ve=r.useMemo(()=>{if("pages"!==oe||!Ie)return Le;const[e,t]=d(Le.length,Ue,ie);return Le.slice(e,t)},[Le,oe,Ie,Ue,ie]),We=r.useMemo(()=>Ve.map(({row:e,index:t})=>Ee(e,t)),[Ve,Ee]),Xe=r.useRef(null);function goPage(e){void 0===ce&&Re(e),e!==Ue&&ue?.(e)}const selectable=(e,t)=>"none"!==re&&(!se||se(e,t)),goSelected=e=>{void 0===ae&&_e(e);const t=new Set(e);le?.(e,I.filter((e,r)=>t.has(Ee(e,r))))},Ye=We.filter(e=>De.includes(e)),Ze=Ve.filter(({row:e,index:t})=>selectable(e,t)).map(({row:e,index:t})=>Ee(e,t)),et=Ze.length>0&&Ye.length===Ze.length,tt=k[Ne][ke],rt=z[Ne][ke],at=Boolean(Q),nt=J||at,lt=void 0!==O,st="none"!==re,ot=K.length+(st?1:0),it={padding:`${rt} ${tt}`,border:0,background:"none"},ct={...it,...L?{boxShadow:"inset 0 -1px 0 var(--plass-border)",background:"linear-gradient(var(--plass-glass-press), var(--plass-glass-press)), linear-gradient(var(--plass-surface), var(--plass-surface))"}:{borderBottom:P}},bodyCellStyle=e=>({...it,borderTop:0===e?0:_}),dt={padding:`${rt} ${tt}`,display:"flex",alignItems:"center",justifyContent:"space-between",gap:"0.75rem"},ut=X||x(ge),pt="pages"===oe&&Qe>1||x(fe);return t("div",{className:v("overflow-hidden",C[ke],N[p],ve),style:{...j(Ce,H),...ye},...be,children:[x(q)?e("div",{"aria-hidden":"true",className:v(w[ke],"font-semibold text-(--plass-muted-fg)"),style:{...it,borderBottom:_,textAlign:"start"},children:q}):null,ut?t("div",{style:{...dt,borderBottom:_},children:[X?e(s,{size:ke,color:Ce,density:Ne,value:Te,onChange:e=>{return t=e.target.value,void 0===Y&&Pe(t),goPage(1),void ee?.(t);var t},placeholder:te??we.search,"aria-label":we.search,className:"min-w-0 flex-1"}):e("span",{}),x(ge)?e("div",{className:v("flex items-center",b[ke]),children:ge}):null]}):null,e("div",{className:v("overflow-x-auto",lt&&"overflow-y-auto overscroll-contain"),style:lt?{maxHeight:O}:void 0,children:t("table",{className:v("text-start",f[ke],"text-(--plass-fg)"),style:A,"aria-busy":he||void 0,children:[x(q)?e("caption",{className:S,children:q}):null,t("colgroup",{children:[st?e("col",{style:{width:R[ke]}}):null,K.map(t=>e("col",{style:void 0===t.width?void 0:{width:"number"==typeof t.width?`${t.width}px`:t.width}},t.key))]}),e("thead",{children:t("tr",{children:[st?e("th",{scope:"col",className:v(L&&"sticky top-0 z-10"),style:ct,children:"multiple"===re?e(a,{size:ke,color:Ce,checked:et,indeterminate:Ye.length>0&&!et,onCheckedChange:()=>{const e=De.filter(e=>!Ze.includes(e));goSelected(et?e:[...e,...Ze])},disabled:0===Ze.length,"aria-label":we.selectAll}):e("span",{className:S,children:we.selectRow})}):null,K.map(r=>{const a=Be?.key===r.key?Be.direction:null;return e("th",{scope:"col",className:v("font-semibold whitespace-nowrap text-(--plass-muted-fg)",L&&"sticky top-0 z-10"),style:{...ct,textAlign:r.align??"start"},"aria-sort":r.sortable?"asc"===a?"ascending":"desc"===a?"descending":"none":void 0,children:r.sortable?t("button",{type:"button",className:B,onClick:()=>(e=>{const t=c(Be,e);void 0===U&&ze(t),goPage(1),W?.(t)})(r.key),children:[r.header??r.key,e(SortMark,{direction:a})]}):r.header??r.key},r.key)})]})}),e("tbody",{children:he?Array.from({length:"pages"===oe?ie:5},(t,r)=>e("tr",{className:$,children:Array.from({length:ot},(t,a)=>e("td",{style:bodyCellStyle(r),children:e(l,{size:ke,color:Ce})},a))},r)):0===Ve.length?e("tr",{className:$,children:e("td",{colSpan:ot,className:"text-(--plass-muted-fg)",style:{...it,padding:`2rem ${tt}`,textAlign:"center"},children:Se})}):Ve.map(({row:r,index:n},l)=>{const s=Ee(r,n),o=De.includes(s),c=selectable(r,n);return t("tr",{"aria-selected":st?o:void 0,className:v($,G&&l%2==1&&"[--p-row:var(--plass-stripe)]",o&&"[--p-row:var(--p-soft)]",nt&&"hover:[--p-row:var(--p-soft)]",at&&M),style:{backgroundColor:"var(--p-row)"},tabIndex:at?0:void 0,onClick:Q?()=>Q(r,n):void 0,onKeyDown:Q?e=>{e.target===e.currentTarget&&("Enter"!==e.key&&" "!==e.key||(e.preventDefault(),Q(r,n)))}:void 0,children:[st?e("td",{style:bodyCellStyle(l),children:e(a,{size:ke,color:Ce,checked:o,disabled:!c,onCheckedChange:(e,t)=>((e,t)=>{if("single"===re)return goSelected(De.includes(e)?[]:[e]),void(Xe.current=e);if(t&&null!==Xe.current&&Xe.current!==e){const t=i(We,Xe.current,e).filter(e=>Ze.includes(e));return void goSelected([...De.filter(e=>!t.includes(e)),...t])}Xe.current=e,goSelected(De.includes(e)?De.filter(t=>t!==e):[...De,e])})(s,Boolean(t.event.shiftKey)),onClick:e=>e.stopPropagation(),"aria-label":we.selectRow})}):null,K.map(t=>e("td",{style:{...bodyCellStyle(l),textAlign:t.align??"start"},children:t.render?t.render(r,n):r[t.key]},t.key))]},s)})})]})}),pt?t("div",{style:{...dt,borderTop:_},children:[e("span",{className:v(w[ke],"text-(--plass-muted-fg)"),children:x(fe)?fe:`${Ve.length} / ${Oe}`}),"pages"===oe?e(n,{size:ke,color:Ce,density:Ne,count:Qe,page:Ue,onPageChange:goPage}):null]}):null]})}
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{PlCheckbox as a}from"../checkbox/index.js";import{PlPagination as n}from"../pagination/index.js";import{PlSkeleton as l}from"../skeleton/index.js";import{PlTextField as s}from"../text-field/index.js";import{compareValues as o,keysBetween as i,nextSort as c,pageBounds as d}from"../../internal/data-table.js";import{useDefaults as u}from"../../internal/defaults.js";import{ChevronIcon as m}from"../../internal/icons.js";import{useLabels as p}from"../../internal/labels.js";import{searchHaystack as h,searchText as g}from"../../internal/search.js";import{controlTextLeadingClasses as f,cx as v,focusRingInsetClasses as y,gapClasses as b,hasContent as x,metaTextClasses as w,paddingXValues as k,radiusClasses as C,sheetRestClasses as S,srOnlyClasses as N,surfaceSlots as j}from"../../internal/styles.js";import{PlassTableScroll as z}from"../../internal/table-scroll.js";import{cellPaddingYValues as M,clickableRowClasses as P,headRule as $,rowClasses as _,rowRule as A,tableStyle as R}from"../../internal/table.js";const B={xs:"2rem",sm:"2.25rem",md:"2.75rem",lg:"3rem",xl:"3.5rem"},T=/* @__PURE__ */v("inline-flex items-center gap-1 [outline:none]","font-semibold whitespace-nowrap text-inherit","[background:none] [border:0] [padding:0] [margin:0] cursor-pointer","hover:text-(--plass-fg) [transition:color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",y);function SortMark({direction:t}){return e("span",{"aria-hidden":"true",className:v("[&_svg]:size-[1em] [&_svg]:shrink-0","[transition:opacity_var(--plass-duration)_var(--plass-ease),rotate_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",null===t?"opacity-30":"opacity-100","asc"===t?"rotate-180":""),children:e(m,{})})}export function PlDataTable({variant:m="glass",size:y,color:D,density:H,elevation:K=0,columns:I,rows:E,getRowKey:q,caption:F,label:G,empty:J,striped:L=!1,hoverable:O=!1,stickyHeader:Q=!0,maxHeight:U,onRowClick:V,sort:W,defaultSort:X=null,onSortChange:Y,searchable:Z=!1,search:ee,defaultSearch:te="",onSearchChange:re,searchPlaceholder:ae,selection:ne="none",selected:le,defaultSelected:se,onSelectedChange:oe,isRowSelectable:ie,paging:ce="scroll",pageSize:de=10,page:ue,defaultPage:me=1,onPageChange:pe,rowCount:he,manual:ge,loading:fe=!1,toolbar:ve,footer:ye,className:be,style:xe,...we}){const ke=u(),Ce=p(),Se=y??ke.size??"md",Ne=D??ke.color??"primary",je=H??ke.density??"default",ze=J??Ce.empty,[Me,Pe]=r.useState(X),[$e,_e]=r.useState(te),[Ae,Re]=r.useState(se??[]),[Be,Te]=r.useState(me),De=void 0===W?Me:W,He=ee??$e,Ke=le??Ae,Ie=!ge?.includes("sort"),Ee=!ge?.includes("search"),qe=!ge?.includes("pages"),Fe=r.useCallback((e,t)=>e.value?e.value(t):t[e.key],[]),Ge=r.useMemo(()=>E.map((e,t)=>({row:e,index:t})),[E]),Je=g(He),Le=r.useMemo(()=>{if(!Ee||""===Je)return Ge;const e=I.filter(e=>!e.unsearchable);return Ge.filter(({row:t})=>h(e.map(e=>Fe(e,t))).includes(Je))},[Ge,I,Je,Ee,Fe]),Oe=r.useMemo(()=>{if(!Ie||null===De)return Le;const e=I.find(e=>e.key===De.key);if(!e)return Le;const t="asc"===De.direction?1:-1;return[...Le].sort((r,a)=>e.compare?e.compare(r.row,a.row)*t:o(Fe(e,r.row),Fe(e,a.row),t))},[Le,I,De,Ie,Fe]),Qe=qe?Oe.length:he??Oe.length,Ue=Math.max(1,Math.ceil(Qe/de)),Ve=Math.min(Math.max(ue??Be,1),Ue),We=r.useMemo(()=>{if("pages"!==ce||!qe)return Oe;const[e,t]=d(Oe.length,Ve,de);return Oe.slice(e,t)},[Oe,ce,qe,Ve,de]),Xe="pages"!==ce||qe?0:(Ve-1)*de,Ye=r.useCallback((e,t)=>q?q(e,t):Xe+t,[q,Xe]),Ze=r.useMemo(()=>We.map(({row:e,index:t})=>Ye(e,t)),[We,Ye]),et=r.useRef(null);function goPage(e){void 0===ue&&Te(e),e!==Ve&&pe?.(e)}const selectable=(e,t)=>"none"!==ne&&(!ie||ie(e,t)),goSelected=e=>{void 0===le&&Re(e);const t=new Set(e);oe?.(e,E.filter((e,r)=>t.has(Ye(e,r))))},tt=Ze.filter(e=>Ke.includes(e)),rt=We.filter(({row:e,index:t})=>selectable(e,t)).map(({row:e,index:t})=>Ye(e,t)),at=rt.length>0&&tt.length===rt.length,nt=k[je][Se],lt=M[je][Se],st=Boolean(V),ot=O||st,it=void 0!==U,ct="none"!==ne,dt=I.length+(ct?1:0),ut={padding:`${lt} ${nt}`,border:0,background:"none"},mt={...ut,...Q?{boxShadow:"inset 0 -1px 0 var(--plass-border)",background:"linear-gradient(var(--plass-glass-press), var(--plass-glass-press)), linear-gradient(var(--plass-surface), var(--plass-surface))"}:{borderBottom:$}},bodyCellStyle=e=>({...ut,borderTop:0===e?0:A}),pt={padding:`${lt} ${nt}`,display:"flex",alignItems:"center",justifyContent:"space-between",gap:"0.75rem"},ht=Z||x(ve),gt="pages"===ce&&Ue>1||x(ye);return t("div",{className:v("overflow-hidden",C[Se],S[m],be),style:{...j(Ne,K),...xe},...we,children:[x(F)?e("div",{"aria-hidden":"true",className:v(w[Se],"font-semibold text-(--plass-muted-fg)"),style:{...ut,borderBottom:A,textAlign:"start"},children:F}):null,ht?t("div",{style:{...pt,borderBottom:A},children:[Z?e(s,{size:Se,color:Ne,density:je,value:He,onChange:e=>{return t=e.target.value,void 0===ee&&_e(t),goPage(1),void re?.(t);var t},placeholder:ae??Ce.search,"aria-label":Ce.search,className:"min-w-0 flex-1"}):e("span",{}),x(ve)?e("div",{className:v("flex items-center",b[Se]),children:ve}):null]}):null,t(z,{className:v("overflow-x-auto",it&&"overflow-y-auto overscroll-contain"),style:it?{maxHeight:U}:void 0,tableClassName:v("text-start",f[Se],"text-(--plass-fg)"),tableStyle:R,busy:fe,caption:x(F)?F:void 0,label:G,children:[t("colgroup",{children:[ct?e("col",{style:{width:B[Se]}}):null,I.map(t=>e("col",{style:void 0===t.width?void 0:{width:"number"==typeof t.width?`${t.width}px`:t.width}},t.key))]}),e("thead",{children:t("tr",{children:[ct?e("th",{scope:"col",className:v(Q&&"sticky top-0 z-10"),style:mt,children:"multiple"===ne?e(a,{size:Se,color:Ne,checked:at,indeterminate:tt.length>0&&!at,onCheckedChange:()=>{const e=Ke.filter(e=>!rt.includes(e));goSelected(at?e:[...e,...rt])},disabled:0===rt.length,"aria-label":Ce.selectAll}):e("span",{className:N,children:Ce.selectRow})}):null,I.map(r=>{const a=De?.key===r.key?De.direction:null;return e("th",{scope:"col",className:v("font-semibold whitespace-nowrap text-(--plass-muted-fg)",Q&&"sticky top-0 z-10"),style:{...mt,textAlign:r.align??"start"},"aria-sort":r.sortable?"asc"===a?"ascending":"desc"===a?"descending":"none":void 0,children:r.sortable?t("button",{type:"button",className:T,onClick:()=>(e=>{const t=c(De,e);void 0===W&&Pe(t),goPage(1),Y?.(t)})(r.key),children:[r.header??r.key,e(SortMark,{direction:a})]}):r.header??r.key},r.key)})]})}),e("tbody",{children:fe?Array.from({length:"pages"===ce?de:5},(t,r)=>e("tr",{className:_,children:Array.from({length:dt},(t,a)=>e("td",{style:bodyCellStyle(r),children:e(l,{size:Se,color:Ne})},a))},r)):0===We.length?e("tr",{className:_,children:e("td",{colSpan:dt,className:"text-(--plass-muted-fg)",style:{...ut,padding:`2rem ${nt}`,textAlign:"center"},children:ze})}):We.map(({row:r,index:n},l)=>{const s=Ye(r,n),o=Ke.includes(s),c=selectable(r,n);return t("tr",{"aria-selected":ct?o:void 0,className:v(_,L&&l%2==1&&"[--p-row:var(--plass-stripe)]",o&&"[--p-row:var(--p-soft)]",ot&&"hover:[--p-row:var(--p-soft)]",st&&P),style:{backgroundColor:"var(--p-row)"},tabIndex:st?0:void 0,onClick:V?()=>V(r,n):void 0,onKeyDown:V?e=>{e.target===e.currentTarget&&("Enter"!==e.key&&" "!==e.key||(e.preventDefault(),V(r,n)))}:void 0,children:[ct?e("td",{style:bodyCellStyle(l),children:e(a,{size:Se,color:Ne,checked:o,disabled:!c,onCheckedChange:(e,t)=>((e,t)=>{if("single"===ne)return goSelected(Ke.includes(e)?[]:[e]),void(et.current=e);if(t&&null!==et.current&&et.current!==e){const t=i(Ze,et.current,e).filter(e=>rt.includes(e));return void goSelected([...Ke.filter(e=>!t.includes(e)),...t])}et.current=e,goSelected(Ke.includes(e)?Ke.filter(t=>t!==e):[...Ke,e])})(s,Boolean(t.event.shiftKey)),onClick:e=>e.stopPropagation(),"aria-label":Ce.selectRow})}):null,I.map(t=>e("td",{style:{...bodyCellStyle(l),textAlign:t.align??"start"},children:t.render?t.render(r,n):r[t.key]},t.key))]},s)})})]}),gt?t("div",{style:{...pt,borderTop:A},children:[e("span",{className:v(w[Se],"text-(--plass-muted-fg)"),children:x(ye)?ye:`${We.length} / ${Qe}`}),"pages"===ce?e(n,{size:Se,color:Ne,density:je,count:Ue,page:Ve,onPageChange:goPage}):null]}):null]})}

package/dist/components/drawer/PlDrawer.js

@@ -1 +1 @@
-"use client";import{jsx as s,jsxs as l,Fragment as e}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{useLabels as o}from"../../internal/labels.js";import{Dialog as d}from"@base-ui/react/dialog";import{CloseIcon as i}from"../../internal/icons.js";import{cx as t,focusRingClasses as n,glassClasses as p,hasContent as u,metaTextClasses as m,sheetBodyClasses as c,sheetHeaderGapClasses as f,sheetLineClasses as x,sheetPaddingXClasses as g,sheetPaddingYClasses as h,sheetSectionGapClasses as b,sheetTitleClasses as v,surfaceSlots as y}from"../../internal/styles.js";const w={xs:"w-56",sm:"w-64",md:"w-80",lg:"w-96",xl:"w-[28rem]"},j={left:{xs:"rounded-r-(--plass-radius-xs)",sm:"rounded-r-(--plass-radius-sm)",md:"rounded-r-(--plass-radius-md)",lg:"rounded-r-(--plass-radius-lg)",xl:"rounded-r-(--plass-radius-xl)"},right:{xs:"rounded-l-(--plass-radius-xs)",sm:"rounded-l-(--plass-radius-sm)",md:"rounded-l-(--plass-radius-md)",lg:"rounded-l-(--plass-radius-lg)",xl:"rounded-l-(--plass-radius-xl)"},top:{xs:"rounded-b-(--plass-radius-xs)",sm:"rounded-b-(--plass-radius-sm)",md:"rounded-b-(--plass-radius-md)",lg:"rounded-b-(--plass-radius-lg)",xl:"rounded-b-(--plass-radius-xl)"},bottom:{xs:"rounded-t-(--plass-radius-xs)",sm:"rounded-t-(--plass-radius-sm)",md:"rounded-t-(--plass-radius-md)",lg:"rounded-t-(--plass-radius-lg)",xl:"rounded-t-(--plass-radius-xl)"}},N={left:"border-r",right:"border-l",top:"border-b",bottom:"border-t"},k={left:"flex-row justify-start",right:"flex-row justify-end",top:"flex-col justify-start",bottom:"flex-col justify-end"},z=/* @__PURE__ */[p,"relative flex flex-col overflow-hidden","text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-glass-line)]","[outline:none]"].join(" "),_=/* @__PURE__ */["[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),C=/* @__PURE__ */["fixed inset-0 z-(--plass-z-portal) bg-(--plass-scrim)","[backdrop-filter:blur(2px)] [-webkit-backdrop-filter:blur(2px)]",_].join(" "),$=/* @__PURE__ */["flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--plass-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","hover:bg-(--p-soft) hover:text-(--plass-fg)",n].join(" ");export const PlDrawerClose=d.Close;export function PlDrawer({side:n="left",mode:p="overlay",size:D,color:P,density:O,open:T,defaultOpen:B,onOpenChange:F,trigger:L,title:R,description:S,actions:V,dividers:q=!1,showClose:A,closeLabel:E,extent:G,rounded:H=!0,modal:I=!0,dismissible:J=!0,className:K,classNames:M,style:Q,children:U,...W}){const X=a(),Y=o(),Z=E??Y.close,ss=D??X.size??"md",ls=P??X.color??"primary",es=O??X.density??"default",rs="overlay"===p,as="left"===n||"right"===n,os=A??rs,[ds,is]=r.useState(B??!0),ts=g[es][ss],ns=h[es][ss],ps=q?`${ts} ${ns}`:ts,us=u(R)||u(S),ms=u(V),cs=void 0===G?null:{[as?"width":"height"]:"number"==typeof G?`${G}px`:G},fs=t(z,c[ss],N[n],H?j[n][ss]:"",rs?"[box-shadow:var(--plass-shadow-4),var(--plass-gloss-glass)]":"[box-shadow:var(--plass-gloss-glass)]",rs?_:"",as?`h-full max-w-full ${void 0===G?w[ss]:""}`:"w-full "+(void 0===G?"max-h-[85%]":""),q?"":`${ns} ${b[ss]}`,K),xs=rs?d.Title:"h2",gs=rs?d.Description:"p",hs=l(e,{children:[us||os?l("div",{className:t("flex shrink-0 items-start gap-3",ps),children:[l("div",{className:t("flex min-w-0 flex-1 flex-col",f[ss]),children:[u(R)?s(xs,{className:t("m-0 font-semibold",v[ss]),children:R}):null,u(S)?s(gs,{className:t("m-0 text-(--plass-muted-fg)",m[ss]),children:S}):null]}),os?rs?s(d.Close,{"aria-label":Z,className:$,children:s(i,{})}):s("button",{type:"button","aria-label":Z,className:$,onClick:()=>{void 0===T&&is(!1),F?.(!1)},children:s(i,{})}):null]}):null,u(U)?s("div",{className:t("min-h-0 flex-1 overflow-y-auto overscroll-contain",ps,q&&(us||os)?x:"",q?"":"-my-1 py-1"),children:U}):null,ms?s("div",{className:t("flex shrink-0 flex-wrap items-center justify-end gap-2",ps,q?x:""),children:V}):null]});return rs?l(d.Root,{open:T,defaultOpen:B,modal:I,disablePointerDismissal:!J,onOpenChange:(s,l)=>{J||s||"escape-key"!==l.reason?F?.(s):l.cancel()},children:[L?s(d.Trigger,{render:L}):null,l(d.Portal,{children:[s(d.Backdrop,{className:t("plass-portal",C,M?.backdrop)}),s(d.Viewport,{className:t("plass-portal fixed inset-0 z-(--plass-z-portal) flex",k[n]),children:s(d.Popup,{className:fs,style:{...y(ls,3),...cs,...Q},...W,children:hs})})]})]}):T??ds?s("div",{className:fs,style:{...y(ls,0),...cs,...Q},...W,children:hs}):null}
+"use client";import{jsx as s,jsxs as l,Fragment as e}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{useLabels as o}from"../../internal/labels.js";import{Dialog as i}from"@base-ui/react/dialog";import{CloseIcon as d}from"../../internal/icons.js";import{cx as t,focusRingClasses as n,glassClasses as u,hasContent as p,metaTextClasses as m,sheetBodyClasses as c,sheetHeaderGapClasses as f,sheetLineClasses as x,sheetPaddingXClasses as g,sheetPaddingYClasses as h,sheetSectionGapClasses as b,sheetTitleClasses as v,surfaceSlots as y,targetClasses as w}from"../../internal/styles.js";const j={xs:"w-56",sm:"w-64",md:"w-80",lg:"w-96",xl:"w-[28rem]"},N={left:{xs:"rounded-r-(--plass-radius-xs)",sm:"rounded-r-(--plass-radius-sm)",md:"rounded-r-(--plass-radius-md)",lg:"rounded-r-(--plass-radius-lg)",xl:"rounded-r-(--plass-radius-xl)"},right:{xs:"rounded-l-(--plass-radius-xs)",sm:"rounded-l-(--plass-radius-sm)",md:"rounded-l-(--plass-radius-md)",lg:"rounded-l-(--plass-radius-lg)",xl:"rounded-l-(--plass-radius-xl)"},top:{xs:"rounded-b-(--plass-radius-xs)",sm:"rounded-b-(--plass-radius-sm)",md:"rounded-b-(--plass-radius-md)",lg:"rounded-b-(--plass-radius-lg)",xl:"rounded-b-(--plass-radius-xl)"},bottom:{xs:"rounded-t-(--plass-radius-xs)",sm:"rounded-t-(--plass-radius-sm)",md:"rounded-t-(--plass-radius-md)",lg:"rounded-t-(--plass-radius-lg)",xl:"rounded-t-(--plass-radius-xl)"}},k={left:"border-r",right:"border-l",top:"border-b",bottom:"border-t"},z={left:"flex-row justify-start",right:"flex-row justify-end",top:"flex-col justify-start",bottom:"flex-col justify-end"},_=/* @__PURE__ */[u,"relative flex flex-col overflow-hidden","text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-glass-line)]","[outline:none]"].join(" "),C=/* @__PURE__ */["[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),$=/* @__PURE__ */["fixed inset-0 z-(--plass-z-portal) bg-(--plass-scrim)","[backdrop-filter:blur(2px)] [-webkit-backdrop-filter:blur(2px)]",C].join(" "),D=/* @__PURE__ */[w,"flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--plass-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","hover:bg-(--p-soft) hover:text-(--plass-fg)",n].join(" ");export const PlDrawerClose=i.Close;export function PlDrawer({side:n="left",mode:u="overlay",size:w,color:P,density:O,open:T,defaultOpen:B,onOpenChange:F,trigger:L,title:R,description:S,actions:V,dividers:q=!1,showClose:A,closeLabel:E,extent:G,rounded:H=!0,modal:I=!0,dismissible:J=!0,className:K,classNames:M,style:Q,children:U,...W}){const X=a(),Y=o(),Z=E??Y.close,ss=w??X.size??"md",ls=P??X.color??"primary",es=O??X.density??"default",rs="overlay"===u,as="left"===n||"right"===n,os=A??rs,[is,ds]=r.useState(B??!0),ts=g[es][ss],ns=h[es][ss],us=q?`${ts} ${ns}`:ts,ps=p(R)||p(S),ms=p(V),cs=void 0===G?null:{[as?"width":"height"]:"number"==typeof G?`${G}px`:G},fs=t(_,c[ss],k[n],H?N[n][ss]:"",rs?"[box-shadow:var(--plass-shadow-4),var(--plass-gloss-glass)]":"[box-shadow:var(--plass-gloss-glass)]",rs?C:"",as?`h-full max-w-full ${void 0===G?j[ss]:""}`:"w-full "+(void 0===G?"max-h-[85%]":""),q?"":`${ns} ${b[ss]}`,K),xs=rs?i.Title:"h2",gs=rs?i.Description:"p",hs=l(e,{children:[ps||os?l("div",{className:t("flex shrink-0 items-start gap-3",us),children:[l("div",{className:t("flex min-w-0 flex-1 flex-col",f[ss]),children:[p(R)?s(xs,{className:t("m-0 font-semibold",v[ss]),children:R}):null,p(S)?s(gs,{className:t("m-0 text-(--plass-muted-fg)",m[ss]),children:S}):null]}),os?rs?s(i.Close,{"aria-label":Z,className:D,children:s(d,{})}):s("button",{type:"button","aria-label":Z,className:D,onClick:()=>{void 0===T&&ds(!1),F?.(!1)},children:s(d,{})}):null]}):null,p(U)?s("div",{className:t("min-h-0 flex-1 overflow-y-auto overscroll-contain",us,q&&(ps||os)?x:"",q?"":"-my-1 py-1"),children:U}):null,ms?s("div",{className:t("flex shrink-0 flex-wrap items-center justify-end gap-2",us,q?x:""),children:V}):null]});return rs?l(i.Root,{open:T,defaultOpen:B,modal:I,disablePointerDismissal:!J,onOpenChange:(s,l)=>{J||s||"escape-key"!==l.reason?F?.(s):l.cancel()},children:[L?s(i.Trigger,{render:L}):null,l(i.Portal,{children:[s(i.Backdrop,{className:t("plass-portal",$,M?.backdrop)}),s(i.Viewport,{className:t("plass-portal fixed inset-0 z-(--plass-z-portal) flex",z[n]),children:s(i.Popup,{className:fs,style:{...y(ls,3),...cs,...Q},...W,children:hs})})]})]}):T??is?s("div",{className:fs,style:{...y(ls,0),...cs,...Q},...W,children:hs}):null}

package/dist/components/fieldset/PlFieldset.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as l from"react";import{Fieldset as r}from"@base-ui/react/fieldset";import{cx as i,hasContent as t,metaTextClasses as a,sheetHeaderGapClasses as n,sheetSectionGapClasses as d,sheetTitleClasses as o}from"../../internal/styles.js";export const PlFieldset=/* @__PURE__ */l.forwardRef(function PlFieldset({legend:l,description:c,disabled:m=!1,size:f="md",className:p,children:u,...x},b){const h=t(l)||t(c);return s(r.Root,{ref:b,disabled:m,className:i("m-0 flex min-w-0 flex-col border-0 p-0",d[f],p),...x,children:[h?s(r.Legend,{className:i("flex min-w-0 flex-col p-0",n[f]),children:[t(l)?e("span",{className:i("font-semibold",o[f]),children:l}):null,t(c)?e("span",{className:i("text-(--plass-muted-fg)",a[f]),children:c}):null]}):null,u]})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as s from"react";import{Fieldset as r}from"@base-ui/react/fieldset";import{FieldsetDisabledContext as i,useDisabled as n}from"../../internal/form.js";import{cx as t,hasContent as a,metaTextClasses as o,sheetHeaderGapClasses as d,sheetSectionGapClasses as m,sheetTitleClasses as c}from"../../internal/styles.js";export const PlFieldset=/* @__PURE__ */s.forwardRef(function PlFieldset({legend:s,description:f,disabled:p=!1,size:u="md",className:x,children:h,...b},j){const N=a(s)||a(f),g=n(p);return l(r.Root,{ref:j,disabled:p,className:t("m-0 flex min-w-0 flex-col border-0 p-0",m[u],x),...b,children:[N?l(r.Legend,{className:t("flex min-w-0 flex-col p-0",d[u]),children:[a(s)?e("span",{className:t("font-semibold",c[u]),children:s}):null,a(f)?e("span",{className:t("text-(--plass-muted-fg)",o[u]),children:f}):null]}):null,e(i.Provider,{value:g,children:h})]})});

package/dist/components/file-picker/PlFilePicker.d.ts

@@ -41,7 +41,9 @@ export interface PlFilePickerProps extends PlassStyleProps, Omit<React.Component
     /** The name of what the box collects. */
     label?: React.ReactNode;
     /**
-     * Where the `label` goes — above the box, or in its top edge.
+     * Where the `label` goes — above the box, or in its top edge. `float` puts it
+     * in the edge as well: the box always has words of its own where a floating
+     * label would rest.
      * Falls back to the nearest `PlassProvider`, then to `top`.
      * @default 'top'
      */

package/dist/components/file-picker/PlFilePicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as s from"react";import{Field as l}from"@base-ui/react/field";import{useDefaults as o}from"../../internal/defaults.js";import{FormControl as a,leaveFormControl as t,useFormReport as n}from"../../internal/form.js";import{glowPointerMove as i}from"../../internal/glow.js";import{CloseIcon as d}from"../../internal/icons.js";import{useLabels as c}from"../../internal/labels.js";import{FieldNotch as p,notchShellStyle as f}from"../../internal/notch.js";import{controlTextLeadingClasses as u,disabledClasses as m,focusRingClasses as h,gapClasses as b,glassClasses as v,hasContent as g,iconClasses as x,metaTextClasses as y,radiusClasses as j,readOnlyFilterClasses as $,sheetTitleClasses as k,stackGapClasses as w,surfaceSlots as N,transitionClasses as z}from"../../internal/styles.js";const _={default:{xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"},compact:{xs:"p-2",sm:"p-3",md:"p-4",lg:"p-5",xl:"p-6"}},C={solid:/* @__PURE__ */[v,"border-2 border-dashed text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */[v,"border-2 border-dashed text-(--plass-fg) bg-(--plass-glass)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"border-2 border-dashed text-(--plass-fg) bg-transparent [border-color:var(--plass-border)]"},I={solid:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line-hover)]",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line-hover)]",ghost:"hover:bg-(--p-soft) hover:[border-color:var(--p-line-hover)]"},B=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)]","group-hover/field:[border-color:var(--p-line-hover)]","group-has-[:focus-visible]/field:[border-color:var(--p-ring)]"].join(" "),R=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)] opacity-50","forced-colors:[border-color:GrayText]"].join(" "),L={solid:/* @__PURE__ */[v,"border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass),0_0_0_4px_var(--p-soft)]"].join(" "),glass:/* @__PURE__ */[v,"border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass),0_0_0_4px_var(--p-soft)]"].join(" "),ghost:/* @__PURE__ */["border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:0_0_0_4px_var(--p-soft)]"].join(" ")};function UploadIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[e("path",{d:"M8 10.5V2.75m0 0L5.25 5.5M8 2.75 10.75 5.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M2.75 9.75v1.75a1.75 1.75 0 0 0 1.75 1.75h7a1.75 1.75 0 0 0 1.75-1.75V9.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function formatFileSize(e){if(e<1e3)return`${e} B`;const r=["kB","MB","GB","TB"];let s=e/1e3,l=0;for(;s>=1e3&&l<r.length-1;)s/=1e3,l+=1;return`${s<10?s.toFixed(1):Math.round(s)} ${r[l]}`}function matchesAccept(e,r){const s=e.name.toLowerCase(),l=e.type.toLowerCase();return r.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?s.endsWith(e):e.endsWith("/*")?l.startsWith(e.slice(0,-1)):l===e)}export const PlFilePicker=/* @__PURE__ */s.forwardRef(function PlFilePicker({variant:v="glass",size:T,color:D,density:M,elevation:P=0,accept:F,multiple:S=!1,maxSize:W,maxFiles:E,value:V,defaultValue:A,onFilesChange:O,onReject:q,label:G,labelPlacement:U,description:H,error:Y,invalid:J,title:K,hint:Q,icon:X,showList:Z=!0,showRejections:ee=!0,removeLabel:re,fullWidth:se=!0,disabled:le=!1,readOnly:oe=!1,required:ae=!1,name:te,id:ne,className:ie,style:de,...ce},pe){const fe=o(),ue=c(),me=re??ue.removeItem,he=T??fe.size??"md",be=D??fe.color??"primary",ve=M??fe.density??"default",ge="notch"===(U??fe.labelPlacement??"top")&&g(G),xe=s.useRef(null),ye=s.useRef(null),je=s.useRef(null);s.useImperativeHandle(pe,()=>xe.current);const[$e,ke]=s.useState(()=>[...A??[]]),we=s.useMemo(()=>V?[...V]:$e,[V,$e]),Ne=s.useRef(0),[ze,_e]=s.useState(!1),[Ce,Ie]=s.useState({type:0,size:0,count:0}),Be=g(Y),Re=J??Be,Le=Re?"danger":be,Te=le||oe,De=s.useId(),Me=`${De}-error`,Pe=`${De}-label`,Fe=ne??`${De}-zone`,Se=s.useCallback(e=>{const r=xe.current;if(!r||"undefined"==typeof DataTransfer)return;const s=new DataTransfer;for(const r of e)s.items.add(r);r.files=s.files},[]);s.useEffect(()=>{Se(we)},[we,Se]),n(te,()=>[...we],!le);const We=s.useCallback(e=>{V||ke(e),O?.(e)},[O,V]),Ee=s.useCallback(e=>{const r=[],s=[],l=S?E??Number.POSITIVE_INFINITY:1,o=S?we.length:0;for(const a of e)F&&!matchesAccept(a,F)?s.push({file:a,reason:"type"}):void 0!==W&&a.size>W?s.push({file:a,reason:"size"}):o+r.length>=l?s.push({file:a,reason:"count"}):r.push(a);return{kept:r,rejections:s}},[F,we.length,E,W,S]),Ve=s.useCallback(e=>{const{kept:r,rejections:s}=Ee(e),l={type:0,size:0,count:0};for(const e of s)l[e.reason]+=1;Ie(l),s.length>0&&q?.(s),r.length>0&&We(S?[...we,...r]:r)},[Ee,We,we,S,q]),Ae=s.useCallback(()=>{Ie(e=>e.type||e.size||e.count?{type:0,size:0,count:0}:e)},[]),Oe=[["type",ue.filesRejectedType],["size",ue.filesRejectedSize],["count",ue.filesRejectedCount]].filter(([e])=>Ce[e]>0),browse=()=>{Te||(Ae(),xe.current?.click())},qe=["relative flex w-full flex-col items-center justify-center text-center","cursor-pointer select-none",_[ve][he],j[he],b[he],z,x,ge?"":h,le?`${m[v]} border-2 border-dashed`:oe?`${C[v]} ${$} cursor-default`:ze?L[v]:C[v],Te||ze?"":I[v],Te?"":"plass-glow"].filter(Boolean).join(" "),Ge=e("span",{id:Pe,className:[y[he],"font-semibold",le?"text-(--plass-muted-fg)":"text-(--plass-fg)"].join(" "),children:G});return r(l.Root,{name:te,disabled:le,invalid:Re,className:["flex-col align-top",w[he],se?"flex w-full":"inline-flex",ie??""].filter(Boolean).join(" "),style:{...N(Le,P),...de},...ce,children:[g(G)&&!ge?Ge:null,r("div",{className:`flex w-full flex-col ${w[he]}`,onDragEnter:e=>{Te||(e.preventDefault(),Ne.current+=1,_e(!0))},onDragOver:e=>{Te||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{Te||(Ne.current=Math.max(0,Ne.current-1),0===Ne.current&&_e(!1))},onDrop:e=>{Te||(e.preventDefault(),Ne.current=0,_e(!1),Ve(Array.from(e.dataTransfer.files)))},children:[e(l.Validity,{children:({validity:s})=>{const l=!1===s.valid,o=!Be&&l&&!le&&!0!==J,a=[g(H)||Be?De:null,o?Me:null].filter(Boolean).join(" ")||void 0;return e(p,{notched:ge,size:he,density:ve,variant:v,disabled:le,readOnly:oe,label:Ge,edgeClassName:le?R:Te?"border-2 border-dashed [border-color:var(--plass-border)]":ze?"border-2 border-dashed [border-color:var(--p-ring)]":B,children:r("button",{ref:ye,type:"button",id:Fe,"aria-labelledby":g(G)?`${Pe} ${Fe}`:void 0,disabled:le,"aria-describedby":a,"aria-invalid":Re||l||void 0,className:qe,style:ge?f:void 0,onPointerMove:i(!Te),onClick:browse,onBlur:()=>t(je.current),children:[void 0===X?e("span",{className:"flex items-center text-(--p-accent) [&_svg]:size-[1.8em]",children:e(UploadIcon,{})}):g(X)?e("span",{className:"flex items-center text-(--p-accent) [&_svg]:size-[1.8em]",children:X}):null,e("span",{className:`font-semibold ${k[he]}`,children:K??ue.filePickerTitle}),g(Q)?e("span",{className:`text-(--plass-muted-fg) ${y[he]}`,children:Q}):null]})})}}),e("input",{ref:xe,type:"file",name:te,accept:F,multiple:S,disabled:Te,tabIndex:-1,"aria-hidden":"true",className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>{Ve(Array.from(e.target.files??[])),Se(we)}}),Z&&we.length>0?e("ul",{role:"list",className:`flex w-full flex-col ${w[he]} m-0 list-none p-0`,children:we.map((s,l)=>r("li",{className:["flex w-full items-center gap-2 px-2 py-1.5",j.xs,u[he],"bg-(--p-soft) text-(--plass-fg)"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:s.name}),e("span",{className:`shrink-0 text-(--plass-muted-fg) tabular-nums ${y[he]}`,children:formatFileSize(s.size)}),Te?null:e("button",{type:"button","aria-label":me(s.name),className:["inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full","size-[1.3em] text-(--plass-muted-fg) opacity-70","[transition:opacity_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","[&_svg]:size-[0.9em]","hover:text-(--plass-fg) hover:opacity-100 focus-visible:opacity-100",h].join(" "),onClick:()=>{Ae(),We(we.filter((e,r)=>r!==l))},children:e(d,{})})]},`${s.name}-${s.size}-${s.lastModified}-${l}`))}):null]}),ee&&Oe.length>0?e("div",{role:"status",className:`flex w-full flex-col ${y[he]} text-(--plass-danger-accent)`,children:Oe.map(([r,s])=>e("span",{children:s(Ce[r])},r))}):null,g(H)&&!Be?e("span",{id:De,className:`${y[he]} text-(--plass-muted-fg)`,children:H}):null,Be?e("span",{id:De,className:`${y[he]} text-(--p-accent)`,children:Y}):e(l.Error,{id:Me,className:`${y[he]} text-(--p-accent)`}),e(a,{ref:je,value:we.map(e=>e.name),required:ae&&!oe,disabled:le,standIn:()=>ye.current})]})});
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as s from"react";import{Field as o}from"@base-ui/react/field";import{useDefaults as l}from"../../internal/defaults.js";import{FormControl as a,leaveFormControl as t,useFormReport as n,useDisabled as i}from"../../internal/form.js";import{glowPointerMove as d}from"../../internal/glow.js";import{CloseIcon as c}from"../../internal/icons.js";import{useLabels as p}from"../../internal/labels.js";import{FieldNotch as f,notchShellStyle as u,resolveNotch as m}from"../../internal/notch.js";import{controlTextLeadingClasses as h,disabledClasses as b,fieldSlots as v,focusRingClasses as g,gapClasses as x,glassClasses as y,hasContent as j,iconClasses as $,metaTextClasses as k,radiusClasses as w,readOnlyFilterClasses as N,sheetTitleClasses as z,stackGapClasses as _,targetClasses as C,transitionClasses as I}from"../../internal/styles.js";const B={default:{xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"},compact:{xs:"p-2",sm:"p-3",md:"p-4",lg:"p-5",xl:"p-6"}},R={solid:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--plass-glass)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"border-2 border-dashed text-(--plass-fg) bg-transparent [border-color:var(--plass-border)]"},L={solid:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line-hover)]",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line-hover)]",ghost:"hover:bg-(--p-soft) hover:[border-color:var(--p-line-hover)]"},T=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)]","group-hover/field:[border-color:var(--p-line-hover)]","group-has-[:focus-visible]/field:[border-color:var(--p-ring)]"].join(" "),D=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)] opacity-50","forced-colors:[border-color:GrayText]"].join(" "),M={solid:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass),0_0_0_4px_var(--p-soft)]"].join(" "),glass:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass),0_0_0_4px_var(--p-soft)]"].join(" "),ghost:/* @__PURE__ */["border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:0_0_0_4px_var(--p-soft)]"].join(" ")};function UploadIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[e("path",{d:"M8 10.5V2.75m0 0L5.25 5.5M8 2.75 10.75 5.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M2.75 9.75v1.75a1.75 1.75 0 0 0 1.75 1.75h7a1.75 1.75 0 0 0 1.75-1.75V9.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function formatFileSize(e){if(e<1e3)return`${e} B`;const r=["kB","MB","GB","TB"];let s=e/1e3,o=0;for(;s>=1e3&&o<r.length-1;)s/=1e3,o+=1;return`${s<10?s.toFixed(1):Math.round(s)} ${r[o]}`}function matchesAccept(e,r){const s=e.name.toLowerCase(),o=e.type.toLowerCase();return r.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?s.endsWith(e):e.endsWith("/*")?o.startsWith(e.slice(0,-1)):o===e)}export const PlFilePicker=/* @__PURE__ */s.forwardRef(function PlFilePicker({variant:y="glass",size:P,color:F,density:S,elevation:W=0,accept:E,multiple:V=!1,maxSize:A,maxFiles:O,value:q,defaultValue:G,onFilesChange:U,onReject:H,label:Y,labelPlacement:J,description:K,error:Q,invalid:X,title:Z,hint:ee,icon:re,showList:se=!0,showRejections:oe=!0,removeLabel:le,fullWidth:ae=!0,disabled:te=!1,readOnly:ne=!1,required:ie=!1,name:de,id:ce,className:pe,style:fe,...ue},me){const he=l(),be=i(te),ve=p(),ge=le??ve.removeItem,xe=P??he.size??"md",ye=F??he.color??"primary",je=S??he.density??"default",$e=J??he.labelPlacement??"top",{notched:ke}=m($e,Y,!0),we=s.useRef(null),Ne=s.useRef(null),ze=s.useRef(null);s.useImperativeHandle(me,()=>we.current);const[_e,Ce]=s.useState(()=>[...G??[]]),Ie=s.useMemo(()=>q?[...q]:_e,[q,_e]),Be=s.useRef(0),[Re,Le]=s.useState(!1),[Te,De]=s.useState({type:0,size:0,count:0}),Me=j(Q),Pe=X??Me,Fe=Pe?"danger":ye,Se=be||ne,We=s.useId(),Ee=`${We}-error`,Ve=`${We}-label`,Ae=ce??`${We}-zone`,Oe=s.useCallback(e=>{const r=we.current;if(!r||"undefined"==typeof DataTransfer)return;const s=new DataTransfer;for(const r of e)s.items.add(r);r.files=s.files},[]);s.useEffect(()=>{Oe(Ie)},[Ie,Oe]),n(de,()=>[...Ie],!be);const qe=s.useCallback(e=>{q||Ce(e),U?.(e)},[U,q]),Ge=s.useCallback(e=>{const r=[],s=[],o=V?O??Number.POSITIVE_INFINITY:1,l=V?Ie.length:0;for(const a of e)E&&!matchesAccept(a,E)?s.push({file:a,reason:"type"}):void 0!==A&&a.size>A?s.push({file:a,reason:"size"}):l+r.length>=o?s.push({file:a,reason:"count"}):r.push(a);return{kept:r,rejections:s}},[E,Ie.length,O,A,V]),Ue=s.useCallback(e=>{const{kept:r,rejections:s}=Ge(e),o={type:0,size:0,count:0};for(const e of s)o[e.reason]+=1;De(o),s.length>0&&H?.(s),r.length>0&&qe(V?[...Ie,...r]:r)},[Ge,qe,Ie,V,H]),He=s.useCallback(()=>{De(e=>e.type||e.size||e.count?{type:0,size:0,count:0}:e)},[]),Ye=[["type",ve.filesRejectedType],["size",ve.filesRejectedSize],["count",ve.filesRejectedCount]].filter(([e])=>Te[e]>0),browse=()=>{Se||(He(),we.current?.click())},Je=["relative flex w-full flex-col items-center justify-center text-center","cursor-pointer select-none",B[je][xe],w[xe],x[xe],I,$,ke?"":g,be?`${b[y]} border-2 border-dashed`:ne?`${R[y]} ${N} cursor-default`:Re?M[y]:R[y],Se||Re?"":L[y],Se?"":"plass-glow"].filter(Boolean).join(" "),Ke=e("span",{id:Ve,className:[k[xe],"font-semibold",be?"text-(--plass-muted-fg)":"text-(--plass-fg)"].join(" "),children:Y});return r(o.Root,{name:de,disabled:be,invalid:Pe,className:["flex-col align-top",_[xe],ae?"flex w-full":"inline-flex",pe??""].filter(Boolean).join(" "),style:{...v(Fe,W),...fe},...ue,children:[j(Y)&&!ke?Ke:null,r("div",{className:`flex w-full flex-col ${_[xe]}`,onDragEnter:e=>{Se||(e.preventDefault(),Be.current+=1,Le(!0))},onDragOver:e=>{Se||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{Se||(Be.current=Math.max(0,Be.current-1),0===Be.current&&Le(!1))},onDrop:e=>{Se||(e.preventDefault(),Be.current=0,Le(!1),Ue(Array.from(e.dataTransfer.files)))},children:[e(o.Validity,{children:({validity:s})=>{const o=!1===s.valid,l=!Me&&o&&!be&&!0!==X,a=[j(K)||Me?We:null,l?Ee:null].filter(Boolean).join(" ")||void 0;return e(f,{notched:ke,size:xe,density:je,variant:y,disabled:be,readOnly:ne,label:Ke,edgeClassName:be?D:Se?"border-2 border-dashed [border-color:var(--plass-border)]":Re?"border-2 border-dashed [border-color:var(--p-ring)]":T,children:r("button",{ref:Ne,type:"button",id:Ae,"aria-labelledby":j(Y)?`${Ve} ${Ae}`:void 0,disabled:be,"aria-describedby":a,"aria-invalid":Pe||o||void 0,className:Je,style:ke?u:void 0,onPointerMove:d(!Se),onClick:browse,onBlur:()=>t(ze.current),children:[void 0===re?e("span",{className:"flex items-center text-(--p-accent) [&_svg]:size-[1.8em]",children:e(UploadIcon,{})}):j(re)?e("span",{className:"flex items-center text-(--p-accent) [&_svg]:size-[1.8em]",children:re}):null,e("span",{className:`font-semibold ${z[xe]}`,children:Z??ve.filePickerTitle}),j(ee)?e("span",{className:`text-(--plass-muted-fg) ${k[xe]}`,children:ee}):null]})})}}),e("input",{ref:we,type:"file",name:de,accept:E,multiple:V,disabled:Se,tabIndex:-1,"aria-hidden":"true",className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>{Ue(Array.from(e.target.files??[])),Oe(Ie)}}),se&&Ie.length>0?e("ul",{role:"list",className:`flex w-full flex-col ${_[xe]} m-0 list-none p-0`,children:Ie.map((s,o)=>r("li",{className:["flex w-full items-center gap-2 px-2 py-1.5",w.xs,h[xe],"bg-(--p-soft) text-(--plass-fg)"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:s.name}),e("span",{className:`shrink-0 text-(--plass-muted-fg) tabular-nums ${k[xe]}`,children:formatFileSize(s.size)}),Se?null:e("button",{type:"button","aria-label":ge(s.name),className:[C,"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full","size-[1.3em] text-(--plass-muted-fg) opacity-70","[transition:opacity_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","[&_svg]:size-[0.9em]","hover:text-(--plass-fg) hover:opacity-100 focus-visible:opacity-100",g].join(" "),onClick:()=>{He(),qe(Ie.filter((e,r)=>r!==o))},children:e(c,{})})]},`${s.name}-${s.size}-${s.lastModified}-${o}`))}):null]}),oe&&Ye.length>0?e("div",{role:"status",className:`flex w-full flex-col ${k[xe]} text-(--plass-danger-accent)`,children:Ye.map(([r,s])=>e("span",{children:s(Te[r])},r))}):null,j(K)&&!Me?e("span",{id:We,className:`${k[xe]} text-(--plass-muted-fg)`,children:K}):null,Me?e("span",{id:We,className:`${k[xe]} text-(--p-accent)`,children:Q}):e(o.Error,{id:Ee,className:`${k[xe]} text-(--p-accent)`}),e(a,{ref:ze,value:Ie.map(e=>e.name),required:ie&&!ne,disabled:be,standIn:()=>Ne.current})]})});

package/dist/components/floating-action-button/PlFloatingActionButton.d.ts

@@ -28,6 +28,11 @@ export interface PlFloatingActionButtonProps extends Omit<PlButtonProps, 'childr
     corner?: PlassCorner;
     /**
      * How far it stands off the two edges it is against. A number is pixels.
+     *
+     * The device's safe area on those two edges is added on top, so the button
+     * clears the home indicator, the navigation bar or a camera cutout of an
+     * edge-to-edge screen rather than sitting under it. On a screen with no such
+     * edge the safe area is `0`, and this is the whole distance.
      * @default '1.5rem'
      */
     offset?: number | string;

package/dist/components/floating-action-button/PlFloatingActionButton.js

@@ -1 +1 @@
-"use client";import{jsx as t}from"react/jsx-runtime";import*as o from"react";import{PlButton as n}from"../button/PlButton.js";import{PlIconButton as e}from"../icon-button/PlIconButton.js";import{useDefaults as r}from"../../internal/defaults.js";import{cx as i,toLength as s}from"../../internal/styles.js";const a={"top-start":["Start","Start"],"top-end":["Start","End"],"bottom-start":["End","Start"],"bottom-end":["End","End"]};export const PlFloatingActionButton=/* @__PURE__ */o.forwardRef(function PlFloatingActionButton({icon:o,label:l,extended:c=!1,corner:m="bottom-end",offset:f,floating:d=!0,variant:u="solid",size:p,elevation:b=3,className:j,style:x,...B},g){const v=r(),z=p??v.size??"lg",[E,P]=a[m],S=s(f)??"1.5rem",y=d?{position:"fixed",[`insetBlock${E}`]:S,[`insetInline${P}`]:S}:{},I={ref:g,variant:u,size:z,elevation:b,className:i(d?"z-30":"",j),style:{...y,...x},...B};return c?t(n,{...I,startIcon:o,children:l}):t(e,{...I,icon:o,label:l})});
+"use client";import{jsx as t}from"react/jsx-runtime";import*as n from"react";import{PlButton as o}from"../button/PlButton.js";import{PlIconButton as e}from"../icon-button/PlIconButton.js";import{useDefaults as a}from"../../internal/defaults.js";import{cx as r,safeInlineClasses as i,toLength as s}from"../../internal/styles.js";const l={"top-start":["Start","Start"],"top-end":["Start","End"],"bottom-start":["End","Start"],"bottom-end":["End","End"]},c={Start:"env(safe-area-inset-top, 0px)",End:"env(safe-area-inset-bottom, 0px)"};export const PlFloatingActionButton=/* @__PURE__ */n.forwardRef(function PlFloatingActionButton({icon:n,label:m,extended:f=!1,corner:d="bottom-end",offset:p,floating:u=!0,variant:b="solid",size:x,elevation:v=3,className:j,style:B,...E},S){const $=a(),g=x??$.size??"lg",[z,P]=l[d],y=s(p)??"1.5rem",I=u?{position:"fixed",[`insetBlock${z}`]:`calc(${y} + ${c[z]})`,[`insetInline${P}`]:`calc(${y} + var(--p-safe-inline, 0px))`}:{},A={ref:S,variant:b,size:g,elevation:v,className:r(u&&"z-30",u&&i[P],j),style:{...I,...B},...E};return f?t(o,{...A,startIcon:n,children:m}):t(e,{...A,icon:n,label:m})});