neba 1.13.0 → 1.16.0

package/dist/components/pie-chart/PieChart.d.ts

@@ -26,6 +26,35 @@ export interface PieChartProps extends ChartBaseProps {
      * @default 0
      */
     startAngle?: number;
+    /**
+     * How much of the middle is cut out, as a fraction of the radius, from `0`
+     * for a filled disc to `0.92` for a hairline ring.
+     *
+     * `shape` already sets it — `0` for a `pie`, `0.62` for a `donut` and a
+     * `semi` — and this is the dial behind that, for the ring that has to be
+     * thinner or thicker than the house one. A `pie` given a hole is a donut, so
+     * reach for `shape` first and for this only when the default ring is the
+     * wrong weight: a thin one reads as a progress track and a thick one as a
+     * pie with a hole punched in it.
+     *
+     * `center` needs a hole to sit in, so setting one is also how a `pie` gets a
+     * readout in the middle.
+     * @default 0 for `pie`, 0.62 for `donut` and `semi`
+     */
+    hole?: number;
+    /**
+     * The surface showing between two touching slices, in pixels.
+     *
+     * A constant on screen and not in the data, which is why it is a length: the
+     * gap is what separates two slices of the same hue family, and an angle that
+     * looked right on a 300px chart is a wedge out of a 60px one. `0` closes it,
+     * and the slices then meet at a hairline the eye has to find on its own.
+     *
+     * It is never taken off a slice too narrow to spare it, so a one-degree
+     * sliver stays a sliver rather than inverting.
+     * @default 2
+     */
+    gap?: number;
     /**
      * What goes in the hole. A `donut` or a `semi` with nothing in the middle is
      * a pie with a bite out of it; the total, or the one figure the chart is
@@ -50,9 +79,11 @@ export interface PieChartProps extends ChartBaseProps {
  * a poor thing to compare — two slices within a few percent of each other are
  * indistinguishable, and a reader cannot rank six of them — so the pie is right
  * for exactly one question: *is one of these most of it?* Anything finer than
- * that, and anything past six slices, is a [BarChart](./bar-chart).
+ * that, and anything past six slices, is a [BarChart](./bar-chart); a pie of
+ * two slices is a [Statistic](./statistic).
  *
- * A slice's colour follows the slice and not its size, so a chart that is
- * refiltered or resorted keeps every category the colour it had.
+ * A slice's colour follows its place in `data`, so a filter that drops one
+ * moves every slice after it onto the next colour; a point's own `color`
+ * holds it.
  */
 export declare function PieChart(rawProps: PieChartProps): React.JSX.Element;

package/dist/components/pie-chart/PieChart.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{ChartDataTable as l,ChartLegendBar as n,ChartStatus as i,ChartSurface as r,ChartTooltipPanel as s,markTransitionClasses as o,useMeasuredWidth as d,useVisibility as u}from"../../internal/chart-frame.js";import{arcPath as m,categoryAt as c,chartFontSizes as h,compactNumber as v,formatCategory as f,markGap as p,plotHeights as x,seriesColor as b,toValue as g}from"../../internal/chart.js";import{numberFormatter as y}from"../../internal/format.js";import{cx as M,metaTextClasses as j}from"../../internal/styles.js";import{chartMessages as N,emptyMessages as w,useMessages as z}from"../../internal/i18n.js";import{useStyleDefaults as I}from"../../internal/defaults.js";const P={pie:0,donut:.62,semi:.62};export function PieChart(k){const{data:A,categories:$,shape:L="pie",startAngle:S=0,center:B,valueLabels:E="none",height:R,format:C,locale:D,label:O,legend:_,tooltip:K,empty:V,size:W="md",variant:q="text",padded:F=!1,className:G,...H}=I(k,["size","variant","locale"]),J=a.useRef(null),Q=d(J),T=z(w,D),U=z(N,D),X=a.useId(),Y=a.useCallback(e=>C?y(D,C).format(e):v(e,D),[C,D]),Z=a.useMemo(()=>A.map(g),[A]),ee=a.useMemo(()=>Z.map((e,t)=>({name:f(c(t,$,[Z]),D),data:[A[t]],color:e.color})),[Z,$,A,D]),te=u(ee),[ae,le]=a.useState(null),ne=ee.map((e,t)=>b(e,t)),ie=Z.reduce((e,t,a)=>te.visible[a]&&null!==t.value?e+Math.abs(t.value):e,0),re="semi"===L,se="number"==typeof R?R:x[W],oe=h[W],de=!1===_?{interactive:!1}:!0===_||void 0===_?{}:_,ue=!1!==_&&ee.length>1,me=de.side??"bottom",ce=!1===K?{mode:"none"}:!0===K||void 0===K?{}:K,he="none"===ce.mode,ve=Q/2,fe=Math.max(0,Math.min(Q/2,re?se:se/2)-2),pe=re?Math.min(se,se/2+fe/2):se/2,xe=fe*P[L],be=ie<=0||fe<=0,ge=fe>0?Math.min(4,p/fe*(180/Math.PI)):0,ye=re?180:360,Me=[];let je=re?-90:S;Z.forEach((e,t)=>{if(!te.visible[t]||null===e.value||0===e.value)return;const a=Math.abs(e.value)/ie,l=a*ye;Me.push({index:t,start:je,end:je+l,value:e.value,share:a}),je+=l});const Ne=null===ae?[]:[{seriesIndex:ae,name:ee[ae]?.name,color:Z[ae]?.color??ne[ae],value:Z[ae]?.value??null,formatted:`${Y(Z[ae]?.value??0)} · ${Math.round(10*(Math.abs(Z[ae]?.value??0)/ie*100+Number.EPSILON))/10}%`,label:Z[ae]?.label}];return t(r,{...H,size:W,variant:q,padded:F,className:G,legendSide:me,legend:ue?e(n,{series:ee,colors:ne,options:de,visibility:te,size:W,values:de.showValue?Z.map(e=>null===e.value?void 0:Y(e.value)):void 0}):null,table:be?null:e(l,{id:X,caption:O,categories:ee.map(e=>e.name??""),series:[{name:O,data:A}],values:[Z],format:Y,locale:D}),children:[t("div",{ref:J,role:"img",tabIndex:be?void 0:0,"aria-label":O??U.label,"aria-describedby":be?void 0:X,onPointerLeave:()=>le(null),onBlur:()=>le(null),onKeyDown:e=>{if("ArrowRight"!==e.key&&"ArrowLeft"!==e.key)return;const t=Me.map(e=>e.index);if(0===t.length)return;const a=null===ae?-1:t.indexOf(ae),l="ArrowRight"===e.key?a+1:a-1;le(t[(l+t.length)%t.length]),e.preventDefault()},className:M("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:se},children:[be?e("div",{className:M("flex h-full items-center justify-center text-(--neba-muted-fg)",j[W]),children:V??T.title}):Q>0?t("svg",{width:Q,height:se,viewBox:`0 0 ${Q} ${se}`,"aria-hidden":"true",className:"block",children:[Me.map(t=>{const a=null!==te.hovered&&te.hovered!==t.index||null!==ae&&ae!==t.index,l=t.end-t.start>2*ge?ge/2:0;return e("path",{d:m(ve,pe,fe,xe,t.start+l,t.end-l),fill:Z[t.index].color??ne[t.index],opacity:a?.32:1,onPointerEnter:he?void 0:()=>le(t.index),className:o},t.index)}),"all"===E?Me.map(t=>{const a=((t.start+t.end)/2-90)*(Math.PI/180),l=xe>0?(xe+fe)/2:.68*fe,n=`${Math.round(100*t.share)}%`;return(t.end-t.start)*(Math.PI/180)*l<2*oe||fe-xe<1.6*oe?null:e("text",{x:ve+l*Math.cos(a),y:pe+l*Math.sin(a),textAnchor:"middle",dominantBaseline:"central",fontSize:oe,fontWeight:600,fill:"var(--neba-surface)",className:"tabular-nums",children:n},t.index)}):null]}):null,B&&xe>0?e("div",{className:"pointer-events-none absolute flex flex-col items-center justify-center text-center",style:{left:ve-xe,top:pe-xe,width:2*xe,height:re?xe:2*xe},children:B}):null,null===ae||he?null:ce.render?e("div",{className:"pointer-events-none absolute top-0 left-1/2 z-10",children:ce.render({index:ae,category:ee[ae]?.name??ae,items:Ne})}):e(s,{heading:ee[ae]?.name,items:Ne,x:ve,y:8,flip:!1,size:W})]}),he?null:e(i,{heading:null===ae?void 0:ee[ae]?.name,items:Ne})]})}
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{ChartDataTable as n,ChartExport as a,ChartLegendBar as i,ChartStatus as r,ChartSummary as o,ChartSurface as s,ChartTooltipPanel as u,markTransitionClasses as d,summarise as m,useMeasuredWidth as c,useReleaseOutside as h,useVisibility as f,chartHeight as v,useMeasuredHeight as p}from"../../internal/chart-frame.js";import{arcPath as x,categoryAt as g,chartFontSizes as b,compactNumber as y,formatCategory as M,inkOn as N,markGap as j,seriesColor as w,toValue as k,warnPaletteOverflow as E}from"../../internal/chart.js";import{numberFormatter as I}from"../../internal/format.js";import{cx as z,metaTextClasses as P}from"../../internal/styles.js";import{chartMessages as A,emptyMessages as $,useMessages as L}from"../../internal/i18n.js";import{useStyleDefaults as S}from"../../internal/defaults.js";const B={pie:0,donut:.62,semi:.62};export function PieChart(C){const{data:R,categories:D,shape:O="pie",startAngle:_=0,hole:F,gap:H=j,center:K,valueLabels:T="none",height:V,format:W,locale:q,label:G,legend:J,tooltip:Q,empty:U,exportable:X=!1,exportFileName:Y="chart.csv",onExport:Z,size:ee="md",variant:le="text",padded:te=!1,className:ne,...ae}=S(C,["size","variant","locale"]),ie=t.useRef(null),re=c(ie),oe=L($,q),se=L(A,q),ue=t.useId(),de=t.useCallback(e=>W?I(q,W).format(e):y(e,q),[W,q]),me=t.useMemo(()=>R.map(k),[R]),ce=t.useMemo(()=>me.map((e,l)=>({name:M(g(l,D,[me]),q),data:[R[l]],color:e.color})),[me,D,R,q]),he=f(ce);t.useEffect(()=>{E(ce.length)},[ce.length]);const[fe,ve]=t.useState(null);h(ie,null!==fe,()=>ve(null));const pe=t.useId(),xe=ce.map((e,l)=>w(e,l)),ge=me.reduce((e,l,t)=>he.visible[t]&&null!==l.value?e+Math.max(0,l.value):e,0),be="semi"===O,ye=p(ie,"string"==typeof V),Me=v(V,ee,ye),Ne=b[ee],je=!1===J?{interactive:!1}:!0===J||void 0===J?{}:J,we=!1!==J&&ce.length>1,ke=je.side??"bottom",Ee=!1===Q?{mode:"none"}:!0===Q||void 0===Q?{}:Q,Ie="none"===Ee.mode,ze=re/2,Pe=Math.max(0,Math.min(re/2,be?Me:Me/2)-2),Ae=be?Math.min(Me,Me/2+Pe/2):Me/2,$e=Pe*Math.min(.92,Math.max(0,F??B[O])),Le=ge<=0||Pe<=0,Se=Pe>0?Math.min(15,Math.max(0,H)/Pe*(180/Math.PI)):0,Be=be?180:360,Ce=[];let Re=be?-90:_;me.forEach((e,l)=>{if(!he.visible[l]||null===e.value||e.value<=0)return;const t=e.value/ge,n=t*Be;Ce.push({index:l,start:Re,end:Re+n,value:e.value,share:t}),Re+=n});const De=null===fe?[]:[{seriesIndex:fe,name:ce[fe]?.name,color:me[fe]?.color??xe[fe],value:me[fe]?.value??null,formatted:`${de(me[fe]?.value??0)} · ${Math.round(10*(Math.max(0,me[fe]?.value??0)/ge*100+Number.EPSILON))/10}%`,label:me[fe]?.label}];return l(s,{...ae,size:ee,variant:le,padded:te,className:ne,legendSide:ke,legend:we?e(i,{series:ce,colors:xe,options:je,visibility:he,size:ee,values:je.showValue?me.map(e=>null===e.value?void 0:de(e.value)):void 0}):null,table:Le?null:e(n,{id:ue,caption:G,categories:ce.map(e=>e.name??""),series:[{name:G,data:R}],values:[me],format:de,locale:q}),children:[X&&!Le?e(a,{rows:()=>[["",G??se.label],...ce.map((e,l)=>[e.name??"",me[l]?.value??null])],fileName:Y,onExport:Z,label:se.exportCsv}):null,l("div",{ref:ie,role:"img",tabIndex:Le?void 0:0,"aria-label":G??se.label,"aria-describedby":Le?void 0:pe,onPointerLeave:e=>{"touch"!==e.pointerType&&ve(null)},onBlur:()=>ve(null),onKeyDown:e=>{const l=Ce.map(e=>e.index);if("Escape"===e.key){if(null===fe)return;ve(null)}else{if(Ie||0===l.length)return;if("Home"===e.key)ve(l[0]);else if("End"===e.key)ve(l[l.length-1]);else{if("ArrowRight"!==e.key&&"ArrowLeft"!==e.key)return;{const t=null===fe?-1:l.indexOf(fe),n="ArrowRight"===e.key?t+1:t-1;ve(l[(n+l.length)%l.length])}}}e.preventDefault()},className:z("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:"string"==typeof V?V:Me},children:[Le?e("div",{className:z("flex h-full items-center justify-center text-(--neba-muted-fg)",P[ee]),children:U??oe.title}):re>0?l("svg",{width:re,height:Me,viewBox:`0 0 ${re} ${Me}`,"aria-hidden":"true",className:"block",children:[Ce.map(l=>{const t=null!==he.hovered&&he.hovered!==l.index||null!==fe&&fe!==l.index,n=l.end-l.start>2*Se?Se/2:0;return e("path",{d:x(ze,Ae,Pe,$e,l.start+n,l.end-n),fill:me[l.index].color??xe[l.index],opacity:t?.32:1,onPointerEnter:Ie?void 0:()=>ve(l.index),className:d},l.index)}),"all"===T?Ce.map(l=>{const t=((l.start+l.end)/2-90)*(Math.PI/180),n=$e>0?($e+Pe)/2:.68*Pe,a=`${Math.round(100*l.share)}%`;return(l.end-l.start)*(Math.PI/180)*n<2*Ne||Pe-$e<1.6*Ne?null:e("text",{x:ze+n*Math.cos(t),y:Ae+n*Math.sin(t),textAnchor:"middle",dominantBaseline:"central",fontSize:Ne,fontWeight:600,fill:N(me[l.index].color,l.index),className:"tabular-nums",children:a},l.index)}):null]}):null,K&&$e>0?e("div",{className:"pointer-events-none absolute flex flex-col items-center justify-center text-center",style:{left:ze-$e,top:Ae-$e,width:2*$e,height:be?$e:2*$e},children:K}):null,null===fe||Ie?null:Ee.render?e("div",{className:"pointer-events-none absolute top-0 left-1/2 z-10",children:Ee.render({index:fe,category:ce[fe]?.name??fe,items:De})}):e(u,{heading:ce[fe]?.name,items:De,x:ze,y:8,flip:!1,size:ee})]}),Le?null:e(o,{id:pe,template:se.summary,locale:q,...m(me.filter((e,l)=>he.visible[l]).map(e=>[e]),de)}),Ie?null:e(r,{heading:null===fe?void 0:ce[fe]?.name,items:De})]})}

package/dist/components/pill/Pill.d.ts

@@ -51,6 +51,14 @@ export interface PillProps extends NebaStyleProps, Omit<React.ComponentPropsWith
     position?: NebaPosition;
     /** Which edge it is held against when `position` is not `static`. @default 'top' */
     side?: 'top' | 'bottom';
+    /**
+     * Keeps it clear of a phone's home indicator and notch, on a page laid out
+     * under them with `viewport-fit=cover`, by adding the screen's
+     * `env(safe-area-inset-*)` on the edge it is held against. Only a `fixed` or
+     * `sticky` one is ever against that edge, so a `static` one is left alone.
+     * @default true
+     */
+    safeArea?: boolean;
     /** Passing it makes the row a real button. */
     onClick?: React.MouseEventHandler<HTMLButtonElement>;
     /**

package/dist/components/pill/Pill.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{observeResize as o}from"../../internal/observe.js";import{controlSlots as i,controlTextClasses as r,cx as s,focusRingClasses as a,gapClasses as c,hasContent as d,iconClasses as m,iconSizeClasses as f,metaTextClasses as x,paddingXClasses as p,pressTransitionClasses as u,sheetBodyClasses as h,surfaceClasses as v,transitionClasses as b}from"../../internal/styles.js";import{useStyleDefaults as g}from"../../internal/defaults.js";const w={solid:[v,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[v,"border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:`${v} text-(--n-accent) bg-(--n-soft)`},j={solid:"hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)",outline:"hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)] active:bg-(--n-panel-press)",text:"hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)"},y={xs:"min-h-5.5",sm:"min-h-6.5",md:"min-h-8",lg:"min-h-10",xl:"min-h-12"},N={xs:"rounded-[0.6875rem]",sm:"rounded-[0.8125rem]",md:"rounded-[1rem]",lg:"rounded-[1.25rem]",xl:"rounded-[1.5rem]"},k={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"}},z={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 Pill=/*@__PURE__*/l.forwardRef(function(v,$){const{variant:_="solid",size:C="md",color:H="secondary",density:I="default",elevation:R=2,startIcon:B,endIcon:E,title:F,description:P,details:S,expanded:q=!1,position:A="static",side:D="top",className:G,style:J,children:K,onClick:L,...M}=g(v,["size","density","variant"]),O=l.useRef(null),[Q,T]=l.useState(0);l.useEffect(()=>{const e=O.current;if(e)return T(e.scrollHeight),o(e,()=>T(e.scrollHeight))},[S]);const U=Boolean(L),V=p[I][C],W=n(t,{children:[d(B)?e("span",{className:`flex shrink-0 items-center justify-center overflow-hidden rounded-full [&_img]:size-full [&_img]:object-cover ${f[C]}`,children:B}):null,d(F)||d(P)||d(K)?n("span",{className:["flex min-w-0 flex-1 flex-col items-center justify-center text-center",k[I][C]].join(" "),children:[d(F)?e("span",{className:"max-w-full truncate",children:F}):null,d(P)?e("span",{className:`max-w-full truncate font-normal ${x[C]} [color:color-mix(in_oklab,currentColor_72%,transparent)]`,children:P}):null,K]}):null]});return n("div",{ref:$,className:s("inline-flex max-w-full flex-col overflow-hidden align-middle",N[C],"font-medium whitespace-nowrap select-none",r[C],w[_],b,u,m,U?`neba-glow ${j[_]}`:"",z[A][D],G??""),style:{...i(H,R,_),...J},...M,children:[n("div",{className:["flex shrink-0 items-center py-1",y[C],c[C],U?"ps-0":V,d(E)?"pe-1":U?"pe-0":""].join(" "),children:[U?e("button",{type:"button",className:["flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch","rounded-[inherit]",c[C],V,a].join(" "),onClick:L,children:W}):W,d(E)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:E}):null]}),d(S)?e("div",{className:["overflow-hidden","[transition:height_var(--neba-duration)_var(--neba-ease)]","motion-reduce:[transition-duration:0ms]"].join(" "),style:{height:q?Q:0},inert:!q,children:e("div",{ref:O,className:`whitespace-normal ${V} pb-2 ${h[C]}`,children:S})}):null]})});
+"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as o from"react";import{trackPointer as i}from"../../internal/glow.js";import{observeResize as l}from"../../internal/observe.js";import{controlSlots as r,controlTextClasses as s,cx as a,focusRingClasses as c,gapClasses as m,hasContent as d,iconClasses as f,iconSizeClasses as x,metaTextClasses as p,paddingXClasses as u,pressTransitionClasses as h,sheetBodyClasses as v,surfaceClasses as b,transitionClasses as g}from"../../internal/styles.js";import{inertValue as w}from"../../internal/inert.js";import{useStyleDefaults as y}from"../../internal/defaults.js";const j={solid:[b,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[b,"border text-(--n-on-tint) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:`${b} text-(--n-on-tint) bg-(--n-soft)`},_={solid:"hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)",outline:"hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)] active:bg-(--n-panel-press)",text:"hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)"},k={xs:"min-h-5.5",sm:"min-h-6.5",md:"min-h-8",lg:"min-h-10",xl:"min-h-12"},z={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"}},$={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"}},P={static:{top:"",bottom:""},sticky:{top:"sticky top-[calc(0.75rem_+_env(safe-area-inset-top))] z-20",bottom:"sticky bottom-[calc(0.75rem_+_env(safe-area-inset-bottom))] z-20"},fixed:{top:"fixed inset-x-0 top-[calc(0.75rem_+_env(safe-area-inset-top))] z-30 mx-auto w-fit",bottom:"fixed inset-x-0 bottom-[calc(0.75rem_+_env(safe-area-inset-bottom))] z-30 mx-auto w-fit"}};export const Pill=/*@__PURE__*/o.forwardRef(function Pill(b,I){const{variant:C="solid",size:H="md",color:M="secondary",density:R="default",elevation:A=2,startIcon:B,endIcon:E,title:F,description:L,details:S,expanded:q=!1,position:D="static",side:G="top",safeArea:J=!0,className:K,style:O,children:Q,onClick:T,...U}=y(b,["size","density","variant"]),V=o.useRef(null),W=o.useId(),[X,Y]=o.useState(null),Z=d(S);o.useLayoutEffect(()=>{const e=V.current;if(e)return Y(e.scrollHeight),l(e,()=>Y(e.scrollHeight))},[Z]);const ee=Boolean(T),te=u[R][H],ne=t(n,{children:[d(B)?e("span",{className:`flex shrink-0 items-center justify-center overflow-hidden rounded-full [&_img]:size-full [&_img]:object-cover ${x[H]}`,children:B}):null,d(F)||d(L)||d(Q)?t("span",{className:["flex min-w-0 flex-1 flex-col items-center justify-center text-center",N[R][H]].join(" "),children:[d(F)?e("span",{className:"max-w-full truncate",children:F}):null,d(L)?e("span",{className:`max-w-full truncate font-normal ${p[H]}`,children:L}):null,Q]}):null]});return t("div",{ref:I,className:a("inline-flex max-w-full flex-col overflow-hidden align-middle",z[H],"font-medium whitespace-nowrap select-none",s[H],j[C],g,h,f,ee?`neba-glow ${_[C]}`:"",(J?P:$)[D][G],K??""),style:{...r(M,A,C),...O},...U,onPointerMove:i(U.onPointerMove,ee),children:[t("div",{className:["flex shrink-0 items-center py-1",k[H],m[H],ee?"ps-0":te,d(E)?"pe-1":ee?"pe-0":""].join(" "),children:[ee?e("button",{type:"button",className:["flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch","rounded-[inherit]",m[H],te,c].join(" "),"aria-expanded":Z?q:void 0,"aria-controls":Z?W:void 0,onClick:T,children:ne}):ne,d(E)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:E}):null]}),Z?e("div",{id:W,className:["overflow-hidden","[transition:height_var(--neba-duration)_var(--neba-ease)]","motion-reduce:[transition-duration:0ms]"].join(" "),style:{height:q?X??"auto":0},inert:w(!q),children:e("div",{ref:V,className:`whitespace-normal ${te} pb-2 ${v[H]}`,children:S})}):null]})});

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

@@ -14,7 +14,12 @@ export interface PopconfirmProps {
     description?: React.ReactNode;
     /** Called when the reader confirms. May return a promise; see `onConfirm`. */
     onConfirm?: () => void | Promise<unknown>;
-    /** Called when the reader cancels. Dismissing does not call it. */
+    /**
+     * Called when the reader cancels. Dismissing does not call it.
+     *
+     * Walking away from a question is not answering it _no_, so a handler that
+     * undoes something here does not run every time somebody presses Escape.
+     */
     onCancel?: () => void;
     /** Overrides the confirming button's label. Defaults to the locale's word. */
     confirmLabel?: React.ReactNode;
@@ -42,7 +47,7 @@ export interface PopconfirmProps {
     open?: boolean;
     defaultOpen?: boolean;
     onOpenChange?: (open: boolean) => void;
-    /** BCP 47 tag deciding the two default labels. Defaults to the browser's. */
+    /** BCP 47 tag deciding the two default labels. Falls back to the provider's, then to English. */
     locale?: string;
     /** How wide the bubble is. */
     width?: number | string;
@@ -63,8 +68,10 @@ export interface PopconfirmProps {
  * So the rule is about *reach* rather than about danger: one row, a Popconfirm;
  * the page, a Confirm.
  *
- * It closes itself once `onConfirm` settles, so an async handler keeps the
+ * It closes itself once `onConfirm` resolves, so an async handler keeps the
  * bubble up — and its confirming button busy — until the work is actually done.
+ * A handler that rejects leaves the bubble open with its button ready again, and
+ * the error is not caught: it belongs to the page's own error reporting.
  * A question that vanished before its answer landed is a question the reader
  * has no way to know was heard.
  */

package/dist/components/popconfirm/Popconfirm.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as i from"react";import{Button as o}from"../button/Button.js";import{Popover as t,PopoverClose as l}from"../popover/Popover.js";import{severityIcon as r}from"../../internal/icons.js";import{confirmMessages as a,useMessages as s}from"../../internal/i18n.js";import{cx as c,gapClasses as m}from"../../internal/styles.js";import{useStyleDefaults as d}from"../../internal/defaults.js";export function Popconfirm(p){const{trigger:f,title:u,description:h,onConfirm:x,onCancel:g,confirmLabel:j,cancelLabel:N,color:v="danger",size:C="sm",icon:y=!0,side:b="top",align:w="center",open:z,defaultOpen:k,onOpenChange:O,locale:L,width:P=280,className:S,classNames:B}=d(p,["size","locale"]),q=s(a,L),[A,D]=i.useState(k??!1),E=z??A,[F,G]=i.useState(!1),H=e=>{void 0===z&&D(e),O?.(e)},I=!0===y?r(v):y;return e(t,{trigger:f,open:E,onOpenChange:H,side:b,align:w,size:C,color:v,width:P,showClose:!1,className:S,children:n("div",{className:c("flex",m[C]),children:[I?e("span",{"aria-hidden":"true",className:c("mt-px shrink-0 text-(--n-accent)",B?.icon),children:I}):null,n("div",{className:c("flex min-w-0 flex-1 flex-col",m[C]),children:[u?e("p",{className:c("font-medium text-(--neba-fg)",B?.title),children:u}):null,h?e("p",{className:c("text-(--neba-muted-fg)",B?.description),children:h}):null,n("div",{className:c("flex justify-end gap-1.5 pt-0.5",B?.actions),children:[e(l,{render:e(o,{size:C,variant:"text",color:"secondary",onClick:()=>g?.(),children:N??q.cancel})}),e(o,{size:C,color:v,loading:F,onClick:async()=>{try{G(!0),await(x?.()),H(!1)}finally{G(!1)}},children:j??q.confirm})]})]})]})})}
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as i from"react";import{Popover as r}from"@base-ui/react/popover";import{Button as o}from"../button/Button.js";import{Popover as t,PopoverClose as a}from"../popover/Popover.js";import{severityIcon as l}from"../../internal/icons.js";import{confirmMessages as s,useMessages as c}from"../../internal/i18n.js";import{cx as m,gapClasses as d}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";export function Popconfirm(f){const{trigger:u,title:h,description:x,onConfirm:g,onCancel:j,confirmLabel:v,cancelLabel:N,color:C="danger",size:b="sm",icon:y=!0,side:w="top",align:z="center",open:k,defaultOpen:O,onOpenChange:P,locale:L,width:S=280,className:B,classNames:D}=p(f,["size","locale"]),T=c(s,L),[q,A]=i.useState(O??!1),E=k??q,[F,G]=i.useState(!1),H=e=>{void 0===k&&A(e),P?.(e)},I=!0===y?l(C):y;return e(t,{trigger:u,open:E,onOpenChange:H,side:w,align:z,size:b,color:C,width:S,showClose:!1,className:B,children:n("div",{className:m("flex",d[b]),children:[I?e("span",{"aria-hidden":"true",className:m("mt-px shrink-0 text-(--n-accent)",D?.icon),children:I}):null,n("div",{className:m("flex min-w-0 flex-1 flex-col",d[b]),children:[h?e(r.Title,{render:e("p",{}),className:m("font-medium text-(--neba-fg)",D?.title),children:h}):null,x?e(r.Description,{render:e("p",{}),className:m("text-(--neba-muted-fg)",D?.description),children:x}):null,n("div",{className:m("flex justify-end gap-1.5 pt-0.5",D?.actions),children:[e(a,{render:e(o,{size:b,variant:"text",color:"secondary",onClick:()=>j?.(),children:N??T.cancel})}),e(o,{size:b,color:C,loading:F,onClick:async()=>{try{G(!0),await(g?.()),H(!1)}finally{G(!1)}},children:v??T.confirm})]})]})]})})}

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

@@ -67,7 +67,14 @@ export interface PopoverProps extends Pick<NebaStyleProps, 'size' | 'color' | 'd
      * @default true
      */
     dismissible?: boolean;
-    /** Shows the × in the corner. @default false */
+    /**
+     * Shows the × in the corner.
+     *
+     * A `modal` popover without one still gets a close button, visually hidden
+     * until it takes the keyboard focus: a focus trap needs a way out a screen
+     * reader can reach, and VoiceOver on iOS has no Escape key to press.
+     * @default false
+     */
     showClose?: boolean;
     /**
      * Which language the × is named in — a BCP 47 tag such as `ko`, `pt-BR` or

package/dist/components/popover/Popover.js

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

package/dist/components/portal/Portal.js

@@ -1 +1 @@
-"use client";import{jsx as t}from"react/jsx-runtime";import*as e from"react";import{createPortal as r}from"react-dom";import{cx as o}from"../../internal/styles.js";export const Portal=/*@__PURE__*/e.forwardRef(function({children:n,container:s,disabled:a=!1,className:c,...i},l){const[f,m]=e.useState(null);e.useEffect(()=>{if(a)return;const t="function"==typeof s?s():s;m(t??document.body)},[s,a]);const u=t("div",{ref:l,className:o("neba-portal",c),...i,children:n});return a?u:f?r(u,f):null});
+"use client";import{jsx as t}from"react/jsx-runtime";import*as r from"react";import{createPortal as e}from"react-dom";import{cx as o}from"../../internal/styles.js";export const Portal=/*@__PURE__*/r.forwardRef(function Portal({children:n,container:s,disabled:a=!1,className:c,...i},l){const[f,m]=r.useState(null);r.useEffect(()=>{if(a)return;const t="function"==typeof s?s():s;m(t??document.body)},[s,a]);const u=t("div",{ref:l,className:o("neba-portal",c),...i,children:n});return a?u:f?e(u,f):null});

package/dist/components/progress-box/ProgressBox.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{plateGapClasses as t,plateRadiusClasses as r,plateSizeClasses as n,progressAriaText as i,progressFraction as o,progressSlots as m,progressText as f}from"../../internal/progress.js";import{cx as u,metaTextClasses as c,stackGapClasses as d}from"../../internal/styles.js";import{useStyleDefaults as h}from"../../internal/defaults.js";export const ProgressBox=/*@__PURE__*/l.forwardRef(function(l,x){const{size:b="md",color:p="primary",count:g=4,value:v=null,min:y=0,max:j=100,label:w,showValue:N=!1,format:M,className:V,style:k,...z}=h(l,["size"]),A=o(v,y,j),R=null===A,T=void 0!==M,$=Math.max(1,Math.floor(g));return a(s.Root,{ref:x,value:v??null,min:y,max:j,format:M,getAriaValueText:i(A,T),className:u("inline-flex flex-col",d[b],V??""),style:{...m(p),...k},...z,children:[w||N?a("div",{className:["flex items-baseline gap-2",w?"justify-between":"justify-end",c[b]].join(" "),children:[w?e(s.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:w}):null,N?e(s.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>f(A,e,T)}):null]}):null,e(s.Track,{className:`flex ${t[b]}`,children:Array.from({length:$},(a,l)=>e("span",{className:u("relative overflow-hidden bg-(--n-soft)","[box-shadow:var(--neba-plate-glass)]",n[b],r[b],R?"neba-plate-wave":""),style:R?{"--n-i":l}:void 0,children:R?null:e("span",{className:"absolute inset-y-0 start-0 bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease)]",style:{width:`${Math.min(100,Math.max(0,100*(A*$-l)))}%`}})},l))})]})});
+"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{plateGapClasses as r,plateRadiusClasses as t,plateSizeClasses as n,progressAriaText as i,progressFraction as o,progressSlots as m,progressText as u}from"../../internal/progress.js";import{cx as f,metaTextClasses as c,stackGapClasses as d}from"../../internal/styles.js";import{useStyleDefaults as x}from"../../internal/defaults.js";export const ProgressBox=/*@__PURE__*/l.forwardRef(function ProgressBox(l,b){const{size:h="md",color:p="primary",count:g=4,value:v=null,min:y=0,max:j=100,label:w,showValue:N=!1,format:M,className:V,style:k,...z}=x(l,["size"]),A=o(v,y,j),B=null===A,P=void 0!==M,R=Number.isFinite(g)?Math.max(1,Math.floor(g)):1;return a(s.Root,{ref:b,value:B?null:v,min:y,max:j,format:M,getAriaValueText:i(A,P),className:f("inline-flex flex-col",d[h],V??""),style:{...m(p),...k},...z,children:[w||N?a("div",{className:["flex items-baseline gap-2",w?"justify-between":"justify-end",c[h]].join(" "),children:[w?e(s.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:w}):null,N?e(s.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>u(A,e,P)}):null]}):null,e(s.Track,{className:`flex ${r[h]}`,children:Array.from({length:R},(a,l)=>e("span",{className:f("relative overflow-hidden bg-(--n-soft)","[box-shadow:var(--neba-plate-glass)]",n[h],t[h],B?"neba-plate-wave":""),style:B?{"--n-i":l}:void 0,children:B?null:e("span",{className:"absolute inset-y-0 start-0 bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease)]",style:{width:`${Math.min(100,Math.max(0,100*(A*R-l)))}%`}})},l))})]})});

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

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

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

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

package/dist/components/prompt-input/PromptInput.d.ts

@@ -0,0 +1,104 @@
+import * as React from 'react';
+import { type PromptMessages } from '../../internal/i18n.js';
+import type { NebaElevation, NebaSlots, NebaStyleProps } from '../../types.js';
+/**
+ * The parts a PromptInput draws behind its root.
+ *
+ * `shell` is the framed box — the thing wearing the border, the fill and the
+ * focus ring — and `control` the `<textarea>` inside it. `toolbar` is the row
+ * under the text and `send` the one button the component draws itself.
+ */
+export type PromptInputSlot = 'shell' | 'control' | 'toolbar' | 'send';
+/** Which key sends, spelled the way [Shortcut] draws it. */
+export type PromptSubmitKey = 'Enter' | 'Mod+Enter';
+type NativeControlProps = Omit<React.ComponentPropsWithoutRef<'textarea'>, 'color' | 'size' | 'value' | 'defaultValue' | 'onChange' | 'onSubmit' | 'children'>;
+export interface PromptInputProps extends Pick<NebaStyleProps, 'size' | 'variant' | 'color' | 'density'>, NativeControlProps {
+    /** What is in the field. Pass it with `onValueChange` to drive it yourself. */
+    value?: string;
+    /** What an uncontrolled field starts with. @default '' */
+    defaultValue?: string;
+    /** Called on every keystroke, with the whole value. */
+    onValueChange?: (value: string) => void;
+    /**
+     * Called with the value when the field is sent — by the key, by the button,
+     * or by a form submission. An empty field never sends.
+     *
+     * It does **not** clear the field. What happens to what was typed is the
+     * application's: a message that failed to send should still be there.
+     */
+    onSubmit?: (value: string) => void;
+    /**
+     * Whether an answer is being written. The send button becomes a stop button,
+     * and stays pressable — which is the whole reason it is one button and not
+     * two: the thing a reader reaches for to stop an answer is exactly where
+     * they last pressed to start it.
+     * @default false
+     */
+    submitting?: boolean;
+    /** Called when the stop button is pressed. */
+    onStop?: () => void;
+    /**
+     * Which key sends. `Enter` sends and `Shift+Enter` breaks the line;
+     * `Mod+Enter` is the other way round, for a field people write paragraphs in.
+     *
+     * Neither fires while an input method is composing — a Korean or Japanese
+     * reader pressing Enter to accept a candidate is finishing a word, not
+     * sending a message.
+     * @default 'Enter'
+     */
+    submitKey?: PromptSubmitKey;
+    /**
+     * Passing it makes the shell a drop target. It is called with the files, and
+     * what happens to them is the application's.
+     *
+     * A folder dropped onto a page arrives looking like a zero-byte file, and
+     * those are filtered out before this is called — the same check a
+     * [FilePicker](../inputs/file-picker) makes.
+     */
+    onFiles?: (files: File[]) => void;
+    /** The field's accessible name, drawn for a screen reader and nobody else. */
+    label?: React.ReactNode;
+    /** How many rows the field is at its shortest. @default 1 */
+    minRows?: number;
+    /**
+     * And at its tallest, after which it scrolls. A prompt field that grows
+     * without a ceiling pushes the conversation it belongs to off the screen.
+     * @default 8
+     */
+    maxRows?: number;
+    /** Controls at the start of the toolbar under the text — attach, a model Select. */
+    start?: React.ReactNode;
+    /** Controls at its end, before the send button — a token count, a mode toggle. */
+    end?: React.ReactNode;
+    /**
+     * Drop shadow depth. `0` (the default) is flat.
+     * @default 0
+     */
+    elevation?: NebaElevation;
+    /** Which language the two button labels are written in, as a BCP 47 tag. */
+    locale?: string;
+    /** Those words, written out. Overrides the `locale`'s. */
+    labels?: Partial<PromptMessages>;
+    /** Class names for the parts behind the root. */
+    classNames?: NebaSlots<PromptInputSlot>;
+    /** A strip above the field — the attachments that have been added, a reply-to line. */
+    children?: React.ReactNode;
+}
+/**
+ * Everything a prompt goes out through: the text, the attach and model
+ * controls, and one button that sends and then stops.
+ *
+ * A [TextField](../inputs/text-field) with `multiline` plus a
+ * [Toolbar](../surfaces/toolbar) gets the shell. What it does not get is the
+ * three things that are rewritten at every call site: a field that grows with
+ * what is typed and then stops growing, a send button that becomes a stop
+ * button without moving, and Enter meaning *send* while Shift+Enter means a new
+ * line.
+ *
+ * The composition guard is the part most easily missed and the one that matters
+ * most outside English: pressing Enter to accept a candidate from a Korean or
+ * Japanese input method is finishing a word, and a field that read it as a
+ * send would make the language unusable.
+ */
+export declare const PromptInput: React.ForwardRefExoticComponent<PromptInputProps & React.RefAttributes<HTMLTextAreaElement>>;
+export {};

package/dist/components/prompt-input/PromptInput.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{IconButton as r}from"../icon-button/IconButton.js";import{useDropZone as l}from"../../internal/drop.js";import{fieldLight as o,fieldSpotlightSlot as a,glowClasses as i}from"../../internal/glow.js";import{matchesShortcut as s}from"../../internal/keys.js";import{promptMessages as c,useMessages as m}from"../../internal/i18n.js";import{controlTextLeadingClasses as d,cx as u,disabledClasses as f,fieldFocusTransitionClasses as p,fieldReadOnlyClasses as h,fieldRestClasses as g,fieldRingClasses as x,hasContent as v,iconClasses as b,metaTextClasses as w,paddingXClasses as y,radiusClasses as $,srOnlyClasses as j,surfaceSlots as N,transitionClasses as k}from"../../internal/styles.js";import{useStyleDefaults as I}from"../../internal/defaults.js";import{useFieldsetDisabled as S}from"../../internal/fieldset.js";function SendIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"M8 13V3.5m0 0L3.75 7.75M8 3.5l4.25 4.25",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}function StopIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e("rect",{x:"4",y:"4",width:"8",height:"8",rx:"1.5"})})}const C={xs:`${$.sm} ${d.xs}`,sm:`${$.md} ${d.sm}`,md:`${$.lg} ${d.md}`,lg:`${$.xl} ${d.lg}`,xl:`${$.xl} ${d.xl}`},D={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"};export const PromptInput=/*@__PURE__*/n.forwardRef(function PromptInput(d,$){const{variant:z="outline",size:L="md",color:M="primary",density:R="default",elevation:B=0,value:E,defaultValue:K="",onValueChange:P,onSubmit:V,submitting:F=!1,onStop:O,submitKey:H="Enter",onFiles:T,label:W,minRows:q=1,maxRows:A=8,start:G,end:J,locale:Q,labels:U,classNames:X,disabled:Y,readOnly:Z=!1,onKeyDown:_,className:ee,style:te,children:ne,...re}=I(d,["size","density","variant","locale"]),le=S(Y),oe=!le&&!Z,ae={...m(c,Q),...U},[ie,se]=n.useState(K),ce=void 0!==E,me=ce?E:ie,{over:de,handlers:ue}=l(T),fe=n.useId(),pe=n.useRef(null),he=n.useCallback(e=>{pe.current=e,"function"==typeof $?$(e):$&&($.current=e)},[$]);n.useLayoutEffect(()=>{const e=pe.current;e&&(e.style.height="auto",e.style.height=`${e.scrollHeight}px`)},[me]);const ge=()=>{!me.trim()||le||Z||F||V?.(me)},xe=me.trim().length>0&&!le&&!Z;return t("form",{onSubmit:e=>{e.preventDefault(),ge()},className:u("flex w-full flex-col",ee??""),style:{...N(M,B),...oe?a:void 0,...te},children:[v(W)?e("label",{htmlFor:fe,className:j,children:W}):null,t("div",{"data-dropping":de||void 0,...ue,...o(oe),onPointerDown:e=>{e.target!==e.currentTarget||le||(e.preventDefault(),pe.current?.focus())},className:u("relative flex w-full flex-col py-2","[-webkit-tap-highlight-color:transparent]",C[L],D[L],y[R][L],k,p,x,b,le?f[z]:Z?h[z]:`${g[z]} ${i}`,de?"[border-color:var(--n-ring)] bg-(--n-soft)":"",X?.shell??""),children:[ne,e("textarea",{ref:he,id:fe,rows:q,value:me,disabled:le,readOnly:Z,onChange:e=>{ce||se(e.target.value),P?.(e.target.value)},className:u("neba-input block w-full resize-none bg-transparent [font:inherit] text-inherit","[outline:none]","min-h-(--n-min-rows) max-h-(--n-max-rows) overflow-y-auto","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",X?.control??""),style:{"--n-min-rows":`calc(${Math.max(q,1)} * 1lh)`,"--n-max-rows":`calc(${Math.max(A,q,1)} * 1lh)`},...re,onKeyDown:e=>{!e.nativeEvent.isComposing&&s(e,H)&&(e.preventDefault(),ge()),_?.(e)}}),t("div",{className:u("flex min-w-0 items-center gap-2",w[L],X?.toolbar??""),children:[v(G)?e("div",{className:"flex min-w-0 items-center gap-1",children:G}):null,t("div",{className:"ms-auto flex shrink-0 items-center gap-2",children:[v(J)?e("div",{className:"flex items-center gap-1",children:J}):null,e(r,{type:F?"button":"submit",size:L,color:M,icon:e(F?StopIcon:SendIcon,{}),label:F?ae.stop:ae.send,disabled:!F&&!xe,onClick:F?O:void 0,className:X?.send})]})]}),de?e("div",{"aria-hidden":"true",className:u("pointer-events-none absolute inset-0 flex items-center justify-center","font-medium text-(--n-accent)",C[L]),children:ae.drop}):null]})]})});

package/dist/components/prompt-input/index.d.ts

@@ -0,0 +1,2 @@
+export { PromptInput } from './PromptInput.js';
+export type { PromptInputProps, PromptInputSlot, PromptSubmitKey } from './PromptInput.js';

package/dist/components/prompt-input/index.js

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

package/dist/components/provider/NebaProvider.d.ts

@@ -61,9 +61,9 @@ export interface NebaProviderProps {
  * <script dangerouslySetInnerHTML={{ __html: colorSchemeScript() }} />
  * ```
  *
- * It reads the same key and writes the same attribute the provider does, so the
- * two cannot disagree — which is the reason it is here rather than in a
- * documentation snippet somebody copies once and never updates.
+ * It reads the same key and writes the same attribute and `color-scheme` the
+ * provider does, so the two cannot disagree — which is the reason it is here
+ * rather than in a documentation snippet somebody copies once and never updates.
  */
 export declare function colorSchemeScript(options?: {
     storageKey?: string;

package/dist/components/provider/NebaProvider.js

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{DirectionProvider as r}from"@base-ui/react/direction-provider";import{DefaultsContext as o}from"../../internal/defaults.js";import{useMediaQuery as c}from"../../internal/media.js";const n=/*@__PURE__*/t.createContext(null);export function colorSchemeScript(e={}){const t=e.storageKey??"neba-color-scheme",r=e.defaultColorScheme??"system";return`(function(){try{var s=localStorage.getItem(${l(t)})||${l(r)};if(s==='system'){s=matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'}document.documentElement.setAttribute('data-theme',s)}catch(e){}})()`}function l(e){return JSON.stringify(e).replace(/</g,"\\u003c")}export function NebaProvider({children:l,defaults:s,colorScheme:a,defaultColorScheme:m="system",onColorSchemeChange:i,storageKey:u="neba-color-scheme",colorSchemeElement:d,direction:h}){const[f,S]=t.useState(()=>function(e){if(!1===e||"undefined"==typeof localStorage)return null;try{const t=localStorage.getItem(e);return"light"===t||"dark"===t||"system"===t?t:null}catch{return null}}(u)??m),g=a??f,p=c("(prefers-color-scheme: dark)"),y="system"===g?p?"dark":"light":g,C=t.useCallback(e=>{if(void 0===a&&S(e),!1!==u)try{localStorage.setItem(u,e)}catch{}i?.(e)},[a,u,i]);t.useEffect(()=>{const e=d?d():document.documentElement;e&&(e.setAttribute("data-theme",y),e.style.colorScheme=y)},[y,d]),t.useEffect(()=>{h&&document.documentElement.setAttribute("dir",h)},[h]);const b=t.useMemo(()=>({colorScheme:g,resolvedColorScheme:y,setColorScheme:C,toggleColorScheme:()=>C("dark"===y?"light":"dark")}),[g,y,C]);return e(o.Provider,{value:s??null,children:e(n.Provider,{value:b,children:e(r,{direction:h??"ltr",children:l})})})}export function useColorScheme(){const e=t.useContext(n);if(!e)throw new Error("neba: useColorScheme() needs a <NebaProvider> above it.");return e}
+"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{DirectionProvider as r,useDirection as o}from"@base-ui/react/direction-provider";import{DefaultsContext as l}from"../../internal/defaults.js";import{useHydrated as n,useMediaQuery as c}from"../../internal/media.js";const s=/*@__PURE__*/t.createContext(null);export function colorSchemeScript(e={}){const t=e.storageKey??"neba-color-scheme",r=e.defaultColorScheme??"system";return`(function(){try{var s=localStorage.getItem(${a(t)})||${a(r)};if(s==='system'){s=matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'}var d=document.documentElement;d.setAttribute('data-theme',s);d.style.colorScheme=s}catch(e){}})()`}function a(e){return JSON.stringify(e).replace(/</g,"\\u003c")}export function NebaProvider({children:a,defaults:i,colorScheme:u,defaultColorScheme:m="system",onColorSchemeChange:d,storageKey:h="neba-color-scheme",colorSchemeElement:f,direction:S}){const g=n(),y=t.useContext(l),v=t.useContext(s),p=o(),[C,b]=t.useState(null),x=t.useMemo(()=>g?function(e){if(!1===e||"undefined"==typeof localStorage)return null;try{const t=localStorage.getItem(e);return"light"===t||"dark"===t||"system"===t?t:null}catch{return null}}(h):null,[g,h]),k=u??C??x??m,E=c("(prefers-color-scheme: dark)"),j="system"===k?E?"dark":"light":k,M=t.useCallback(e=>{if(void 0===u&&b(e),!1!==h)try{localStorage.setItem(h,e)}catch{}d?.(e)},[u,h,d]);t.useEffect(()=>{if(!g)return;const e=f?f():null===v?document.documentElement:null;e&&(e.setAttribute("data-theme",j),e.style.colorScheme=j)},[g,j,f,v]),t.useEffect(()=>{S&&document.documentElement.setAttribute("dir",S)},[S]);const P=t.useMemo(()=>({colorScheme:k,resolvedColorScheme:j,setColorScheme:M,toggleColorScheme:()=>M("dark"===j?"light":"dark")}),[k,j,M]),z=i?.size??y?.size,A=i?.density??y?.density,I=i?.variant??y?.variant,N=i?.locale??y?.locale,w=null!=i||null!==y,K=t.useMemo(()=>w?{size:z,density:A,variant:I,locale:N}:null,[w,z,A,I,N]);return e(l.Provider,{value:K,children:e(s.Provider,{value:P,children:e(r,{direction:S??p,children:a})})})}export function useColorScheme(){const e=t.useContext(s);if(!e)throw new Error("neba: useColorScheme() needs a <NebaProvider> above it.");return e}

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

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Radio as n}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{Field as i}from"@base-ui/react/field";import{controlTextClasses as o,cx as t,hitAreaClasses as s,metaTextClasses as c,surfaceClasses as d,tickDotClasses as b,tickRowLeadingClasses as f,tickSizeClasses as h,transitionClasses as m}from"../../internal/styles.js";const u=/*@__PURE__*/r.createContext({size:"md",color:"primary",readOnly:!1}),p=["relative inline-flex shrink-0 items-center justify-center rounded-full border",s,"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",m,"active:[transition-duration:0ms]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),v=[d,"cursor-pointer bg-(--n-panel) [border-color:var(--n-line)]","hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]","data-[checked]:bg-(--n-fill) data-[checked]:text-(--n-on-solid)","data-[checked]:[border-color:transparent]","data-[checked]:hover:bg-(--n-fill-hover)"].join(" "),g=[d,"cursor-default bg-(--n-panel) [border-color:var(--n-line)]","[filter:saturate(0.55)]","data-[checked]:bg-(--n-fill) data-[checked]:text-(--n-on-solid)","data-[checked]:[border-color:transparent]"].join(" "),x=["cursor-not-allowed bg-transparent [border-color:var(--neba-disabled-border)] shadow-none","data-[checked]:bg-(--neba-disabled-bg)"].join(" "),N=["rounded-full bg-current","[transition:width_var(--neba-duration)_var(--neba-ease),height_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:size-0 data-[ending-style]:size-0"].join(" ");export const Radio=/*@__PURE__*/r.forwardRef(function({label:l,description:s,disabled:d=!1,className:m,classNames:y,style:k,...j},z){const w=r.useContext(u),R=j.readOnly??w.readOnly;return e(i.Root,{disabled:d,className:t("flex flex-col",m??""),style:k,children:a("div",{className:`flex items-start gap-2 ${o[w.size]} ${f}`,children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(n.Root,{ref:z,className:t(p,h[w.size],d?x:R?g:v,y?.control),disabled:d,...j,children:e(n.Indicator,{className:t(N,b[w.size],y?.indicator)})})}),l||s?a("span",{className:"flex min-w-0 flex-col gap-0.5",children:[l?e(i.Label,{className:t("leading-[1.4]",d?"text-(--neba-disabled-fg)":"cursor-pointer text-(--neba-fg)",y?.label),children:l}):null,s?e(i.Description,{className:t(c[w.size],"text-(--neba-muted-fg)",y?.description),children:s}):null]}):null]})})});export const RadioGroup=/*@__PURE__*/r.forwardRef(function({size:n="md",color:o="primary",orientation:s="vertical",label:d,description:b,error:f,invalid:h,disabled:m=!1,readOnly:p=!1,className:v,classNames:g,style:x,children:N,...y},k){const j=null!=f&&!1!==f&&""!==f,z=h??j,w=z?"danger":o,R={"--n-fill":`var(--neba-${w}-fill)`,"--n-fill-hover":`var(--neba-${w}-fill-hover)`,"--n-on-solid":`var(--neba-${w}-on-solid)`,"--n-accent":`var(--neba-${w}-accent)`,"--n-panel":"var(--neba-panel)","--n-panel-hover":"var(--neba-panel-hover)","--n-line":`var(--neba-${w}-line)`,"--n-line-hover":`var(--neba-${w}-line-hover)`,"--n-ring":`var(--neba-${w}-ring)`},$=r.useMemo(()=>({size:n,color:w,readOnly:p}),[n,w,p]);return e(u.Provider,{value:$,children:a(i.Root,{disabled:m,invalid:z,className:t("flex flex-col gap-1.5",v??""),style:{...R,...x},children:[d?e(i.Label,{className:t(c[n],"font-medium",m?"text-(--neba-disabled-fg)":"text-(--neba-fg)",g?.label),children:d}):null,b?e(i.Description,{className:t(c[n],"text-(--neba-muted-fg)",g?.description),children:b}):null,e(l,{ref:k,disabled:m,readOnly:p,className:t("flex","horizontal"===s?"flex-row flex-wrap gap-x-5 gap-y-2":"flex-col gap-2",g?.control),...y,children:N}),e(i.Error,j?{match:!0,className:t(c[n],"text-(--n-accent)",g?.error),children:f}:{className:t(c[n],"text-(--n-accent)",g?.error)})]})})});
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Radio as n}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{Field as i}from"@base-ui/react/field";import{controlTextClasses as o,cx as t,hitAreaClasses as s,metaTextClasses as d,surfaceClasses as c,tickDotClasses as b,tickRowLeadingClasses as f,tickSizeClasses as m,transitionClasses as h}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";import{useFieldsetDisabled as u}from"../../internal/fieldset.js";const v=/*@__PURE__*/r.createContext({size:"md",color:"primary",readOnly:!1,disabled:!1}),g=["relative inline-flex shrink-0 items-center justify-center rounded-full border",s,"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",h,"active:[transition-duration:0ms]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),x=[c,"cursor-pointer bg-(--n-panel) [border-color:var(--n-line)]","hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]","data-[checked]:bg-(--n-fill) data-[checked]:text-(--n-on-solid)","data-[checked]:[border-color:transparent]","data-[checked]:hover:bg-(--n-fill-hover)"].join(" "),N=[c,"cursor-default bg-(--n-panel) [border-color:var(--n-line)]","[filter:saturate(0.55)]","data-[checked]:bg-(--n-fill) data-[checked]:text-(--n-on-solid)","data-[checked]:[border-color:transparent]"].join(" "),y=["cursor-not-allowed bg-transparent [border-color:var(--neba-disabled-border)] shadow-none","data-[checked]:bg-(--neba-disabled-bg)"].join(" "),j=["rounded-full bg-current","[transition:width_var(--neba-duration)_var(--neba-ease),height_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:size-0 data-[ending-style]:size-0"].join(" ");export const Radio=/*@__PURE__*/r.forwardRef(function Radio({label:l,description:s,disabled:c,className:h,classNames:p,style:u,...k},z){const R=r.useContext(v),w=k.readOnly??R.readOnly,$=c??R.disabled;return e(i.Root,{disabled:$,className:t("flex flex-col",h??""),style:u,children:a("div",{className:`flex items-start gap-2 ${o[R.size]} ${f}`,children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(n.Root,{ref:z,className:t(g,m[R.size],$?y:w?N:x,p?.control),disabled:$,...k,children:e(n.Indicator,{className:t(j,b[R.size],p?.indicator)})})}),l||s?a("span",{className:"flex min-w-0 flex-col gap-0.5",children:[l?e(i.Label,{className:t("leading-[1.4]",$?"text-(--neba-disabled-fg)":"cursor-pointer text-(--neba-fg)",p?.label),children:l}):null,s?e(i.Description,{className:t(d[R.size],"text-(--neba-muted-fg)",p?.description),children:s}):null]}):null]})})});export const RadioGroup=/*@__PURE__*/r.forwardRef(function RadioGroup(n,o){const{size:s="md",color:c="primary",orientation:b="vertical",label:f,description:m,error:h,invalid:g,disabled:x,readOnly:N=!1,className:y,classNames:j,style:k,children:z,...R}=p(n,["size"]),w=u(x),$=null!=h&&!1!==h&&""!==h,O=g??$,_=O?"danger":c,G={"--n-fill":`var(--neba-${_}-fill)`,"--n-fill-hover":`var(--neba-${_}-fill-hover)`,"--n-on-solid":`var(--neba-${_}-on-solid)`,"--n-accent":`var(--neba-${_}-accent)`,"--n-panel":"var(--neba-panel)","--n-panel-hover":"var(--neba-panel-hover)","--n-line":`var(--neba-${_}-line)`,"--n-line-hover":`var(--neba-${_}-line-hover)`,"--n-ring":`var(--neba-${_}-ring)`},C=r.useMemo(()=>({size:s,color:_,readOnly:N,disabled:w}),[s,_,N,w]);return e(v.Provider,{value:C,children:a(i.Root,{disabled:w,invalid:O,className:t("flex flex-col gap-1.5",y??""),style:{...G,...k},children:[f?e(i.Label,{className:t(d[s],"font-medium",w?"text-(--neba-disabled-fg)":"text-(--neba-fg)",j?.label),children:f}):null,m?e(i.Description,{className:t(d[s],"text-(--neba-muted-fg)",j?.description),children:m}):null,e(l,{ref:o,disabled:w,readOnly:N,className:t("flex","horizontal"===b?"flex-row flex-wrap gap-x-5 gap-y-2":"flex-col gap-2",j?.control),...R,children:z}),e(i.Error,$?{match:!0,className:t(d[s],"text-(--n-accent)",j?.error),children:h}:{className:t(d[s],"text-(--n-accent)",j?.error)})]})})});

package/dist/components/rating/Rating.d.ts

@@ -49,7 +49,10 @@ export interface RatingProps extends Omit<React.ComponentPropsWithoutRef<'div'>,
     readOnly?: boolean;
     /** Unavailable. Drops the colour family for neutral grey. */
     disabled?: boolean;
-    /** Identifies the value when a form is submitted. */
+    /**
+     * Identifies the value when a form is submitted. Without one a Rating
+     * submits nothing, and `required` has nothing to hold back.
+     */
     name?: string;
     /** A form will not submit until a star has been chosen. */
     required?: boolean;

package/dist/components/rating/Rating.js

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

package/dist/components/reasoning/Reasoning.d.ts

@@ -0,0 +1,78 @@
+import * as React from 'react';
+import { type ReasoningMessages } from '../../internal/i18n.js';
+import type { NebaElevation, NebaSlots, NebaStyleProps } from '../../types.js';
+/** The two parts a Reasoning draws behind its root: the header, and the panel. */
+export type ReasoningSlot = 'header' | 'body';
+export interface ReasoningProps extends Pick<NebaStyleProps, 'size' | 'variant' | 'color' | 'density'>, Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'onChange'> {
+    /**
+     * Whether the thinking is still arriving. It is what the header says, what
+     * the mark does, and — unless `autoOpen` is off — whether the panel is open.
+     * @default false
+     */
+    streaming?: boolean;
+    /**
+     * How long the thinking took, in milliseconds.
+     *
+     * Left out, the panel counts its own from the moment `streaming` went true
+     * and keeps the last figure once it stops — which is where "Thought for 4s"
+     * comes from. A stretch shorter than a second never gets a number, and the
+     * header says so in words instead.
+     */
+    duration?: number;
+    /** Whether the panel is showing. Pass it to drive the disclosure yourself. */
+    open?: boolean;
+    /**
+     * Where an uncontrolled Reasoning starts, before any stream has run.
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /** Called when the header, or the stream, opens or closes the panel. */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Opens the panel while the stream runs and closes it when the stream ends.
+     *
+     * On, because that is the whole difference between this and a
+     * [Collapsible](../surfaces/collapsible): the reader can watch the thinking
+     * as it arrives without asking for it, and is left with a one-line summary
+     * rather than a wall of it. Turn it off for a panel that should stay where
+     * the reader put it.
+     * @default true
+     */
+    autoOpen?: boolean;
+    /** Replaces what the header says. Otherwise it is the `locale`'s sentence. */
+    label?: React.ReactNode;
+    /**
+     * The mark at the start. Defaults to the turning ring while the stream runs
+     * and nothing after it; pass `false` to drop it, or a node to replace it.
+     */
+    icon?: React.ReactNode | false;
+    /**
+     * Drop shadow depth. `0` (the default) is flat.
+     * @default 0
+     */
+    elevation?: NebaElevation;
+    /** Which language the header's own sentence is written in, as a BCP 47 tag. */
+    locale?: string;
+    /** Those sentences, written out. Overrides the `locale`'s. */
+    labels?: Partial<ReasoningMessages>;
+    /** Class names for the parts behind the root. */
+    classNames?: NebaSlots<ReasoningSlot>;
+    /** The thinking. */
+    children?: React.ReactNode;
+}
+/**
+ * A thinking panel that the stream opens and closes.
+ *
+ * On a [Spoiler](../surfaces/spoiler) and a
+ * [Collapsible](../surfaces/collapsible) the reader owns the open state: they
+ * covered it, they uncover it. Here the stream owns it — the panel opens as the
+ * thinking starts arriving, stays open while the reader can follow it, and
+ * folds itself away into one line when it stops. What is left behind is a
+ * record that it happened and how long it took, which is what a reader wants
+ * from reasoning they did not need to read.
+ *
+ * The panel is deliberately **not** a live region. Thinking is long, it is
+ * revised as it arrives, and a screen reader reading every revision aloud would
+ * bury the answer it is on the way to.
+ */
+export declare const Reasoning: React.ForwardRefExoticComponent<ReasoningProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/reasoning/Reasoning.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{Collapsible as t}from"@base-ui/react/collapsible";import{boxPaddingXClasses as o,boxPaddingYClasses as r}from"../box/Box.js";import{ChevronIcon as l,SpinnerIcon as s}from"../../internal/icons.js";import{formatDuration as i,useElapsed as c}from"../../internal/run.js";import{fillMessage as d,reasoningMessages as m,useMessages as f}from"../../internal/i18n.js";import{collapsiblePanelClasses as p,cx as u,gapClasses as b,hasContent as h,iconClasses as v,radiusClasses as x,sheetBodyClasses as g,sheetTitleClasses as j,surfaceClasses as N,surfaceSlots as y,transitionClasses as w}from"../../internal/styles.js";import{useStyleDefaults as O}from"../../internal/defaults.js";const R={solid:[N,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[N,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"};export const Reasoning=/*@__PURE__*/a.forwardRef(function Reasoning(N,_){const{variant:k="text",size:C="md",color:z="secondary",density:S="default",elevation:B=0,streaming:P=!1,duration:T,open:q,defaultOpen:A=!1,onOpenChange:D,autoOpen:E=!0,label:F,icon:G,locale:H,labels:I,classNames:J,className:K,style:L,children:M,...Q}=O(N,["size","density","variant","locale"]),U={...f(m,H),...I},[V,W]=a.useState(A||E&&P),[X,Y]=a.useState(P),Z=void 0!==q,$=Z?q:V;X!==P&&(Y(P),E&&!Z&&W(P));const ee=c(P,T),ne=null===ee?null:i(ee,H),ae=h(F)?F:P?U.thinking:null===ne?U.done:d(U.thought,{duration:ne}),te=void 0===G?P?e(s,{}):null:G;return n(t.Root,{ref:_,open:$,onOpenChange:e=>{Z||W(e),D?.(e)},"aria-busy":P||void 0,"data-streaming":P||void 0,className:u("flex flex-col overflow-hidden",x[C],R[k],w,v,K??""),style:{...y(z,B),...L},...Q,children:[n(t.Trigger,{className:u("flex w-full cursor-pointer items-center text-start text-(--neba-muted-fg)",o[S][C],r[S][C],b[C],j[C],w,"hover:bg-(--n-soft) hover:text-(--n-on-tint)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]",J?.header??""),children:[h(te)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:te}):null,e("span",{className:"min-w-0 flex-1 truncate font-medium",children:ae}),e("span",{className:["flex h-[1lh] shrink-0 items-center","[transition:rotate_var(--neba-duration)_var(--neba-ease)]","data-[panel-open]:rotate-180"].join(" "),children:e(l,{})})]}),e(t.Panel,{className:p,children:e("div",{className:u("min-w-0 border-s-2 text-(--neba-muted-fg) [border-color:var(--n-line)]",o[S][C],"compact"===S?"pb-2":"pb-4",g[C],J?.body??""),children:M})})]})});

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

@@ -0,0 +1,2 @@
+export { Reasoning } from './Reasoning.js';
+export type { ReasoningProps, ReasoningSlot } from './Reasoning.js';

package/dist/components/reasoning/index.js

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