plass-ui 1.7.0 → 1.8.0

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{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})})})});
+"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 b}from"../../internal/color.js";import{controlTextClasses as v,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:v,disabled:x,readOnly:k,invalid:N,labels:I,className:T}){const D=x||k,M=_[v],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[v],S[v],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[v],C[v],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[v],"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[v],"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[v]),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[v],"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 p-0","[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:b(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:b,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,"aria-label":Q,"aria-labelledby":Z,...ee},ae){const re=l(),le=W??re.size??"md",se=U??re.color??"primary",oe=X??re.density??"default",ne=r.useMemo(()=>({...defaultColorPickerLabels,...R}),[R]),[te,ie]=r.useState(h),de=d??te,[ce,he]=r.useState(H),ue=B??ce,[fe,pe]=r.useState(()=>m(de)??{hsv:I,alpha:1}),[me,be]=r.useState(()=>de),ve=p(fe.hsv,C?fe.alpha:1,y),ge=""===de;r.useEffect(()=>{const e=m(de);e?p(e.hsv,C?e.alpha:1,y)!==ve&&(be(de),pe(e)):be(de)},[de,ve,C,y]);const commit=(e,a)=>{pe(e);const r=p(e.hsv,C?e.alpha:1,y);be(a??r),void 0===d&&ie(r),b?.(r)},[xe,ye]=r.useState(null),we=r.useCallback(e=>{ye(e),"function"==typeof ae?ae(e):ae&&(ae.current=e)},[ae]),Ce=t(xe),ke=n(M)||Ce,Ne=T??Boolean(z),Pe=r.useId(),je=e(ColorPanel,{hsv:fe.hsv,alphaValue:fe.alpha,onChange:commit,text:me,onTextChange:e=>{be(e);const a=m(e);a&&commit(a,e)},withAlpha:C,swatches:P,editable:O,size:le,disabled:ke,readOnly:A,invalid:j&&Ne,labels:ne,className:j?G?.control:void 0});i(q,()=>ge?"":ve,j&&!ke);const Oe=q?e("input",{type:"hidden",name:q,value:ge?"":ve,disabled:ke}):null;if(j){const r=Ne?"danger":se,l=[$?`${Pe}-description`:null,z?`${Pe}-error`:null].filter(Boolean).join(" ")||void 0;return a("div",{ref:we,role:"group","aria-label":Q,"aria-labelledby":Z??(S&&!Q?`${Pe}-label`:void 0),"aria-describedby":l,className:g("flex flex-col",k[le],F),style:{...N(r,Y),...J},...ee,children:[S?e("span",{id:`${Pe}-label`,className:g(w[le],"font-semibold",ke?"text-(--plass-muted-fg)":"text-(--plass-fg)",G?.label),children:S}):null,je,$?e("span",{id:`${Pe}-description`,className:g(x(le),G?.description),children:$}):null,z?e("span",{id:`${Pe}-error`,className:g(w[le],"text-(--p-accent)",G?.error),children:z}):null,Oe]})}return e("div",{ref:we,className:L?"w-full":"inline-block",...ee,children:e(o,{"aria-label":Q,"aria-labelledby":Z,variant:E,size:le,color:se,density:oe,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:ge?"transparent":u(fe.hsv,C?fe.alpha:1)}})}),display:ge?ne.empty:ve,samples:widthSamples(y,C),empty:ge,clearable:V,onClear:()=>{void 0===d&&ie(""),be(""),b?.("")},open:ue,onOpenChange:e=>{void 0===B&&he(e),K?.(e)},labels:{...s,clear:ne.clear},name:q,formValue:ge?"":ve,children:e("div",{className:v[le],children:je})})})});

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

@@ -160,5 +160,5 @@ export interface PlComboboxProps<Multiple extends boolean | undefined = false> e
  * 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: 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 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, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...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{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)})]})}
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{FadedContext as t,controlNaming as s,useDisabled as r}from"../../internal/form.js";import{useDefaults as n,useRuntimeLocale as i}from"../../internal/defaults.js";import{useLabels as o}from"../../internal/labels.js";import{Combobox as c}from"@base-ui/react/combobox";import{Field as d}from"@base-ui/react/field";import{PlChip as m}from"../chip/PlChip.js";import{CheckIcon as p,ChevronIcon as u,CloseIcon as h,PlusIcon as b}from"../../internal/icons.js";import{hotKeyHandler as f}from"../../internal/keys.js";import{useFieldLight as g}from"../../internal/glow.js";import{FieldNotch as v,floatControlClassName as y,notchShellStyle as x,resolveNotch as w}from"../../internal/notch.js";import{chipRemoveClasses as N,controlHeightClasses as j,controlTextLeadingClasses as C,cx as L,disabledClasses as I,fieldDescriptionClasses as S,fieldReadOnlyClasses as z,fieldRestClasses as _,fieldSlots as O,focusWithinRingClasses as P,forcedHighlightedClasses as V,gapClasses as A,glassClasses as M,hasContent as k,iconClasses as R,metaTextClasses as F,paddingXClasses as T,radiusClasses as $,stackGapClasses as q,surfaceSlots as D,targetClasses as E,transitionClasses as K}from"../../internal/styles.js";const G=/* @__PURE__ */["relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",K,R].join(" "),H=P,W={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"},B=/* @__PURE__ */[M,"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(" "),J=/* @__PURE__ */["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--plass-radius-xs) py-1.5 pe-2 ps-7",K,"data-[highlighted]:bg-(--p-soft-hover) data-[highlighted]:text-(--p-accent)",V,"data-[selected]:font-semibold data-[selected]:text-(--p-accent)","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50","[outline:none]"].join(" "),Q=/* @__PURE__ */["inline-flex h-[1lh] shrink-0 cursor-pointer items-center justify-center p-0","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(" "),U=/* @__PURE__ */L(E,Q),X=[];function toArray(e){return null==e?X:Array.isArray(e)?e:[e]}export function PlCombobox({variant:P="glass",size:V,color:M,density:R,elevation:E=0,items:K,multiple:X,value:Y,defaultValue:Z,onValueChange:ee,onInputValueChange:ae,allowCustom:le=!0,customLabel:te,clearable:se=!1,emptyMessage:re,limit:ne,placeholder:ie,label:oe,labelPlacement:ce,description:de,error:me,invalid:pe,startIcon:ue,fullWidth:he=!1,disabled:be=!1,readOnly:fe=!1,required:ge=!1,name:ve,open:ye,defaultOpen:xe,onOpenChange:we,openLabel:Ne,clearLabel:je,removeLabel:Ce,inputRef:Le,id:Ie,className:Se,hotKeys:ze,classNames:_e,style:Oe,"aria-label":Pe,"aria-labelledby":Ve,...Ae}){const Me=n(),ke=i(void 0),Re=r(be),Fe=o(),Te=Ne??Fe.open,$e=je??Fe.clear,qe=re??Fe.empty,De=Ce??Fe.removeItem,Ee=V??Me.size??"md",Ke=M??Me.color??"primary",Ge=R??Me.density??"default",He=ce??Me.labelPlacement??"top",{notched:We,float:Be}=w(He,oe,k(ue)),Je=k(me),Qe=pe??Je,Ue=Qe?"danger":Ke,Xe=!0===X,Ye=l.useMemo(()=>K.map(e=>({value:e.value,label:e.label??String(e.value),disabled:e.disabled})),[K]),[Ze,ea]=l.useState(()=>toArray(Z)),aa=void 0===Y?Ze:toArray(Y),[la,ta]=l.useState(""),sa=l.useMemo(()=>new Map(Ye.map(e=>[e.value,e])),[Ye]),ra=l.useCallback(e=>sa.get(e)??{value:e,label:String(e),custom:!0},[sa]),na=la.trim(),ia=na.toLocaleLowerCase(ke),oa=""===na||Ye.some(e=>e.label.toLocaleLowerCase(ke)===ia||String(e.value).toLocaleLowerCase(ke)===ia)||aa.some(e=>String(e).toLocaleLowerCase(ke)===ia),ca=!le||fe||Re||oa?null:na,da=l.useMemo(()=>null===ca?Ye:[...Ye,{value:ca,label:ca,custom:!0}],[Ye,ca]),ma=l.useMemo(()=>c.createItems(da,{getValue:e=>e.value,getLabel:e=>e.label}),[da]),pa=Xe?aa:aa[0]??null,ua=!Re&&!fe,ha=g(ua),ba=L(G,We?"":H,C[Ee],$[Ee],A[Ee],Xe?W[Ee]:j[Ee],`${T[Ge][Ee]} pe-1.5`,Re?I[P]:fe?z[P]:_[P],ua?"plass-glow":""),fa=/* @__PURE__ */["min-w-0 flex-1 self-stretch bg-transparent p-0 [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(c.Input,{ref:Le,placeholder:Be?ie||" ":ie,...s(Pe,Ve),onKeyDown:f(ze,void 0),className:L(fa,Xe&&"min-w-16",Xe&&a&&"ms-1.5",Be&&!a&&y)}),ga=e(d.Label,{className:L(F[Ee],"font-semibold",Re?"text-(--plass-muted-fg)":"text-(--plass-fg)",_e?.label),children:oe});return a(d.Root,{disabled:Re,invalid:Qe,className:L("flex-col align-top",q[Ee],he?"flex w-full":"inline-flex",Se),style:{...O(Ue,E),...Oe},...Ae,children:[k(oe)&&!We?ga:null,a(c.Root,{id:Ie,name:ve,items:ma,multiple:Xe,value:pa,onValueChange:e=>{const a=toArray(e);0===a.length&&0===aa.length||function commit(e){void 0===Y&&ea(e),ee?.(Xe?e:e[0]??null)}(a)},onInputValueChange:e=>{ta(e),ae?.(e)},open:ye,defaultOpen:xe,onOpenChange:e=>we?.(e),autoHighlight:!0,itemToStringLabel:String,itemToStringValue:String,limit:ne,locale:ke,disabled:Re,readOnly:fe,required:ge,children:[e(v,{notched:We,size:Ee,density:Ge,variant:P,disabled:Re,readOnly:fe,float:Be,label:ga,children:a(c.InputGroup,{style:We?x:void 0,...ha,className:L(ba,_e?.control),children:[ue?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--plass-muted-fg)",children:ue}):null,Xe?e(c.Chips,{className:"flex min-w-0 flex-1 flex-wrap items-center gap-1",children:e(t.Provider,{value:Re,children:e(c.Value,{children:t=>a(l.Fragment,{children:[t.map(ra).map(a=>e(c.Chip,{render:e(m,{variant:"glass",size:Ee,color:Ue,density:"compact",disabled:Re,endIcon:fe||Re?null:e(c.ChipRemove,{"aria-label":De(a.label),className:N,children:e(h,{})})}),children:a.label},String(a.value))),renderInput(t.length>0)]})})})}):renderInput(!1),!se||fe||Re?null:e(c.Clear,{"aria-label":$e,className:U,children:e(h,{})}),e(c.Trigger,{"aria-label":Te,"aria-labelledby":void 0,className:Q,children:e(c.Icon,{className:L("flex items-center","[transition:rotate_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[popup-open]:rotate-180"),children:e(u,{})})})]})}),e(c.Portal,{children:e(c.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",sideOffset:6,children:a(c.Popup,{className:L(B,$[Ee],C[Ee]),style:D(Ue,3),children:[e(c.Empty,{className:"px-2 py-1.5 text-(--plass-muted-fg) empty:hidden",children:qe}),e(c.List,{children:t=>e(c.Item,{value:t.value,disabled:t.disabled,className:J,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(b,{})}),e("span",{className:"truncate",children:te?te(t.label):Fe.addCustom(t.label)})]}):a(l.Fragment,{children:[e(c.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(p,{})}),e("span",{className:"truncate",children:t.label})]})},`${t.custom?"custom:":""}${String(t.value)}`)})]})})})]}),de?e(d.Description,{className:L(S(Ee),_e?.description),children:de}):null,e(d.Error,Je?{match:!0,className:L(F[Ee],"text-(--p-accent)",_e?.error),children:me}:{className:L(F[Ee],"text-(--p-accent)",_e?.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,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})]})})})]})})}
+"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 r}from"@base-ui/react/autocomplete";import{Dialog as o}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 f,metaTextClasses as x,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:var(--plass-scrim-blur)] [-webkit-backdrop-filter:var(--plass-scrim-blur)]","[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:R,label:K,size:V,color:E,density:F,className:I,classNames:T,style:B}){const D=t(),L=l(),W=K??L.commandPalette,q=H??L.commandPalettePlaceholder,A=R??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(""),$=a.useRef(null),ee=u??U,se=a.useRef(ee);a.useEffect(()=>{se.current&&!ee&&Z(""),se.current=ee},[ee]);const ae=a.useCallback(e=>{void 0===u&&X(e),v?.(e)},[u,v]);n(!1===O?void 0:{[O]:()=>ae(!0)},{whileTyping:!0});const te=a.useMemo(()=>c.map(haystackOf),[c]),le=a.useMemo(()=>{const e=p(Y);return""===e?c:c.filter((s,a)=>te[a].includes(e))},[c,te,Y]),re=a.useMemo(()=>le.length>100?le.slice(0,100):le,[le]),oe=le.length-re.length,ie=b(S),ne=b(_);return e(o.Root,{open:ee,onOpenChange:ae,children:s(o.Portal,{children:[e(o.Backdrop,{className:m("plass-portal",w,T?.backdrop)}),e(o.Viewport,{className:"plass-portal fixed inset-0 z-(--plass-z-portal) flex justify-center p-4 pt-[12vh]",children:e(o.Popup,{initialFocus:$,"aria-label":W,className:m(k,g[G],d[G],void 0===ie?N[G]:"","self-start",I),style:{...y(J,3),...void 0===ie?null:{maxWidth:ie},...B},children:s(r.Root,{inline:!0,open:!0,mode:"list",items:re,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(r.Input,{ref:$,placeholder:q,className:m("min-w-0 flex-1 bg-transparent p-0 [font:inherit] text-inherit [outline:none]","placeholder:text-(--plass-muted-fg) caret-(--p-accent)","selection:bg-(--p-soft-press)",j[G])})}),e(r.List,{className:"min-h-0 flex-1 overflow-y-auto overscroll-contain p-1",style:{maxHeight:ne},children:(t,l)=>s(a.Fragment,{children:[t.group&&t.group!==re[l-1]?.group?e("div",{role:"presentation",className:m(z[G],"pt-2 pb-1 font-medium text-(--plass-muted-fg)",x[G]),children:t.group}):null,s(r.Item,{index:l,value:t,disabled:t.disabled,onClick:()=>(e=>{e.disabled||(e.onSelect?.(),M?.(e),ae(!1))})(t),className:m(C,g[G],z[G],P["compact"===Q?"xs":G]),children:[f(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}),f(t.description)?e("span",{className:m("truncate text-(--plass-muted-fg)",x[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)]",x[G]),children:L.chartMore(oe)}):null,e(r.Empty,{className:m(z[G],"py-6 text-center text-(--plass-muted-fg)",x[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,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}
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as r from"react";import{PlButton as o}from"../button/PlButton.js";import{useLabels as t}from"../../internal/labels.js";import{lazyPart as l}from"../../internal/lazy.js";const c=/* @__PURE__ */l(()=>import("../modal/PlModal.js").then(e=>e.PlModal));function ConfirmModal({open:n,...o}){const[t,l]=r.useState(!1);return r.useLayoutEffect(()=>{l(!0)},[]),e(c,{open:!0===n&&t,...o})}const i=/* @__PURE__ */r.createContext(null);export function PlConfirmProvider({size:l,color:s,confirmLabel:u,cancelLabel:a,acknowledgeLabel:f,width:d,children:m}){const h=t(),[p,w]=r.useState(!1),[C,b]=r.useState(null),v=r.useRef(null),k=r.useRef([]),P=r.useRef(0),z=r.useRef(null),j=r.useCallback(e=>{const n=v.current;if(!n)return;n.resolve(e);const r=k.current.shift();if(r)return v.current=r,void b(r);v.current=null,w(!1)},[]),x=r.useCallback((e,n)=>new Promise(r=>{P.current+=1;const o={id:P.current,kind:e,options:n,resolve:r};v.current?k.current.push(o):(v.current=o,b(o),w(!0))}),[]),E=r.useMemo(()=>({confirm:e=>x("confirm",e),alert:e=>x("alert",e).then(()=>{})}),[x]);r.useEffect(()=>function whenIdle(e){if("function"==typeof window.requestIdleCallback){const n=window.requestIdleCallback(e,{timeout:2e3});return()=>window.cancelIdleCallback(n)}const n=window.setTimeout(e,500);return()=>window.clearTimeout(n)}(c.preload),[]);const L=r.useCallback(()=>{const e=[v.current,...k.current];v.current=null,k.current=[],e.forEach(e=>e?.resolve(!1)),w(!1),b(null)},[]);r.useEffect(()=>()=>{v.current?.resolve(!1),k.current.forEach(e=>e.resolve(!1)),v.current=null,k.current=[]},[]);const g=C?.options,y="alert"===C?.kind,M="confirm"===(g?.initialFocus??"cancel")||y,R=r.useRef(!1);r.useLayoutEffect(()=>{p&&R.current&&z.current?.focus(),R.current=p},[p,C]);const I=C?e(r.Suspense,{fallback:null,children:e(ConfirmModal,{open:p,onUnavailable:L,onOpenChange:e=>{e||j(!1)},showClose:!1,initialFocus:z,size:g?.size??l,color:g?.color??s,width:g?.width??d,dismissible:g?.dismissible??!0,title:g?.title,description:g?.description,actions:n(r.Fragment,{children:[y?null:e(o,{ref:M?void 0:z,variant:"ghost",color:"secondary",size:g?.size??l,onClick:()=>j(!1),children:g?.cancelLabel??a??h.cancel}),e(o,{ref:M?z:void 0,color:g?.color??s,size:g?.size??l,onClick:()=>j(!0),children:g?.confirmLabel??(y?f??h.acknowledge:u??h.confirm)})]},C?.id),children:g?.children})}):null;return n(i.Provider,{value:E,children:[m,I]})}export function usePlConfirm(){const e=r.useContext(i);if(!e)throw new Error("[plass-ui] usePlConfirm was called outside a <PlConfirmProvider>.");return e}

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

package/dist/components/date-picker/PlDatePicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{useDefaults as o}from"../../internal/defaults.js";import{PlButton as n}from"../button/PlButton.js";import{Calendar as l,usePickerLabels as r}from"../../internal/calendar.js";import{CalendarIcon as s}from"../../internal/icons.js";import{PickerFooter as i,PickerShell as c}from"../../internal/picker.js";import{displaySamples as d,formatDate as m,isDayOutside as u,isMonthOutside as h,isValidDate as p,isYearOutside as f,localeWeekStart as y,mergeDateAndTime as b,startOfDay as g,startOfMonth as j,startOfYear as D,toISODate as O,toISOMonth as S,toISOYear as k,today as x,withPlaceholder as v}from"../../internal/date.js";import{cx as z}from"../../internal/styles.js";const C={day:{dateStyle:"medium"},month:{year:"numeric",month:"long"},year:{year:"numeric"}},w={day:O,month:S,year:k};export const PlDatePicker=/* @__PURE__ */a.forwardRef(function PlDatePicker({value:O,defaultValue:S,onValueChange:k,precision:P="day",open:M,defaultOpen:V,onOpenChange:B,defaultMonth:I,minDate:R,maxDate:E,shouldDisableDate:F,locale:N,weekStartsOn:T,format:Y,placeholder:q,clearable:A=!1,showTodayButton:G=!0,closeOnSelect:H=!0,labels:J,name:K,size:L,color:Q,density:U,readOnly:W=!1,disabled:X=!1,startIcon:Z,...$},_){const ee=o(),te=N??ee.locale,ae=L??ee.size??"md",oe=Q??ee.color??"primary",ne=U??ee.density??"default",le=r(J),re=T??ee.weekStartsOn??y(te),se=Y??C[P],[ie,ce]=a.useState(S??null),de=void 0!==O?O:ie,[me,ue]=a.useState(V??!1),he=M??me,[pe,fe]=a.useState(()=>j(p(de)?de:I??x()));a.useEffect(()=>{he&&fe(j(p(de)?de:I??x()))},[he]);const setOpen=e=>{e&&(W||X)||(void 0===M&&ue(e),B?.(e))},commit=e=>{void 0===O&&ce(e),k?.(e)},select=e=>{const t=p(de)?b(e,de):g(e);commit(t),fe(j(t)),H&&setOpen(!1)},ye=x(),be="day"===P?ye:"month"===P?j(ye):D(ye),ge="day"===P?le.today:"month"===P?le.thisMonth:le.thisYear,je="day"===P?u(ye,R,E)||(F?.(ye)??!1):"month"===P?h(ye,R,E):f(ye,R,E),De=G||A,Oe=a.useMemo(()=>v(d(te,se),q),[te,se,q]);return e(c,{...$,size:ae,color:oe,density:ne,readOnly:W,disabled:X,triggerRef:_,startIcon:Z??e(s,{}),display:p(de)?m(de,te,se):q??"",samples:Oe,empty:!p(de),clearable:A,onClear:()=>commit(null),open:he,onOpenChange:setOpen,labels:le,name:K,formValue:p(de)?w[P](de):"",children:t("div",{className:z("flex flex-col",De&&"gap-1.5"),children:[e(l,{size:ae,color:oe,locale:te,weekStartsOn:re,month:pe,onMonthChange:fe,precision:P,selected:[de],onSelect:select,minDate:R,maxDate:E,shouldDisableDate:F,labels:le,autoFocus:!0}),De?t(i,{size:ae,children:[A?e(n,{variant:"ghost",size:ae,color:oe,density:"compact",onClick:()=>{commit(null),setOpen(!1)},children:le.clear}):null,G?e(n,{variant:"ghost",size:ae,color:oe,density:"compact",disabled:je,onClick:()=>select(be),children:ge}):null]}):null]})})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{useDefaults as n,useLocale as o}from"../../internal/defaults.js";import{PlButton as l}from"../button/PlButton.js";import{Calendar as r,usePickerLabels as s}from"../../internal/calendar.js";import{CalendarIcon as i}from"../../internal/icons.js";import{PickerFooter as c,PickerShell as d}from"../../internal/picker.js";import{displaySamples as m,formatDate as u,isDayOutside as h,isMonthOutside as p,isSameMonth as f,isValidDate as y,isYearOutside as b,localeWeekStart as g,mergeDateAndTime as j,startOfDay as D,startOfMonth as O,startOfYear as S,toISODate as k,toISOMonth as x,toISOYear as v,today as z,withPlaceholder as C}from"../../internal/date.js";import{cx as w}from"../../internal/styles.js";const P={day:{dateStyle:"medium"},month:{year:"numeric",month:"long"},year:{year:"numeric"}},M={day:k,month:x,year:v};export const PlDatePicker=/* @__PURE__ */a.forwardRef(function PlDatePicker({value:k,defaultValue:x,onValueChange:v,precision:V="day",open:B,defaultOpen:I,onOpenChange:R,defaultMonth:E,minDate:F,maxDate:N,shouldDisableDate:T,locale:Y,weekStartsOn:q,format:A,placeholder:G,clearable:H=!1,showTodayButton:J=!0,closeOnSelect:K=!0,labels:L,name:Q,size:U,color:W,density:X,readOnly:Z=!1,disabled:$=!1,startIcon:_,...ee},te){const ae=n(),ne=o(Y),oe=U??ae.size??"md",le=W??ae.color??"primary",re=X??ae.density??"default",se=s(L),ie=q??ae.weekStartsOn??g(ne),ce=A??P[V],[de,me]=a.useState(x??null),ue=void 0!==k?k:de,[he,pe]=a.useState(I??!1),fe=B??he,[ye,be]=a.useState(()=>O(y(ue)?ue:E??z()));a.useEffect(()=>{if(fe){const e=O(y(ue)?ue:E??z());be(t=>f(t,e)?t:e)}},[fe]);const setOpen=e=>{e&&(Z||$)||(void 0===B&&pe(e),R?.(e))},commit=e=>{void 0===k&&me(e),v?.(e)},select=e=>{const t=y(ue)?j(e,ue):D(e);commit(t),be(O(t)),K&&setOpen(!1)},ge=z(),je="day"===V?ge:"month"===V?O(ge):S(ge),De="day"===V?se.today:"month"===V?se.thisMonth:se.thisYear,Oe="day"===V?h(ge,F,N)||(T?.(ge)??!1):"month"===V?p(ge,F,N):b(ge,F,N),Se=J||H,ke=a.useMemo(()=>C(m(ne,ce),G),[ne,ce,G]);return e(d,{...ee,size:oe,color:le,density:re,readOnly:Z,disabled:$,triggerRef:te,startIcon:_??e(i,{}),display:y(ue)?u(ue,ne,ce):G??"",samples:ke,empty:!y(ue),clearable:H,onClear:()=>commit(null),open:fe,onOpenChange:setOpen,labels:se,name:Q,formValue:y(ue)?M[V](ue):"",children:t("div",{className:w("flex flex-col",Se&&"gap-1.5"),children:[e(r,{size:oe,color:le,locale:ne,weekStartsOn:ie,month:ye,onMonthChange:be,precision:V,selected:[ue],onSelect:select,minDate:F,maxDate:N,shouldDisableDate:T,labels:se,autoFocus:!0}),Se?t(c,{size:oe,children:[H?e(l,{variant:"ghost",size:oe,color:le,density:"compact",onClick:()=>{commit(null),setOpen(!1)},children:se.clear}):null,J?e(l,{variant:"ghost",size:oe,color:le,density:"compact",disabled:Oe,onClick:()=>select(je),children:De}):null]}):null]})})});

package/dist/components/date-range-picker/PlDateRangePicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{useDefaults as t}from"../../internal/defaults.js";import{PlButton as a}from"../button/PlButton.js";import{Calendar as s,usePickerLabels as r}from"../../internal/calendar.js";import{ArrowRightIcon as o,CalendarIcon as i}from"../../internal/icons.js";import{PickerFooter as c,PickerShell as u}from"../../internal/picker.js";import{WidthSizer as d}from"../../internal/sizer.js";import{addMonths as m,compareDay as p,displaySamples as f,formatDate as h,isValidDate as x,localeWeekStart as g,startOfDay as v,startOfMonth as y,toISODate as w,today as b,withPlaceholder as N}from"../../internal/date.js";import{cx as j,gapClasses as S,metaTextClasses as D}from"../../internal/styles.js";const C={start:null,end:null};export const PlDateRangePicker=/* @__PURE__ */n.forwardRef(function PlDateRangePicker({value:O,defaultValue:k,onValueChange:P,open:z,defaultOpen:M,onOpenChange:R,defaultMonth:B,minDate:V,maxDate:E,shouldDisableDate:I,locale:F,weekStartsOn:W,format:q={dateStyle:"medium"},monthCount:A=2,startPlaceholder:G,endPlaceholder:H,presets:J,clearable:K=!1,closeOnSelect:L=!0,labels:Q,name:T,size:U,color:X,density:Y,readOnly:Z=!1,disabled:$=!1,startIcon:_,...ee},le){const ne=t(),te=F??ne.locale,ae=U??ne.size??"md",se=X??ne.color??"primary",re=Y??ne.density??"default",oe=r(Q),ie=W??ne.weekStartsOn??g(te),[ce,ue]=n.useState(k??C),de=void 0!==O?O??C:ce,me=x(de.start)?de.start:null,pe=x(de.end)?de.end:null,[fe,he]=n.useState(M??!1),xe=z??fe,[ge,ve]=n.useState(null),[ye,we]=n.useState(null),[be,Ne]=n.useState(()=>y(me??B??b()));n.useEffect(()=>{xe?Ne(y(me??B??b())):(ve(null),we(null))},[xe]);const setOpen=e=>{e&&(Z||$)||(void 0===z&&he(e),R?.(e))},commit=e=>{void 0===O&&ue(e),P?.(e)},je=ge??me,Se=null!==ge?ye:pe,write=(l,n)=>x(l)?h(l,te,q):e("span",{className:"text-(--plass-muted-fg)",children:n??""}),De=m(be,1),Ce=2===A,Oe=ee.fullWidth??!1,ke=n.useMemo(()=>Oe?[]:f(te,q),[Oe,te,q]),Pe=null!==ge?oe.end:null===me?oe.start:null,ze={size:ae,color:se,locale:te,weekStartsOn:ie,selected:[me,pe,ge],rangeStart:je,rangeEnd:Se,onSelect:e=>{const l=v(e);if(null===ge)return ve(l),we(l),void commit({start:l,end:null});const[n,t]=p(l,ge)<0?[l,ge]:[ge,l];ve(null),we(null),commit({start:n,end:t}),L&&setOpen(!1)},onPreviewChange:e=>{null!==ge&&we(e??ge)},minDate:V,maxDate:E,shouldDisableDate:I,showOutsideDays:!1,labels:oe};return e(u,{...ee,size:ae,color:se,density:re,readOnly:Z,disabled:$,triggerRef:le,startIcon:_??e(i,{}),display:l("span",{className:"flex min-w-0 items-center gap-1.5",children:[l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:write(me,G)}),Oe?null:e(d,{samples:N(ke,G)})]}),e("span",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--plass-muted-fg) rtl:rotate-180",children:e(o,{})}),l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:write(pe,H)}),Oe?null:e(d,{samples:N(ke,H)})]})]}),empty:null===me&&null===pe,clearable:K,onClear:()=>commit(C),open:xe,onOpenChange:setOpen,labels:oe,name:T,formValue:[me?w(me):"",pe?w(pe):""],children:l("div",{className:"flex flex-col gap-1.5",children:[l("div",{className:j("flex items-stretch",S[ae]),children:[J&&J.length>0?e("div",{className:j("flex max-h-[calc(var(--p-cell,2.5rem)*8)] flex-col overflow-y-auto border-e pe-1.5","[border-color:var(--plass-divider)]"),children:J.map((l,n)=>e(a,{variant:"ghost",size:ae,color:se,density:"compact",className:"justify-start whitespace-nowrap",onClick:()=>(e=>{const l="function"==typeof e.value?e.value():e.value;ve(null),we(null),commit(l),x(l.start)&&Ne(y(l.start)),L&&setOpen(!1)})(l),children:l.label},n))}):null,e(s,{...ze,month:be,onMonthChange:Ne,showNextButton:!Ce,autoFocus:!0}),Ce?e(s,{...ze,month:De,onMonthChange:e=>Ne(m(e,-1)),showPreviousButton:!1}):null]}),K||null!==Pe?l(c,{size:ae,children:[null!==Pe?e("span",{className:j("me-auto text-(--plass-muted-fg)",D[ae]),children:Pe}):null,K?e(a,{variant:"ghost",size:ae,color:se,density:"compact",onClick:()=>{ve(null),we(null),commit(C),setOpen(!1)},children:oe.clear}):null]}):null]})})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{useDefaults as t,useLocale as a}from"../../internal/defaults.js";import{PlButton as s}from"../button/PlButton.js";import{Calendar as r,usePickerLabels as o}from"../../internal/calendar.js";import{ArrowRightIcon as i,CalendarIcon as c}from"../../internal/icons.js";import{PickerFooter as u,PickerShell as d}from"../../internal/picker.js";import{WidthSizer as m}from"../../internal/sizer.js";import{addMonths as p,compareDay as f,displaySamples as h,formatDate as x,isSameMonth as g,isValidDate as v,localeWeekStart as y,startOfDay as w,startOfMonth as b,toISODate as N,today as j,withPlaceholder as S}from"../../internal/date.js";import{cx as D,gapClasses as C,metaTextClasses as O}from"../../internal/styles.js";const k={start:null,end:null};export const PlDateRangePicker=/* @__PURE__ */n.forwardRef(function PlDateRangePicker({value:P,defaultValue:z,onValueChange:M,open:R,defaultOpen:B,onOpenChange:V,defaultMonth:E,minDate:I,maxDate:F,shouldDisableDate:W,locale:q,weekStartsOn:A,format:G={dateStyle:"medium"},monthCount:H=2,startPlaceholder:J,endPlaceholder:K,presets:L,clearable:Q=!1,closeOnSelect:T=!0,labels:U,name:X,size:Y,color:Z,density:$,readOnly:_=!1,disabled:ee=!1,startIcon:le,...ne},te){const ae=t(),se=a(q),re=Y??ae.size??"md",oe=Z??ae.color??"primary",ie=$??ae.density??"default",ce=o(U),ue=A??ae.weekStartsOn??y(se),[de,me]=n.useState(z??k),pe=void 0!==P?P??k:de,fe=v(pe.start)?pe.start:null,he=v(pe.end)?pe.end:null,[xe,ge]=n.useState(B??!1),ve=R??xe,[ye,we]=n.useState(null),[be,Ne]=n.useState(null),[je,Se]=n.useState(()=>b(fe??E??j()));n.useEffect(()=>{if(ve){const e=b(fe??E??j());Se(l=>g(l,e)?l:e)}else we(null),Ne(null)},[ve]);const setOpen=e=>{e&&(_||ee)||(void 0===R&&ge(e),V?.(e))},commit=e=>{void 0===P&&me(e),M?.(e)},De=ye??fe,Ce=null!==ye?be:he,write=(l,n)=>v(l)?x(l,se,G):e("span",{className:"text-(--plass-muted-fg)",children:n??""}),Oe=p(je,1),ke=2===H,Pe=ne.fullWidth??!1,ze=n.useMemo(()=>Pe?[]:h(se,G),[Pe,se,G]),Me=null!==ye?ce.end:null===fe?ce.start:null,Re={size:re,color:oe,locale:se,weekStartsOn:ue,selected:[fe,he,ye],rangeStart:De,rangeEnd:Ce,onSelect:e=>{const l=w(e);if(null===ye)return we(l),Ne(l),void commit({start:l,end:null});const[n,t]=f(l,ye)<0?[l,ye]:[ye,l];we(null),Ne(null),commit({start:n,end:t}),T&&setOpen(!1)},onPreviewChange:e=>{null!==ye&&Ne(e??ye)},minDate:I,maxDate:F,shouldDisableDate:W,showOutsideDays:!1,labels:ce};return e(d,{...ne,size:re,color:oe,density:ie,readOnly:_,disabled:ee,triggerRef:te,startIcon:le??e(c,{}),display:l("span",{className:"flex min-w-0 items-center gap-1.5",children:[l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:write(fe,J)}),Pe?null:e(m,{samples:S(ze,J)})]}),e("span",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--plass-muted-fg) rtl:rotate-180",children:e(i,{})}),l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:write(he,K)}),Pe?null:e(m,{samples:S(ze,K)})]})]}),empty:null===fe&&null===he,clearable:Q,onClear:()=>commit(k),open:ve,onOpenChange:setOpen,labels:ce,name:X,formValue:[fe?N(fe):"",he?N(he):""],children:l("div",{className:"flex flex-col gap-1.5",children:[l("div",{className:D("flex items-stretch",C[re]),children:[L&&L.length>0?e("div",{className:D("flex max-h-[calc(var(--p-cell,2.5rem)*8)] flex-col overflow-y-auto border-e pe-1.5","[border-color:var(--plass-divider)]"),children:L.map((l,n)=>e(s,{variant:"ghost",size:re,color:oe,density:"compact",className:"justify-start whitespace-nowrap",onClick:()=>(e=>{const l="function"==typeof e.value?e.value():e.value;we(null),Ne(null),commit(l),v(l.start)&&Se(b(l.start)),T&&setOpen(!1)})(l),children:l.label},n))}):null,e(r,{...Re,month:je,onMonthChange:Se,showNextButton:!ke,autoFocus:!0}),ke?e(r,{...Re,month:Oe,onMonthChange:e=>Se(p(e,-1)),showPreviousButton:!1}):null]}),Q||null!==Me?l(u,{size:re,children:[null!==Me?e("span",{className:D("me-auto text-(--plass-muted-fg)",O[re]),children:Me}):null,Q?e(s,{variant:"ghost",size:re,color:oe,density:"compact",onClick:()=>{we(null),Ne(null),commit(k),setOpen(!1)},children:ce.clear}):null]}):null]})})});

package/dist/components/date-time-picker/PlDateTimePicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{useDefaults as o}from"../../internal/defaults.js";import{PlButton as n}from"../button/PlButton.js";import{Calendar as a,TimeGrid as s,usePickerLabels as i}from"../../internal/calendar.js";import{CalendarIcon as r}from"../../internal/icons.js";import{PickerDivider as c,PickerFooter as d,PickerShell as m}from"../../internal/picker.js";import{clampMoment as u,displaySamples as h,formatDate as p,isDayOutside as f,isHour12 as S,isValidDate as b,localeWeekStart as y,mergeDateAndTime as g,startOfDay as D,startOfMonth as j,timeUnitSpan as k,toISODateTime as v,today as w,withPlaceholder as C,withTime as x}from"../../internal/date.js";import{cx as z,gapClasses as O}from"../../internal/styles.js";export const PlDateTimePicker=/* @__PURE__ */l.forwardRef(function PlDateTimePicker({value:T,defaultValue:P,onValueChange:M,open:N,defaultOpen:V,onOpenChange:B,defaultMonth:I,minDate:R,maxDate:E,shouldDisableDate:F,shouldDisableTime:q,locale:A,weekStartsOn:G,format:H={dateStyle:"medium",timeStyle:"short"},hour12:J,showSeconds:K=!1,hourStep:L=1,minuteStep:Q=1,secondStep:U=1,placeholder:W,clearable:X=!1,showNowButton:Y=!0,closeOnSelect:Z=!1,labels:$,name:_,size:ee,color:te,density:le,readOnly:oe=!1,disabled:ne=!1,startIcon:ae,...se},ie){const re=o(),ce=A??re.locale,de=ee??re.size??"md",me=te??re.color??"primary",ue=le??re.density??"default",he=i($),pe=G??re.weekStartsOn??y(ce),fe=J??S(ce),[Se,be]=l.useState(P??null),ye=void 0!==T?T:Se,[ge,De]=l.useState(V??!1),je=N??ge,[ke,ve]=l.useState(()=>j(b(ye)?ye:I??w()));l.useEffect(()=>{je&&ve(j(b(ye)?ye:I??w()))},[je]);const setOpen=e=>{e&&(oe||ne)||(void 0===N&&De(e),B?.(e))},commit=e=>{void 0===T&&be(e),M?.(e)},we=l.useCallback((e,t)=>{const[l,o]=k(t,e),n=D(e).getTime();return!!(b(R)&&n+1e3*o<R.getTime())||!!(b(E)&&n+1e3*l>E.getTime())||(q?.(e,t)??!1)},[R,E,q]),Ce=new Date,xe=x(Ce,{seconds:K?Ce.getSeconds():0}),ze=f(xe,R,E)||(F?.(xe)??!1)||we(xe,"second"),Oe=l.useMemo(()=>C(h(ce,H),W),[ce,H,W]);return e(m,{...se,size:de,color:me,density:ue,readOnly:oe,disabled:ne,triggerRef:ie,startIcon:ae??e(r,{}),display:b(ye)?p(ye,ce,H):W??"",samples:Oe,empty:!b(ye),clearable:X,onClear:()=>commit(null),open:je,onOpenChange:setOpen,labels:he,name:_,formValue:b(ye)?v(ye,K):"",children:t("div",{className:"flex flex-col gap-1.5",children:[t("div",{className:z("flex items-stretch",O[de]),children:[e(a,{size:de,color:me,locale:ce,weekStartsOn:pe,month:ke,onMonthChange:ve,selected:[ye],onSelect:e=>{const t=u(b(ye)?g(e,ye):D(e),R,E,K);commit(t),ve(j(t)),Z&&setOpen(!1)},minDate:R,maxDate:E,shouldDisableDate:F,labels:he,autoFocus:!0}),e(c,{}),e(s,{size:de,density:ue,locale:ce,value:b(ye)?ye:null,referenceDate:b(ye)?ye:w(),onChange:commit,hour12:fe,showSeconds:K,hourStep:L,minuteStep:Q,secondStep:U,shouldDisableTime:we,labels:he})]}),t(d,{size:de,children:[X?e(n,{variant:"ghost",size:de,color:me,density:"compact",onClick:()=>{commit(null),setOpen(!1)},children:he.clear}):null,Y?e(n,{variant:"ghost",size:de,color:me,density:"compact",disabled:ze,onClick:()=>{commit(xe),ve(j(xe))},children:he.now}):null,e(n,{variant:"solid",size:de,color:me,density:"compact",onClick:()=>setOpen(!1),children:he.done})]})]})})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{useDefaults as l,useLocale as n}from"../../internal/defaults.js";import{PlButton as a}from"../button/PlButton.js";import{Calendar as s,TimeGrid as i,usePickerLabels as r}from"../../internal/calendar.js";import{CalendarIcon as c}from"../../internal/icons.js";import{PickerDivider as d,PickerFooter as m,PickerShell as u}from"../../internal/picker.js";import{clampMoment as h,displaySamples as p,formatDate as f,isDayOutside as S,isHour12 as b,isSameMonth as y,isValidDate as g,localeWeekStart as D,mergeDateAndTime as j,startOfDay as k,startOfMonth as v,timeUnitSpan as w,toISODateTime as C,today as x,withPlaceholder as z,withTime as O}from"../../internal/date.js";import{cx as T,gapClasses as P}from"../../internal/styles.js";export const PlDateTimePicker=/* @__PURE__ */o.forwardRef(function PlDateTimePicker({value:M,defaultValue:N,onValueChange:V,open:B,defaultOpen:I,onOpenChange:R,defaultMonth:E,minDate:F,maxDate:q,shouldDisableDate:A,shouldDisableTime:G,locale:H,weekStartsOn:J,format:K={dateStyle:"medium",timeStyle:"short"},hour12:L,showSeconds:Q=!1,hourStep:U=1,minuteStep:W=1,secondStep:X=1,placeholder:Y,clearable:Z=!1,showNowButton:$=!0,closeOnSelect:_=!1,labels:ee,name:te,size:oe,color:le,density:ne,readOnly:ae=!1,disabled:se=!1,startIcon:ie,...re},ce){const de=l(),me=n(H),ue=oe??de.size??"md",he=le??de.color??"primary",pe=ne??de.density??"default",fe=r(ee),Se=J??de.weekStartsOn??D(me),be=L??b(me),[ye,ge]=o.useState(N??null),De=void 0!==M?M:ye,[je,ke]=o.useState(I??!1),ve=B??je,[we,Ce]=o.useState(()=>v(g(De)?De:E??x()));o.useEffect(()=>{if(ve){const e=v(g(De)?De:E??x());Ce(t=>y(t,e)?t:e)}},[ve]);const setOpen=e=>{e&&(ae||se)||(void 0===B&&ke(e),R?.(e))},commit=e=>{void 0===M&&ge(e),V?.(e)},xe=o.useCallback((e,t)=>{const[o,l]=w(t,e),n=k(e).getTime();return!!(g(F)&&n+1e3*l<F.getTime())||!!(g(q)&&n+1e3*o>q.getTime())||(G?.(e,t)??!1)},[F,q,G]),ze=new Date,Oe=O(ze,{seconds:Q?ze.getSeconds():0}),Te=S(Oe,F,q)||(A?.(Oe)??!1)||xe(Oe,"second"),Pe=o.useMemo(()=>z(p(me,K),Y),[me,K,Y]);return e(u,{...re,size:ue,color:he,density:pe,readOnly:ae,disabled:se,triggerRef:ce,startIcon:ie??e(c,{}),display:g(De)?f(De,me,K):Y??"",samples:Pe,empty:!g(De),clearable:Z,onClear:()=>commit(null),open:ve,onOpenChange:setOpen,labels:fe,name:te,formValue:g(De)?C(De,Q):"",children:t("div",{className:"flex flex-col gap-1.5",children:[t("div",{className:T("flex items-stretch",P[ue]),children:[e(s,{size:ue,color:he,locale:me,weekStartsOn:Se,month:we,onMonthChange:Ce,selected:[De],onSelect:e=>{const t=h(g(De)?j(e,De):k(e),F,q,Q);commit(t),Ce(v(t)),_&&setOpen(!1)},minDate:F,maxDate:q,shouldDisableDate:A,labels:fe,autoFocus:!0}),e(d,{}),e(i,{size:ue,density:pe,locale:me,value:g(De)?De:null,referenceDate:g(De)?De:x(),onChange:commit,hour12:be,showSeconds:Q,hourStep:U,minuteStep:W,secondStep:X,shouldDisableTime:xe,labels:fe})]}),t(m,{size:ue,children:[Z?e(a,{variant:"ghost",size:ue,color:he,density:"compact",onClick:()=>{commit(null),setOpen(!1)},children:fe.clear}):null,$?e(a,{variant:"ghost",size:ue,color:he,density:"compact",disabled:Te,onClick:()=>{commit(Oe),Ce(v(Oe))},children:fe.now}):null,e(a,{variant:"solid",size:ue,color:he,density:"compact",onClick:()=>setOpen(!1),children:fe.done})]})]})})});

package/dist/components/drawer/PlDrawer.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Dialog as BaseUIDialog } from '@base-ui/react/dialog';
-import type { PlassPortalClassNames, PlassSide, PlassStyleProps } from '../../types.js';
+import type { PlassHeadingLevel, PlassPortalClassNames, PlassSide, PlassStyleProps } from '../../types.js';
 /**
  * How the panel relates to the page.
  *
@@ -57,6 +57,18 @@ export interface PlDrawerProps extends Pick<PlassStyleProps, 'size' | 'color' |
     trigger?: React.ReactElement;
     /** The heading. Rendered as the element that names the drawer. */
     title?: React.ReactNode;
+    /**
+     * The level of the heading `title` is, `1` to `6`.
+     *
+     * An `inline` drawer's title sits in the page's outline, and a heading has
+     * to sit one level under the one above it, or the outline skips a step. `2`
+     * fits a sidebar beside the page's `<h1>`; a panel inside a section headed by
+     * an `<h2>` wants `3`. An `overlay` drawer's title takes the level too and
+     * still names the dialog. Only the element changes: the type scale is the
+     * drawer's either way.
+     * @default 2
+     */
+    headingLevel?: PlassHeadingLevel;
     /** A line under the title, and the drawer's accessible description. */
     description?: React.ReactNode;
     /**
@@ -110,6 +122,19 @@ export interface PlDrawerProps extends Pick<PlassStyleProps, 'size' | 'color' |
      * @default true
      */
     dismissible?: boolean;
+    /**
+     * Keeps the drawer's content in the document while it is closed, hidden, out
+     * of the focus order and off the accessibility tree, rather than taking it
+     * out. `overlay` only.
+     *
+     * For a drawer that holds a site's navigation. A closed drawer is otherwise
+     * not in the document, and neither are its links — which is what a search
+     * engine finds on a phone, where the navigation is a drawer nobody has
+     * opened. Off by default, because a drawer's content is usually work that
+     * only needs doing once somebody opens it.
+     * @default false
+     */
+    keepMounted?: boolean;
     /** The body. */
     children?: React.ReactNode;
 }
@@ -143,4 +168,4 @@ export declare const PlDrawerClose: React.ForwardRefExoticComponent<Omit<import(
  * scroll lock, the `aria-labelledby` / `aria-describedby` wiring, restoring
  * focus to the trigger, and the inert page behind.
  */
-export declare function PlDrawer({ side, mode, size: sizeProp, color: colorProp, density: densityProp, open, defaultOpen, onOpenChange, trigger, title, description, actions, dividers, showClose, closeLabel: closeLabelProp, extent, rounded, modal, dismissible, className, classNames, style, children, ...props }: PlDrawerProps): React.JSX.Element | null;
+export declare function PlDrawer({ side, mode, size: sizeProp, color: colorProp, density: densityProp, open, defaultOpen, onOpenChange, trigger, title, headingLevel: headingLevelProp, description, actions, dividers, showClose, closeLabel: closeLabelProp, extent, rounded, modal, dismissible, keepMounted, className, classNames, style, children, ...props }: PlDrawerProps): React.JSX.Element | 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 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}
+"use client";import{jsx as s,jsxs as e,Fragment as l}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{headingLevelOf as o}from"../../internal/heading.js";import{useLabels as i}from"../../internal/labels.js";import{Dialog as d}from"@base-ui/react/dialog";import{CloseIcon as t}from"../../internal/icons.js";import{cx as n,focusRingClasses as p,glassClasses as u,hasContent as m,metaTextClasses as c,sheetBodyClasses as f,sheetHeaderGapClasses as x,sheetLineClasses as g,sheetPaddingXClasses as h,sheetPaddingYClasses as b,sheetSectionGapClasses as v,sheetTitleClasses as y,surfaceSlots as w,targetClasses as j}from"../../internal/styles.js";const N={xs:"w-56",sm:"w-64",md:"w-80",lg:"w-96",xl:"w-[28rem]"},k={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)"}},z={left:"border-r",right:"border-l",top:"border-b",bottom:"border-t"},_={left:"flex-row justify-start",right:"flex-row justify-end",top:"flex-col justify-start",bottom:"flex-col justify-end"},C=/* @__PURE__ */[u,"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)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),D=/* @__PURE__ */["fixed inset-0 z-(--plass-z-portal) bg-(--plass-scrim)","[backdrop-filter:var(--plass-scrim-blur)] [-webkit-backdrop-filter:var(--plass-scrim-blur)]",$].join(" "),P="[&[hidden]]:hidden",O=/* @__PURE__ */[j,"flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center p-0","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)",p].join(" ");export const PlDrawerClose=d.Close;export function PlDrawer({side:p="left",mode:u="overlay",size:j,color:L,density:M,open:T,defaultOpen:B,onOpenChange:F,trigger:R,title:S,headingLevel:V=2,description:q,actions:A,dividers:E=!1,showClose:G,closeLabel:H,extent:I,rounded:J=!0,modal:K=!0,dismissible:Q=!0,keepMounted:U=!1,className:W,classNames:X,style:Y,children:Z,...ss}){const es=a(),ls=i(),rs=H??ls.close,as=j??es.size??"md",os=L??es.color??"primary",is=M??es.density??"default",ds="overlay"===u,ts="left"===p||"right"===p,ns=G??ds,[ps,us]=r.useState(B??!0),ms=h[is][as],cs=b[is][as],fs=E?`${ms} ${cs}`:ms,xs=m(S)||m(q),gs=m(A),hs=void 0===I?null:{[ts?"width":"height"]:"number"==typeof I?`${I}px`:I},bs=n(C,f[as],z[p],J?k[p][as]:"",ds?"[box-shadow:var(--plass-shadow-4),var(--plass-gloss-glass)]":"[box-shadow:var(--plass-gloss-glass)]",ds?$:"",ts?`h-full max-w-full ${void 0===I?N[as]:""}`:"w-full "+(void 0===I?"max-h-[85%]":""),E?"":`${cs} ${v[as]}`,W),vs=`h${o(V)??2}`,ys=ds?d.Description:"p",ws=e(l,{children:[xs||ns?e("div",{className:n("flex shrink-0 items-start gap-3",fs),children:[e("div",{className:n("flex min-w-0 flex-1 flex-col",x[as]),children:[m(S)?ds?s(d.Title,{render:s(vs,{}),className:n("m-0 font-semibold",y[as]),children:S}):s(vs,{className:n("m-0 font-semibold",y[as]),children:S}):null,m(q)?s(ys,{className:n("m-0 text-(--plass-muted-fg)",c[as]),children:q}):null]}),ns?ds?s(d.Close,{"aria-label":rs,className:O,children:s(t,{})}):s("button",{type:"button","aria-label":rs,className:O,onClick:()=>{void 0===T&&us(!1),F?.(!1)},children:s(t,{})}):null]}):null,m(Z)?s("div",{className:n("min-h-0 flex-1 overflow-y-auto overscroll-contain",fs,E&&(xs||ns)?g:"",E?"":"-my-1 py-1"),children:Z}):null,gs?s("div",{className:n("flex shrink-0 flex-wrap items-center justify-end gap-2",fs,E?g:""),children:A}):null]});return ds?e(d.Root,{open:T,defaultOpen:B,modal:K,disablePointerDismissal:!Q,onOpenChange:(s,e)=>{Q||s||"escape-key"!==e.reason?F?.(s):e.cancel()},children:[R?s(d.Trigger,{render:R}):null,e(d.Portal,{keepMounted:U,children:[s(d.Backdrop,{className:n("plass-portal",D,U?P:"",X?.backdrop)}),s(d.Viewport,{className:n("plass-portal fixed inset-0 z-(--plass-z-portal) flex",_[p],U?P:""),children:s(d.Popup,{className:n(bs,U?P:""),style:{...w(os,3),...hs,...Y},...ss,children:ws})})]})]}):T??ps?s("div",{className:bs,style:{...w(os,0),...hs,...Y},...ss,children:ws}):null}

package/dist/components/empty/PlEmpty.d.ts

@@ -6,7 +6,10 @@ export interface PlEmptyProps extends Omit<React.ComponentPropsWithoutRef<'div'>
      * `1em` fills it without being told a number.
      */
     icon?: React.ReactNode;
-    /** The one line that says what is not here. */
+    /**
+     * The one line that says what is not here. It is not a heading of its own;
+     * pass one when the page's outline needs it.
+     */
     title?: React.ReactNode;
     /** What to do about it. One or two sentences, never a paragraph. */
     description?: React.ReactNode;

package/dist/components/empty/PlEmpty.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as s from"react";import{useDefaults as l}from"../../internal/defaults.js";import{controlSlots as r,cx as n,hasContent as i,metaTextClasses as c,sheetPaddingYClasses as a,sheetTitleClasses as m,stackGapClasses as o}from"../../internal/styles.js";const x={xs:"text-2xl",sm:"text-3xl",md:"text-4xl",lg:"text-5xl",xl:"text-6xl"};export const PlEmpty=/* @__PURE__ */s.forwardRef(function PlEmpty({icon:s,title:d,description:f,actions:p,size:u,color:y,density:h,className:j,style:g,children:N,...v},w){const z=l(),E=u??z.size??"md",P=y??z.color??"secondary",b=h??z.density??"default";return t("div",{ref:w,className:n("flex flex-col items-center justify-center text-center",o[E],a[b][E],j),style:{...r(P,0,"ghost"),...g},...v,children:[i(s)?e("span",{"aria-hidden":"true",className:n("flex items-center justify-center text-(--p-accent) [&_svg]:size-[1em]",x[E]),children:s}):null,i(d)?e("p",{className:n("m-0 font-semibold text-(--plass-fg)",m[E]),children:d}):null,i(f)?e("p",{className:n("m-0 max-w-prose text-(--plass-muted-fg)",c[E]),children:f}):null,N,i(p)?e("div",{className:n("flex flex-wrap items-center justify-center gap-2"),children:p}):null]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as s from"react";import{useDefaults as l}from"../../internal/defaults.js";import{controlSlots as r,cx as n,hasContent as i,metaTextClasses as c,sheetPaddingYClasses as a,sheetTitleClasses as m,stackGapClasses as o}from"../../internal/styles.js";const x={xs:"text-2xl",sm:"text-3xl",md:"text-4xl",lg:"text-5xl",xl:"text-6xl"};export const PlEmpty=/* @__PURE__ */s.forwardRef(function PlEmpty({icon:s,title:d,description:f,actions:p,size:u,color:y,density:h,className:j,style:g,children:N,...v},w){const z=l(),E=u??z.size??"md",P=y??z.color??"secondary",b=h??z.density??"default";return t("div",{ref:w,className:n("flex flex-col items-center justify-center text-center",o[E],a[b][E],j),style:{...r(P,0,"ghost"),...g},...v,children:[i(s)?e("span",{"aria-hidden":"true",className:n("flex items-center justify-center text-(--p-accent) [&_svg]:size-[1em]",x[E]),children:s}):null,i(d)?e("div",{className:n("m-0 font-semibold text-(--plass-fg)",m[E]),children:d}):null,i(f)?e("div",{className:n("m-0 max-w-prose text-(--plass-muted-fg)",c[E]),children:f}):null,N,i(p)?e("div",{className:n("flex flex-wrap items-center justify-center gap-2"),children:p}):null]})});

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

@@ -6,6 +6,15 @@ export interface PlFileRejection {
     file: File;
     reason: PlFileRejectionReason;
 }
+/** One drop, or one pick from the file dialog, as `onAdd` hands it over. */
+export interface PlFileBatch {
+    /** What the batch added to the list, in the order it arrived. */
+    kept: File[];
+    /** What it turned away, and why. */
+    rejected: PlFileRejection[];
+    /** Whether the files were dropped on the field or chosen in the dialog. */
+    source: 'drop' | 'dialog';
+}
 export interface PlFilePickerProps extends PlassStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'defaultValue' | 'title' | 'children'> {
     /**
      * Drop shadow depth. `0` is the default — a dropzone is cut into the page
@@ -38,6 +47,13 @@ export interface PlFilePickerProps extends PlassStyleProps, Omit<React.Component
      * file disappears silently, which is the single worst thing a dropzone does.
      */
     onReject?: (rejections: PlFileRejection[]) => void;
+    /**
+     * Called once per drop or dialog pick with what it kept and what it turned
+     * away together, after `onReject` and `onFilesChange`. The place for a rule
+     * that needs both halves, such as an error only when nothing in the batch
+     * could be used. A batch with no file in it, and a removal, call nothing.
+     */
+    onAdd?: (batch: PlFileBatch) => void;
     /** The name of what the box collects. */
     label?: React.ReactNode;
     /**
@@ -83,6 +99,19 @@ export interface PlFilePickerProps extends PlassStyleProps, Omit<React.Component
      * @default `Remove {name}`, from the label pack
      */
     removeLabel?: (name: string) => string;
+    /**
+     * Keeps a file let go beside the box from leaving the page. A browser opens a
+     * file dropped where nothing takes it, in place of the page, or downloads
+     * it, so a near miss throws away whatever the reader had filled in.
+     *
+     * While the picker is mounted and neither disabled nor read-only, a file
+     * dragged over the rest of the page shows the no-drop pointer and is not
+     * dropped. A drop target of the page that takes the file itself, another
+     * picker or a native `<input type="file">` among them, is left alone, and so
+     * is a drag that carries no file.
+     * @default false
+     */
+    preventDocumentDrop?: boolean;
     /** Stretches to the width of the container. @default true */
     fullWidth?: boolean;
     /** Unavailable. */

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 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})]})});
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as o from"react";import{Field as t}from"@base-ui/react/field";import{useDefaults as s}from"../../internal/defaults.js";import{FormControl as a,leaveFormControl as l,useFormReport as n,useDisabled as i,useLabelReference as d}from"../../internal/form.js";import{glowPointerMove as c}from"../../internal/glow.js";import{CloseIcon as p}from"../../internal/icons.js";import{useLabels as u}from"../../internal/labels.js";import{FieldNotch as f,notchShellStyle as v,resolveNotch as m}from"../../internal/notch.js";import{controlTextLeadingClasses as b,disabledClasses as h,fieldSlots as g,focusRingClasses as x,gapClasses as y,glassClasses as w,hasContent as j,iconClasses as $,metaTextClasses as k,radiusClasses as L,readOnlyFilterClasses as E,sheetTitleClasses as N,stackGapClasses as z,targetClasses as _,transitionClasses as D}from"../../internal/styles.js";const C={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"}},B={solid:/* @__PURE__ */[w,"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__ */[w,"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)]"},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(" "),R=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)] opacity-50","forced-colors:[border-color:GrayText]"].join(" "),M={solid:/* @__PURE__ */[w,"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__ */[w,"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 o=e/1e3,t=0;for(;o>=1e3&&t<r.length-1;)o/=1e3,t+=1;return`${o<10?o.toFixed(1):Math.round(o)} ${r[t]}`}function matchesAccept(e,r){const o=e.name.toLowerCase(),t=e.type.toLowerCase();return r.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?o.endsWith(e):e.endsWith("/*")?t.startsWith(e.slice(0,-1)):t===e)}export const PlFilePicker=/* @__PURE__ */o.forwardRef(function PlFilePicker({variant:w="glass",size:P,color:F,density:S,elevation:W=0,accept:A,multiple:O=!1,maxSize:V,maxFiles:q,value:G,defaultValue:H,onFilesChange:U,onReject:Y,onAdd:J,label:K,labelPlacement:Q,description:X,error:Z,invalid:ee,title:re,hint:oe,icon:te,showList:se=!0,showRejections:ae=!0,removeLabel:le,preventDocumentDrop:ne=!1,fullWidth:ie=!0,disabled:de=!1,readOnly:ce=!1,required:pe=!1,name:ue,id:fe,className:ve,style:me,onDragEnter:be,onDragOver:he,onDragLeave:ge,onDrop:xe,"aria-label":ye,"aria-labelledby":we,...je},$e){const ke=s(),Le=i(de),Ee=u(),Ne=le??Ee.removeItem,ze=P??ke.size??"md",_e=F??ke.color??"primary",De=S??ke.density??"default",Ce=Q??ke.labelPlacement??"top",{notched:Be}=m(Ce,K,!0),Ie=o.useRef(null),Te=o.useRef(null),Re=o.useRef(null);o.useImperativeHandle($e,()=>Ie.current);const[Me,Pe]=o.useState(()=>[...H??[]]),Fe=o.useMemo(()=>G?[...G]:Me,[G,Me]),Se=o.useRef(0),[We,Ae]=o.useState(!1);o.useEffect(()=>{if(!We)return;const end=()=>{Se.current=0,Ae(!1)};return window.addEventListener("drop",end,!0),window.addEventListener("dragend",end,!0),window.addEventListener("pointermove",end,!0),window.addEventListener("blur",end),()=>{window.removeEventListener("drop",end,!0),window.removeEventListener("dragend",end,!0),window.removeEventListener("pointermove",end,!0),window.removeEventListener("blur",end)}},[We]);const[Oe,Ve]=o.useState({type:0,size:0,count:0}),qe=j(Z),Ge=ee??qe,He=Ge?"danger":_e,Ue=Le||ce,Ye=o.useId(),Je=`${Ye}-error`,Ke=`${Ye}-label`,Qe=fe??`${Ye}-zone`,Xe=d(ye,we),Ze=Xe.labelledBy??(j(K)?Ke:void 0);o.useEffect(()=>{if(!ne||Ue)return;const stray=e=>!e.defaultPrevented&&Boolean(e.dataTransfer?.types.includes("Files"))&&!(e.target instanceof HTMLInputElement&&"file"===e.target.type),refuse=e=>{stray(e)&&(e.preventDefault(),e.dataTransfer.dropEffect="none")},cancel=e=>{stray(e)&&e.preventDefault()};return document.addEventListener("dragover",refuse),document.addEventListener("drop",cancel),()=>{document.removeEventListener("dragover",refuse),document.removeEventListener("drop",cancel)}},[ne,Ue]);const er=o.useCallback(e=>{const r=Ie.current;if(!r||"undefined"==typeof DataTransfer)return;const o=new DataTransfer;for(const r of e)o.items.add(r);r.files=o.files},[]);o.useEffect(()=>{er(Fe)},[Fe,er]),n(ue,()=>[...Fe],!Le);const rr=o.useCallback(e=>{G||Pe(e),U?.(e)},[U,G]),or=o.useCallback(e=>{const r=[],o=[],t=O?q??Number.POSITIVE_INFINITY:1,s=O?Fe.length:0;for(const a of e)A&&!matchesAccept(a,A)?o.push({file:a,reason:"type"}):void 0!==V&&a.size>V?o.push({file:a,reason:"size"}):s+r.length>=t?o.push({file:a,reason:"count"}):r.push(a);return{kept:r,rejections:o}},[A,Fe.length,q,V,O]),tr=o.useCallback((e,r)=>{const{kept:o,rejections:t}=or(e),s={type:0,size:0,count:0};for(const e of t)s[e.reason]+=1;Ve(s),t.length>0&&Y?.(t),o.length>0&&rr(O?[...Fe,...o]:o),e.length>0&&J?.({kept:o,rejected:t,source:r})},[or,rr,Fe,O,J,Y]),sr=o.useCallback(()=>{Ve(e=>e.type||e.size||e.count?{type:0,size:0,count:0}:e)},[]),ar=[["type",Ee.filesRejectedType],["size",Ee.filesRejectedSize],["count",Ee.filesRejectedCount]].filter(([e])=>Oe[e]>0),browse=()=>{Ue||(sr(),Ie.current?.click())},lr=["relative flex w-full flex-col items-center justify-center text-center","cursor-pointer select-none",C[De][ze],L[ze],y[ze],D,$,Be?"":x,Le?`${h[w]} border-2 border-dashed`:ce?`${B[w]} ${E} cursor-default`:We?M[w]:B[w],Ue||We?"":I[w],Ue?"":"plass-glow"].filter(Boolean).join(" "),nr=`flex items-center text-(--p-accent) [&_svg]:size-[1.8em] ${N[ze]}`,ir=e("span",{id:Ke,className:[k[ze],"font-semibold",Le?"text-(--plass-muted-fg)":"text-(--plass-fg)"].join(" "),children:K});return r(t.Root,{name:ue,disabled:Le,invalid:Ge,className:["flex-col align-top",z[ze],ie?"flex w-full":"inline-flex",ve??""].filter(Boolean).join(" "),style:{...g(He,W),...me},...je,onDragEnter:e=>{Ue||(e.preventDefault(),Se.current+=1,Ae(!0)),be?.(e)},onDragOver:e=>{Ue||(e.preventDefault(),e.dataTransfer.dropEffect="copy"),he?.(e)},onDragLeave:e=>{Ue||(Se.current=Math.max(0,Se.current-1),0===Se.current&&Ae(!1)),ge?.(e)},onDrop:e=>{Ue||(e.preventDefault(),Se.current=0,Ae(!1),tr(Array.from(e.dataTransfer.files),"drop")),xe?.(e)},children:[j(K)&&!Be?ir:null,r("div",{className:`flex w-full flex-col ${z[ze]}`,children:[e(t.Validity,{children:({validity:o})=>{const t=!1===o.valid,s=!qe&&t&&!Le&&!0!==ee,a=[j(X)||qe?Ye:null,s?Je:null].filter(Boolean).join(" ")||void 0;return e(f,{notched:Be,size:ze,density:De,variant:w,disabled:Le,readOnly:ce,label:ir,edgeClassName:Le?R:Ue?"border-2 border-dashed [border-color:var(--plass-border)]":We?"border-2 border-dashed [border-color:var(--p-ring)]":T,children:r("button",{ref:Te,type:"button",id:Qe,"aria-labelledby":Ze?`${Ze} ${Qe}`:void 0,disabled:Le,"aria-describedby":a,"aria-invalid":Ge||t||void 0,className:lr,style:Be?v:void 0,onPointerMove:c(!Ue),onClick:browse,onBlur:()=>l(Re.current),children:[j(te)||void 0===te?e("span",{className:nr,children:void 0===te?e(UploadIcon,{}):te}):null,e("span",{className:`font-semibold ${N[ze]}`,children:re??Ee.filePickerTitle}),j(oe)?e("span",{className:`text-(--plass-muted-fg) ${k[ze]}`,children:oe}):null]})})}}),e("input",{ref:Ie,type:"file",name:ue,accept:A,multiple:O,disabled:Ue,tabIndex:-1,"aria-hidden":"true",className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>{tr(Array.from(e.target.files??[]),"dialog"),er(Fe)}}),se&&Fe.length>0?e("ul",{role:"list",className:`flex w-full flex-col ${z[ze]} m-0 list-none p-0`,children:Fe.map((o,t)=>r("li",{className:["flex w-full items-center gap-2 px-2 py-1.5",L.xs,b[ze],"bg-(--p-soft) text-(--plass-fg)"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:o.name}),e("span",{className:`shrink-0 text-(--plass-muted-fg) tabular-nums ${k[ze]}`,children:formatFileSize(o.size)}),Ue?null:e("button",{type:"button","aria-label":Ne(o.name),className:[_,"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full p-0","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",x].join(" "),onClick:()=>{sr(),rr(Fe.filter((e,r)=>r!==t))},children:e(p,{})})]},`${o.name}-${o.size}-${o.lastModified}-${t}`))}):null]}),ae&&ar.length>0?e("div",{role:"status",className:`flex w-full flex-col ${k[ze]} text-(--plass-danger-accent)`,children:ar.map(([r,o])=>e("span",{children:o(Oe[r])},r))}):null,j(X)&&!qe?e("span",{id:Ye,className:`${k[ze]} text-(--plass-muted-fg)`,children:X}):null,qe?e("span",{id:Ye,className:`${k[ze]} text-(--p-accent)`,children:Z}):e(t.Error,{id:Je,className:`${k[ze]} text-(--p-accent)`}),e(a,{ref:Re,value:Fe.map(e=>e.name),required:pe&&!ce,disabled:Le,standIn:()=>Te.current}),Xe.node]})});

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

@@ -1,2 +1,2 @@
 export { PlFilePicker, formatFileSize } from './PlFilePicker.js';
-export type { PlFilePickerProps, PlFileRejection, PlFileRejectionReason } from './PlFilePicker.js';
+export type { PlFileBatch, PlFilePickerProps, PlFileRejection, PlFileRejectionReason } from './PlFilePicker.js';