plass-ui 1.1.0 → 1.3.0

package/dist/components/pagination/PlPagination.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{PlButton as n}from"../button/PlButton.js";import{ChevronIcon as r}from"../../internal/icons.js";import{controlTextClasses as l,gapClasses as i,srOnlyClasses as o}from"../../internal/styles.js";function range(e,t){return Array.from({length:Math.max(0,t-e+1)},(t,a)=>e+a)}function DoubleChevronIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"m7.5 4.5 3.5 3.5-3.5 3.5M3.5 4.5 7 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}const s={xs:"h-6 min-w-6",sm:"h-8 min-w-8",md:"h-10 min-w-10",lg:"h-12 min-w-12",xl:"h-14 min-w-14"};export const PlPagination=/* @__PURE__ */a.forwardRef(function PlPagination({variant:c="ghost",size:m="md",color:u="primary",density:h="compact",elevation:d=0,count:f,page:g,defaultPage:p=1,onPageChange:x,siblingCount:b=1,boundaryCount:v=1,showEdges:y=!1,showArrows:M=!0,disabled:P=!1,getPageHref:j,renderLink:w,label:L="Pagination",pageLabel:N=e=>`Page ${e}`,previousLabel:C="Previous page",nextLabel:k="Next page",firstLabel:$="First page",lastLabel:D="Last page",statusLabel:I=(e,t)=>`Page ${e} of ${t}`,className:K,children:z,...B},A){const[R,E]=a.useState(p),F=Math.min(Math.max(g??R,1),Math.max(f,1));if(f<2)return null;const H=function paginationRange(e,t,a,n){const r=range(1,Math.min(n,e)),l=range(Math.max(e-n+1,n+1),e),i=Math.max(Math.min(t-a,e-n-2*a-1),n+2),o=Math.min(Math.max(t+a,n+2*a+2),l.length>0?l[0]-2:e-1);return[...r,...i>n+2?["start-ellipsis"]:n+1<e-n?[n+1]:[],...range(i,o),...o<e-n-1?["end-ellipsis"]:e-n>n?[e-n]:[],...l]}(f,F,b,v),S=F<=1,W=F>=f,linkProps=(t,a,n)=>{if(!j||a)return null;const r=j(t);return{render:w?w(t,r):e("a",{href:r}),rel:n}},press=(e,t)=>{e.metaKey||e.ctrlKey||e.shiftKey||e.altKey||j&&!x||(e.preventDefault(),(e=>{const t=Math.min(Math.max(e,1),f);t!==F&&(void 0===g&&E(t),x?.(t))})(t))},stepper=(t,a,r,l,i,o,s)=>e("li",{className:"flex",children:e(n,{variant:c,size:m,color:u,density:h,elevation:d,disabled:P||l,"aria-label":a,startIcon:e("span",{className:`flex items-center ${i}`,children:o}),onClick:e=>press(e,r),...linkProps(r,P||l,s)})},t);return t("nav",{ref:A,"aria-label":L,className:["flex items-center",K??""].filter(Boolean).join(" "),...B,children:[t("ul",{role:"list",className:`m-0 flex list-none items-center p-0 ${i[m]}`,children:[y?stepper("first",$,1,S,"rotate-180 rtl:rotate-0",e(DoubleChevronIcon,{})):null,M?stepper("previous",C,F-1,S,"rotate-90 rtl:-rotate-90",e(r,{}),"prev"):null,H.map((t,a)=>e("li","number"==typeof t?{className:"flex",children:e(n,{variant:t===F?"solid":c,size:m,color:u,density:h,elevation:d,disabled:P,"aria-label":N(t),"aria-current":t===F?"page":void 0,className:"tabular-nums",onClick:e=>press(e,t),...linkProps(t,P||t===F),children:t})}:{"aria-hidden":"true",className:["flex select-none items-center justify-center","text-(--plass-muted-fg)",l[m],s[m]].join(" "),children:"…"},`slot-${a}`)),M?stepper("next",k,F+1,W,"-rotate-90 rtl:rotate-90",e(r,{}),"next"):null,y?stepper("last",D,f,W,"rtl:rotate-180",e(DoubleChevronIcon,{})):null]}),e("span",{className:o,"aria-live":"polite",children:I(F,f)}),z]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{useDefaults as n}from"../../internal/defaults.js";import{PlButton as r}from"../button/PlButton.js";import{ChevronIcon as l}from"../../internal/icons.js";import{controlTextClasses as i,gapClasses as o,srOnlyClasses as s}from"../../internal/styles.js";function range(e,t){return Array.from({length:Math.max(0,t-e+1)},(t,a)=>e+a)}function DoubleChevronIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"m7.5 4.5 3.5 3.5-3.5 3.5M3.5 4.5 7 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}const c={xs:"h-6 min-w-6",sm:"h-8 min-w-8",md:"h-10 min-w-10",lg:"h-12 min-w-12",xl:"h-14 min-w-14"};export const PlPagination=/* @__PURE__ */a.forwardRef(function PlPagination({variant:m="ghost",size:u,color:d,density:h,elevation:f=0,count:p,page:g,defaultPage:x=1,onPageChange:b,siblingCount:v=1,boundaryCount:y=1,showEdges:M=!1,showArrows:P=!0,disabled:j=!1,getPageHref:w,renderLink:L,label:N="Pagination",pageLabel:C=e=>`Page ${e}`,previousLabel:k="Previous page",nextLabel:$="Next page",firstLabel:z="First page",lastLabel:D="Last page",statusLabel:I=(e,t)=>`Page ${e} of ${t}`,className:K,children:B,...A},R){const E=n(),F=u??E.size??"md",H=d??E.color??"primary",S=h??E.density??"compact",[W,q]=a.useState(x),G=Math.min(Math.max(g??W,1),Math.max(p,1));if(p<2)return null;const J=function paginationRange(e,t,a,n){const r=range(1,Math.min(n,e)),l=range(Math.max(e-n+1,n+1),e),i=Math.max(Math.min(t-a,e-n-2*a-1),n+2),o=Math.min(Math.max(t+a,n+2*a+2),l.length>0?l[0]-2:e-1);return[...r,...i>n+2?["start-ellipsis"]:n+1<e-n?[n+1]:[],...range(i,o),...o<e-n-1?["end-ellipsis"]:e-n>n?[e-n]:[],...l]}(p,G,v,y),O=G<=1,Q=G>=p,linkProps=(t,a,n)=>{if(!w||a)return null;const r=w(t);return{render:L?L(t,r):e("a",{href:r}),rel:n}},press=(e,t)=>{e.metaKey||e.ctrlKey||e.shiftKey||e.altKey||w&&!b||(e.preventDefault(),(e=>{const t=Math.min(Math.max(e,1),p);t!==G&&(void 0===g&&q(t),b?.(t))})(t))},stepper=(t,a,n,l,i,o,s)=>e("li",{className:"flex",children:e(r,{variant:m,size:F,color:H,density:S,elevation:f,disabled:j||l,"aria-label":a,startIcon:e("span",{className:`flex items-center ${i}`,children:o}),onClick:e=>press(e,n),...linkProps(n,j||l,s)})},t);return t("nav",{ref:R,"aria-label":N,className:["flex items-center",K??""].filter(Boolean).join(" "),...A,children:[t("ul",{role:"list",className:`m-0 flex list-none items-center p-0 ${o[F]}`,children:[M?stepper("first",z,1,O,"rotate-180 rtl:rotate-0",e(DoubleChevronIcon,{})):null,P?stepper("previous",k,G-1,O,"rotate-90 rtl:-rotate-90",e(l,{}),"prev"):null,J.map((t,a)=>e("li","number"==typeof t?{className:"flex",children:e(r,{variant:t===G?"solid":m,size:F,color:H,density:S,elevation:f,disabled:j,"aria-label":C(t),"aria-current":t===G?"page":void 0,className:"tabular-nums",onClick:e=>press(e,t),...linkProps(t,j||t===G),children:t})}:{"aria-hidden":"true",className:["flex select-none items-center justify-center","text-(--plass-muted-fg)",i[F],c[F]].join(" "),children:"…"},`slot-${a}`)),P?stepper("next",$,G+1,Q,"-rotate-90 rtl:rotate-90",e(l,{}),"next"):null,M?stepper("last",D,p,Q,"rtl:rotate-180",e(DoubleChevronIcon,{})):null]}),e("span",{className:s,"aria-live":"polite",children:I(G,p)}),B]})});

package/dist/components/panes/PlPanes.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{cx as r,transitionClasses as i}from"../../internal/styles.js";const s=/* @__PURE__ */n.createContext({basis:null}),o={xs:"basis-1",sm:"basis-1.5",md:"basis-2",lg:"basis-2.5",xl:"basis-3"},a={xs:4,sm:6,md:8,lg:10,xl:12};function toPixels(e,t,n){if(null==e)return;if("number"==typeof e)return t*e/100;const r=/^\s*(-?[\d.]+)\s*(px|rem|em|%)\s*$/.exec(e);if(!r)return;const i=Number(r[1]);if(!Number.isNaN(i))switch(r[2]){case"px":return i;case"%":return t*i/100;case"rem":return i*parseFloat(getComputedStyle(document.documentElement).fontSize||"16");case"em":return i*parseFloat(n&&getComputedStyle(n).fontSize||"16");default:return}}export const PlPanes=/* @__PURE__ */n.forwardRef(function PlPanes({orientation:l="horizontal",resizable:c=!0,color:u="primary",size:d="md",onResize:m,onResizeEnd:p,className:f,style:g,children:h,...x},v){const b=n.Children.toArray(h).filter(n.isValidElement),y=b.length,w=n.useRef(null),z=n.useCallback(e=>{w.current=e,"function"==typeof v?v(e):v&&(v.current=e)},[v]),P=n.useRef([]);P.current=b.map(e=>e.props);const[S,R]=n.useState(null),E=S&&S.length===y?S:null,k=n.useRef(null);k.current=E;const C="horizontal"===l,N=a[d]*Math.max(0,y-1);function grip(e){const t=w.current,n=k.current;if(!c||!t||!n||void 0===n[e+1])return null;const r=t.getBoundingClientRect(),i=(C?r.width:r.height)-N;if(i<=0)return null;const s=P.current[e],o=P.current[e+1],a=n[e]*i,l=a+n[e+1]*i,u=Math.max(toPixels(s?.minSize,i,t)??0,l-(toPixels(o?.maxSize,i,t)??l)),d=Math.min(toPixels(s?.maxSize,i,t)??l,l-(toPixels(o?.minSize,i,t)??0));return d<u?null:{root:t,current:n,extent:i,start:a,pair:l,resize(t){const r=Math.min(d,Math.max(u,a+t)),s=[...n];return s[e]=r/i,s[e+1]=(l-r)/i,R(s),m?.(s.map(e=>100*e)),s}}}n.useEffect(()=>{const e=w.current;if(!e)return;const measure=()=>{const t=e.getBoundingClientRect(),n=(C?t.width:t.height)-N;n<=0||R(t=>t&&t.length===y?t:function initialFractions(e,t,n){const r=e.map(e=>toPixels(e.defaultSize,t,n)),i=r.reduce((e,t)=>e+(t??0),0),s=r.filter(e=>void 0===e).length,o=s>0?Math.max(0,t-i)/s:0,a=r.map(e=>Math.max(0,e??o)),l=a.reduce((e,t)=>e+t,0);return l<=0?a.map(()=>1/Math.max(1,a.length)):a.map(e=>e/l)}(P.current,n,e))};measure();const t=new ResizeObserver(measure);return t.observe(e),()=>t.disconnect()},[y,C,N]);const M=n.useRef(null);n.useEffect(()=>()=>M.current?.(),[]);const L=r("group/handle relative z-1 flex shrink-0 grow-0 items-center justify-center",o[d],i,"[outline:none] focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-0",c?r(C?"cursor-col-resize":"cursor-row-resize","hover:bg-(--p-soft) data-[dragging]:bg-(--p-soft)"):"");return e("div",{ref:z,className:r("flex h-full w-full",C?"flex-row":"flex-col","min-h-0 min-w-0",f),style:{"--p-accent":`var(--plass-${u}-accent)`,"--p-soft":`var(--plass-${u}-soft)`,"--p-ring":`var(--plass-${u}-ring)`,...g},...x,children:b.map((o,a)=>t(n.Fragment,{children:[a>0?e("div",{role:"separator","aria-orientation":C?"vertical":"horizontal","aria-valuenow":E?Math.round(100*E[a-1]):void 0,"aria-valuemin":0,"aria-valuemax":100,"aria-disabled":!c||void 0,tabIndex:c?0:-1,className:L,onPointerDown:e=>{0===e.button&&function beginDrag(e,t){const n=grip(e);if(!n)return;const r=t.currentTarget;r.setPointerCapture(t.pointerId),r.dataset.dragging="true";const i=document.body.style.getPropertyValue("-webkit-user-select");document.body.style.setProperty("-webkit-user-select","none");const s=C?t.clientX:t.clientY,o=C&&"rtl"===getComputedStyle(n.root).direction?-1:1;let a=n.current;const move=e=>{const t=C?e.clientX:e.clientY;a=n.resize((t-s)*o)},release=()=>{M.current=null,r.removeEventListener("pointermove",move),r.removeEventListener("pointerup",end),r.removeEventListener("pointercancel",end),delete r.dataset.dragging,i?document.body.style.setProperty("-webkit-user-select",i):document.body.style.removeProperty("-webkit-user-select")},end=()=>{release(),p?.(a.map(e=>100*e))};M.current=release,r.addEventListener("pointermove",move),r.addEventListener("pointerup",end),r.addEventListener("pointercancel",end)}(a-1,e)},onKeyDown:e=>{const t=C?"ArrowLeft":"ArrowUp",n=C?"ArrowRight":"ArrowDown";e.key!==t&&e.key!==n||(e.preventDefault(),function nudge(e,t){const n=grip(e);if(!n)return;const r=n.resize(t);p?.(r.map(e=>100*e))}(a-1,e.key===n?16:-16))},children:e("span",{"aria-hidden":"true",className:r("pointer-events-none bg-(--plass-border)",i,C?"h-full w-px":"h-px w-full",c?"group-hover/handle:bg-(--p-accent) group-focus-visible/handle:bg-(--p-accent) group-data-[dragging]/handle:bg-(--p-accent)":"")})}):null,e(s.Provider,{value:{basis:E?`calc((100% - ${N}px) * ${E[a].toFixed(6)})`:null},children:o})]},o.key??a))})});export const PlPane=/* @__PURE__ */n.forwardRef(function PlPane({defaultSize:t,minSize:i,maxSize:o,className:a,style:l,children:c,...u},d){const{basis:m}=n.useContext(s);return e("div",{ref:d,className:r("relative min-h-0 min-w-0 overflow-auto",a),style:{flex:m?`0 0 ${m}`:"1 1 0%",...l},...u,children:c})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{useDefaults as n}from"../../internal/defaults.js";import{cx as i,transitionClasses as o}from"../../internal/styles.js";const s=/* @__PURE__ */r.createContext({basis:null}),a={xs:"basis-1",sm:"basis-1.5",md:"basis-2",lg:"basis-2.5",xl:"basis-3"},l={xs:4,sm:6,md:8,lg:10,xl:12};function toPixels(e,t,r){if(null==e)return;if("number"==typeof e)return t*e/100;const n=/^\s*(-?[\d.]+)\s*(px|rem|em|%)\s*$/.exec(e);if(!n)return;const i=Number(n[1]);if(!Number.isNaN(i))switch(n[2]){case"px":return i;case"%":return t*i/100;case"rem":return i*parseFloat(getComputedStyle(document.documentElement).fontSize||"16");case"em":return i*parseFloat(r&&getComputedStyle(r).fontSize||"16");default:return}}export const PlPanes=/* @__PURE__ */r.forwardRef(function PlPanes({orientation:c="horizontal",resizable:u=!0,color:d,size:m,onResize:p,onResizeEnd:f,className:g,style:h,children:x,...v},b){const y=n(),w=d??y.color??"primary",z=m??y.size??"md",P=r.Children.toArray(x).filter(r.isValidElement),S=P.length,R=r.useRef(null),C=r.useCallback(e=>{R.current=e,"function"==typeof b?b(e):b&&(b.current=e)},[b]),E=r.useRef([]);E.current=P.map(e=>e.props);const[k,N]=r.useState(null),M=k&&k.length===S?k:null,L=r.useRef(null);L.current=M;const $="horizontal"===c,j=l[z]*Math.max(0,S-1);function grip(e){const t=R.current,r=L.current;if(!u||!t||!r||void 0===r[e+1])return null;const n=t.getBoundingClientRect(),i=($?n.width:n.height)-j;if(i<=0)return null;const o=E.current[e],s=E.current[e+1],a=r[e]*i,l=a+r[e+1]*i,c=Math.max(toPixels(o?.minSize,i,t)??0,l-(toPixels(s?.maxSize,i,t)??l)),d=Math.min(toPixels(o?.maxSize,i,t)??l,l-(toPixels(s?.minSize,i,t)??0));return d<c?null:{root:t,current:r,extent:i,start:a,pair:l,resize(t){const n=Math.min(d,Math.max(c,a+t)),o=[...r];return o[e]=n/i,o[e+1]=(l-n)/i,N(o),p?.(o.map(e=>100*e)),o}}}r.useEffect(()=>{const e=R.current;if(!e)return;const measure=()=>{const t=e.getBoundingClientRect(),r=($?t.width:t.height)-j;r<=0||N(t=>t&&t.length===S?t:function initialFractions(e,t,r){const n=e.map(e=>toPixels(e.defaultSize,t,r)),i=n.reduce((e,t)=>e+(t??0),0),o=n.filter(e=>void 0===e).length,s=o>0?Math.max(0,t-i)/o:0,a=n.map(e=>Math.max(0,e??s)),l=a.reduce((e,t)=>e+t,0);return l<=0?a.map(()=>1/Math.max(1,a.length)):a.map(e=>e/l)}(E.current,r,e))};measure();const t=new ResizeObserver(measure);return t.observe(e),()=>t.disconnect()},[S,$,j]);const A=r.useRef(null);r.useEffect(()=>()=>A.current?.(),[]);const D=i("group/handle relative z-1 flex shrink-0 grow-0 items-center justify-center",a[z],o,"[outline:none] focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-0",u?i($?"cursor-col-resize":"cursor-row-resize","hover:bg-(--p-soft) data-[dragging]:bg-(--p-soft)"):"");return e("div",{ref:C,className:i("flex h-full w-full",$?"flex-row":"flex-col","min-h-0 min-w-0",g),style:{"--p-accent":`var(--plass-${w}-accent)`,"--p-soft":`var(--plass-${w}-soft)`,"--p-ring":`var(--plass-${w}-ring)`,...h},...v,children:P.map((n,a)=>t(r.Fragment,{children:[a>0?e("div",{role:"separator","aria-orientation":$?"vertical":"horizontal","aria-valuenow":M?Math.round(100*M[a-1]):void 0,"aria-valuemin":0,"aria-valuemax":100,"aria-disabled":!u||void 0,tabIndex:u?0:-1,className:D,onPointerDown:e=>{0===e.button&&function beginDrag(e,t){const r=grip(e);if(!r)return;const n=t.currentTarget;n.setPointerCapture(t.pointerId),n.dataset.dragging="true";const i=document.body.style.getPropertyValue("-webkit-user-select");document.body.style.setProperty("-webkit-user-select","none");const o=$?t.clientX:t.clientY,s=$&&"rtl"===getComputedStyle(r.root).direction?-1:1;let a=r.current;const move=e=>{const t=$?e.clientX:e.clientY;a=r.resize((t-o)*s)},release=()=>{A.current=null,n.removeEventListener("pointermove",move),n.removeEventListener("pointerup",end),n.removeEventListener("pointercancel",end),delete n.dataset.dragging,i?document.body.style.setProperty("-webkit-user-select",i):document.body.style.removeProperty("-webkit-user-select")},end=()=>{release(),f?.(a.map(e=>100*e))};A.current=release,n.addEventListener("pointermove",move),n.addEventListener("pointerup",end),n.addEventListener("pointercancel",end)}(a-1,e)},onKeyDown:e=>{const t=$?"ArrowLeft":"ArrowUp",r=$?"ArrowRight":"ArrowDown";if(e.key!==t&&e.key!==r)return;e.preventDefault();const n=$&&"rtl"===getComputedStyle(e.currentTarget).direction?-1:1,i=e.key===r?16:-16;!function nudge(e,t){const r=grip(e);if(!r)return;const n=r.resize(t);f?.(n.map(e=>100*e))}(a-1,i*n)},children:e("span",{"aria-hidden":"true",className:i("pointer-events-none bg-(--plass-border)",o,$?"h-full w-px":"h-px w-full",u?"group-hover/handle:bg-(--p-accent) group-focus-visible/handle:bg-(--p-accent) group-data-[dragging]/handle:bg-(--p-accent)":"")})}):null,e(s.Provider,{value:{basis:M?`calc((100% - ${j}px) * ${M[a].toFixed(6)})`:null},children:n})]},n.key??a))})});export const PlPane=/* @__PURE__ */r.forwardRef(function PlPane({defaultSize:t,minSize:n,maxSize:o,className:a,style:l,children:c,...u},d){const{basis:m}=r.useContext(s);return e("div",{ref:d,className:i("relative min-h-0 min-w-0 overflow-auto",a),style:{flex:m?`0 0 ${m}`:"1 1 0%",...l},...u,children:c})});

package/dist/components/pill/PlPill.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{controlSlots as n,controlTextClasses as r,cx as o,focusRingClasses as i,gapClasses as a,glassClasses as c,hasContent as d,iconClasses as m,iconSizeClasses as p,metaTextClasses as f,paddingXClasses as x,sheetBodyClasses as u,transitionClasses as h}from"../../internal/styles.js";const g={solid:"text-(--p-on-solid) [background-image:var(--p-fill)] [box-shadow:var(--p-elev),var(--p-lift)]",glass:/* @__PURE__ */[c,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:`${c} text-(--p-accent) bg-(--p-soft)`},v={solid:"hover:brightness-105 active:brightness-95",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)] active:bg-(--plass-glass-press)",ghost:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)"},b={xs:"min-h-5.5",sm:"min-h-6.5",md:"min-h-8",lg:"min-h-10",xl:"min-h-12"},w={xs:"rounded-[0.6875rem]",sm:"rounded-[0.8125rem]",md:"rounded-[1rem]",lg:"rounded-[1.25rem]",xl:"rounded-[1.5rem]"},y={default:{xs:"px-3",sm:"px-4",md:"px-5",lg:"px-6",xl:"px-8"},compact:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-4"}},N={static:{top:"",bottom:""},sticky:{top:"sticky top-3 z-20",bottom:"sticky bottom-3 z-20"},fixed:{top:"fixed inset-x-0 top-3 z-30 mx-auto w-fit",bottom:"fixed inset-x-0 bottom-3 z-30 mx-auto w-fit"}};export const PlPill=/* @__PURE__ */l.forwardRef(function PlPill({variant:c="solid",size:k="md",color:j="secondary",density:z="default",elevation:_=2,startIcon:P,endIcon:R,title:C,description:H,details:I,expanded:O=!1,position:$="static",side:B="top",className:E,style:F,children:S,onClick:q,...A},D){const G=l.useRef(null),[J,K]=l.useState(0);l.useEffect(()=>{const e=G.current;if(!e||"undefined"==typeof ResizeObserver)return;const s=new ResizeObserver(()=>K(e.scrollHeight));return s.observe(e),K(e.scrollHeight),()=>s.disconnect()},[I]);const L=Boolean(q),M=x[z][k],Q=s(t,{children:[d(P)?e("span",{className:o("flex shrink-0 items-center justify-center overflow-hidden rounded-full [&_img]:size-full [&_img]:object-cover",p[k]),children:P}):null,d(C)||d(H)||d(S)?s("span",{className:o("flex min-w-0 flex-1 flex-col items-center justify-center text-center",y[z][k]),children:[d(C)?e("span",{className:"max-w-full truncate",children:C}):null,d(H)?e("span",{className:o("max-w-full truncate font-normal",f[k],"[color:color-mix(in_oklab,currentColor_72%,transparent)]"),children:H}):null,S]}):null]});return s("div",{ref:D,className:o("inline-flex max-w-full flex-col overflow-hidden align-middle",w[k],"font-medium whitespace-nowrap select-none",r[k],g[c],h,m,L?`plass-glow ${v[c]}`:"",N[$][B],E),style:{...n(j,_,c),...F},...A,children:[s("div",{className:o("flex shrink-0 items-center py-1",b[k],a[k],L?"ps-0":M,d(R)?"pe-1":L?"pe-0":""),children:[L?e("button",{type:"button",className:o("flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch","rounded-[inherit]",a[k],M,i),onClick:q,children:Q}):Q,d(R)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:R}):null]}),d(I)?e("div",{className:o("overflow-hidden","[transition:height_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]"),style:{height:O?J:0},inert:!O,children:e("div",{ref:G,className:o("whitespace-normal pb-2",M,u[k]),children:I})}):null]})});
+"use client";import{jsx as e,jsxs as s,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{useDefaults as r}from"../../internal/defaults.js";import{controlSlots as n,controlTextClasses as o,cx as i,focusRingClasses as a,gapClasses as c,glassClasses as d,hasContent as m,iconClasses as p,iconSizeClasses as f,metaTextClasses as x,paddingXClasses as u,sheetBodyClasses as h,transitionClasses as g}from"../../internal/styles.js";const v={solid:"text-(--p-on-solid) [background-image:var(--p-fill)] [box-shadow:var(--p-elev),var(--p-lift)]",glass:/* @__PURE__ */[d,"border text-(--p-accent) bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:`${d} text-(--p-accent) bg-(--p-soft)`},b={solid:"hover:brightness-105 active:brightness-95",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)] active:bg-(--plass-glass-press)",ghost:"hover:bg-(--p-soft-hover) active:bg-(--p-soft-press)"},w={xs:"min-h-5.5",sm:"min-h-6.5",md:"min-h-8",lg:"min-h-10",xl:"min-h-12"},y={xs:"rounded-[0.6875rem]",sm:"rounded-[0.8125rem]",md:"rounded-[1rem]",lg:"rounded-[1.25rem]",xl:"rounded-[1.5rem]"},N={default:{xs:"px-3",sm:"px-4",md:"px-5",lg:"px-6",xl:"px-8"},compact:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-4"}},j={static:{top:"",bottom:""},sticky:{top:"sticky top-3 z-20",bottom:"sticky bottom-3 z-20"},fixed:{top:"fixed inset-x-0 top-3 z-30 mx-auto w-fit",bottom:"fixed inset-x-0 bottom-3 z-30 mx-auto w-fit"}};export const PlPill=/* @__PURE__ */l.forwardRef(function PlPill({variant:d="solid",size:k,color:z,density:_,elevation:P=2,startIcon:R,endIcon:C,title:H,description:I,details:O,expanded:$=!1,position:B="static",side:E="top",className:F,style:S,children:q,onClick:A,...D},G){const J=r(),K=k??J.size??"md",L=z??J.color??"secondary",M=_??J.density??"default",Q=l.useRef(null),[T,U]=l.useState(0);l.useEffect(()=>{const e=Q.current;if(!e||"undefined"==typeof ResizeObserver)return;const s=new ResizeObserver(()=>U(e.scrollHeight));return s.observe(e),U(e.scrollHeight),()=>s.disconnect()},[O]);const V=Boolean(A),W=u[M][K],X=s(t,{children:[m(R)?e("span",{className:i("flex shrink-0 items-center justify-center overflow-hidden rounded-full [&_img]:size-full [&_img]:object-cover",f[K]),children:R}):null,m(H)||m(I)||m(q)?s("span",{className:i("flex min-w-0 flex-1 flex-col items-center justify-center text-center",N[M][K]),children:[m(H)?e("span",{className:"max-w-full truncate",children:H}):null,m(I)?e("span",{className:i("max-w-full truncate font-normal",x[K],"[color:color-mix(in_oklab,currentColor_72%,transparent)]"),children:I}):null,q]}):null]});return s("div",{ref:G,className:i("inline-flex max-w-full flex-col overflow-hidden align-middle",y[K],"font-medium whitespace-nowrap select-none",o[K],v[d],g,p,V?`plass-glow ${b[d]}`:"",j[B][E],F),style:{...n(L,P,d),...S},...D,children:[s("div",{className:i("flex shrink-0 items-center py-1",w[K],c[K],V?"ps-0":W,m(C)?"pe-1":V?"pe-0":""),children:[V?e("button",{type:"button",className:i("flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch","rounded-[inherit]",c[K],W,a),onClick:A,children:X}):X,m(C)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:C}):null]}),m(O)?e("div",{className:i("overflow-hidden","[transition:height_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]"),style:{height:$?T:0},inert:!$,children:e("div",{ref:Q,className:i("whitespace-normal pb-2",W,h[K]),children:O})}):null]})});

package/dist/components/popconfirm/PlPopconfirm.d.ts

@@ -0,0 +1,61 @@
+import * as React from 'react';
+import type { PlassAlign, PlassColor, PlassSize, PlassSide } from '../../types.js';
+export interface PlPopconfirmProps {
+    /** What opens it. The element it is put on keeps everything it already had. */
+    trigger: React.ReactElement;
+    /** The question, as the heading that names the popup. */
+    title?: React.ReactNode;
+    /** A line under it. Say what happens. */
+    description?: React.ReactNode;
+    /** The word on the button that answers yes. @default 'Confirm' */
+    confirmLabel?: React.ReactNode;
+    /** The word on the button that answers no. @default 'Cancel' */
+    cancelLabel?: React.ReactNode;
+    /**
+     * What confirming does. **A promise is waited for**: the button shows its
+     * loading state until it settles and the popup closes only if it resolves, so
+     * a failed request leaves the question on screen instead of pretending.
+     *
+     * A rejection is caught and goes no further. Keeping the question up is the
+     * whole of what this component owes a failure; what the failure *means* is
+     * the caller's, and `onConfirm` is where to report it from.
+     */
+    onConfirm?: () => void | Promise<unknown>;
+    /** What cancelling does, beyond closing. */
+    onCancel?: () => void;
+    /** @default 'danger' */
+    color?: PlassColor;
+    /** @default 'md' */
+    size?: PlassSize;
+    /** Which edge of the trigger it opens against. @default 'top' */
+    side?: PlassSide;
+    /** @default 'center' */
+    align?: PlassAlign;
+    /** How wide the sheet may get. @default 280 */
+    width?: number | string;
+    /** The popup is open. Use with `onOpenChange` for a controlled one. */
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Classes on the popup, alongside the component's own. */
+    className?: string;
+}
+/**
+ * A question asked where it was raised, rather than in the middle of the page.
+ *
+ * The difference from [`PlConfirmProvider`](../feedback/confirm) is not the
+ * words, it is **how much it interrupts**. A modal takes the page away and is
+ * right for the question that deserves that — deleting an account, discarding
+ * an hour of work. This is right for the row's own delete button: the question
+ * appears against the thing it is about, the rest of the table stays readable,
+ * and a reader who changes their mind presses Escape and is exactly where they
+ * were.
+ *
+ * The rule of thumb is what happens if they answer by accident. If the answer
+ * is "they can undo it", this is the one.
+ *
+ * `color` defaults to `danger` here and to `primary` on a `PlButton`, and that
+ * is not an inconsistency: nobody reaches for a popconfirm to ask whether to
+ * save.
+ */
+export declare function PlPopconfirm({ trigger, title, description, confirmLabel, cancelLabel, onConfirm, onCancel, color: colorProp, size: sizeProp, side, align, width, open: openProp, defaultOpen, onOpenChange, className }: PlPopconfirmProps): React.JSX.Element;

package/dist/components/popconfirm/PlPopconfirm.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"react";import{PlButton as i}from"../button/PlButton.js";import{PlPopover as n}from"../popover/PlPopover.js";import{useDefaults as r}from"../../internal/defaults.js";import{cx as s}from"../../internal/styles.js";export function PlPopconfirm({trigger:a,title:c,description:l,confirmLabel:m="Confirm",cancelLabel:d="Cancel",onConfirm:p,onCancel:f,color:u,size:g,side:h="top",align:C="center",width:j=280,open:y,defaultOpen:x,onOpenChange:P,className:v}){const w=r(),z=g??w.size??"md",b=u??"danger",[N,O]=t.useState(x??!1),k=y??N,[L,S]=t.useState(!1),setOpen=e=>{void 0===y&&O(e),P?.(e)};return e(n,{trigger:a,open:k,onOpenChange:e=>{L||(e||f?.(),setOpen(e))},title:c,description:l,side:h,align:C,width:j,color:b,size:z,showClose:!1,className:v,children:o("div",{className:s("mt-3 flex flex-wrap items-center justify-end gap-2"),children:[e(i,{variant:"ghost",color:"secondary",size:z,density:"compact",disabled:L,onClick:()=>{f?.(),setOpen(!1)},children:d}),e(i,{color:b,size:z,density:"compact",loading:L,autoFocus:!0,onClick:async()=>{const e=p?.();if(e instanceof Promise){S(!0);try{await e,setOpen(!1)}catch{}finally{S(!1)}}else setOpen(!1)},children:m})]})})}

package/dist/components/popconfirm/index.d.ts

@@ -0,0 +1,2 @@
+export { PlPopconfirm } from './PlPopconfirm.js';
+export type { PlPopconfirmProps } from './PlPopconfirm.js';

package/dist/components/popconfirm/index.js

@@ -0,0 +1 @@
+export{PlPopconfirm}from"./PlPopconfirm.js";

package/dist/components/popover/PlPopover.d.ts

@@ -104,4 +104,4 @@ export declare const PlPopoverClose: React.ForwardRefExoticComponent<Omit<import
  * the `aria-labelledby` / `aria-describedby` wiring. What is left here is the
  * surface, the width ladder and the header.
  */
-export declare function PlPopover({ size, color, density, trigger, title, description, children, side, align, sideOffset, alignOffset, arrow, open, defaultOpen, onOpenChange, modal, dismissible, showClose, closeLabel, width, className, style, ...props }: PlPopoverProps): React.JSX.Element;
+export declare function PlPopover({ size: sizeProp, color: colorProp, density: densityProp, trigger, title, description, children, side, align, sideOffset, alignOffset, arrow, open, defaultOpen, onOpenChange, modal, dismissible, showClose, closeLabel, width, className, style, ...props }: PlPopoverProps): React.JSX.Element;

package/dist/components/popover/PlPopover.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{Popover as a}from"@base-ui/react/popover";import{CloseIcon as l}from"../../internal/icons.js";import{cx as t,focusRingClasses as o,glassClasses as r,hasContent as i,metaTextClasses as n,radiusClasses as d,sheetBodyClasses as p,sheetHeaderGapClasses as c,sheetPaddingXClasses as m,sheetPaddingYClasses as f,sheetSectionGapClasses as g,sheetTitleClasses as h,surfaceSlots as u}from"../../internal/styles.js";const x={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},v=/* @__PURE__ */[r,"relative flex flex-col","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)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),b={xs:8,sm:9,md:10,lg:11,xl:12},w=/* @__PURE__ */["flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--plass-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","hover:bg-(--p-soft) hover:text-(--plass-fg)",o].join(" ");export const PlPopoverClose=a.Close;export function PlPopover({size:o="md",color:r="primary",density:y="default",trigger:N,title:k,description:j,children:O,side:P="bottom",align:_="center",sideOffset:C=6,alignOffset:z=0,arrow:L=!1,open:M,defaultOpen:T,onOpenChange:W,modal:A=!1,dismissible:B=!0,showClose:D=!1,closeLabel:E="Close",width:R,className:$,style:q,...F}){const G=m[y][o],H=f[y][o],I=b[o],J=i(k)||i(j);return s(a.Root,{open:M,defaultOpen:T,modal:A,onOpenChange:(e,s)=>{B||e||"escape-key"!==s.reason&&"outside-press"!==s.reason&&"focus-out"!==s.reason?W?.(e):s.cancel()},children:[N?e(a.Trigger,{render:N}):null,e(a.Portal,{children:e(a.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",side:P,align:_,sideOffset:C,alignOffset:z,children:s(a.Popup,{className:t(v,d[o],p[o],g[o],G,H,void 0===R?x[o]:"",$),style:{...u(r,3),...void 0===R?null:{maxWidth:"number"==typeof R?`${R}px`:R},...q},...F,children:[L?e(a.Arrow,{className:t("data-[side=top]:bottom-[-1px]","data-[side=bottom]:top-[-1px] data-[side=bottom]:rotate-180","data-[side=left]:right-[-1px] data-[side=left]:-rotate-90","data-[side=right]:left-[-1px] data-[side=right]:rotate-90"),children:s("svg",{width:I,height:I/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:[e("path",{d:"M0 0h10L5 5z",fill:"var(--plass-glass-press)"}),e("path",{d:"M0 0 5 5 10 0",fill:"none",stroke:"var(--plass-glass-line)",strokeWidth:"1",vectorEffect:"non-scaling-stroke"})]})}):null,J||D?s("div",{className:"flex shrink-0 items-start gap-3",children:[s("div",{className:t("flex min-w-0 flex-1 flex-col",c[o]),children:[i(k)?e(a.Title,{className:t("m-0 font-semibold",h[o]),children:k}):null,i(j)?e(a.Description,{className:t("m-0 text-(--plass-muted-fg)",n[o]),children:j}):null]}),D?e(a.Close,{"aria-label":E,className:w,children:e(l,{})}):null]}):null,i(O)?e("div",{className:"min-w-0",children:O}):null]})})})]})}
+"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{useDefaults as a}from"../../internal/defaults.js";import{Popover as l}from"@base-ui/react/popover";import{CloseIcon as t}from"../../internal/icons.js";import{cx as o,focusRingClasses as r,glassClasses as i,hasContent as n,metaTextClasses as d,radiusClasses as p,sheetBodyClasses as c,sheetHeaderGapClasses as m,sheetPaddingXClasses as f,sheetPaddingYClasses as g,sheetSectionGapClasses as h,sheetTitleClasses as u,surfaceSlots as x}from"../../internal/styles.js";const v={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},b=/* @__PURE__ */[i,"relative flex flex-col","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)_var(--plass-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),w={xs:8,sm:9,md:10,lg:11,xl:12},y=/* @__PURE__ */["flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--plass-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","hover:bg-(--p-soft) hover:text-(--plass-fg)",r].join(" ");export const PlPopoverClose=l.Close;export function PlPopover({size:r,color:i,density:N,trigger:j,title:k,description:O,children:P,side:_="bottom",align:z="center",sideOffset:C=6,alignOffset:L=0,arrow:M=!1,open:T,defaultOpen:W,onOpenChange:A,modal:B=!1,dismissible:D=!0,showClose:E=!1,closeLabel:R="Close",width:$,className:q,style:F,...G}){const H=a(),I=r??H.size??"md",J=i??H.color??"primary",K=N??H.density??"default",Q=f[K][I],S=g[K][I],U=w[I],V=n(k)||n(O);return s(l.Root,{open:T,defaultOpen:W,modal:B,onOpenChange:(e,s)=>{D||e||"escape-key"!==s.reason&&"outside-press"!==s.reason&&"focus-out"!==s.reason?A?.(e):s.cancel()},children:[j?e(l.Trigger,{render:j}):null,e(l.Portal,{children:e(l.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",side:_,align:z,sideOffset:C,alignOffset:L,children:s(l.Popup,{className:o(b,p[I],c[I],h[I],Q,S,void 0===$?v[I]:"",q),style:{...x(J,3),...void 0===$?null:{maxWidth:"number"==typeof $?`${$}px`:$},...F},...G,children:[M?e(l.Arrow,{className:o("data-[side=top]:bottom-[-1px]","data-[side=bottom]:top-[-1px] data-[side=bottom]:rotate-180","data-[side=left]:right-[-1px] data-[side=left]:-rotate-90","data-[side=right]:left-[-1px] data-[side=right]:rotate-90"),children:s("svg",{width:U,height:U/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:[e("path",{d:"M0 0h10L5 5z",fill:"var(--plass-glass-press)"}),e("path",{d:"M0 0 5 5 10 0",fill:"none",stroke:"var(--plass-glass-line)",strokeWidth:"1",vectorEffect:"non-scaling-stroke"})]})}):null,V||E?s("div",{className:"flex shrink-0 items-start gap-3",children:[s("div",{className:o("flex min-w-0 flex-1 flex-col",m[I]),children:[n(k)?e(l.Title,{className:o("m-0 font-semibold",u[I]),children:k}):null,n(O)?e(l.Description,{className:o("m-0 text-(--plass-muted-fg)",d[I]),children:O}):null]}),E?e(l.Close,{"aria-label":R,className:y,children:e(t,{})}):null]}):null,n(P)?e("div",{className:"min-w-0",children:P}):null]})})})]})}

package/dist/components/progress-box/PlProgressBox.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Progress as s}from"@base-ui/react/progress";import{fillTransitionClasses as r,plateGapClasses as t,plateRadiusClasses as n,plateSizeClasses as i,progressAriaText as o,progressFraction as m,progressSlots as c,progressText as u,trackClasses as f}from"../../internal/progress.js";import{cx as d,metaTextClasses as p,stackGapClasses as x}from"../../internal/styles.js";export const PlProgressBox=/* @__PURE__ */l.forwardRef(function PlProgressBox({size:l="md",color:h="primary",count:g=4,value:y=null,min:b=0,max:v=100,label:w,showValue:N=!1,format:j,className:M,style:P,...k},V){const A=m(y,b,v),B=null===A,R=void 0!==j,T=Math.max(1,Math.floor(g));return a(s.Root,{ref:V,value:y??null,min:b,max:v,format:j,getAriaValueText:o(A,R),className:d("inline-flex flex-col",x[l],M),style:{...c(h),...P},...k,children:[w||N?a("div",{className:d("flex items-baseline gap-2",w?"justify-between":"justify-end",p[l]),children:[w?e(s.Label,{className:"min-w-0 truncate text-(--plass-fg)",children:w}):null,N?e(s.Value,{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:e=>u(A,e,R)}):null]}):null,e(s.Track,{className:d("flex",t[l]),children:Array.from({length:T},(a,s)=>e("span",{className:d("relative overflow-hidden",f,i[l],n[l]),children:e("span",{"aria-hidden":"true",className:d("absolute inset-y-0 start-0 [background-image:var(--p-fill)]",B?"plass-plate-wave w-full":r),style:B?{"--p-i":s}:{width:`${Math.min(100,Math.max(0,100*(A*T-s)))}%`}})},s))})]})});
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{useDefaults as s}from"../../internal/defaults.js";import{Progress as r}from"@base-ui/react/progress";import{fillTransitionClasses as t,plateGapClasses as i,plateRadiusClasses as n,plateSizeClasses as o,progressAriaText as m,progressFraction as c,progressSlots as u,progressText as f,trackClasses as d}from"../../internal/progress.js";import{cx as p,metaTextClasses as x,stackGapClasses as h}from"../../internal/styles.js";export const PlProgressBox=/* @__PURE__ */l.forwardRef(function PlProgressBox({size:l,color:g,count:y=4,value:b=null,min:j=0,max:v=100,label:w,showValue:N=!1,format:M,className:P,style:k,...V},z){const A=s(),B=l??A.size??"md",R=g??A.color??"primary",T=c(b,j,v),L=null===T,$=void 0!==M,q=Math.max(1,Math.floor(y));return a(r.Root,{ref:z,value:b??null,min:j,max:v,format:M,getAriaValueText:m(T,$),className:p("inline-flex flex-col",h[B],P),style:{...u(R),...k},...V,children:[w||N?a("div",{className:p("flex items-baseline gap-2",w?"justify-between":"justify-end",x[B]),children:[w?e(r.Label,{className:"min-w-0 truncate text-(--plass-fg)",children:w}):null,N?e(r.Value,{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:e=>f(T,e,$)}):null]}):null,e(r.Track,{className:p("flex",i[B]),children:Array.from({length:q},(a,l)=>e("span",{className:p("relative overflow-hidden",d,o[B],n[B]),children:e("span",{"aria-hidden":"true",className:p("absolute inset-y-0 start-0 [background-image:var(--p-fill)]",L?"plass-plate-wave w-full":t),style:L?{"--p-i":l}:{width:`${Math.min(100,Math.max(0,100*(T*q-l)))}%`}})},l))})]})});

package/dist/components/progress-circular/PlProgressCircular.js

@@ -1 +1 @@
-"use client";import{jsx as r,jsxs as s}from"react/jsx-runtime";import*as e from"react";import{Progress as a}from"@base-ui/react/progress";import{progressAriaText as t,progressFraction as l,progressSlots as o,progressText as i,ringDiameters as n,ringStrokes as c}from"../../internal/progress.js";import{cx as m,gapClasses as f,metaTextClasses as u}from"../../internal/styles.js";export const PlProgressCircular=/* @__PURE__ */e.forwardRef(function PlProgressCircular({size:d="md",color:p="primary",value:h=null,min:x=0,max:k=100,label:g,showValue:v=!1,format:y,className:$,style:w,...N},j){const P=l(h,x,k),b=null===P,C=void 0!==y,V=`${e.useId()}-fill`,D=n[d],I=c[d],L=D/2,R=L-I/2,W=2*Math.PI*R,_=b?`${.28*W} ${W}`:`${W}`,z=b?0:W*(1-P);return s(a.Root,{ref:j,value:h??null,min:x,max:k,format:y,getAriaValueText:t(P,C),className:m("inline-flex items-center",f[d],u[d],$),style:{...o(p),...w},...N,children:[s("svg",{className:m("shrink-0",b&&"plass-ring-spin"),width:D,height:D,viewBox:`0 0 ${D} ${D}`,fill:"none","aria-hidden":"true",children:[r("defs",{children:s("linearGradient",{id:V,x1:"0",y1:"0",x2:"1",y2:"1",children:[r("stop",{offset:"0%",stopColor:"var(--p-solid)"}),r("stop",{offset:"100%",stopColor:"var(--p-solid-to)"})]})}),r("circle",{cx:L,cy:L,r:R,stroke:"var(--plass-track)",strokeWidth:I}),r("circle",{cx:L,cy:L,r:R,stroke:`url(#${V})`,strokeWidth:I,strokeLinecap:"round",strokeDasharray:_,strokeDashoffset:z,transform:`rotate(-90 ${L} ${L})`,className:"[transition:stroke-dashoffset_var(--plass-duration-slow)_var(--plass-ease)]"})]}),g?r(a.Label,{className:"min-w-0 truncate text-(--plass-fg)",children:g}):null,v?r(a.Value,{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:r=>i(P,r,C)}):null]})});
+"use client";import{jsx as r,jsxs as s}from"react/jsx-runtime";import*as e from"react";import{useDefaults as a}from"../../internal/defaults.js";import{Progress as t}from"@base-ui/react/progress";import{progressAriaText as l,progressFraction as o,progressSlots as i,progressText as n,ringDiameters as c,ringStrokes as m}from"../../internal/progress.js";import{cx as f,gapClasses as u,metaTextClasses as d}from"../../internal/styles.js";export const PlProgressCircular=/* @__PURE__ */e.forwardRef(function PlProgressCircular({size:p,color:h,value:x=null,min:k=0,max:g=100,label:v,showValue:y=!1,format:$,className:j,style:w,...N},P){const b=a(),C=p??b.size??"md",V=h??b.color??"primary",z=o(x,k,g),D=null===z,I=void 0!==$,L=`${e.useId()}-fill`,R=c[C],W=m[C],_=R/2,A=_-W/2,B=2*Math.PI*A,G=D?`${.28*B} ${B}`:`${B}`,M=D?0:B*(1-z);return s(t.Root,{ref:P,value:x??null,min:k,max:g,format:$,getAriaValueText:l(z,I),className:f("inline-flex items-center",u[C],d[C],j),style:{...i(V),...w},...N,children:[s("svg",{className:f("shrink-0",D&&"plass-ring-spin"),width:R,height:R,viewBox:`0 0 ${R} ${R}`,fill:"none","aria-hidden":"true",children:[r("defs",{children:s("linearGradient",{id:L,x1:"0",y1:"0",x2:"1",y2:"1",children:[r("stop",{offset:"0%",stopColor:"var(--p-solid)"}),r("stop",{offset:"100%",stopColor:"var(--p-solid-to)"})]})}),r("circle",{cx:_,cy:_,r:A,stroke:"var(--plass-track)",strokeWidth:W}),r("circle",{cx:_,cy:_,r:A,stroke:`url(#${L})`,strokeWidth:W,strokeLinecap:"round",strokeDasharray:G,strokeDashoffset:M,transform:`rotate(-90 ${_} ${_})`,className:"[transition:stroke-dashoffset_var(--plass-duration-slow)_var(--plass-ease)]"})]}),v?r(t.Label,{className:"min-w-0 truncate text-(--plass-fg)",children:v}):null,y?r(t.Value,{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:r=>n(z,r,I)}):null]})});

package/dist/components/progress-linear/PlProgressLinear.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as s from"react";import{Progress as r}from"@base-ui/react/progress";import{barThicknessClasses as a,fillTransitionClasses as t,progressAriaText as n,progressFraction as o,progressSlots as i,progressText as m,trackClasses as u}from"../../internal/progress.js";import{cx as c,metaTextClasses as f,stackGapClasses as d}from"../../internal/styles.js";export const PlProgressLinear=/* @__PURE__ */s.forwardRef(function PlProgressLinear({size:s="md",color:p="primary",value:x=null,min:g=0,max:b=100,label:h,showValue:w=!1,format:j,className:v,style:N,...y},P){const k=o(x,g,b),L=null===k,V=void 0!==j;return l(r.Root,{ref:P,value:x??null,min:g,max:b,format:j,getAriaValueText:n(k,V),className:c("flex w-full flex-col",d[s],v),style:{...i(p),...N},...y,children:[h||w?l("div",{className:c("flex items-baseline gap-2",h?"justify-between":"justify-end",f[s]),children:[h?e(r.Label,{className:"min-w-0 truncate text-(--plass-fg)",children:h}):null,w?e(r.Value,{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:e=>m(k,e,V)}):null]}):null,e(r.Track,{className:c("relative w-full overflow-hidden rounded-full",u,a[s]),children:e(r.Indicator,{className:c("rounded-full [background-image:var(--p-fill)]",L?"plass-progress-sweep":`absolute top-0 ${t}`)})})]})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as r from"react";import{useDefaults as s}from"../../internal/defaults.js";import{Progress as a}from"@base-ui/react/progress";import{barThicknessClasses as t,fillTransitionClasses as o,progressAriaText as n,progressFraction as i,progressSlots as m,progressText as u,trackClasses as c}from"../../internal/progress.js";import{cx as f,metaTextClasses as d,stackGapClasses as p}from"../../internal/styles.js";export const PlProgressLinear=/* @__PURE__ */r.forwardRef(function PlProgressLinear({size:r,color:x,value:g=null,min:b=0,max:h=100,label:j,showValue:w=!1,format:v,className:N,style:y,...P},k){const L=s(),V=r??L.size??"md",z=x??L.color??"primary",R=i(g,b,h),T=null===R,A=void 0!==v;return l(a.Root,{ref:k,value:g??null,min:b,max:h,format:v,getAriaValueText:n(R,A),className:f("flex w-full flex-col",p[V],N),style:{...m(z),...y},...P,children:[j||w?l("div",{className:f("flex items-baseline gap-2",j?"justify-between":"justify-end",d[V]),children:[j?e(a.Label,{className:"min-w-0 truncate text-(--plass-fg)",children:j}):null,w?e(a.Value,{className:"shrink-0 tabular-nums text-(--plass-muted-fg)",children:e=>u(R,e,A)}):null]}):null,e(a.Track,{className:f("relative w-full overflow-hidden rounded-full",c,t[V]),children:e(a.Indicator,{className:f("rounded-full [background-image:var(--p-fill)]",T?"plass-progress-sweep":`absolute top-0 ${o}`)})})]})});

package/dist/components/radio-group/PlRadioGroup.d.ts

@@ -1,8 +1,10 @@
 import * as React from 'react';
 import { Radio as BaseUIRadio } from '@base-ui/react/radio';
 import { RadioGroup as BaseUIRadioGroup } from '@base-ui/react/radio-group';
-import type { PlassColor, PlassOrientation, PlassSize } from '../../types.js';
+import type { PlassColor, PlassFieldClassNames, PlassOrientation, PlassSize } from '../../types.js';
 export interface PlRadioGroupProps extends Omit<React.ComponentPropsWithoutRef<typeof BaseUIRadioGroup>, 'className' | 'style' | 'render'> {
+    /** Classes on the parts a `className` does not reach. */
+    classNames?: PlassFieldClassNames;
     /** @default 'md' */
     size?: PlassSize;
     /** @default 'primary' */

package/dist/components/radio-group/PlRadioGroup.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Radio as l}from"@base-ui/react/radio";import{RadioGroup as o}from"@base-ui/react/radio-group";import{Field as s}from"@base-ui/react/field";import{controlSlots as t,focusRingClasses as i,glassClasses as c,hasContent as d,metaTextClasses as n,tickDotClasses as p,tickRowTextClasses as m,tickSizeClasses as f,transitionClasses as u}from"../../internal/styles.js";const h=/* @__PURE__ */r.createContext({size:"md",color:"primary",readOnly:!1}),b=/* @__PURE__ */["relative inline-flex shrink-0 items-center justify-center rounded-full border","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",u,i].join(" "),g=/* @__PURE__ */[c,"cursor-pointer bg-(--plass-glass) [border-color:var(--plass-border)]","hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)]","data-[checked]:[background-image:var(--p-fill)] data-[checked]:text-(--p-on-solid)","data-[checked]:[border-color:transparent] data-[checked]:hover:brightness-105"].join(" "),x=/* @__PURE__ */[c,"cursor-default bg-(--plass-glass) [border-color:var(--plass-border)]","saturate-[0.55]","data-[checked]:[background-image:var(--p-fill)] data-[checked]:text-(--p-on-solid)","data-[checked]:[border-color:transparent]"].join(" "),v=/* @__PURE__ */[c,"cursor-not-allowed bg-(--plass-glass) [border-color:var(--plass-border)]","opacity-50 saturate-[0.35]","data-[checked]:[background-image:var(--p-fill)] data-[checked]:text-(--p-on-solid)","data-[checked]:[border-color:transparent]"].join(" ");export const PlRadio=/* @__PURE__ */r.forwardRef(function PlRadio({label:o,description:t,disabled:i=!1,className:c,style:d,...u},k){const y=r.useContext(h),N=u.readOnly??y.readOnly;return e(s.Root,{disabled:i,className:["flex flex-col",c??""].filter(Boolean).join(" "),style:d,children:a("div",{className:`flex items-start gap-2 ${m[y.size]}`,children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(l.Root,{ref:k,className:[b,f[y.size],i?v:N?x:g].join(" "),disabled:i,...u,children:e(l.Indicator,{className:`rounded-full bg-current ${p[y.size]}`})})}),o||t?a("span",{className:"flex min-w-0 flex-col gap-0.5",children:[o?e(s.Label,{className:i?"text-(--plass-muted-fg)":"cursor-pointer text-(--plass-fg)",children:o}):null,t?e(s.Description,{className:`${n[y.size]} text-(--plass-muted-fg)`,children:t}):null]}):null]})})});export const PlRadioGroup=/* @__PURE__ */r.forwardRef(function PlRadioGroup({size:l="md",color:i="primary",orientation:c="vertical",label:p,description:m,error:f,invalid:u,disabled:b=!1,readOnly:g=!1,className:x,style:v,children:k,...y},N){const j=d(f),R=u??j,z=R?"danger":i,w=r.useMemo(()=>({size:l,color:z,readOnly:g}),[l,z,g]);return e(h.Provider,{value:w,children:a(s.Root,{disabled:b,invalid:R,className:["flex flex-col gap-1.5",x??""].filter(Boolean).join(" "),style:{...t(z,0,"solid"),...v},children:[p?e(s.Label,{className:[n[l],"font-semibold",b?"text-(--plass-muted-fg)":"text-(--plass-fg)"].join(" "),children:p}):null,m?e(s.Description,{className:`${n[l]} text-(--plass-muted-fg)`,children:m}):null,e(o,{ref:N,disabled:b,readOnly:g,className:["flex","horizontal"===c?"flex-row flex-wrap gap-x-5 gap-y-2":"flex-col gap-2"].join(" "),...y,children:k}),e(s.Error,j?{match:!0,className:`${n[l]} text-(--p-accent)`,children:f}:{className:`${n[l]} text-(--p-accent)`})]})})});
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{useDefaults as l}from"../../internal/defaults.js";import{Radio as o}from"@base-ui/react/radio";import{RadioGroup as s}from"@base-ui/react/radio-group";import{Field as t}from"@base-ui/react/field";import{controlSlots as i,cx as c,focusRingClasses as d,glassClasses as n,hasContent as p,metaTextClasses as m,tickDotClasses as f,tickRowTextClasses as u,tickSizeClasses as h,transitionClasses as b}from"../../internal/styles.js";const g=/* @__PURE__ */a.createContext({size:"md",color:"primary",readOnly:!1}),x=/* @__PURE__ */["relative inline-flex shrink-0 items-center justify-center rounded-full border","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",b,d].join(" "),v=/* @__PURE__ */[n,"cursor-pointer bg-(--plass-glass) [border-color:var(--plass-border)]","hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line)]","data-[checked]:[background-image:var(--p-fill)] data-[checked]:text-(--p-on-solid)","data-[checked]:[border-color:transparent] data-[checked]:hover:brightness-105"].join(" "),N=/* @__PURE__ */[n,"cursor-default bg-(--plass-glass) [border-color:var(--plass-border)]","saturate-[0.55]","data-[checked]:[background-image:var(--p-fill)] data-[checked]:text-(--p-on-solid)","data-[checked]:[border-color:transparent]"].join(" "),k=/* @__PURE__ */[n,"cursor-not-allowed bg-(--plass-glass) [border-color:var(--plass-border)]","opacity-50 saturate-[0.35]","data-[checked]:[background-image:var(--p-fill)] data-[checked]:text-(--p-on-solid)","data-[checked]:[border-color:transparent]"].join(" ");export const PlRadio=/* @__PURE__ */a.forwardRef(function PlRadio({label:l,description:s,disabled:i=!1,className:c,style:d,...n},p){const b=a.useContext(g),y=n.readOnly??b.readOnly;return e(t.Root,{disabled:i,className:["flex flex-col",c??""].filter(Boolean).join(" "),style:d,children:r("div",{className:`flex items-start gap-2 ${u[b.size]}`,children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(o.Root,{ref:p,className:[x,h[b.size],i?k:y?N:v].join(" "),disabled:i,...n,children:e(o.Indicator,{className:`rounded-full bg-current ${f[b.size]}`})})}),l||s?r("span",{className:"flex min-w-0 flex-col gap-0.5",children:[l?e(t.Label,{className:i?"text-(--plass-muted-fg)":"cursor-pointer text-(--plass-fg)",children:l}):null,s?e(t.Description,{className:`${m[b.size]} text-(--plass-muted-fg)`,children:s}):null]}):null]})})});export const PlRadioGroup=/* @__PURE__ */a.forwardRef(function PlRadioGroup({size:o,color:d,orientation:n="vertical",label:f,description:u,error:h,invalid:b,disabled:x=!1,readOnly:v=!1,className:N,classNames:k,style:y,children:j,...R},z){const w=l(),O=o??w.size??"md",P=d??w.color??"primary",G=p(h),$=b??G,B=$?"danger":P,C=a.useMemo(()=>({size:O,color:B,readOnly:v}),[O,B,v]);return e(g.Provider,{value:C,children:r(t.Root,{disabled:x,invalid:$,className:["flex flex-col gap-1.5",N??""].filter(Boolean).join(" "),style:{...i(B,0,"solid"),...y},children:[f?e(t.Label,{className:c(m[O],"font-semibold",x?"text-(--plass-muted-fg)":"text-(--plass-fg)",k?.label),children:f}):null,u?e(t.Description,{className:c(m[O],"text-(--plass-muted-fg)",k?.description),children:u}):null,e(s,{ref:z,disabled:x,readOnly:v,className:c("flex","horizontal"===n?"flex-row flex-wrap gap-x-5 gap-y-2":"flex-col gap-2",k?.control),...R,children:j}),e(t.Error,G?{match:!0,className:c(m[O],"text-(--p-accent)",k?.error),children:h}:{className:c(m[O],"text-(--p-accent)",k?.error)})]})})});

package/dist/components/rating/PlRating.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{StarIcon as n,StarOutlineIcon as r}from"../../internal/icons.js";import{controlSlots as l,cx as i,focusWithinRingClasses as s,gapClasses as o,iconSizeClasses as c,radiusClasses as d,srOnlyClasses as u,transitionClasses as m}from"../../internal/styles.js";const h="flex items-center justify-center";function defaultValueLabel(e,a){return e<=0?"No rating":`${e} out of ${a}`}export const PlRating=/* @__PURE__ */t.forwardRef(function PlRating({value:p,defaultValue:f=0,onValueChange:y,count:b=5,precision:x=1,icon:v,emptyIcon:g,clearable:N=!0,readOnly:M=!1,disabled:w=!1,name:j,required:L=!1,size:P="md",color:k="warning",label:R="Rating",valueLabel:V=defaultValueLabel,className:q,style:C,onPointerLeave:I,...S},A){const $=t.useId(),z=j??$,[E,F]=t.useState(f),O=void 0!==p,B=O?p:E,[D,G]=t.useState(null),H=Math.max(1,Math.floor(b)),J=x>0&&x<=1?x:1,K=Math.round(1/J),Q=Math.max(0,Math.min(H,D??B)),change=e=>{O||F(e),y?.(e)},T=Array.from({length:H},(t,l)=>{const o=Math.max(0,Math.min(1,Q-l));return a("span",{className:i("relative inline-flex shrink-0",c[P],d.xs,M||w?"":s),children:[e("span",{className:i(h,c[P],"text-(--p-empty)"),children:g??e(r,{})}),e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-y-0 start-0 overflow-hidden",style:{width:100*o+"%"},children:e("span",{className:i(h,c[P],"text-(--p-accent)",m),children:v??e(n,{})})}),M?null:Array.from({length:K},(a,t)=>{const n=Number((l+(t+1)*J).toFixed(4));return e("label",{className:i("absolute inset-y-0",w?"cursor-not-allowed":"cursor-pointer"),style:{insetInlineStart:100*t/K+"%",width:100/K+"%"},onPointerEnter:()=>{w||G(n)},children:e("input",{type:"radio",className:u,name:z,value:n,checked:B===n,disabled:w,required:L,"aria-label":V(n,H),onChange:()=>change(n),onClick:()=>{N&&B===n&&change(0)}})},n)})]},l)}),U=i("inline-flex items-center align-middle",o[P],w?"cursor-not-allowed opacity-50 saturate-[0.35]":"",q),W={...l(k,0,"solid"),"--p-empty":"color-mix(in oklab, var(--plass-muted-fg) 40%, transparent)",...C};return e("div",M?{ref:A,role:"img","aria-label":V(Math.max(0,Math.min(H,B)),H),className:U,style:W,onPointerLeave:I,...S,children:T}:{ref:A,role:"radiogroup","aria-label":R,"aria-disabled":w||void 0,"aria-required":L||void 0,className:U,style:W,onPointerLeave:e=>{G(null),I?.(e)},...S,children:T})});
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{useDefaults as n}from"../../internal/defaults.js";import{StarIcon as r,StarOutlineIcon as l}from"../../internal/icons.js";import{controlSlots as i,cx as s,focusWithinRingClasses as o,gapClasses as c,iconSizeClasses as d,radiusClasses as u,srOnlyClasses as m,transitionClasses as h}from"../../internal/styles.js";const f="flex items-center justify-center";function defaultValueLabel(e,a){return e<=0?"No rating":`${e} out of ${a}`}export const PlRating=/* @__PURE__ */t.forwardRef(function PlRating({value:p,defaultValue:y=0,onValueChange:b,count:x=5,precision:v=1,icon:g,emptyIcon:N,clearable:M=!0,readOnly:j=!1,disabled:w=!1,name:L,required:P=!1,size:k,color:R,label:V="Rating",valueLabel:q=defaultValueLabel,className:C,style:I,onPointerLeave:S,...z},A){const $=n(),E=k??$.size??"md",F=R??$.color??"warning",O=t.useId(),B=L??O,[D,G]=t.useState(y),H=void 0!==p,J=H?p:D,[K,Q]=t.useState(null),T=Math.max(1,Math.floor(x)),U=v>0&&v<=1?v:1,W=Math.round(1/U),X=Math.max(0,Math.min(T,K??J)),change=e=>{H||G(e),b?.(e)},Y=Array.from({length:T},(t,n)=>{const i=Math.max(0,Math.min(1,X-n));return a("span",{className:s("relative inline-flex shrink-0",d[E],u.xs,j||w?"":o),children:[e("span",{className:s(f,d[E],"text-(--p-empty)"),children:N??e(l,{})}),e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-y-0 start-0 overflow-hidden",style:{width:100*i+"%"},children:e("span",{className:s(f,d[E],"text-(--p-accent)",h),children:g??e(r,{})})}),j?null:Array.from({length:W},(a,t)=>{const r=Number((n+(t+1)*U).toFixed(4));return e("label",{className:s("absolute inset-y-0",w?"cursor-not-allowed":"cursor-pointer"),style:{insetInlineStart:100*t/W+"%",width:100/W+"%"},onPointerEnter:()=>{w||Q(r)},children:e("input",{type:"radio",className:m,name:B,value:r,checked:J===r,disabled:w,required:P,"aria-label":q(r,T),onChange:()=>change(r),onClick:()=>{M&&J===r&&change(0)}})},r)})]},n)}),Z=s("inline-flex items-center align-middle",c[E],w?"cursor-not-allowed opacity-50 saturate-[0.35]":"",C),_={...i(F,0,"solid"),"--p-empty":"color-mix(in oklab, var(--plass-muted-fg) 40%, transparent)",...I};return e("div",j?{ref:A,role:"img","aria-label":q(Math.max(0,Math.min(T,J)),T),className:Z,style:_,onPointerLeave:S,...z,children:Y}:{ref:A,role:"radiogroup","aria-label":V,"aria-disabled":w||void 0,"aria-required":P||void 0,className:Z,style:_,onPointerLeave:e=>{Q(null),S?.(e)},...z,children:Y})});

package/dist/components/scroll-zone/PlScrollZone.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{PlIconButton as r}from"../icon-button/PlIconButton.js";import{spacingValue as o}from"../../internal/grid.js";import{ChevronIcon as s}from"../../internal/icons.js";import{cx as l}from"../../internal/styles.js";const i={xs:"p-1",sm:"p-1.5",md:"p-2",lg:"p-3",xl:"p-4"},a={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-3",xl:"gap-4"};export const PlScrollZone=/* @__PURE__ */n.forwardRef(function PlScrollZone({orientation:c="horizontal",lines:u=1,spacing:d=2,buttons:f="auto",buttonPlacement:p="inline",mode:m="item",step:v=1,speed:b=900,snap:w=!1,drag:g=!0,wheel:h=!0,scrollbar:y=!1,variant:x="glass",size:E="md",color:L="primary",density:k="default",label:M,previousLabel:C="Previous",nextLabel:P="Next",className:D,style:R,children:A,...B},N){const T="horizontal"===c,j=Math.max(1,Math.round(u)),z=Math.max(1,Math.round(v)),S=n.useRef(null),W=n.useRef(null),[Y,_]=n.useState({back:!1,forward:!1}),H=n.useCallback(()=>{const e=S.current;if(!e)return;const t=T?e.clientWidth:e.clientHeight,n=T?e.scrollWidth:e.scrollHeight,r=Math.abs(T?e.scrollLeft:e.scrollTop);_(e=>{const o=r>1,s=n-t-r>1;return e.back===o&&e.forward===s?e:{back:o,forward:s}})},[T]);n.useEffect(()=>{const e=S.current,t=W.current;if(!e)return;if(H(),"undefined"==typeof ResizeObserver)return;const n=new ResizeObserver(H);return n.observe(e),t&&n.observe(t),()=>n.disconnect()},[H]);const F=n.useCallback(()=>{const e=S.current;return e&&T&&"rtl"===getComputedStyle(e).direction?-1:1},[T]),I=n.useCallback((e,t)=>{const n=S.current;if(!n)return;const r=t?function scrollBehavior(){return"undefined"!=typeof window&&window.matchMedia?.("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}():"auto";n.scrollBy(T?{left:e,behavior:r}:{top:e,behavior:r})},[T]);n.useEffect(()=>{const e=S.current;if(!e||!h||!T)return;const onWheel=t=>{if(Math.abs(t.deltaY)<=Math.abs(t.deltaX))return;const n=t.deltaMode===t.DOM_DELTA_LINE?16*t.deltaY:t.deltaMode===t.DOM_DELTA_PAGE?t.deltaY*e.clientWidth:t.deltaY,r=Math.abs(e.scrollLeft);(n>0?e.scrollWidth-e.clientWidth-r>1:r>1)&&(t.preventDefault(),I(n*F(),!1))};return e.addEventListener("wheel",onWheel,{passive:!1}),()=>e.removeEventListener("wheel",onWheel)},[F,T,I,h]);const O=n.useCallback(()=>{const e=S.current,t=W.current;if(!e||!t)return[];const n=T&&"rtl"===getComputedStyle(e).direction,r=T?n?"right":"left":"top",o=n?-1:1,s=e.getBoundingClientRect()[r],l=[];for(const e of Array.from(t.children)){const t=Math.round((e.getBoundingClientRect()[r]-s)*o);l.includes(t)||l.push(t)}return l.sort((e,t)=>e-t)},[T]),X=n.useCallback((e,t=m)=>{const n=S.current;if(!n)return;const r=F(),o=T?n.clientWidth:n.clientHeight;if("page"===t)return void I(o*(e?1:-1)*r,!0);const s=O(),l=s.filter(e=>e>1),i=s.filter(e=>e<-1),a=e?l[z-1]:i[i.length-z];I(void 0!==a?a*r:o*(e?1:-1)*r,!0)},[F,T,O,z,m,I]),$=n.useRef(null);n.useEffect(()=>()=>$.current?.(),[]);const q=n.useCallback((e,t)=>{if($.current)return;const n=F(),r=performance.now();let o=r,s=0;const tick=t=>{const r=t-o;o=t,I(b*r/1e3*(e?1:-1)*n,!1),s=requestAnimationFrame(tick)};s=requestAnimationFrame(tick);const release=()=>{cancelAnimationFrame(s),$.current=null,window.removeEventListener(t,release),window.removeEventListener("pointercancel",release),window.removeEventListener("blur",release),performance.now()-r<140&&X(e,"item")};$.current=release,window.addEventListener(t,release),window.addEventListener("pointercancel",release),window.addEventListener("blur",release)},[X,F,I,b]),Z=n.useRef(null);function pressHandlers(e){return"hold"!==m?{onClick:()=>X(e)}:{onPointerDown:t=>{0===t.button&&q(e,"pointerup")},onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),q(e,"keyup"))}}}n.useEffect(()=>()=>Z.current?.(),[]);const G="none"!==f&&("always"===f||Y.back||Y.forward),K="inline"===p;function scrollButton(t){const n=t?Y.forward:Y.back;if("auto"===f&&!n&&!K)return e("span",{});const o="auto"===f&&!n,i=e(r,{variant:x,size:E,color:L,density:k,elevation:1,label:t?P:C,disabled:!n,className:"pointer-events-auto",icon:e("span",{className:l("flex items-center",T?t?"-rotate-90 rtl:rotate-90":"rotate-90 rtl:-rotate-90":t?"":"rotate-180"),children:e(s,{})}),...pressHandlers(t)});return K?e("span",{className:l("flex shrink-0 items-center justify-center",o?"invisible":""),inert:o,children:i}):i}return t("div",{ref:N,className:l("relative flex min-w-0",K&&T?"flex-row items-stretch":"flex-col",K?a[E]:"",D),style:{"--p-ring":`var(--plass-${L}-ring)`,...R},...B,children:[G&&K?scrollButton(!1):null,e("div",{ref:S,tabIndex:0,role:M?"group":void 0,"aria-label":M,className:l("min-h-0 min-w-0 grow",T?"overflow-x-auto overflow-y-hidden":"overflow-y-auto overflow-x-hidden",w?T?"snap-x snap-mandatory":"snap-y snap-mandatory":"",y?"":"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden",g&&(Y.back||Y.forward)?"cursor-grab data-[dragging]:cursor-grabbing":"","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:[outline-offset:-2px]"),onScroll:H,onPointerDown:function beginDrag(e){if(!g||"touch"===e.pointerType||0!==e.button)return;Z.current?.();const t=e.currentTarget,n=e.clientX,r=e.clientY,o=t.scrollLeft,s=t.scrollTop;let l=!1;const i=document.body.style.getPropertyValue("-webkit-user-select"),move=e=>{const i=e.clientX-n,a=e.clientY-r;if(!l){if(Math.abs(T?i:a)<4)return;l=!0,t.setPointerCapture(e.pointerId),t.dataset.dragging="true",document.body.style.setProperty("-webkit-user-select","none")}T?t.scrollLeft=o-i:t.scrollTop=s-a},release=()=>{Z.current=null,t.removeEventListener("pointermove",move),t.removeEventListener("pointerup",end),t.removeEventListener("pointercancel",release),delete t.dataset.dragging,i?document.body.style.setProperty("-webkit-user-select",i):document.body.style.removeProperty("-webkit-user-select")},end=()=>{const e=l;if(release(),!e)return;const swallow=e=>{e.stopPropagation(),e.preventDefault()};t.addEventListener("click",swallow,{capture:!0,once:!0}),window.setTimeout(()=>t.removeEventListener("click",swallow,!0),0)};Z.current=release,t.addEventListener("pointermove",move),t.addEventListener("pointerup",end),t.addEventListener("pointercancel",release)},children:e("div",{ref:W,className:l(w?"[&>*]:snap-start":""),style:{display:"grid",gap:o(d),gridAutoFlow:T?"column":"row",...T?{width:"max-content",gridTemplateRows:`repeat(${j}, auto)`,gridAutoColumns:"max-content"}:{gridTemplateColumns:`repeat(${j}, minmax(0, 1fr))`,gridAutoRows:"max-content"}},children:A})}),G&&K?scrollButton(!0):null,G&&!K?t("div",{className:l("pointer-events-none absolute inset-0 flex justify-between",T?"items-center":"flex-col items-center",i[E]),children:[scrollButton(!1),scrollButton(!0)]}):null]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{useDefaults as r}from"../../internal/defaults.js";import{PlIconButton as o}from"../icon-button/PlIconButton.js";import{spacingValue as s}from"../../internal/grid.js";import{ChevronIcon as l}from"../../internal/icons.js";import{cx as i}from"../../internal/styles.js";const a={xs:"p-1",sm:"p-1.5",md:"p-2",lg:"p-3",xl:"p-4"},c={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-3",xl:"gap-4"};export const PlScrollZone=/* @__PURE__ */n.forwardRef(function PlScrollZone({orientation:u="horizontal",lines:d=1,spacing:f=2,buttons:p="auto",buttonPlacement:m="inline",mode:v="item",step:b=1,speed:w=900,snap:g=!1,drag:h=!0,wheel:y=!0,scrollbar:x=!1,variant:E="glass",size:L,color:k,density:M,label:C,previousLabel:P="Previous",nextLabel:D="Next",className:R,style:j,children:A,...B},N){const T=r(),z=L??T.size??"md",S=k??T.color??"primary",W=M??T.density??"default",Y="horizontal"===u,_=Math.max(1,Math.round(d)),H=Math.max(1,Math.round(b)),F=n.useRef(null),I=n.useRef(null),[O,X]=n.useState({back:!1,forward:!1}),$=n.useCallback(()=>{const e=F.current;if(!e)return;const t=Y?e.clientWidth:e.clientHeight,n=Y?e.scrollWidth:e.scrollHeight,r=Math.abs(Y?e.scrollLeft:e.scrollTop);X(e=>{const o=r>1,s=n-t-r>1;return e.back===o&&e.forward===s?e:{back:o,forward:s}})},[Y]);n.useEffect(()=>{const e=F.current,t=I.current;if(!e)return;if($(),"undefined"==typeof ResizeObserver)return;const n=new ResizeObserver($);return n.observe(e),t&&n.observe(t),()=>n.disconnect()},[$]);const q=n.useCallback(()=>{const e=F.current;return e&&Y&&"rtl"===getComputedStyle(e).direction?-1:1},[Y]),Z=n.useCallback((e,t)=>{const n=F.current;if(!n)return;const r=t?function scrollBehavior(){return"undefined"!=typeof window&&window.matchMedia?.("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}():"auto";n.scrollBy(Y?{left:e,behavior:r}:{top:e,behavior:r})},[Y]);n.useEffect(()=>{const e=F.current;if(!e||!y||!Y)return;const onWheel=t=>{if(Math.abs(t.deltaY)<=Math.abs(t.deltaX))return;const n=t.deltaMode===t.DOM_DELTA_LINE?16*t.deltaY:t.deltaMode===t.DOM_DELTA_PAGE?t.deltaY*e.clientWidth:t.deltaY,r=Math.abs(e.scrollLeft);(n>0?e.scrollWidth-e.clientWidth-r>1:r>1)&&(t.preventDefault(),Z(n*q(),!1))};return e.addEventListener("wheel",onWheel,{passive:!1}),()=>e.removeEventListener("wheel",onWheel)},[q,Y,Z,y]);const G=n.useCallback(()=>{const e=F.current,t=I.current;if(!e||!t)return[];const n=Y&&"rtl"===getComputedStyle(e).direction,r=Y?n?"right":"left":"top",o=n?-1:1,s=e.getBoundingClientRect()[r],l=[];for(const e of Array.from(t.children)){const t=Math.round((e.getBoundingClientRect()[r]-s)*o);l.includes(t)||l.push(t)}return l.sort((e,t)=>e-t)},[Y]),K=n.useCallback((e,t=v)=>{const n=F.current;if(!n)return;const r=q(),o=Y?n.clientWidth:n.clientHeight;if("page"===t)return void Z(o*(e?1:-1)*r,!0);const s=G(),l=s.filter(e=>e>1),i=s.filter(e=>e<-1),a=e?l[H-1]:i[i.length-H];Z(void 0!==a?a*r:o*(e?1:-1)*r,!0)},[q,Y,G,H,v,Z]),V=n.useRef(null);n.useEffect(()=>()=>V.current?.(),[]);const J=n.useCallback((e,t)=>{if(V.current)return;const n=q(),r=performance.now();let o=r,s=0;const tick=t=>{const r=t-o;o=t,Z(w*r/1e3*(e?1:-1)*n,!1),s=requestAnimationFrame(tick)};s=requestAnimationFrame(tick);const release=()=>{cancelAnimationFrame(s),V.current=null,window.removeEventListener(t,release),window.removeEventListener("pointercancel",release),window.removeEventListener("blur",release),performance.now()-r<140&&K(e,"item")};V.current=release,window.addEventListener(t,release),window.addEventListener("pointercancel",release),window.addEventListener("blur",release)},[K,q,Z,w]),Q=n.useRef(null);function pressHandlers(e){return"hold"!==v?{onClick:()=>K(e)}:{onPointerDown:t=>{0===t.button&&J(e,"pointerup")},onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),J(e,"keyup"))}}}n.useEffect(()=>()=>Q.current?.(),[]);const U="none"!==p&&("always"===p||O.back||O.forward),ee="inline"===m;function scrollButton(t){const n=t?O.forward:O.back;if("auto"===p&&!n&&!ee)return e("span",{});const r="auto"===p&&!n,s=e(o,{variant:E,size:z,color:S,density:W,elevation:1,label:t?D:P,disabled:!n,className:"pointer-events-auto",icon:e("span",{className:i("flex items-center",Y?t?"-rotate-90 rtl:rotate-90":"rotate-90 rtl:-rotate-90":t?"":"rotate-180"),children:e(l,{})}),...pressHandlers(t)});return ee?e("span",{className:i("flex shrink-0 items-center justify-center",r?"invisible":""),inert:r,children:s}):s}return t("div",{ref:N,className:i("relative flex min-w-0",ee&&Y?"flex-row items-stretch":"flex-col",ee?c[z]:"",R),style:{"--p-ring":`var(--plass-${S}-ring)`,...j},...B,children:[U&&ee?scrollButton(!1):null,e("div",{ref:F,tabIndex:0,role:C?"group":void 0,"aria-label":C,className:i("min-h-0 min-w-0 grow",Y?"overflow-x-auto overflow-y-hidden":"overflow-y-auto overflow-x-hidden",g?Y?"snap-x snap-mandatory":"snap-y snap-mandatory":"",x?"":"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden",h&&(O.back||O.forward)?"cursor-grab data-[dragging]:cursor-grabbing":"","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:[outline-offset:-2px]"),onScroll:$,onPointerDown:function beginDrag(e){if(!h||"touch"===e.pointerType||0!==e.button)return;Q.current?.();const t=e.currentTarget,n=e.clientX,r=e.clientY,o=t.scrollLeft,s=t.scrollTop;let l=!1;const i=document.body.style.getPropertyValue("-webkit-user-select"),move=e=>{const i=e.clientX-n,a=e.clientY-r;if(!l){if(Math.abs(Y?i:a)<4)return;l=!0,t.setPointerCapture(e.pointerId),t.dataset.dragging="true",document.body.style.setProperty("-webkit-user-select","none")}Y?t.scrollLeft=o-i:t.scrollTop=s-a},release=()=>{Q.current=null,t.removeEventListener("pointermove",move),t.removeEventListener("pointerup",end),t.removeEventListener("pointercancel",release),delete t.dataset.dragging,i?document.body.style.setProperty("-webkit-user-select",i):document.body.style.removeProperty("-webkit-user-select")},end=()=>{const e=l;if(release(),!e)return;const swallow=e=>{e.stopPropagation(),e.preventDefault()};t.addEventListener("click",swallow,{capture:!0,once:!0}),window.setTimeout(()=>t.removeEventListener("click",swallow,!0),0)};Q.current=release,t.addEventListener("pointermove",move),t.addEventListener("pointerup",end),t.addEventListener("pointercancel",release)},children:e("div",{ref:I,className:i(g?"[&>*]:snap-start":""),style:{display:"grid",gap:s(f),gridAutoFlow:Y?"column":"row",...Y?{width:"max-content",gridTemplateRows:`repeat(${_}, auto)`,gridAutoColumns:"max-content"}:{gridTemplateColumns:`repeat(${_}, minmax(0, 1fr))`,gridAutoRows:"max-content"}},children:A})}),U&&ee?scrollButton(!0):null,U&&!ee?t("div",{className:i("pointer-events-none absolute inset-0 flex justify-between",Y?"items-center":"flex-col items-center",a[z]),children:[scrollButton(!1),scrollButton(!0)]}):null]})});

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

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

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PlassElevation, PlassStyleProps } from '../../types.js';
+import type { PlassElevation, PlassFieldClassNames, PlassHotKeys, PlassStyleProps } from '../../types.js';
 /**
  * What a select's value may be.
  *
@@ -19,6 +19,17 @@ export interface PlSelectOption {
     disabled?: boolean;
 }
 export interface PlSelectProps extends PlassStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'defaultValue' | 'children'> {
+    /** Classes on the parts a `className` does not reach. */
+    classNames?: PlassFieldClassNames;
+    /**
+     * Chords this field answers to, in the vocabulary `PlHotKeys` draws.
+     *
+     * `{ 'Mod+Enter': save, Escape: cancel }` — the same string a `PlHotKeys`
+     * beside the field would print, so the cap and the binding cannot drift. A
+     * chord that matches is **consumed**: the handler runs and the key reaches
+     * neither the control's own behaviour nor the form around it.
+     */
+    hotKeys?: PlassHotKeys;
     /**
      * The options, as data. There is no `<PlSelect.Option>` to compose: what a
      * caller has is almost always an array already, and the list has to be

package/dist/components/select/PlSelect.js

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

package/dist/components/sidebar/PlSidebar.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{PlDrawer as n}from"../drawer/PlDrawer.js";import{drawerSide as o,expandedOnlyClasses as s,PlPageLayoutContext as i,PlassSidebarSideContext as a,useCollapsed as l}from"../../internal/page-layout.js";import{cx as d,sheetPaddingXClasses as c,sheetPaddingYClasses as u,sheetRestClasses as p,surfaceSlots as m,toLength as f,transitionClasses as y}from"../../internal/styles.js";const b={xs:"11rem",sm:"13rem",md:"16rem",lg:"18rem",xl:"21rem"},v=p;function toPixels(e,t){if(null==e)return t;if("number"==typeof e)return e;const r=/^\s*(-?[\d.]+)\s*(px|rem|em|%)\s*$/.exec(e);if(!r)return t;const n=Number(r[1]);if(Number.isNaN(n))return t;switch(r[2]){case"px":return n;case"%":return"undefined"==typeof window?t:window.innerWidth*n/100;default:return n*parseFloat(("undefined"==typeof document?"":getComputedStyle(document.documentElement).fontSize)||"16")}}export const PlSidebar=/* @__PURE__ */r.forwardRef(function PlSidebar({side:p,width:g,minWidth:w=160,maxWidth:h=480,resizable:x=!1,onResize:P,onResizeEnd:C,collapseBelow:k,open:z,defaultOpen:L=!1,onOpenChange:R,sticky:E=!0,title:N,variant:S="glass",size:j="md",color:B="primary",density:D="default",elevation:O=0,divider:A=!0,padded:M=!0,label:W="Sidebar",closeLabel:I="Close sidebar",resizeLabel:T="Resize sidebar",className:X,style:$,children:_,...F},K){const V=r.useContext(i),q=r.useContext(a),G=p??q??"start",H=k??(V.present?V.collapseBelow:"none"),J=l(H),[Q,U]=r.useState(L),Y=void 0!==z,Z=Y?z:V.present?V.open[G]:Q,ee=f(g)??b[j],te=r.useRef(null),re=r.useCallback(e=>{te.current=e,"function"==typeof K?K(e):K&&(K.current=e)},[K]),ne=r.useRef(null);r.useEffect(()=>()=>ne.current?.(),[]);const applyWidth=e=>{const t=te.current;if(!t)return e;const r=Math.min(toPixels(h,480),Math.max(toPixels(w,160),Math.round(e)));return t.style.setProperty("--p-sidebar-w",`${r}px`),r};return J?e(n,{side:o(G),mode:"overlay",open:Z,onOpenChange:e=>{Y||(V.present?V.setOpen(G,e):U(e)),R?.(e)},title:N,size:j,color:B,density:D,closeLabel:I,extent:void 0===g?void 0:ee,"aria-label":N?void 0:W,className:X,style:$,children:_}):t("aside",{ref:re,"aria-label":W,className:d("relative flex min-w-0 shrink-0 flex-col","w-(--p-sidebar-w)",v[S],A?d("start"===G?"border-e":"border-s","[border-color:var(--plass-divider)]"):"","content"===V.scroll?"h-full":E?d("self-start","sticky [top:var(--p-layout-header,0px)]","[height:calc(100dvh-var(--p-layout-header,0px)-var(--p-layout-footer,0px))]"):"",s[H],y,X),style:{...m(B,O),"--p-sidebar-w":ee,...$},...F,children:[e("div",{className:d("min-h-0 flex-1 overflow-y-auto overscroll-contain",M?d(c[D][j],u[D][j]):""),children:_}),x?e("div",{role:"separator","aria-orientation":"vertical","aria-label":T,tabIndex:0,className:d("absolute inset-y-0 z-1 w-2 cursor-col-resize","start"===G?"end-0 -me-1":"start-0 -ms-1","bg-transparent hover:bg-(--p-soft) data-[dragging]:bg-(--p-soft)",y,"[outline:none] focus-visible:[outline:2px_solid_var(--p-ring)]","focus-visible:[outline-offset:0px]"),onPointerDown:e=>{const t=te.current;if(!t||0!==e.button)return;const r=e.currentTarget;r.setPointerCapture(e.pointerId),r.dataset.dragging="true";const n=document.body.style.getPropertyValue("-webkit-user-select");document.body.style.setProperty("-webkit-user-select","none");const o=e.clientX,s=t.getBoundingClientRect().width,i="rtl"===getComputedStyle(t).direction,a="start"===G===i?-1:1;let l=s;const move=e=>{l=applyWidth(s+(e.clientX-o)*a),P?.(l)},release=()=>{ne.current=null,r.removeEventListener("pointermove",move),r.removeEventListener("pointerup",end),r.removeEventListener("pointercancel",end),delete r.dataset.dragging,n?document.body.style.setProperty("-webkit-user-select",n):document.body.style.removeProperty("-webkit-user-select")},end=()=>{release(),C?.(l)};ne.current=release,r.addEventListener("pointermove",move),r.addEventListener("pointerup",end),r.addEventListener("pointercancel",end)},onKeyDown:e=>{if("ArrowLeft"!==e.key&&"ArrowRight"!==e.key)return;e.preventDefault();const t="rtl"===getComputedStyle(e.currentTarget).direction,r="start"===G===t?-1:1;(e=>{const t=te.current;if(!t)return;const r=applyWidth(t.getBoundingClientRect().width+e);P?.(r),C?.(r)})(("ArrowRight"===e.key?16:-16)*r)}}):null]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{useDefaults as n}from"../../internal/defaults.js";import{PlDrawer as o}from"../drawer/PlDrawer.js";import{drawerSide as s,expandedOnlyClasses as i,PlPageLayoutContext as l,PlassSidebarSideContext as a,useCollapsed as d}from"../../internal/page-layout.js";import{cx as c,sheetPaddingXClasses as u,sheetPaddingYClasses as p,sheetRestClasses as m,surfaceSlots as f,toLength as y,transitionClasses as b}from"../../internal/styles.js";const v={xs:"11rem",sm:"13rem",md:"16rem",lg:"18rem",xl:"21rem"},g=m;function toPixels(e,t){if(null==e)return t;if("number"==typeof e)return e;const r=/^\s*(-?[\d.]+)\s*(px|rem|em|%)\s*$/.exec(e);if(!r)return t;const n=Number(r[1]);if(Number.isNaN(n))return t;switch(r[2]){case"px":return n;case"%":return"undefined"==typeof window?t:window.innerWidth*n/100;default:return n*parseFloat(("undefined"==typeof document?"":getComputedStyle(document.documentElement).fontSize)||"16")}}export const PlSidebar=/* @__PURE__ */r.forwardRef(function PlSidebar({side:m,width:w,minWidth:h=160,maxWidth:x=480,resizable:P=!1,onResize:C,onResizeEnd:k,collapseBelow:z,open:L,defaultOpen:R=!1,onOpenChange:E,sticky:N=!0,title:S,variant:j="glass",size:B,color:D,density:O,elevation:A=0,divider:M=!0,padded:W=!0,label:I="Sidebar",closeLabel:T="Close sidebar",resizeLabel:X="Resize sidebar",className:$,style:_,children:F,...K},V){const q=n(),G=B??q.size??"md",H=D??q.color??"primary",J=O??q.density??"default",Q=r.useContext(l),U=r.useContext(a),Y=m??U??"start",Z=z??(Q.present?Q.collapseBelow:"none"),ee=d(Z),[te,re]=r.useState(R),ne=void 0!==L,oe=ne?L:Q.present?Q.open[Y]:te,se=y(w)??v[G],ie=r.useRef(null),le=r.useCallback(e=>{ie.current=e,"function"==typeof V?V(e):V&&(V.current=e)},[V]),ae=r.useRef(null);r.useEffect(()=>()=>ae.current?.(),[]);const applyWidth=e=>{const t=ie.current;if(!t)return e;const r=Math.min(toPixels(x,480),Math.max(toPixels(h,160),Math.round(e)));return t.style.setProperty("--p-sidebar-w",`${r}px`),r};return ee?e(o,{side:s(Y),mode:"overlay",open:oe,onOpenChange:e=>{ne||(Q.present?Q.setOpen(Y,e):re(e)),E?.(e)},title:S,size:G,color:H,density:J,closeLabel:T,extent:void 0===w?void 0:se,"aria-label":S?void 0:I,className:$,style:_,children:F}):t("aside",{ref:le,"aria-label":I,className:c("relative flex min-w-0 shrink-0 flex-col","w-(--p-sidebar-w)",g[j],M?c("start"===Y?"border-e":"border-s","[border-color:var(--plass-divider)]"):"","content"===Q.scroll?"h-full":N?c("self-start","sticky [top:var(--p-layout-header,0px)]","[height:calc(100dvh-var(--p-layout-header,0px)-var(--p-layout-footer,0px))]"):"",i[Z],b,$),style:{...f(H,A),"--p-sidebar-w":se,..._},...K,children:[e("div",{className:c("min-h-0 flex-1 overflow-y-auto overscroll-contain",W?c(u[J][G],p[J][G]):""),children:F}),P?e("div",{role:"separator","aria-orientation":"vertical","aria-label":X,tabIndex:0,className:c("absolute inset-y-0 z-1 w-2 cursor-col-resize","start"===Y?"end-0 -me-1":"start-0 -ms-1","bg-transparent hover:bg-(--p-soft) data-[dragging]:bg-(--p-soft)",b,"[outline:none] focus-visible:[outline:2px_solid_var(--p-ring)]","focus-visible:[outline-offset:0px]"),onPointerDown:e=>{const t=ie.current;if(!t||0!==e.button)return;const r=e.currentTarget;r.setPointerCapture(e.pointerId),r.dataset.dragging="true";const n=document.body.style.getPropertyValue("-webkit-user-select");document.body.style.setProperty("-webkit-user-select","none");const o=e.clientX,s=t.getBoundingClientRect().width,i="rtl"===getComputedStyle(t).direction,l="start"===Y===i?-1:1;let a=s;const move=e=>{a=applyWidth(s+(e.clientX-o)*l),C?.(a)},release=()=>{ae.current=null,r.removeEventListener("pointermove",move),r.removeEventListener("pointerup",end),r.removeEventListener("pointercancel",end),delete r.dataset.dragging,n?document.body.style.setProperty("-webkit-user-select",n):document.body.style.removeProperty("-webkit-user-select")},end=()=>{release(),k?.(a)};ae.current=release,r.addEventListener("pointermove",move),r.addEventListener("pointerup",end),r.addEventListener("pointercancel",end)},onKeyDown:e=>{if("ArrowLeft"!==e.key&&"ArrowRight"!==e.key)return;e.preventDefault();const t="rtl"===getComputedStyle(e.currentTarget).direction,r="start"===Y===t?-1:1;(e=>{const t=ie.current;if(!t)return;const r=applyWidth(t.getBoundingClientRect().width+e);C?.(r),k?.(r)})(("ArrowRight"===e.key?16:-16)*r)}}):null]})});

package/dist/components/skeleton/PlSkeleton.js

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{useRender as l}from"@base-ui/react/use-render";import{controlHeightClasses as s,controlSquareClasses as d,surfaceSlots as n}from"../../internal/styles.js";const o={xs:"h-[0.6875rem]",sm:"h-[0.75rem]",md:"h-[0.8125rem]",lg:"h-[0.9375rem]",xl:"h-[1.0625rem]"},a={xs:"gap-[0.3125rem]",sm:"gap-[0.375rem]",md:"gap-[0.5625rem]",lg:"gap-[0.5625rem]",xl:"gap-[0.6875rem]"},m={xs:"rounded-[0.3125rem]",sm:"rounded-[0.3125rem]",md:"rounded-[0.375rem]",lg:"rounded-[0.4375rem]",xl:"rounded-[0.5rem]"},i={xs:"h-12",sm:"h-16",md:"h-20",lg:"h-28",xl:"h-36"},t={xs:"rounded-(--plass-radius-xs)",sm:"rounded-(--plass-radius-sm)",md:"rounded-(--plass-radius-md)",lg:"rounded-(--plass-radius-lg)",xl:"rounded-(--plass-radius-xl)"},u="relative overflow-hidden bg-(--p-soft-hover)";function length(e){if(void 0!==e)return"number"==typeof e?`${e}px`:e}export const PlSkeleton=/* @__PURE__ */r.forwardRef(function PlSkeleton({shape:r="line",lines:h=1,size:f="md",color:p="secondary",width:c,height:g,animated:x=!0,label:w,render:y,className:$,style:b,...v},j){const k=x?"plass-skeleton":"",N="circle"===r?`shrink-0 rounded-full ${s[f]} ${d[f]}`:"rect"===r?`w-full ${t[f]} ${void 0===g?i[f]:""}`:`w-full ${m[f]} ${o[f]}`,B=w?{role:"status","aria-busy":!0,"aria-label":w}:{"aria-hidden":!0},P="line"===r&&h>1;return l({render:y,ref:j,props:{className:(P?["flex w-full flex-col",a[f],$??""]:[u,k,N,$??""]).filter(Boolean).join(" "),style:{...n(p,0),width:length(c),height:length(g),...b},...B,...P?{children:Array.from({length:h},(r,l)=>e("div",{className:[u,k,m[f],o[f],l===h-1?"w-3/5":"w-full"].filter(Boolean).join(" ")},l))}:null,...v}})});
+"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{useDefaults as l}from"../../internal/defaults.js";import{useRender as s}from"@base-ui/react/use-render";import{controlHeightClasses as o,controlSquareClasses as d,surfaceSlots as n}from"../../internal/styles.js";const a={xs:"h-[0.6875rem]",sm:"h-[0.75rem]",md:"h-[0.8125rem]",lg:"h-[0.9375rem]",xl:"h-[1.0625rem]"},m={xs:"gap-[0.3125rem]",sm:"gap-[0.375rem]",md:"gap-[0.5625rem]",lg:"gap-[0.5625rem]",xl:"gap-[0.6875rem]"},i={xs:"rounded-[0.3125rem]",sm:"rounded-[0.3125rem]",md:"rounded-[0.375rem]",lg:"rounded-[0.4375rem]",xl:"rounded-[0.5rem]"},t={xs:"h-12",sm:"h-16",md:"h-20",lg:"h-28",xl:"h-36"},u={xs:"rounded-(--plass-radius-xs)",sm:"rounded-(--plass-radius-sm)",md:"rounded-(--plass-radius-md)",lg:"rounded-(--plass-radius-lg)",xl:"rounded-(--plass-radius-xl)"},h="relative overflow-hidden bg-(--p-soft-hover)";function length(e){if(void 0!==e)return"number"==typeof e?`${e}px`:e}export const PlSkeleton=/* @__PURE__ */r.forwardRef(function PlSkeleton({shape:r="line",lines:f=1,size:p,color:c,width:g,height:x,animated:w=!0,label:y,render:$,className:b,style:j,...v},k){const N=l(),z=p??N.size??"md",B=c??N.color??"secondary",P=w?"plass-skeleton":"",S="circle"===r?`shrink-0 rounded-full ${o[z]} ${d[z]}`:"rect"===r?`w-full ${u[z]} ${void 0===x?t[z]:""}`:`w-full ${i[z]} ${a[z]}`,A=y?{role:"status","aria-busy":!0,"aria-label":y}:{"aria-hidden":!0},R="line"===r&&f>1;return s({render:$,ref:k,props:{className:(R?["flex w-full flex-col",m[z],b??""]:[h,P,S,b??""]).filter(Boolean).join(" "),style:{...n(B,0),width:length(g),height:length(x),...j},...A,...R?{children:Array.from({length:f},(r,l)=>e("div",{className:[h,P,i[z],a[z],l===f-1?"w-3/5":"w-full"].filter(Boolean).join(" ")},l))}:null,...v}})});

package/dist/components/slider/PlSlider.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as s from"react";import{Slider as a}from"@base-ui/react/slider";import{controlSlots as r,focusRingClasses as o,metaTextClasses as t,transitionClasses as i}from"../../internal/styles.js";const n={xs:"h-1",sm:"h-1.5",md:"h-1.5",lg:"h-2",xl:"h-2.5"},c={xs:"w-1",sm:"w-1.5",md:"w-1.5",lg:"w-2",xl:"w-2.5"},d={xs:"size-3",sm:"size-3.5",md:"size-4.5",lg:"size-5",xl:"size-6"},m={xs:"h-4",sm:"h-4.5",md:"h-5",lg:"h-6",xl:"h-7"},u={xs:"w-4",sm:"w-4.5",md:"w-5",lg:"w-6",xl:"w-7"},f="rounded-full bg-(--plass-track)",h=`rounded-full [background-image:var(--p-fill)] ${i}`,p=/* @__PURE__ */["rounded-full border-2 [background-image:var(--p-fill)]","[border-color:var(--plass-surface)]","[box-shadow:var(--p-elev),var(--p-lift)]","cursor-grab select-none active:cursor-grabbing",i,"hover:[box-shadow:var(--p-elev-hover),var(--p-lift-hover),0_0_0_4px_var(--p-soft)]",o,"data-[dragging]:[box-shadow:var(--p-elev-press),var(--p-lift-press),0_0_0_6px_var(--p-soft-hover)]"].join(" ");export const PlSlider=/* @__PURE__ */s.forwardRef(function PlSlider({size:s="md",color:o="primary",elevation:i=1,orientation:x="horizontal",label:g,description:v,showValue:w=!1,disabled:b=!1,className:y,style:N,...j},$){const _="vertical"===x,z=j.value??j.defaultValue,k=Array.isArray(z)?z.length:1;return l(a.Root,{ref:$,orientation:x,disabled:b,className:["flex",_?"w-fit flex-col items-center gap-2":"w-full flex-col gap-1.5",b?"opacity-50 saturate-[0.35] [&_*]:cursor-not-allowed":"",y??""].filter(Boolean).join(" "),style:{...r(o,i,"solid"),...N},...j,children:[g||w?l("div",{className:`flex w-full items-baseline gap-2 ${t[s]}`,children:[g?e(a.Label,{className:"font-semibold text-(--plass-fg)",children:g}):null,w?e(a.Value,{className:"ms-auto tabular-nums text-(--plass-muted-fg)",children:"function"==typeof w?w:null}):null]}):null,e(a.Control,{className:["flex touch-none items-center justify-center select-none",_?`${u[s]} h-40 flex-col`:`w-full ${m[s]}`].join(" "),children:l(a.Track,{className:[f,_?`${c[s]} h-full`:`${n[s]} w-full`].join(" "),children:[e(a.Indicator,{className:h}),Array.from({length:k},(l,r)=>e(a.Thumb,{index:r,className:`${p} ${d[s]}`},r))]})}),v?e("div",{className:`${t[s]} text-(--plass-muted-fg)`,children:v}):null]})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as s from"react";import{useDefaults as r}from"../../internal/defaults.js";import{Slider as a}from"@base-ui/react/slider";import{controlSlots as o,focusRingClasses as t,metaTextClasses as i,transitionClasses as n}from"../../internal/styles.js";const c={xs:"h-1",sm:"h-1.5",md:"h-1.5",lg:"h-2",xl:"h-2.5"},d={xs:"w-1",sm:"w-1.5",md:"w-1.5",lg:"w-2",xl:"w-2.5"},m={xs:"size-3",sm:"size-3.5",md:"size-4.5",lg:"size-5",xl:"size-6"},f={xs:"h-4",sm:"h-4.5",md:"h-5",lg:"h-6",xl:"h-7"},u={xs:"w-4",sm:"w-4.5",md:"w-5",lg:"w-6",xl:"w-7"},h="rounded-full bg-(--plass-track)",p=`rounded-full [background-image:var(--p-fill)] ${n}`,x=/* @__PURE__ */["rounded-full border-2 [background-image:var(--p-fill)]","[border-color:var(--plass-surface)]","[box-shadow:var(--p-elev),var(--p-lift)]","cursor-grab select-none active:cursor-grabbing",n,"hover:[box-shadow:var(--p-elev-hover),var(--p-lift-hover),0_0_0_4px_var(--p-soft)]",t,"data-[dragging]:[box-shadow:var(--p-elev-press),var(--p-lift-press),0_0_0_6px_var(--p-soft-hover)]"].join(" ");export const PlSlider=/* @__PURE__ */s.forwardRef(function PlSlider({size:s,color:t,elevation:n=1,orientation:g="horizontal",label:v,description:w,showValue:b=!1,disabled:j=!1,className:y,style:N,...$},_){const z=r(),k=s??z.size??"md",A=t??z.color??"primary",S="vertical"===g,V=$.value??$.defaultValue,P=Array.isArray(V)?V.length:1;return l(a.Root,{ref:_,orientation:g,disabled:j,className:["flex",S?"w-fit flex-col items-center gap-2":"w-full flex-col gap-1.5",j?"opacity-50 saturate-[0.35] [&_*]:cursor-not-allowed":"",y??""].filter(Boolean).join(" "),style:{...o(A,n,"solid"),...N},...$,children:[v||b?l("div",{className:`flex w-full items-baseline gap-2 ${i[k]}`,children:[v?e(a.Label,{className:"font-semibold text-(--plass-fg)",children:v}):null,b?e(a.Value,{className:"ms-auto tabular-nums text-(--plass-muted-fg)",children:"function"==typeof b?b:null}):null]}):null,e(a.Control,{className:["flex touch-none items-center justify-center select-none",S?`${u[k]} h-40 flex-col`:`w-full ${f[k]}`].join(" "),children:l(a.Track,{className:[h,S?`${d[k]} h-full`:`${c[k]} w-full`].join(" "),children:[e(a.Indicator,{className:p}),Array.from({length:P},(l,s)=>e(a.Thumb,{index:s,className:`${x} ${m[k]}`},s))]})}),w?e("div",{className:`${i[k]} text-(--plass-muted-fg)`,children:w}):null]})});

package/dist/components/spoiler/PlSpoiler.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import*as a from"react";import{PlButton as r}from"../button/PlButton.js";import{cx as l,hasContent as s,metaTextClasses as t,radiusClasses as n,sheetPaddingXClasses as o,sheetPaddingYClasses as d,sheetRestClasses as c,surfaceSlots as m,transitionClasses as u}from"../../internal/styles.js";export const PlSpoiler=/* @__PURE__ */a.forwardRef(function PlSpoiler({revealed:p,defaultRevealed:f=!1,onRevealedChange:v,label:h="Reveal",hideLabel:x="Hide",description:g="This may contain spoilers",action:y,reversible:b=!1,maxHeight:j,blur:N=10,padded:w=!0,variant:k="glass",size:z="md",color:R="primary",density:_="default",elevation:C=0,className:H,style:P,children:S,...$},B){const I=a.useId(),[L,T]=a.useState(f),q=p??L,change=e=>{void 0===p&&T(e),v?.(e)},A=o[_][z],D=d[_][z],E=!1===g?null:g;return i("div",{ref:B,className:l("isolate grid overflow-hidden",n[z],c[k],u,H),style:{...m(R,C),...P},...$,children:[e("div",{id:I,className:l("min-w-0 [grid-area:1/1]",w?`${A} ${D}`:"","[transition:filter_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",q?"":"select-none"),style:{filter:q?void 0:`blur(${N}px)`,maxHeight:q?void 0:j,overflow:q?void 0:"hidden"},inert:!q,children:S}),q?null:i("div",{className:l("z-10 flex flex-col items-center justify-center gap-2 text-center [grid-area:1/1]",A,D,"[background-color:color-mix(in_oklab,var(--plass-surface)_55%,transparent)]"),children:[s(E)?e("p",{className:l("m-0 text-(--plass-muted-fg)",t[z]),children:E}):null,y??e(r,{size:z,color:R,density:_,onClick:()=>change(!0),"aria-expanded":!1,"aria-controls":I,children:h})]}),q&&b?e("div",{className:l("flex justify-end",A,D,"pt-0"),children:e(r,{variant:"ghost",size:z,color:R,density:_,onClick:()=>change(!1),"aria-expanded":!0,"aria-controls":I,children:x})}):null]})});
+"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{PlButton as l}from"../button/PlButton.js";import{cx as s,hasContent as t,metaTextClasses as n,radiusClasses as o,sheetPaddingXClasses as d,sheetPaddingYClasses as c,sheetRestClasses as m,surfaceSlots as u,transitionClasses as f}from"../../internal/styles.js";export const PlSpoiler=/* @__PURE__ */r.forwardRef(function PlSpoiler({revealed:p,defaultRevealed:v=!1,onRevealedChange:h,label:x="Reveal",hideLabel:y="Hide",description:g="This may contain spoilers",action:b,reversible:j=!1,maxHeight:N,blur:w=10,padded:z=!0,variant:k="glass",size:R,color:_,density:C,elevation:H=0,className:P,style:S,children:$,...B},I){const L=a(),T=R??L.size??"md",q=_??L.color??"primary",A=C??L.density??"default",D=r.useId(),[E,F]=r.useState(v),G=p??E,change=e=>{void 0===p&&F(e),h?.(e)},J=d[A][T],K=c[A][T],M=!1===g?null:g;return i("div",{ref:I,className:s("isolate grid overflow-hidden",o[T],m[k],f,P),style:{...u(q,H),...S},...B,children:[e("div",{id:D,className:s("min-w-0 [grid-area:1/1]",z?`${J} ${K}`:"","[transition:filter_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",G?"":"select-none"),style:{filter:G?void 0:`blur(${w}px)`,maxHeight:G?void 0:N,overflow:G?void 0:"hidden"},inert:!G,children:$}),G?null:i("div",{className:s("z-10 flex flex-col items-center justify-center gap-2 text-center [grid-area:1/1]",J,K,"[background-color:color-mix(in_oklab,var(--plass-surface)_55%,transparent)]"),children:[t(M)?e("p",{className:s("m-0 text-(--plass-muted-fg)",n[T]),children:M}):null,b??e(l,{size:T,color:q,density:A,onClick:()=>change(!0),"aria-expanded":!1,"aria-controls":D,children:x})]}),G&&j?e("div",{className:s("flex justify-end",J,K,"pt-0"),children:e(l,{variant:"ghost",size:T,color:q,density:A,onClick:()=>change(!1),"aria-expanded":!0,"aria-controls":D,children:y})}):null]})});