neba 1.9.0 → 1.11.0

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

@@ -1,7 +1,16 @@
 import * as React from 'react';
-import type { NebaElevation, NebaStyleProps } from '../../types.js';
+import type { NebaElevation, NebaFieldSlot, NebaShortcuts, NebaSlots, NebaStyleProps } from '../../types.js';
 /** How the multiline control may be resized by the user. Ignored when single line. */
 export type TextFieldResize = 'none' | 'vertical' | 'horizontal' | 'both';
+/**
+ * The parts a TextField draws behind its root.
+ *
+ * `shell` is the framed box the control sits in — the thing wearing the border,
+ * the fill and the focus ring. It is a part rather than an implementation
+ * detail because it, and not the `<input>`, is what a caller means by "the
+ * field" when they want to change its shape.
+ */
+export type TextFieldSlot = NebaFieldSlot | 'shell';
 /**
  * Native `<input>` attributes, minus the three that collide with the shared
  * vocabulary: `color` and `size` are Neba props here, and `onChange` is widened
@@ -57,6 +66,23 @@ export interface TextFieldProps extends NebaStyleProps, NativeControlProps {
     loading?: boolean;
     /** Stretches to the width of the container. */
     fullWidth?: boolean;
+    /**
+     * Class names for the parts behind the root. `className` is the root — the
+     * column that holds the label, the shell and the two lines under it — so the
+     * control itself is reached through `classNames.control`.
+     */
+    classNames?: NebaSlots<TextFieldSlot>;
+    /**
+     * Key combinations to act on, spelled the way
+     * [Shortcut](../display/shortcut) draws them — `{ 'Mod+Enter': send }`. Bound
+     * to the control, so `event.currentTarget` is the `<input>` or the
+     * `<textarea>` and `event.currentTarget.value` is what was typed.
+     *
+     * It runs *before* `onKeyDown`, which still sees every keystroke; neither
+     * replaces the other. Nothing is prevented on the caller's behalf — a
+     * shortcut that must not also insert a newline calls `preventDefault` itself.
+     */
+    shortcuts?: NebaShortcuts<HTMLInputElement | HTMLTextAreaElement>;
     onChange?: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
 }
 export declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;

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

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Field as r}from"@base-ui/react/field";import{Input as i}from"@base-ui/react/input";import{controlHeightClasses as l,controlTextLeadingClasses as a,cx as s,disabledClasses as o,fieldReadOnlyClasses as c,fieldRestClasses as d,focusWithinRingClasses as m,gapClasses as u,iconClasses as x,metaTextClasses as p,paddingXClasses as f,radiusClasses as h,stackGapClasses as g,surfaceSlots as b,transitionClasses as y}from"../../internal/styles.js";const $={xs:`${u.xs} ${h.xs} ${a.xs}`,sm:`${u.sm} ${h.sm} ${a.sm}`,md:`${u.md} ${h.md} ${a.md}`,lg:`${u.lg} ${h.lg} ${a.lg}`,xl:`${u.xl} ${h.xl} ${a.xl}`},v={xs:"min-h-5.5 py-[3px]",sm:"min-h-6.5 py-[4px]",md:"min-h-8 py-[5px]",lg:"min-h-10 py-[8px]",xl:"min-h-12 py-[10px]"},w={none:"resize-none",vertical:"resize-y",horizontal:"resize-x",both:"resize"},N=["group relative flex w-full cursor-text","[-webkit-tap-highlight-color:transparent]",y,"focus-within:[transition-duration:0ms]",m,x].join(" "),j=d,k=c;function z(){return t("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[e("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),e("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export const TextField=/*@__PURE__*/n.forwardRef(function({variant:a="outline",size:c="md",color:d="primary",density:m="default",elevation:u=0,multiline:x=!1,rows:h=3,resize:y="vertical",label:C,description:D,error:O,invalid:R,startIcon:W,endIcon:I,loading:L=!1,fullWidth:T=!1,readOnly:A=!1,disabled:B=!1,type:E="text",className:F,style:M,...P},q){const G=null!=O&&!1!==O&&""!==O,H=R??G,J=H?"danger":d,K=n.useRef(null),Q=n.useCallback(e=>{K.current=e,"function"==typeof q?q(e):q&&(q.current=e)},[q]),S=s(N,$[c],x?`${v[c]} items-start`:`${l[c]} items-center`,f[m][c],B?o[a]:A?k[a]:j[a]),U=["min-w-0 flex-1 bg-transparent [font:inherit] text-inherit","[outline:none]","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",x?`block ${w[y]}`:"self-stretch"].join(" "),V="inline-flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg) transition-[color] duration-(--neba-duration) group-focus-within:text-(--n-accent)";return t(r.Root,{disabled:B,invalid:H,className:s("flex-col align-top",g[c],T?"flex w-full":"inline-flex",F??""),style:{...b(J,u),...M},children:[C?e(r.Label,{className:[p[c],"font-medium",B?"text-(--neba-disabled-fg)":"text-(--neba-fg)"].join(" "),children:C}):null,t("span",{className:S,onPointerDown:e=>{e.target!==e.currentTarget||B||(e.preventDefault(),K.current?.focus())},children:[W?e("span",{className:V,children:W}):null,e(i,{ref:Q,className:U,disabled:B,readOnly:A,"aria-busy":L||void 0,"data-loading":L||void 0,...x?{render:e("textarea",{rows:h})}:{type:E},...P}),L?e("span",{className:V,children:e(z,{})}):I?e("span",{className:V,children:I}):null]}),D?e(r.Description,{className:[p[c],"text-(--neba-muted-fg)"].join(" "),children:D}):null,e(r.Error,G?{match:!0,className:[p[c],"text-(--n-accent)"].join(" "),children:O}:{className:[p[c],"text-(--n-accent)"].join(" ")})]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Field as r}from"@base-ui/react/field";import{Input as i}from"@base-ui/react/input";import{controlHeightClasses as l,controlTextLeadingClasses as s,cx as a,disabledClasses as o,fieldReadOnlyClasses as c,fieldRestClasses as d,focusWithinRingClasses as m,gapClasses as u,iconClasses as p,metaTextClasses as f,paddingXClasses as x,radiusClasses as h,stackGapClasses as b,surfaceSlots as g,transitionClasses as y}from"../../internal/styles.js";import{keyHandler as $}from"../../internal/keys.js";import{useStyleDefaults as w}from"../../internal/defaults.js";const v={xs:`${u.xs} ${h.xs} ${s.xs}`,sm:`${u.sm} ${h.sm} ${s.sm}`,md:`${u.md} ${h.md} ${s.md}`,lg:`${u.lg} ${h.lg} ${s.lg}`,xl:`${u.xl} ${h.xl} ${s.xl}`},N={xs:"min-h-5.5 py-[3px]",sm:"min-h-6.5 py-[4px]",md:"min-h-8 py-[5px]",lg:"min-h-10 py-[8px]",xl:"min-h-12 py-[10px]"},k={none:"resize-none",vertical:"resize-y",horizontal:"resize-x",both:"resize"},z=["group relative flex w-full cursor-text","[-webkit-tap-highlight-color:transparent]",y,"focus-within:[transition-duration:0ms]",m,p].join(" "),j=d,D=c;function C(){return t("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[e("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),e("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export const TextField=/*@__PURE__*/n.forwardRef(function(s,c){const{variant:d="outline",size:m="md",color:u="primary",density:p="default",elevation:h=0,multiline:y=!1,rows:O=3,resize:R="vertical",label:W,description:I,error:K,invalid:L,startIcon:T,endIcon:A,loading:B=!1,fullWidth:E=!1,classNames:F,shortcuts:M,onKeyDown:P,readOnly:q=!1,disabled:G=!1,type:H="text",className:J,style:Q,...S}=w(s,["size","density","variant"]),U=null!=K&&!1!==K&&""!==K,V=L??U,X=V?"danger":u,Y=n.useRef(null),Z=n.useCallback(e=>{Y.current=e,"function"==typeof c?c(e):c&&(c.current=e)},[c]),_=a(z,v[m],y?`${N[m]} items-start`:`${l[m]} items-center`,x[p][m],G?o[d]:q?D[d]:j[d],F?.shell),ee=a("min-w-0 flex-1 bg-transparent [font:inherit] text-inherit","[outline:none]","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",y?`block ${k[R]}`:"self-stretch",F?.control),te="inline-flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg) transition-[color] duration-(--neba-duration) group-focus-within:text-(--n-accent)";return t(r.Root,{disabled:G,invalid:V,className:a("flex-col align-top",b[m],E?"flex w-full":"inline-flex",J??""),style:{...g(X,h),...Q},children:[W?e(r.Label,{className:a(f[m],"font-medium",G?"text-(--neba-disabled-fg)":"text-(--neba-fg)",F?.label),children:W}):null,t("span",{className:_,onPointerDown:e=>{e.target!==e.currentTarget||G||(e.preventDefault(),Y.current?.focus())},children:[T?e("span",{className:te,children:T}):null,e(i,{ref:Z,className:ee,disabled:G,readOnly:q,"aria-busy":B||void 0,"data-loading":B||void 0,...y?{render:e("textarea",{rows:O})}:{type:H},...S,onKeyDown:$(M,P)}),B?e("span",{className:te,children:e(C,{})}):A?e("span",{className:te,children:A}):null]}),I?e(r.Description,{className:a(f[m],"text-(--neba-muted-fg)",F?.description),children:I}):null,e(r.Error,U?{match:!0,className:a(f[m],"text-(--n-accent)",F?.error),children:K}:{className:a(f[m],"text-(--n-accent)",F?.error)})]})});

package/dist/components/text-link/TextLink.js

@@ -1 +1 @@
-"use client";import{jsx as n,Fragment as e,jsxs as r}from"react/jsx-runtime";import*as i from"react";import{useRender as a}from"@base-ui/react/use-render";import{linkMessages as o,useMessages as t}from"../../internal/i18n.js";import{ExternalLinkIcon as l,LinkIcon as s}from"../../internal/icons.js";import{safeRel as c}from"../../internal/link.js";import{controlTextLeadingClasses as m,cx as u,focusRingClasses as d,srOnlyClasses as p}from"../../internal/styles.js";const b={always:"[&.neba-link]:underline",hover:"[&.neba-link]:no-underline [&.neba-link]:hover:underline",none:"[&.neba-link]:no-underline"},f=["neba-link","cursor-pointer","[&_svg]:pointer-events-none [&_svg]:inline [&_svg]:size-[0.95em] [&_svg]:shrink-0",["[transition-property:color,text-decoration-color]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]"].join(" "),d,"focus-visible:rounded-[0.25rem]"].join(" ");export const TextLink=/*@__PURE__*/i.forwardRef(function({href:i,underline:d="always",color:v,size:h,newTab:k=!1,icon:g,locale:j,render:x,className:y,style:w,children:_,...N},T){const z=t(o,j),C=g??k,$=!0===C?n(k?l:s,{}):C,F=u(f,h?m[h]:"",b[d],v?"[&.neba-link]:text-(--n-accent)":"[&.neba-link]:text-inherit",y??""),L={"--n-underline":"color-mix(in oklab, currentColor 45%, transparent)","--n-underline-hover":"currentColor","--n-ring":`var(--neba-${v??"primary"}-ring)`,...v?{"--n-accent":`var(--neba-${v}-accent)`}:null},R=k?"_blank":void 0,{rel:q,...A}=N,B=c(R,q);return a({render:x??n("a",{}),ref:T,props:{href:i,target:R,className:F,style:{...L,...w},children:r(e,{children:[_,$?n("span",{className:"ms-[0.25em]",children:$}):null,k?r(e,{children:[" ",n("span",{className:p,children:z.newTab})]}):null]}),...A,rel:B}})});
+"use client";import{jsx as n,Fragment as e,jsxs as r}from"react/jsx-runtime";import*as i from"react";import{useRender as a}from"@base-ui/react/use-render";import{linkMessages as o,useMessages as t}from"../../internal/i18n.js";import{ExternalLinkIcon as l,LinkIcon as s}from"../../internal/icons.js";import{safeRel as c}from"../../internal/link.js";import{controlTextLeadingClasses as m,cx as u,focusRingClasses as d,srOnlyClasses as p}from"../../internal/styles.js";import{useStyleDefaults as b}from"../../internal/defaults.js";const f={always:"[&.neba-link]:underline",hover:"[&.neba-link]:no-underline [&.neba-link]:hover:underline",none:"[&.neba-link]:no-underline"},v=["neba-link","cursor-pointer","[&_svg]:pointer-events-none [&_svg]:inline [&_svg]:size-[0.95em] [&_svg]:shrink-0",["[transition-property:color,text-decoration-color]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]"].join(" "),d,"focus-visible:rounded-[0.25rem]"].join(" ");export const TextLink=/*@__PURE__*/i.forwardRef(function(i,d){const{href:h,underline:k="always",color:j,size:g,newTab:x=!1,icon:y,locale:w,render:_,className:N,style:z,children:T,...C}=b(i,["size","locale"]),$=t(o,w),F=y??x,L=!0===F?n(x?l:s,{}):F,R=u(v,g?m[g]:"",f[k],j?"[&.neba-link]:text-(--n-accent)":"[&.neba-link]:text-inherit",N??""),q={"--n-underline":"color-mix(in oklab, currentColor 45%, transparent)","--n-underline-hover":"currentColor","--n-ring":`var(--neba-${j??"primary"}-ring)`,...j?{"--n-accent":`var(--neba-${j}-accent)`}:null},A=x?"_blank":void 0,{rel:B,...D}=C,E=c(A,B);return a({render:_??n("a",{}),ref:d,props:{href:h,target:A,className:R,style:{...q,...z},children:r(e,{children:[T,L?n("span",{className:"ms-[0.25em]",children:L}):null,x?r(e,{children:[" ",n("span",{className:p,children:$.newTab})]}):null]}),...D,rel:E}})});

package/dist/components/time-picker/TimePicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as o from"react";import{Button as t}from"../button/Button.js";import{TimeGrid as l,usePickerLabels as a}from"../../internal/calendar.js";import{ClockIcon as s}from"../../internal/icons.js";import{PickerFooter as i,PickerShell as r}from"../../internal/picker.js";import{displaySamples as c,formatDate as d,isHour12 as u,isValidDate as m,secondsOfDay as p,timeUnitSpan as h,toISOTime as f,withPlaceholder as S,withTime as b}from"../../internal/date.js";import{cx as g}from"../../internal/styles.js";export const TimePicker=/*@__PURE__*/o.forwardRef(function({value:y,defaultValue:v,onValueChange:j,open:x,defaultOpen:C,onOpenChange:w,referenceDate:z,minTime:k,maxTime:D,shouldDisableTime:O,hour12:T,showSeconds:M=!1,hourStep:V=1,minuteStep:B=1,secondStep:I=1,locale:N,format:R,placeholder:F,clearable:H=!1,showNowButton:P=!0,closeOnSelect:q=!1,labels:A,name:E,size:G="md",color:J="primary",density:K="default",readOnly:L=!1,disabled:Q=!1,startIcon:U,...W},X){const Y=a(A),Z=T??u(N),[$,_]=o.useState(v??null),ee=void 0!==y?y:$,[ne,oe]=o.useState(C??!1),te=x??ne,[le]=o.useState(()=>z??new Date),ae=e=>{e&&(L||Q)||(void 0===x&&oe(e),w?.(e))},se=e=>{void 0===y&&_(e),j?.(e)},ie=o.useCallback((e,n)=>{const[o,t]=h(n,e);return!!(m(k)&&t<p(k))||(!!(m(D)&&o>p(D))||(O?.(e,n)??!1))},[k,D,O]),re=o.useMemo(()=>R??{hour:"numeric",minute:"2-digit",...M?{second:"2-digit"}:{}},[R,M]),ce=new Date,de=b(z??le,{hours:ce.getHours(),minutes:ce.getMinutes(),seconds:M?ce.getSeconds():0}),ue=P||H||!q,me=o.useMemo(()=>S(c(N,re),F),[N,re,F]);return e(r,{...W,size:G,color:J,density:K,readOnly:L,disabled:Q,triggerRef:X,startIcon:U??e(s,{}),display:m(ee)?d(ee,N,re):F??"",samples:me,empty:!m(ee),clearable:H,onClear:()=>se(null),open:te,onOpenChange:ae,labels:Y,hiddenValues:E?[{name:E,value:m(ee)?f(ee,M):""}]:void 0,children:n("div",{className:g("flex flex-col",ue&&"gap-1.5"),children:[e(l,{size:G,density:K,locale:N,value:m(ee)?ee:null,referenceDate:z??le,onChange:e=>{se(e),q&&ae(!1)},hour12:Z,showSeconds:M,hourStep:V,minuteStep:B,secondStep:I,shouldDisableTime:ie,labels:Y,autoFocus:!0}),ue?n(i,{size:G,children:[H?e(t,{variant:"text",size:G,color:J,density:"compact",onClick:()=>{se(null),ae(!1)},children:Y.clear}):null,P?e(t,{variant:"text",size:G,color:J,density:"compact",disabled:ie(de,"second"),onClick:()=>{se(de),ae(!1)},children:Y.now}):null,q?null:e(t,{variant:"solid",size:G,color:J,density:"compact",onClick:()=>ae(!1),children:Y.done})]}):null]})})});
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as o from"react";import{Button as t}from"../button/Button.js";import{TimeGrid as l,usePickerLabels as a}from"../../internal/calendar.js";import{ClockIcon as s}from"../../internal/icons.js";import{PickerFooter as i,PickerShell as r}from"../../internal/picker.js";import{displaySamples as c,formatDate as d,isHour12 as u,isValidDate as m,secondsOfDay as p,timeUnitSpan as h,toISOTime as f,withPlaceholder as y,withTime as S}from"../../internal/date.js";import{cx as b}from"../../internal/styles.js";import{useStyleDefaults as g}from"../../internal/defaults.js";export const TimePicker=/*@__PURE__*/o.forwardRef(function(v,j){const{value:x,defaultValue:C,onValueChange:w,open:z,defaultOpen:k,onOpenChange:D,referenceDate:O,minTime:T,maxTime:M,shouldDisableTime:V,hour12:B,showSeconds:I=!1,hourStep:N=1,minuteStep:R=1,secondStep:F=1,locale:H,format:P,placeholder:q,clearable:A=!1,showNowButton:E=!0,closeOnSelect:G=!1,labels:J,name:K,size:L="md",color:Q="primary",density:U="default",readOnly:W=!1,disabled:X=!1,startIcon:Y,...Z}=g(v,["size","density","locale"]),$=a(J),_=B??u(H),[ee,ne]=o.useState(C??null),oe=void 0!==x?x:ee,[te,le]=o.useState(k??!1),ae=z??te,[se]=o.useState(()=>O??new Date),ie=e=>{e&&(W||X)||(void 0===z&&le(e),D?.(e))},re=e=>{void 0===x&&ne(e),w?.(e)},ce=o.useCallback((e,n)=>{const[o,t]=h(n,e);return!!(m(T)&&t<p(T))||(!!(m(M)&&o>p(M))||(V?.(e,n)??!1))},[T,M,V]),de=o.useMemo(()=>P??{hour:"numeric",minute:"2-digit",...I?{second:"2-digit"}:{}},[P,I]),ue=new Date,me=S(O??se,{hours:ue.getHours(),minutes:ue.getMinutes(),seconds:I?ue.getSeconds():0}),pe=E||A||!G,he=o.useMemo(()=>y(c(H,de),q),[H,de,q]);return e(r,{...Z,size:L,color:Q,density:U,readOnly:W,disabled:X,triggerRef:j,startIcon:Y??e(s,{}),display:m(oe)?d(oe,H,de):q??"",samples:he,empty:!m(oe),clearable:A,onClear:()=>re(null),open:ae,onOpenChange:ie,labels:$,hiddenValues:K?[{name:K,value:m(oe)?f(oe,I):""}]:void 0,children:n("div",{className:b("flex flex-col",pe&&"gap-1.5"),children:[e(l,{size:L,density:U,locale:H,value:m(oe)?oe:null,referenceDate:O??se,onChange:e=>{re(e),G&&ie(!1)},hour12:_,showSeconds:I,hourStep:N,minuteStep:R,secondStep:F,shouldDisableTime:ce,labels:$,autoFocus:!0}),pe?n(i,{size:L,children:[A?e(t,{variant:"text",size:L,color:Q,density:"compact",onClick:()=>{re(null),ie(!1)},children:$.clear}):null,E?e(t,{variant:"text",size:L,color:Q,density:"compact",disabled:ce(me,"second"),onClick:()=>{re(me),ie(!1)},children:$.now}):null,G?null:e(t,{variant:"solid",size:L,color:Q,density:"compact",onClick:()=>ie(!1),children:$.done})]}):null]})})});

package/dist/components/timeline-chart/TimelineChart.d.ts

@@ -41,4 +41,4 @@ export interface TimelineChartProps extends Omit<CartesianChartProps, 'series' |
  * steps and draws no axis at all. That one is for a sequence of events; this
  * one is for how long each of them took.
  */
-export declare function TimelineChart({ series, min, max, barSize, rounded, size, density, xAxis, yAxis, locale, ...props }: TimelineChartProps): React.JSX.Element;
+export declare function TimelineChart(rawProps: TimelineChartProps): React.JSX.Element;

package/dist/components/timeline-chart/TimelineChart.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{CartesianChart as o}from"../../internal/chart-frame.js";import{barBandRatio as r,barMaxThickness as a,barRadius as s,formatTimeTicks as l,formatTimeValue as i,markGap as c,resolveColor as m,seriesColor as d,timeScale as u,toNumber as h}from"../../internal/chart.js";import{srOnlyClasses as x}from"../../internal/styles.js";export function TimelineChart({series:n,min:s,max:m,barSize:x,rounded:b=!0,size:y="md",density:k="default",xAxis:g,yAxis:v,locale:$,...j}){const C=t.useMemo(()=>n.map(f),[n]),w=t.useMemo(()=>C.map(e=>e.spans),[C]),z=t.useMemo(()=>{let e=1/0,n=-1/0,t=!1;for(const o of w)for(const r of o)r&&(t=!0,e=Math.min(e,r.from),n=Math.max(n,r.to));return t?{min:e,max:n}:null},[w]),A=t.useMemo(()=>u(z,{min:h(s)??void 0,max:h(m)??void 0,tickCount:v?.tickCount}),[z,s,m,v?.tickCount]),E=t.useMemo(()=>l(A.ticks,A.unit,$),[A,$]),P=t.useMemo(()=>n.map((e,n)=>d(e,n)),[n]),B=t.useMemo(()=>[{data:w.map(e=>e.some(Boolean)?1:null)}],[w]),I=t.useMemo(()=>n.map((e,n)=>e.name??`${n+1}`),[n]),T=x??a[y],F=t.useCallback(e=>{const n=[];return C.forEach((t,o)=>{const r=Math.min(T,Math.max(1,(e.band.band-c*(t.lanes-1))/t.lanes)),a=r*t.lanes+c*(t.lanes-1),s=e.plot.top+e.categoryPx(o)-a/2+r/2;t.spans.forEach((t,a)=>{if(!t)return;const l=e.valuePx(t.from),i=e.valuePx(t.to);n.push({series:o,index:a,x:(l+i)/2,y:s+t.lane*(r+c),r:r/2,rx:Math.max(0,(i-l)/2),ry:r/2})})}),n},[C,T]),N=t.useCallback(e=>{const n=w[e.series]?.[e.index];if(!n)return null;const t=[{seriesIndex:e.series,name:I[e.series],color:n.color??P[e.series],value:n.to-n.from,formatted:`${i(n.from,A.unit,$)} – ${i(n.to,A.unit,$)}`}];return{heading:n.span.label??I[e.series],items:t}},[w,I,P,A.unit,$]);return e(o,{...j,series:B,categories:I,size:y,density:k,locale:$,horizontal:!0,scale:A,xAxis:g,yAxis:{tickFormat:(e,n)=>E[n]??"",...v},legend:!1,bandRatio:r[k],marks:F,markTooltip:N,table:t=>e(M,{id:t,names:I,series:n,spans:w,unit:A.unit,label:j.label,corner:g?.label,locale:$}),children:n=>e(p,{context:n,spans:w,colors:P,rounded:b})})}function f(e){const n=e.data.map(e=>{const n=h(e.start),t=h(e.end);return null===n||null===t?null:{from:Math.min(n,t),to:Math.max(n,t),lane:0,color:e.color?m(e.color):void 0,span:e}}),t=[];return n.map((e,n)=>({one:e,index:n})).filter(e=>Boolean(e.one)).sort((e,n)=>e.one.from-n.one.from).forEach(({one:e})=>{const n=t.findIndex(n=>n<=e.from),o=-1===n?t.length:n;t[o]=e.to,e.lane=o}),{spans:n,lanes:Math.max(1,t.length)}}function p({context:n,spans:t,colors:o,rounded:r}){const{marks:a,activeMark:l,plot:i}=n,c=r?s:0;return e("g",{children:a.map(n=>{const r=t[n.series]?.[n.index];if(!r)return null;const a=l?.series===n.series&&l?.index===n.index,s=n.rx??n.r,m=2*(n.ry??n.r),d=Math.max(i.left,n.x-s),u=Math.min(i.left+i.width,n.x+s);if(u<i.left||d>i.left+i.width)return null;const h=Math.max(1,u-d);return e("rect",{x:d,y:n.y-m/2,width:h,height:m,rx:Math.min(c,h/2,m/2),fill:r.color??o[n.series],opacity:a?1:.92},`${n.series}-${n.index}`)})})}function M({id:t,names:o,series:r,spans:a,unit:s,label:l,corner:c,locale:m}){const d=r.some(e=>e.data.some(e=>void 0!==e.label));return n("table",{id:t,className:x,children:[l?e("caption",{children:l}):null,e("thead",{children:n("tr",{children:[e("th",{scope:"col",children:c??""}),d?e("th",{scope:"col",children:"label"}):null,e("th",{scope:"col",children:"start"}),e("th",{scope:"col",children:"end"})]})}),e("tbody",{children:a.flatMap((t,a)=>t.map((t,l)=>n("tr",{children:[e("th",{scope:"row",children:o[a]}),d?e("td",{children:r[a].data[l]?.label??""}):null,e("td",{children:t?i(t.from,s,m):""}),e("td",{children:t?i(t.to,s,m):""})]},`${a}-${l}`)))})]})}
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{CartesianChart as o}from"../../internal/chart-frame.js";import{barBandRatio as r,barMaxThickness as a,barRadius as s,formatTimeTicks as l,formatTimeValue as i,markGap as c,resolveColor as m,seriesColor as d,timeScale as u,toNumber as h}from"../../internal/chart.js";import{srOnlyClasses as f}from"../../internal/styles.js";import{useStyleDefaults as x}from"../../internal/defaults.js";export function TimelineChart(n){const{series:s,min:m,max:f,barSize:y,rounded:k=!0,size:g="md",density:v="default",xAxis:j,yAxis:$,locale:C,...z}=x(n,["size","density","locale"]),w=t.useMemo(()=>s.map(p),[s]),A=t.useMemo(()=>w.map(e=>e.spans),[w]),E=t.useMemo(()=>{let e=1/0,n=-1/0,t=!1;for(const o of A)for(const r of o)r&&(t=!0,e=Math.min(e,r.from),n=Math.max(n,r.to));return t?{min:e,max:n}:null},[A]),P=t.useMemo(()=>u(E,{min:h(m)??void 0,max:h(f)??void 0,tickCount:$?.tickCount}),[E,m,f,$?.tickCount]),B=t.useMemo(()=>l(P.ticks,P.unit,C),[P,C]),I=t.useMemo(()=>s.map((e,n)=>d(e,n)),[s]),T=t.useMemo(()=>[{data:A.map(e=>e.some(Boolean)?1:null)}],[A]),F=t.useMemo(()=>s.map((e,n)=>e.name??`${n+1}`),[s]),N=y??a[g],R=t.useCallback(e=>{const n=[];return w.forEach((t,o)=>{const r=Math.min(N,Math.max(1,(e.band.band-c*(t.lanes-1))/t.lanes)),a=r*t.lanes+c*(t.lanes-1),s=e.plot.top+e.categoryPx(o)-a/2+r/2;t.spans.forEach((t,a)=>{if(!t)return;const l=e.valuePx(t.from),i=e.valuePx(t.to);n.push({series:o,index:a,x:(l+i)/2,y:s+t.lane*(r+c),r:r/2,rx:Math.max(0,(i-l)/2),ry:r/2})})}),n},[w,N]),S=t.useCallback(e=>{const n=A[e.series]?.[e.index];if(!n)return null;const t=[{seriesIndex:e.series,name:F[e.series],color:n.color??I[e.series],value:n.to-n.from,formatted:`${i(n.from,P.unit,C)} – ${i(n.to,P.unit,C)}`}];return{heading:n.span.label??F[e.series],items:t}},[A,F,I,P.unit,C]);return e(o,{...z,series:T,categories:F,size:g,density:v,locale:C,horizontal:!0,scale:P,xAxis:j,yAxis:{tickFormat:(e,n)=>B[n]??"",...$},legend:!1,bandRatio:r[v],marks:R,markTooltip:S,table:n=>e(b,{id:n,names:F,series:s,spans:A,unit:P.unit,label:z.label,corner:j?.label,locale:C}),children:n=>e(M,{context:n,spans:A,colors:I,rounded:k})})}function p(e){const n=e.data.map(e=>{const n=h(e.start),t=h(e.end);return null===n||null===t?null:{from:Math.min(n,t),to:Math.max(n,t),lane:0,color:e.color?m(e.color):void 0,span:e}}),t=[];return n.map((e,n)=>({one:e,index:n})).filter(e=>Boolean(e.one)).sort((e,n)=>e.one.from-n.one.from).forEach(({one:e})=>{const n=t.findIndex(n=>n<=e.from),o=-1===n?t.length:n;t[o]=e.to,e.lane=o}),{spans:n,lanes:Math.max(1,t.length)}}function M({context:n,spans:t,colors:o,rounded:r}){const{marks:a,activeMark:l,plot:i}=n,c=r?s:0;return e("g",{children:a.map(n=>{const r=t[n.series]?.[n.index];if(!r)return null;const a=l?.series===n.series&&l?.index===n.index,s=n.rx??n.r,m=2*(n.ry??n.r),d=Math.max(i.left,n.x-s),u=Math.min(i.left+i.width,n.x+s);if(u<i.left||d>i.left+i.width)return null;const h=Math.max(1,u-d);return e("rect",{x:d,y:n.y-m/2,width:h,height:m,rx:Math.min(c,h/2,m/2),fill:r.color??o[n.series],opacity:a?1:.92},`${n.series}-${n.index}`)})})}function b({id:t,names:o,series:r,spans:a,unit:s,label:l,corner:c,locale:m}){const d=r.some(e=>e.data.some(e=>void 0!==e.label));return n("table",{id:t,className:f,children:[l?e("caption",{children:l}):null,e("thead",{children:n("tr",{children:[e("th",{scope:"col",children:c??""}),d?e("th",{scope:"col",children:"label"}):null,e("th",{scope:"col",children:"start"}),e("th",{scope:"col",children:"end"})]})}),e("tbody",{children:a.flatMap((t,a)=>t.map((t,l)=>n("tr",{children:[e("th",{scope:"row",children:o[a]}),d?e("td",{children:r[a].data[l]?.label??""}):null,e("td",{children:t?i(t.from,s,m):""}),e("td",{children:t?i(t.to,s,m):""})]},`${a}-${l}`)))})]})}

package/dist/components/toast/Toast.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaAlign, NebaColor, NebaStyleProps, NebaVariant } from '../../types.js';
+import type { NebaAlign, NebaColor, NebaSlots, NebaStyleProps, NebaVariant } from '../../types.js';
 /**
  * Where the stack sits.
  *
@@ -50,6 +50,16 @@ export interface ToastOptions extends ToastData {
     /** Called once it has finished animating out and left the DOM. */
     onRemove?: () => void;
 }
+/**
+ * The parts the toast stack draws.
+ *
+ * There is no `className` on the provider and there is deliberately no `root`
+ * slot: a ToastProvider renders no element of its own — it wraps the app and
+ * puts a portalled stack on the page — so there is nothing for a root class
+ * name to land on. `viewport` is the strip the toasts are stacked in and
+ * `toast` is one of them.
+ */
+export type ToastSlot = 'viewport' | 'toast' | 'title' | 'description' | 'action' | 'close';
 export interface ToastProviderProps extends Pick<NebaStyleProps, 'variant' | 'size' | 'density'> {
     /** The default colour family. A single toast overrides it in `add`. */
     color?: NebaColor;
@@ -79,6 +89,11 @@ export interface ToastProviderProps extends Pick<NebaStyleProps, 'variant' | 'si
     locale?: string;
     /** Accessible name of every toast's × button. Defaults to the `locale`'s word. */
     closeLabel?: string;
+    /**
+     * Class names for the parts of the stack. There is no `className` here — a
+     * provider renders no element of its own to put one on.
+     */
+    classNames?: NebaSlots<ToastSlot>;
     children?: React.ReactNode;
 }
 /**
@@ -121,4 +136,4 @@ export declare function useToast(): {
  * limit, the swipe, the F6 focus hotkey, and the live region that makes a
  * message that appeared out of nowhere reach a screen reader at all.
  */
-export declare function ToastProvider({ variant, size, color, density, position, timeout, limit, width, locale, closeLabel, children }: ToastProviderProps): React.JSX.Element;
+export declare function ToastProvider(rawProps: ToastProviderProps): React.JSX.Element;

package/dist/components/toast/Toast.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Toast as i}from"@base-ui/react/toast";import{boxPaddingClasses as n}from"../box/Box.js";import{actionMessages as s,useMessages as a}from"../../internal/i18n.js";import{CloseIcon as r,severityIcon as l}from"../../internal/icons.js";import{controlSlots as c,focusRingClasses as d,hasContent as m,iconClasses as u,metaTextClasses as p,radiusClasses as f,sheetBodyClasses as b,sheetHeaderGapClasses as x,sheetSectionGapClasses as v,sheetTitleClasses as h,surfaceClasses as y}from"../../internal/styles.js";const g={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 items-start flex-col-reverse","bottom-center":"bottom-0 items-center flex-col-reverse","bottom-end":"bottom-0 items-end flex-col-reverse"},w={solid:[y,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-solid)]"].join(" "),outline:[y,"border text-(--neba-fg) bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]"].join(" "),text:[y,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]"].join(" ")},j={solid:"",outline:"text-(--n-accent)",text:"text-(--n-accent)"};function N(e){const{color:t,variant:o,icon:i,actionLabel:n,onAction:s,...a}=e;return{...a,data:{color:t,variant:o,icon:i},actionProps:void 0===n?void 0:{children:n,onClick:s}}}export function useToast(){const e=i.useToastManager();return o.useMemo(()=>({add:t=>e.add(N(t)),close:t=>e.close(t),update:(t,o)=>e.update(t,N(o)),promise:(t,o)=>e.promise(t,{loading:N(o.loading),success:e=>N("function"==typeof o.success?o.success(e):o.success),error:e=>N("function"==typeof o.error?o.error(e):o.error)}),toasts:e.toasts}),[e])}function _({toast:o,variant:s,color:a,size:y,density:g,closeLabel:N,swipeDirection:_}){const T=o.data?.variant??s??"outline",z=o.data?.color??a,$=void 0===o.data?.icon?l(z):o.data.icon,k=j[T],D=m(o.title);return t(i.Root,{toast:o,swipeDirection:_,className:["pointer-events-auto flex w-full items-start",n[g??"default"][y],f[y],v[y],b[y],w[T],u,"[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0","data-[limited]:hidden",d,"[outline:none]"].filter(Boolean).join(" "),style:c(z,3,T),children:[m($)?e("span",{className:`flex h-[1lh] shrink-0 items-center ${k}`,children:$}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${x[y]}`,children:[e(i.Title,{className:`neba-title font-semibold ${h[y]} ${k}`}),e(i.Description,{className:D?""+("solid"===T?"":"text-(--neba-muted-fg)"):""})]}),e(i.Action,{className:["flex h-[1lh] shrink-0 cursor-pointer items-center rounded-full px-2","font-medium underline-offset-2",k||"text-(--n-on-solid)","hover:underline","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",p[y]].join(" ")}),e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(i.Close,{"aria-label":N,className:["inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full","opacity-70 [transition:opacity_var(--neba-duration)_var(--neba-ease)]","hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),children:e(r,{})})})]})}function T(t){const{toasts:n}=i.useToastManager(),{position:s,width:a,...r}=t,l=o.useMemo(()=>[s.startsWith("top")?"up":"down","left","right"],[s]);return e(i.Portal,{children:e(i.Viewport,{className:["neba-portal pointer-events-none fixed inset-x-0 z-50 flex flex-col gap-2 p-4",g[s]].join(" "),children:n.map(t=>e("div",{className:"w-full",style:{maxWidth:"number"==typeof a?`${a}px`:a},children:e(_,{toast:t,swipeDirection:l,...r})},t.id))})})}export function ToastProvider({variant:o="outline",size:n="md",color:r="primary",density:l="default",position:c="bottom-end",timeout:d=5e3,limit:m=3,width:u=380,locale:p,closeLabel:f,children:b}){const x=a(s,p);return t(i.Provider,{timeout:d,limit:m,children:[b,e(T,{position:c,variant:o,size:n,color:r,density:l,width:u,closeLabel:f??x.close})]})}
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Toast as s}from"@base-ui/react/toast";import{boxPaddingClasses as i}from"../box/Box.js";import{actionMessages as a,useMessages as n}from"../../internal/i18n.js";import{CloseIcon as r,severityIcon as l}from"../../internal/icons.js";import{controlSlots as c,cx as d,focusRingClasses as m,hasContent as p,iconClasses as u,metaTextClasses as f,radiusClasses as b,sheetBodyClasses as v,sheetHeaderGapClasses as x,sheetSectionGapClasses as h,sheetTitleClasses as y,surfaceClasses as g}from"../../internal/styles.js";import{useStyleDefaults as w}from"../../internal/defaults.js";const N={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 items-start flex-col-reverse","bottom-center":"bottom-0 items-center flex-col-reverse","bottom-end":"bottom-0 items-end flex-col-reverse"},j={solid:[g,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-solid)]"].join(" "),outline:[g,"border text-(--neba-fg) bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]"].join(" "),text:[g,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]"].join(" ")},_={solid:"",outline:"text-(--n-accent)",text:"text-(--n-accent)"};function z(e){const{color:t,variant:o,icon:s,actionLabel:i,onAction:a,...n}=e;return{...n,data:{color:t,variant:o,icon:s},actionProps:void 0===i?void 0:{children:i,onClick:a}}}export function useToast(){const e=s.useToastManager();return o.useMemo(()=>({add:t=>e.add(z(t)),close:t=>e.close(t),update:(t,o)=>e.update(t,z(o)),promise:(t,o)=>e.promise(t,{loading:z(o.loading),success:e=>z("function"==typeof o.success?o.success(e):o.success),error:e=>z("function"==typeof o.error?o.error(e):o.error)}),toasts:e.toasts}),[e])}function T({toast:o,variant:a,color:n,size:g,density:w,closeLabel:N,swipeDirection:z,classNames:T}){const k=o.data?.variant??a??"outline",D=o.data?.color??n,L=void 0===o.data?.icon?l(D):o.data.icon,M=_[k],P=p(o.title);return t(s.Root,{toast:o,swipeDirection:z,className:d("pointer-events-auto flex w-full items-start",i[w??"default"][g],b[g],h[g],v[g],j[k],u,"[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0","data-[limited]:hidden",m,"[outline:none]",T?.toast),style:c(D,3,k),children:[p(L)?e("span",{className:`flex h-[1lh] shrink-0 items-center ${M}`,children:L}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${x[g]}`,children:[e(s.Title,{className:d("neba-title font-semibold",y[g],M,T?.title)}),e(s.Description,{className:d(P&&"solid"!==k?"text-(--neba-muted-fg)":"",T?.description)})]}),e(s.Action,{className:d("flex h-[1lh] shrink-0 cursor-pointer items-center rounded-full px-2","font-medium underline-offset-2",M||"text-(--n-on-solid)","hover:underline","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",f[g],T?.action)}),e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(s.Close,{"aria-label":N,className:d("inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full","opacity-70 [transition:opacity_var(--neba-duration)_var(--neba-ease)]","hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",T?.close),children:e(r,{})})})]})}function k(t){const{toasts:i}=s.useToastManager(),{position:a,width:n,classNames:r,...l}=t,c=o.useMemo(()=>[a.startsWith("top")?"up":"down","left","right"],[a]);return e(s.Portal,{children:e(s.Viewport,{className:d("neba-portal pointer-events-none fixed inset-x-0 z-50 flex flex-col gap-2 p-4",N[a],r?.viewport),children:i.map(t=>e("div",{className:"w-full",style:{maxWidth:"number"==typeof n?`${n}px`:n},children:e(T,{toast:t,swipeDirection:c,classNames:r,...l})},t.id))})})}export function ToastProvider(o){const{variant:i="outline",size:r="md",color:l="primary",density:c="default",position:d="bottom-end",timeout:m=5e3,limit:p=3,width:u=380,locale:f,closeLabel:b,classNames:v,children:x}=w(o,["size","density","variant","locale"]),h=n(a,f);return t(s.Provider,{timeout:m,limit:p,children:[x,e(k,{position:d,variant:i,size:r,color:l,density:c,width:u,closeLabel:b??h.close,classNames:v})]})}

package/dist/components/toggle/Toggle.js

@@ -1 +1 @@
-"use client";import{jsxs as e}from"react/jsx-runtime";import*as n from"react";import{Toggle as t}from"@base-ui/react/toggle";import{ButtonGroupContext as o}from"../../internal/button-group.js";import{controlHeightClasses as r,controlSlots as s,controlSquareClasses as a,controlTextClasses as l,cx as i,disabledClasses as v,focusRingClasses as d,gapClasses as g,iconClasses as b,paddingXClasses as p,pressTransitionClasses as x,radiusClasses as c,surfaceClasses as f,transitionClasses as m}from"../../internal/styles.js";const h={xs:`${r.xs} ${g.xs} ${c.xs} ${l.xs}`,sm:`${r.sm} ${g.sm} ${c.sm} ${l.sm}`,md:`${r.md} ${g.md} ${c.md} ${l.md}`,lg:`${r.lg} ${g.lg} ${c.lg} ${l.lg}`,xl:`${r.xl} ${g.xl} ${c.xl} ${l.xl}`},u={xs:`${a.xs} px-0`,sm:`${a.sm} px-0`,md:`${a.md} px-0`,lg:`${a.lg} px-0`,xl:`${a.xl} px-0`},$=["relative inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap align-middle font-medium leading-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",m,x,d,b].join(" "),j={solid:[f,"text-(--neba-muted-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]","hover:bg-(--n-panel-press) hover:text-(--neba-fg)","active:bg-(--n-panel-press)"].join(" "),outline:[f,"border text-(--neba-muted-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]","hover:bg-(--n-panel-hover) hover:text-(--neba-fg) hover:[border-color:var(--n-line-hover)]","active:bg-(--n-panel-press)"].join(" "),text:["text-(--neba-muted-fg) bg-transparent","hover:bg-(--n-soft) hover:text-(--neba-fg)","active:bg-(--n-soft-hover)"].join(" ")},y={solid:[f,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]","hover:bg-(--n-fill-hover)","active:bg-(--n-fill-active)"].join(" "),outline:[f,"border text-(--n-accent) bg-(--n-soft)","[border-color:var(--n-line-hover)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]","hover:bg-(--n-soft-hover)","active:bg-(--n-soft-press)"].join(" "),text:["text-(--n-accent) bg-(--n-soft)","hover:bg-(--n-soft-hover)","active:bg-(--n-soft-press)"].join(" ")};export const Toggle=/*@__PURE__*/n.forwardRef(function({variant:r,size:a,color:l,density:d,elevation:g,pressed:b,defaultPressed:x,onPressedChange:c,value:f,startIcon:m,endIcon:w,fullWidth:P=!1,disabled:C,className:T,style:k,children:z,onPointerMove:E,...I},M){const N=n.useContext(o),R=r??N?.variant??"outline",W=a??N?.size??"md",X=l??N?.color??"primary",Y=d??N?.density??"default",q=g??N?.elevation??0,A=C??N?.disabled??!1,B=null==z||!1===z;return e(t,{ref:M,value:f,pressed:b,defaultPressed:x,onPressedChange:e=>c?.(e),disabled:A,className:e=>i($,h[W],B?u[W]:p[Y][W],A?v[R]:e.pressed?y[R]:j[R],A?"":"neba-glow",P?"w-full":"",T??""),style:{...s(X,q,R),...k},onPointerMove:e=>{if(!A){const n=e.currentTarget;n.style.setProperty("--n-mx",`${e.nativeEvent.offsetX}px`),n.style.setProperty("--n-my",`${e.nativeEvent.offsetY}px`)}E?.(e)},...I,children:[m,z,w]})});
+"use client";import{jsxs as e}from"react/jsx-runtime";import*as t from"react";import{Toggle as n}from"@base-ui/react/toggle";import{ButtonGroupContext as o}from"../../internal/button-group.js";import{controlHeightClasses as r,controlSlots as s,controlSquareClasses as a,controlTextClasses as l,cx as i,disabledClasses as d,focusRingClasses as v,gapClasses as g,iconClasses as b,paddingXClasses as p,pressTransitionClasses as x,radiusClasses as f,surfaceClasses as m,transitionClasses as c}from"../../internal/styles.js";import{useStyleDefaults as h}from"../../internal/defaults.js";const u={xs:`${r.xs} ${g.xs} ${f.xs} ${l.xs}`,sm:`${r.sm} ${g.sm} ${f.sm} ${l.sm}`,md:`${r.md} ${g.md} ${f.md} ${l.md}`,lg:`${r.lg} ${g.lg} ${f.lg} ${l.lg}`,xl:`${r.xl} ${g.xl} ${f.xl} ${l.xl}`},$={xs:`${a.xs} px-0`,sm:`${a.sm} px-0`,md:`${a.md} px-0`,lg:`${a.lg} px-0`,xl:`${a.xl} px-0`},j=["relative inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap align-middle font-medium leading-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",c,x,v,b].join(" "),y={solid:[m,"text-(--neba-muted-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]","hover:bg-(--n-panel-press) hover:text-(--neba-fg)","active:bg-(--n-panel-press)"].join(" "),outline:[m,"border text-(--neba-muted-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]","hover:bg-(--n-panel-hover) hover:text-(--neba-fg) hover:[border-color:var(--n-line-hover)]","active:bg-(--n-panel-press)"].join(" "),text:["text-(--neba-muted-fg) bg-transparent","hover:bg-(--n-soft) hover:text-(--neba-fg)","active:bg-(--n-soft-hover)"].join(" ")},w={solid:[m,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]","hover:bg-(--n-fill-hover)","active:bg-(--n-fill-active)"].join(" "),outline:[m,"border text-(--n-accent) bg-(--n-soft)","[border-color:var(--n-line-hover)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]","hover:bg-(--n-soft-hover)","active:bg-(--n-soft-press)"].join(" "),text:["text-(--n-accent) bg-(--n-soft)","hover:bg-(--n-soft-hover)","active:bg-(--n-soft-press)"].join(" ")};export const Toggle=/*@__PURE__*/t.forwardRef(function(r,a){const{variant:l,size:v,color:g,density:b,elevation:x,pressed:f,defaultPressed:m,onPressedChange:c,value:P,startIcon:z,endIcon:C,fullWidth:T=!1,disabled:k,className:E,style:I,children:M,onPointerMove:N,...R}=h(r,["size","density","variant"]),W=t.useContext(o),X=l??W?.variant??"outline",Y=v??W?.size??"md",q=g??W?.color??"primary",A=b??W?.density??"default",B=x??W?.elevation??0,D=k??W?.disabled??!1,F=null==M||!1===M;return e(n,{ref:a,value:P,pressed:f,defaultPressed:m,onPressedChange:e=>c?.(e),disabled:D,className:e=>i(j,u[Y],F?$[Y]:p[A][Y],D?d[X]:e.pressed?w[X]:y[X],D?"":"neba-glow",T?"w-full":"",E??""),style:{...s(q,B,X),...I},onPointerMove:e=>{if(!D){const t=e.currentTarget;t.style.setProperty("--n-mx",`${e.nativeEvent.offsetX}px`),t.style.setProperty("--n-my",`${e.nativeEvent.offsetY}px`)}N?.(e)},...R,children:[z,M,C]})});

package/dist/components/toggle-group/ToggleGroup.js

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import*as o from"react";import{ToggleGroup as l}from"@base-ui/react/toggle-group";import{ButtonGroupContext as i}from"../../internal/button-group.js";import{cx as t}from"../../internal/styles.js";const n={horizontal:"[&>*:not(:first-child)]:rounded-s-none [&>*:not(:last-child)]:rounded-e-none",vertical:"[&>*:not(:first-child)]:rounded-t-none [&>*:not(:last-child)]:rounded-b-none"},r={horizontal:"[&>*:not(:first-child)]:-ms-px",vertical:"[&>*:not(:first-child)]:-mt-px"},a=["inline-flex align-middle","[&>*]:relative [&>*:hover]:z-10 [&>*:focus-visible]:z-10","[&>*]:shrink-0"].join(" ");export const ToggleGroup=/*@__PURE__*/o.forwardRef(function({variant:s,size:u,color:d,density:c,elevation:f,value:m,defaultValue:h,onValueChange:p,multiple:v=!1,orientation:g="horizontal",disabled:x,loopFocus:b=!0,fullWidth:z=!1,className:j,children:V,...w},y){const C=o.useMemo(()=>({variant:s,size:u,color:d,density:c,elevation:f,disabled:x}),[s,u,d,c,f,x]);return e(i.Provider,{value:C,children:e(l,{ref:y,value:m,defaultValue:h,onValueChange:e=>p?.(e),multiple:v,orientation:g,disabled:x,loopFocus:b,className:t(a,"vertical"===g?"flex-col":"flex-row",n[g],"outline"===(s??"outline")?r[g]:"",z?"flex w-full [&>*]:flex-1":"",j??""),...w,children:V})})});
+"use client";import{jsx as e}from"react/jsx-runtime";import*as o from"react";import{ToggleGroup as l}from"@base-ui/react/toggle-group";import{ButtonGroupContext as i}from"../../internal/button-group.js";import{cx as t}from"../../internal/styles.js";import{useStyleDefaults as n}from"../../internal/defaults.js";const r={horizontal:"[&>*:not(:first-child)]:rounded-s-none [&>*:not(:last-child)]:rounded-e-none",vertical:"[&>*:not(:first-child)]:rounded-t-none [&>*:not(:last-child)]:rounded-b-none"},a={horizontal:"[&>*:not(:first-child)]:-ms-px",vertical:"[&>*:not(:first-child)]:-mt-px"},s=["inline-flex align-middle","[&>*]:relative [&>*:hover]:z-10 [&>*:focus-visible]:z-10","[&>*]:shrink-0"].join(" ");export const ToggleGroup=/*@__PURE__*/o.forwardRef(function(d,u){const{variant:c,size:f,color:m,density:h,elevation:p,value:v,defaultValue:g,onValueChange:x,multiple:z=!1,orientation:b="horizontal",disabled:j,loopFocus:y=!0,fullWidth:V=!1,className:w,children:C,...F}=n(d,["size","density","variant"]),G=o.useMemo(()=>({variant:c,size:f,color:m,density:h,elevation:p,disabled:j}),[c,f,m,h,p,j]);return e(i.Provider,{value:G,children:e(l,{ref:u,value:v,defaultValue:g,onValueChange:e=>x?.(e),multiple:z,orientation:b,disabled:j,loopFocus:y,className:t(s,"vertical"===b?"flex-col":"flex-row",r[b],"outline"===(c??"outline")?a[b]:"",V?"flex w-full [&>*]:flex-1":"",w??""),...F,children:C})})});

package/dist/components/toolbar/Toolbar.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as o from"react";import{useRender as n}from"@base-ui/react/use-render";import{boxPaddingXClasses as i,boxPaddingYClasses as s}from"../box/Box.js";import{cx as a,hasContent as l,radiusClasses as c,sheetSectionGapClasses as d,surfaceClasses as m,surfaceSlots as b,transitionClasses as p}from"../../internal/styles.js";const f={solid:[m,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[m,"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"},x={static:{top:"",bottom:""},sticky:{top:"sticky top-0 z-20",bottom:"sticky bottom-0 z-20"},fixed:{top:"fixed inset-x-0 top-0 z-30",bottom:"fixed inset-x-0 bottom-0 z-30"}},v={top:"border-b [border-color:var(--n-line)]",bottom:"border-t [border-color:var(--n-line)]"};export const Toolbar=/*@__PURE__*/o.forwardRef(function({variant:o="outline",size:m="md",color:u="primary",density:g="default",elevation:h=0,position:w="static",side:y="top",divider:j=!1,start:k,end:z,render:N,className:B,style:F,children:R,...T},q){const A=a("flex w-full min-w-0 items-center",i[g][m],s[g][m],d[m],"static"===w?c[m]:"",f[o],j?v[y]:"",x[w][y],p,B??"");return n({render:N,ref:q,props:{className:A,style:{...b(u,h),...F},children:r(t,{children:[l(k)?e("div",{className:"flex min-w-0 shrink-0 items-center gap-2",children:k}):null,e("div",{className:"flex min-w-0 flex-1 items-center gap-2",children:R}),l(z)?e("div",{className:"flex min-w-0 shrink-0 items-center gap-2",children:z}):null]}),...T}})});
+"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as o from"react";import{useRender as n}from"@base-ui/react/use-render";import{boxPaddingXClasses as i,boxPaddingYClasses as s}from"../box/Box.js";import{cx as a,hasContent as l,radiusClasses as d,sheetSectionGapClasses as m,surfaceClasses as c,surfaceSlots as b,transitionClasses as p}from"../../internal/styles.js";import{useStyleDefaults as f}from"../../internal/defaults.js";const x={solid:[c,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[c,"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"},v={static:{top:"",bottom:""},sticky:{top:"sticky top-0 z-20",bottom:"sticky bottom-0 z-20"},fixed:{top:"fixed inset-x-0 top-0 z-30",bottom:"fixed inset-x-0 bottom-0 z-30"}},u={top:"border-b [border-color:var(--n-line)]",bottom:"border-t [border-color:var(--n-line)]"};export const Toolbar=/*@__PURE__*/o.forwardRef(function(o,c){const{variant:g="outline",size:h="md",color:y="primary",density:j="default",elevation:w=0,position:z="static",side:k="top",divider:N=!1,start:B,end:F,render:R,className:T,style:q,children:A,...C}=f(o,["size","density","variant"]),D=a("flex w-full min-w-0 items-center",i[j][h],s[j][h],m[h],"static"===z?d[h]:"",x[g],N?u[k]:"",v[z][k],p,T??"");return n({render:R,ref:c,props:{className:D,style:{...b(y,w),...q},children:r(t,{children:[l(B)?e("div",{className:"flex min-w-0 shrink-0 items-center gap-2",children:B}):null,e("div",{className:"flex min-w-0 flex-1 items-center gap-2",children:A}),l(F)?e("div",{className:"flex min-w-0 shrink-0 items-center gap-2",children:F}):null]}),...C}})});

package/dist/components/tooltip/Tooltip.d.ts

@@ -76,4 +76,4 @@ export type TooltipProviderProps = React.ComponentProps<typeof BaseUITooltip.Pro
  * this component wires both, and drops the reference while it is closed rather
  * than pointing at an element that is not in the document.
  */
-export declare function Tooltip({ content, children, size, color, density, side, align, sideOffset, delay, closeDelay, arrow, open, defaultOpen, onOpenChange, disabled, className, style, ...props }: TooltipProps): React.JSX.Element;
+export declare function Tooltip(rawProps: TooltipProps): React.JSX.Element;

package/dist/components/tooltip/Tooltip.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{Tooltip as o}from"@base-ui/react/tooltip";import{controlSlots as i,cx as s,metaTextClasses as n,paddingXClasses as l,radiusClasses as r,surfaceClasses as d}from"../../internal/styles.js";export const TooltipProvider=o.Provider;const p=[d,"max-w-64 text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-solid)]","[outline:none]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0","data-[instant]:[transition-duration:0ms]"].join(" "),c={xs:"py-0.5",sm:"py-0.5",md:"py-1",lg:"py-1.5",xl:"py-2"},m={xs:6,sm:7,md:8,lg:9,xl:10};export function Tooltip({content:d,children:h,size:y="sm",color:f="secondary",density:u="default",side:x="top",align:b="center",sideOffset:g=6,delay:v,closeDelay:w,arrow:j=!0,open:O,defaultOpen:N,onOpenChange:P,disabled:T=!1,className:z,style:C,...D}){const _=m[y],k=a.useId(),[A,B]=a.useState(N??!1),I=O??A;return t(o.Root,{open:O,defaultOpen:N,onOpenChange:e=>{void 0===O&&B(e),P?.(e)},children:[e(o.Trigger,{render:h,delay:v,closeDelay:w,disabled:T,"aria-describedby":I?k:void 0}),e(o.Portal,{children:e(o.Positioner,{className:"neba-portal z-50 [outline:none]",side:x,align:b,sideOffset:g,children:t(o.Popup,{id:k,role:"tooltip",className:s(p,r[y],l[u][y],c[y],n[y],z??""),style:{...i(f,3,"solid"),...C},...D,children:[j?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:e("svg",{width:_,height:_/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:e("path",{d:"M0 0h10L5 5z",fill:"var(--n-fill)"})})}):null,d]})})})]})}
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{Tooltip as o}from"@base-ui/react/tooltip";import{controlSlots as i,cx as s,metaTextClasses as n,paddingXClasses as r,radiusClasses as l,surfaceClasses as d}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";export const TooltipProvider=o.Provider;const c=[d,"max-w-64 text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-solid)]","[outline:none]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0","data-[instant]:[transition-duration:0ms]"].join(" "),m={xs:"py-0.5",sm:"py-0.5",md:"py-1",lg:"py-1.5",xl:"py-2"},y={xs:6,sm:7,md:8,lg:9,xl:10};export function Tooltip(d){const{content:f,children:h,size:u="sm",color:x="secondary",density:b="default",side:g="top",align:v="center",sideOffset:j=6,delay:w,closeDelay:O,arrow:N=!0,open:P,defaultOpen:z,onOpenChange:T,disabled:C=!1,className:D,style:_,...k}=p(d,["size","density"]),A=y[u],B=a.useId(),[I,L]=a.useState(z??!1),M=P??I;return t(o.Root,{open:P,defaultOpen:z,onOpenChange:e=>{void 0===P&&L(e),T?.(e)},children:[e(o.Trigger,{render:h,delay:w,closeDelay:O,disabled:C,"aria-describedby":M?B:void 0}),e(o.Portal,{children:e(o.Positioner,{className:"neba-portal z-50 [outline:none]",side:g,align:v,sideOffset:j,children:t(o.Popup,{id:B,role:"tooltip",className:s(c,l[u],r[b][u],m[u],n[u],D??""),style:{...i(x,3,"solid"),..._},...k,children:[N?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:e("svg",{width:A,height:A/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:e("path",{d:"M0 0h10L5 5z",fill:"var(--n-fill)"})})}):null,f]})})})]})}

package/dist/components/tour/Tour.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaAlign, NebaSide, NebaStyleProps } from '../../types.js';
+import type { NebaAlign, NebaSide, NebaSlots, NebaStyleProps } from '../../types.js';
 /** One stop on the tour. */
 export interface TourStep {
     /**
@@ -23,6 +23,14 @@ export interface TourStep {
      */
     padding?: number;
 }
+/**
+ * The parts a Tour draws around its card.
+ *
+ * `className` is the card — the popup the steps are written on — and `mask` is
+ * the dimming behind it, which is a sibling of the popup rather than a
+ * descendant and so has no other way in.
+ */
+export type TourSlot = 'mask' | 'title' | 'description' | 'close' | 'footer';
 export interface TourProps extends Pick<NebaStyleProps, 'size' | 'color' | 'density'> {
     /** The stops, in order. */
     steps: readonly TourStep[];
@@ -63,6 +71,13 @@ export interface TourProps extends Pick<NebaStyleProps, 'size' | 'color' | 'dens
     doneLabel?: React.ReactNode;
     /** The Skip button. */
     skipLabel?: React.ReactNode;
+    /** Class names for the card. */
+    className?: string;
+    /**
+     * Class names for the parts around it. `className` is the card, so the
+     * dimming behind it is `classNames.mask`.
+     */
+    classNames?: NebaSlots<TourSlot>;
 }
 /**
  * A guided walk over a page that already exists — the three things a new reader
@@ -79,4 +94,4 @@ export interface TourProps extends Pick<NebaStyleProps, 'size' | 'color' | 'dens
  * pointed at while the card is up, which is the difference between a tour and a
  * sequence of dialogs.
  */
-export declare function Tour({ steps, open, defaultOpen, onOpenChange, step, defaultStep, onStepChange, onFinish, mask, skippable, dismissible, scrollIntoView, locale, previousLabel, nextLabel, doneLabel, skipLabel, size, color, density }: TourProps): React.JSX.Element | null;
+export declare function Tour(rawProps: TourProps): React.JSX.Element | null;

package/dist/components/tour/Tour.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Popover as i}from"@base-ui/react/popover";import{Button as o}from"../button/Button.js";import{boxPaddingXClasses as s,boxPaddingYClasses as r}from"../box/Box.js";import{actionMessages as a,fill as l,stepsMessages as c,useMessages as d}from"../../internal/i18n.js";import{CloseIcon as m}from"../../internal/icons.js";import{observeResize as u}from"../../internal/observe.js";import{hasContent as p,metaTextClasses as f,radiusClasses as h,sheetBodyClasses as g,sheetHeaderGapClasses as b,sheetSectionGapClasses as v,sheetTitleClasses as x,surfaceClasses as w,surfaceSlots as y}from"../../internal/styles.js";const k=[w,"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]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),_={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},j={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"};function N({spot:t,radius:n}){return e("div",null===t?{"aria-hidden":"true",className:"pointer-events-none fixed inset-0 z-40 bg-(--neba-scrim)"}:{"aria-hidden":"true",className:"pointer-events-none fixed z-40 [box-shadow:0_0_0_9999px_var(--neba-scrim)]",style:{top:t.top,left:t.left,width:t.width,height:t.height,borderRadius:n}})}export function Tour({steps:w,open:z,defaultOpen:L=!1,onOpenChange:S,step:C,defaultStep:E=0,onStepChange:P,onFinish:O,mask:q=!0,skippable:B=!0,dismissible:F=!0,scrollIntoView:M=!0,locale:R,previousLabel:T,nextLabel:$,doneLabel:A,skipLabel:I,size:V="md",color:D="primary",density:H="default"}){const G=d(c,R),J=d(a,R),[K,Q]=n.useState(L),[U,W]=n.useState(E),X=z??K,Y=Math.min(C??U,Math.max(0,w.length-1)),Z=w[Y],[ee,te]=n.useState(null),ne=e=>{void 0===z&&Q(e),S?.(e)},ie=e=>{void 0===C&&W(e),P?.(e)};if(n.useEffect(()=>{const e=Z?.target;if(!X||!e)return;const t=document.querySelector(e);if(!(t instanceof HTMLElement))return;M&&t.scrollIntoView({block:"center",inline:"nearest",behavior:"smooth"});const n=Z?.padding??6;let i=0;const o=()=>{i=0;const o=t.getBoundingClientRect();te({selector:e,spot:{top:o.top-n,left:o.left-n,width:o.width+2*n,height:o.height+2*n}})},s=()=>{0===i&&(i=requestAnimationFrame(o))};o();const r=u(t,s);return window.addEventListener("scroll",s,{passive:!0,capture:!0}),window.addEventListener("resize",s,{passive:!0}),()=>{0!==i&&cancelAnimationFrame(i),r(),window.removeEventListener("scroll",s,!0),window.removeEventListener("resize",s)}},[X,Z?.target,Z?.padding,M]),0===w.length)return null;const oe=X&&Z?.target&&ee?.selector===Z.target?ee.spot:null,se=0===Y,re=Y===w.length-1,ae=s[H][V],le=r[H][V],ce=j[V],de=p(Z?.title)||p(Z?.content);return t(i.Root,{open:X,onOpenChange:(e,t)=>{(e||F||"escape-key"!==t.reason)&&(e||"outside-press"!==t.reason&&"focus-out"!==t.reason)?ne(e):t.cancel()},children:[X&&q?e(N,{spot:oe,radius:oe?8:0}):null,e(i.Portal,{children:e(i.Positioner,{className:"neba-portal z-50 [outline:none]",side:Z?.side??"bottom",align:Z?.align??"center",sideOffset:10,collisionPadding:12,anchor:()=>{if(!Z?.target)return null;const e=document.querySelector(Z.target);return e instanceof Element?e:null},children:t(i.Popup,{className:[k,h[V],g[V],v[V],_[V],ae,le].join(" "),style:y(D,3),children:[de?t("div",{className:"flex items-start gap-3",children:[t("div",{className:`flex min-w-0 flex-1 flex-col ${b[V]}`,children:[p(Z?.title)?e(i.Title,{className:`m-0 font-semibold ${x[V]}`,children:Z?.title}):null,p(Z?.content)?e(i.Description,{className:"m-0 min-w-0",children:Z?.content}):null]}),F?e("button",{type:"button","aria-label":J.close,onClick:()=>ne(!1),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(m,{})}):null]}):null,t("div",{className:"flex items-center gap-2",children:[e("span",{className:`shrink-0 tabular-nums text-(--neba-muted-fg) ${f[V]}`,children:l(G.position,{index:String(Y+1),total:String(w.length)})}),t("div",{className:"ms-auto flex items-center gap-2",children:[B&&!re?e(o,{size:ce,variant:"text",color:"secondary",onClick:()=>ne(!1),children:I??G.skip}):null,se?null:e(o,{size:ce,variant:"outline",color:D,onClick:()=>ie(Y-1),children:T??G.previous}),e(o,{size:ce,color:D,onClick:()=>re?(O?.(),void ne(!1)):ie(Y+1),children:re?A??G.done:$??G.next})]})]})]})})})]})}
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Popover as s}from"@base-ui/react/popover";import{Button as i}from"../button/Button.js";import{boxPaddingXClasses as o,boxPaddingYClasses as a}from"../box/Box.js";import{actionMessages as r,fill as l,stepsMessages as c,useMessages as d}from"../../internal/i18n.js";import{CloseIcon as m}from"../../internal/icons.js";import{observeResize as u}from"../../internal/observe.js";import{cx as p,hasContent as f,metaTextClasses as h,radiusClasses as g,sheetBodyClasses as b,sheetHeaderGapClasses as v,sheetSectionGapClasses as x,sheetTitleClasses as w,surfaceClasses as y,surfaceSlots as N}from"../../internal/styles.js";import{useStyleDefaults as k}from"../../internal/defaults.js";const _=[y,"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]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),j={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},z={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"};function L({spot:t,radius:n,className:s}){return e("div",null===t?{"aria-hidden":"true",className:p("pointer-events-none fixed inset-0 z-40 bg-(--neba-scrim)",s)}:{"aria-hidden":"true",className:p("pointer-events-none fixed z-40 [box-shadow:0_0_0_9999px_var(--neba-scrim)]",s),style:{top:t.top,left:t.left,width:t.width,height:t.height,borderRadius:n}})}export function Tour(y){const{steps:S,open:C,defaultOpen:E=!1,onOpenChange:P,step:O,defaultStep:q=0,onStepChange:B,onFinish:F,mask:M=!0,skippable:R=!0,dismissible:T=!0,scrollIntoView:A=!0,locale:I,previousLabel:V,nextLabel:$,doneLabel:D,skipLabel:H,size:G="md",color:J="primary",density:K="default",className:Q,classNames:U}=k(y,["size","density","locale"]),W=d(c,I),X=d(r,I),[Y,Z]=n.useState(E),[ee,te]=n.useState(q),ne=C??Y,se=Math.min(O??ee,Math.max(0,S.length-1)),ie=S[se],[oe,ae]=n.useState(null),re=e=>{void 0===C&&Z(e),P?.(e)},le=e=>{void 0===O&&te(e),B?.(e)};if(n.useEffect(()=>{const e=ie?.target;if(!ne||!e)return;const t=document.querySelector(e);if(!(t instanceof HTMLElement))return;A&&t.scrollIntoView({block:"center",inline:"nearest",behavior:"smooth"});const n=ie?.padding??6;let s=0;const i=()=>{s=0;const i=t.getBoundingClientRect();ae({selector:e,spot:{top:i.top-n,left:i.left-n,width:i.width+2*n,height:i.height+2*n}})},o=()=>{0===s&&(s=requestAnimationFrame(i))};i();const a=u(t,o);return window.addEventListener("scroll",o,{passive:!0,capture:!0}),window.addEventListener("resize",o,{passive:!0}),()=>{0!==s&&cancelAnimationFrame(s),a(),window.removeEventListener("scroll",o,!0),window.removeEventListener("resize",o)}},[ne,ie?.target,ie?.padding,A]),0===S.length)return null;const ce=ne&&ie?.target&&oe?.selector===ie.target?oe.spot:null,de=0===se,me=se===S.length-1,ue=o[K][G],pe=a[K][G],fe=z[G],he=f(ie?.title)||f(ie?.content);return t(s.Root,{open:ne,onOpenChange:(e,t)=>{(e||T||"escape-key"!==t.reason)&&(e||"outside-press"!==t.reason&&"focus-out"!==t.reason)?re(e):t.cancel()},children:[ne&&M?e(L,{spot:ce,radius:ce?8:0,className:U?.mask}):null,e(s.Portal,{children:e(s.Positioner,{className:"neba-portal z-50 [outline:none]",side:ie?.side??"bottom",align:ie?.align??"center",sideOffset:10,collisionPadding:12,anchor:()=>{if(!ie?.target)return null;const e=document.querySelector(ie.target);return e instanceof Element?e:null},children:t(s.Popup,{className:p(_,g[G],b[G],x[G],j[G],ue,pe,Q),style:N(J,3),children:[he?t("div",{className:"flex items-start gap-3",children:[t("div",{className:`flex min-w-0 flex-1 flex-col ${v[G]}`,children:[f(ie?.title)?e(s.Title,{className:p("m-0 font-semibold",w[G],U?.title),children:ie?.title}):null,f(ie?.content)?e(s.Description,{className:p("m-0 min-w-0",U?.description),children:ie?.content}):null]}),T?e("button",{type:"button","aria-label":X.close,onClick:()=>re(!1),className:p("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",U?.close),children:e(m,{})}):null]}):null,t("div",{className:p("flex items-center gap-2",U?.footer),children:[e("span",{className:`shrink-0 tabular-nums text-(--neba-muted-fg) ${h[G]}`,children:l(W.position,{index:String(se+1),total:String(S.length)})}),t("div",{className:"ms-auto flex items-center gap-2",children:[R&&!me?e(i,{size:fe,variant:"text",color:"secondary",onClick:()=>re(!1),children:H??W.skip}):null,de?null:e(i,{size:fe,variant:"outline",color:J,onClick:()=>le(se-1),children:V??W.previous}),e(i,{size:fe,color:J,onClick:()=>me?(F?.(),void re(!1)):le(se+1),children:me?D??W.done:$??W.next})]})]})]})})})]})}

package/dist/components/transfer/Transfer.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{Checkbox as t}from"../checkbox/Checkbox.js";import{IconButton as s}from"../icon-button/IconButton.js";import{ScrollArea as r}from"../scroll-area/ScrollArea.js";import{TextField as i}from"../text-field/TextField.js";import{transferMessages as n,useMessages as o}from"../../internal/i18n.js";import{ArrowRightIcon as c}from"../../internal/icons.js";import{searchText as d}from"../../internal/search.js";import{cx as h,fieldRestClasses as m,hasContent as u,metaTextClasses as f,paddingXClasses as b,radiusClasses as p,surfaceSlots as g,toLength as v}from"../../internal/styles.js";const x={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},y={xs:"py-0.5",sm:"py-1",md:"py-1",lg:"py-1.5",xl:"py-2"};function k({title:a,rows:s,ticked:n,onTick:o,onTickAll:c,search:d,onSearch:h,searchable:u,disabled:v,height:k,emptyMessage:S,searchLabel:w,selectAllLabel:j,style:N}){const{size:$,variant:z="outline",color:A="primary",density:C="default"}=N,T=s.filter(e=>!e.disabled),L=T.filter(e=>n.has(e.value)),M=T.length>0&&L.length===T.length,V=L.length>0&&!M,_=b[C][$];return l("div",{className:["flex min-w-0 flex-col overflow-hidden",m[z],p[$]].join(" "),style:g(A,0),children:[l("div",{className:`flex items-center gap-2 border-b [border-color:var(--neba-border)] ${_} ${x[$]}`,children:[e(t,{size:$,color:A,checked:M,indeterminate:V,disabled:v||0===T.length,"aria-label":j,onCheckedChange:e=>c(!0===e)}),e("span",{className:`min-w-0 flex-1 truncate font-medium ${f[$]}`,children:a}),l("span",{className:`shrink-0 tabular-nums text-(--neba-muted-fg) ${f[$]}`,children:[L.length,"/",s.length]})]}),u?e("div",{className:`${_} ${x[$]}`,children:e(i,{size:$,color:A,density:C,fullWidth:!0,variant:"text",disabled:v,placeholder:w,"aria-label":w,value:d,onChange:e=>h(e.target.value)})}):null,e(r,{size:$,color:A,height:k,fade:!0,children:e("div",{className:`flex flex-col ${_} ${x[$]}`,children:0===s.length?e("span",{className:`text-(--neba-muted-fg) ${f[$]} ${y[$]}`,children:S}):s.map(l=>e(t,{size:$,color:A,className:y[$],label:l.label,checked:n.has(l.value),disabled:v||l.disabled,onCheckedChange:e=>o(l.value,!0===e)},l.value))})})]})}function S(e,l){const a=d(l);return""===a?e:e.filter(e=>"string"!=typeof e.label||d(e.label).includes(a))}export const Transfer=/*@__PURE__*/a.forwardRef(function({items:t,value:r,defaultValue:i,onValueChange:d,sourceLabel:m,targetLabel:f,searchable:b=!1,height:p=220,disabled:g=!1,locale:x,variant:y="outline",size:w="md",color:j="primary",density:N="default",className:$,...z},A){const C=o(n,x),[T,L]=a.useState(i??[]),M=r??T,[V,_]=a.useState(()=>new Set),[B,F]=a.useState(""),[I,R]=a.useState(""),W=a.useMemo(()=>new Set(M),[M]),q=a.useMemo(()=>t.filter(e=>!W.has(e.value)),[t,W]),D=a.useMemo(()=>t.filter(e=>W.has(e.value)),[t,W]),E=(e,l)=>{_(a=>{const t=new Set(a);return l?t.add(e):t.delete(e),t})},G=(e,l)=>{_(a=>{const t=new Set(a);for(const a of e)a.disabled||(l?t.add(a.value):t.delete(a.value));return t})},H=(e,l)=>{const a=e.filter(e=>!e.disabled&&V.has(e.value));if(0===a.length)return;const s=new Set(a.map(e=>e.value)),i=l?t.filter(e=>W.has(e.value)||s.has(e.value)).map(e=>e.value):M.filter(e=>!s.has(e));_(e=>new Set([...e].filter(e=>!s.has(e)))),(e=>{void 0===r&&L(e),d?.(e)})(i)},J=S(q,B),K=S(D,I),O=J.some(e=>!e.disabled&&V.has(e.value)),P=K.some(e=>!e.disabled&&V.has(e.value)),Q=v(p),U={variant:y,size:w,color:j,density:N};return l("div",{ref:A,className:h("grid w-full items-center gap-3","[grid-template-columns:minmax(0,1fr)_auto_minmax(0,1fr)]",$??""),...z,children:[e(k,{title:u(m)?m:C.source,rows:J,ticked:V,onTick:E,onTickAll:e=>G(J,e),search:B,onSearch:F,searchable:b,disabled:g,height:Q,emptyMessage:C.empty,searchLabel:C.search,selectAllLabel:C.selectAll,style:U}),l("div",{className:"flex flex-col gap-2",children:[e(s,{size:w,color:j,variant:"text"===y?"text":"outline",label:C.toTarget,disabled:g||!O,onClick:()=>H(J,!0),icon:e(c,{})}),e(s,{size:w,color:j,variant:"text"===y?"text":"outline",label:C.toSource,disabled:g||!P,onClick:()=>H(K,!1),icon:e("span",{className:"flex rotate-180",children:e(c,{})})})]}),e(k,{title:u(f)?f:C.target,rows:K,ticked:V,onTick:E,onTickAll:e=>G(K,e),search:I,onSearch:R,searchable:b,disabled:g,height:Q,emptyMessage:C.empty,searchLabel:C.search,selectAllLabel:C.selectAll,style:U})]})});
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{Checkbox as t}from"../checkbox/Checkbox.js";import{IconButton as s}from"../icon-button/IconButton.js";import{ScrollArea as r}from"../scroll-area/ScrollArea.js";import{TextField as i}from"../text-field/TextField.js";import{transferMessages as n,useMessages as o}from"../../internal/i18n.js";import{ArrowRightIcon as c}from"../../internal/icons.js";import{searchText as d}from"../../internal/search.js";import{cx as m,fieldRestClasses as h,hasContent as u,metaTextClasses as f,paddingXClasses as b,radiusClasses as p,surfaceSlots as g,toLength as v}from"../../internal/styles.js";import{useStyleDefaults as x}from"../../internal/defaults.js";const y={xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},k={xs:"py-0.5",sm:"py-1",md:"py-1",lg:"py-1.5",xl:"py-2"};function S({title:a,rows:s,ticked:n,onTick:o,onTickAll:c,search:d,onSearch:m,searchable:u,disabled:v,height:x,emptyMessage:S,searchLabel:w,selectAllLabel:j,style:N}){const{size:z,variant:$="outline",color:A="primary",density:C="default"}=N,T=s.filter(e=>!e.disabled),L=T.filter(e=>n.has(e.value)),M=T.length>0&&L.length===T.length,V=L.length>0&&!M,_=b[C][z];return l("div",{className:["flex min-w-0 flex-col overflow-hidden",h[$],p[z]].join(" "),style:g(A,0),children:[l("div",{className:`flex items-center gap-2 border-b [border-color:var(--neba-border)] ${_} ${y[z]}`,children:[e(t,{size:z,color:A,checked:M,indeterminate:V,disabled:v||0===T.length,"aria-label":j,onCheckedChange:e=>c(!0===e)}),e("span",{className:`min-w-0 flex-1 truncate font-medium ${f[z]}`,children:a}),l("span",{className:`shrink-0 tabular-nums text-(--neba-muted-fg) ${f[z]}`,children:[L.length,"/",s.length]})]}),u?e("div",{className:`${_} ${y[z]}`,children:e(i,{size:z,color:A,density:C,fullWidth:!0,variant:"text",disabled:v,placeholder:w,"aria-label":w,value:d,onChange:e=>m(e.target.value)})}):null,e(r,{size:z,color:A,height:x,fade:!0,children:e("div",{className:`flex flex-col ${_} ${y[z]}`,children:0===s.length?e("span",{className:`text-(--neba-muted-fg) ${f[z]} ${k[z]}`,children:S}):s.map(l=>e(t,{size:z,color:A,className:k[z],label:l.label,checked:n.has(l.value),disabled:v||l.disabled,onCheckedChange:e=>o(l.value,!0===e)},l.value))})})]})}function w(e,l){const a=d(l);return""===a?e:e.filter(e=>"string"!=typeof e.label||d(e.label).includes(a))}export const Transfer=/*@__PURE__*/a.forwardRef(function(t,r){const{items:i,value:d,defaultValue:h,onValueChange:f,sourceLabel:b,targetLabel:p,searchable:g=!1,height:y=220,disabled:k=!1,locale:j,variant:N="outline",size:z="md",color:$="primary",density:A="default",className:C,...T}=x(t,["size","density","variant","locale"]),L=o(n,j),[M,V]=a.useState(h??[]),_=d??M,[B,F]=a.useState(()=>new Set),[I,R]=a.useState(""),[W,q]=a.useState(""),D=a.useMemo(()=>new Set(_),[_]),E=a.useMemo(()=>i.filter(e=>!D.has(e.value)),[i,D]),G=a.useMemo(()=>i.filter(e=>D.has(e.value)),[i,D]),H=(e,l)=>{F(a=>{const t=new Set(a);return l?t.add(e):t.delete(e),t})},J=(e,l)=>{F(a=>{const t=new Set(a);for(const a of e)a.disabled||(l?t.add(a.value):t.delete(a.value));return t})},K=(e,l)=>{const a=e.filter(e=>!e.disabled&&B.has(e.value));if(0===a.length)return;const t=new Set(a.map(e=>e.value)),s=l?i.filter(e=>D.has(e.value)||t.has(e.value)).map(e=>e.value):_.filter(e=>!t.has(e));F(e=>new Set([...e].filter(e=>!t.has(e)))),(e=>{void 0===d&&V(e),f?.(e)})(s)},O=w(E,I),P=w(G,W),Q=O.some(e=>!e.disabled&&B.has(e.value)),U=P.some(e=>!e.disabled&&B.has(e.value)),X=v(y),Y={variant:N,size:z,color:$,density:A};return l("div",{ref:r,className:m("grid w-full items-center gap-3","[grid-template-columns:minmax(0,1fr)_auto_minmax(0,1fr)]",C??""),...T,children:[e(S,{title:u(b)?b:L.source,rows:O,ticked:B,onTick:H,onTickAll:e=>J(O,e),search:I,onSearch:R,searchable:g,disabled:k,height:X,emptyMessage:L.empty,searchLabel:L.search,selectAllLabel:L.selectAll,style:Y}),l("div",{className:"flex flex-col gap-2",children:[e(s,{size:z,color:$,variant:"text"===N?"text":"outline",label:L.toTarget,disabled:k||!Q,onClick:()=>K(O,!0),icon:e(c,{})}),e(s,{size:z,color:$,variant:"text"===N?"text":"outline",label:L.toSource,disabled:k||!U,onClick:()=>K(P,!1),icon:e("span",{className:"flex rotate-180",children:e(c,{})})})]}),e(S,{title:u(p)?p:L.target,rows:P,ticked:B,onTick:H,onTickAll:e=>J(P,e),search:W,onSearch:q,searchable:g,disabled:k,height:X,emptyMessage:L.empty,searchLabel:L.search,selectAllLabel:L.selectAll,style:Y})]})});

package/dist/components/tree-select/TreeSelect.d.ts

@@ -0,0 +1,88 @@
+import * as React from 'react';
+import { type TreeViewValue } from '../tree-view/TreeView.js';
+import { type PickerShellProps } from '../../internal/picker.js';
+import type { NebaSlots } from '../../types.js';
+/** One node of the tree the reader is choosing from. */
+export interface TreeSelectItem {
+    /** What is stored when this node is chosen. Unique across the whole tree. */
+    value: TreeViewValue;
+    label: React.ReactNode;
+    /** What a search matches against. Falls back to `label` when it is a string. */
+    searchLabel?: string;
+    startIcon?: React.ReactNode;
+    disabled?: boolean;
+    /**
+     * Whether this node may itself be chosen.
+     *
+     * `false` makes it a heading with children under it — a "Europe" that groups
+     * countries without being one. Defaults to `true` for a leaf and follows
+     * `selectableBranches` for a node that has children.
+     */
+    selectable?: boolean;
+    children?: TreeSelectItem[];
+}
+/** The parts a TreeSelect draws behind its root. */
+export type TreeSelectSlot = 'popup' | 'tree' | 'item' | 'empty';
+export interface TreeSelectProps extends PickerShellProps {
+    /** The tree, as nested items. */
+    items?: TreeSelectItem[];
+    /** The chosen value, or values when `multiple`. */
+    value?: TreeViewValue | TreeViewValue[] | null;
+    defaultValue?: TreeViewValue | TreeViewValue[] | null;
+    onValueChange?: (value: TreeViewValue[]) => void;
+    /** Whether more than one node may be held. @default false */
+    multiple?: boolean;
+    /**
+     * Whether a node that has children may itself be chosen.
+     *
+     * Off by default, which is the shape most trees actually have: the branches
+     * are the taxonomy and the leaves are the answers. An item's own
+     * `selectable` overrides it either way.
+     * @default false
+     */
+    selectableBranches?: boolean;
+    /** Which branches start open. */
+    defaultExpanded?: TreeViewValue[];
+    expanded?: TreeViewValue[];
+    onExpandedChange?: (expanded: TreeViewValue[]) => void;
+    /** Whether the popup is open. Use with `onOpenChange` to control it. */
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Shown in the trigger while nothing is chosen. */
+    placeholder?: React.ReactNode;
+    /** Offers the × that empties the control. @default false */
+    clearable?: boolean;
+    /** Closes the popup as soon as a node is chosen. @default !multiple */
+    closeOnSelect?: boolean;
+    /**
+     * Offers a field above the tree that filters it.
+     *
+     * A match keeps its ancestors, because a node with its parents cut away is a
+     * node the reader cannot place — "Seoul" under nothing at all.
+     * @default false
+     */
+    searchable?: boolean;
+    searchPlaceholder?: string;
+    /** BCP 47 tag deciding the strings this draws on its own behalf. */
+    locale?: string;
+    /** How the trigger writes what is held. Defaults to the labels, comma-joined. */
+    format?: (chosen: TreeSelectItem[]) => React.ReactNode;
+    /** Identifies the field when a form is submitted. One input per value. */
+    name?: string;
+    classNames?: NebaSlots<TreeSelectSlot>;
+}
+/**
+ * A value chosen from a tree rather than from a list.
+ *
+ * The gap between [Select](./select) and [TreeView](../display/tree-view): the
+ * first is a flat list behind a field, the second is a hierarchy that shows
+ * what it holds but has no field. A category, a folder, an org chart node and a
+ * region are all chosen from a shape a flat list flattens away.
+ *
+ * `selectableBranches` is off by default because that is the shape most of
+ * these trees have — the branches are the taxonomy and the leaves are the
+ * answers, and a "Europe" that can be chosen alongside "France" is usually a
+ * data model nobody meant. An item's own `selectable` overrides it either way.
+ */
+export declare const TreeSelect: React.ForwardRefExoticComponent<TreeSelectProps & React.RefAttributes<HTMLButtonElement>>;

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

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{TreeItem as n,TreeView as r}from"../tree-view/TreeView.js";import{PickerShell as t}from"../../internal/picker.js";import{defaultPickerLabels as i}from"../../internal/calendar.js";import{searchHaystack as o,searchText as s}from"../../internal/search.js";import{commandMessages as c,comboboxMessages as d,useMessages as u}from"../../internal/i18n.js";import{useStyleDefaults as p}from"../../internal/defaults.js";function h(e,l=new Map){for(const a of e)l.set(a.value,a),a.children&&h(a.children,l);return l}function m(e){return o([e.searchLabel??("string"==typeof e.label?e.label:String(e.value))])}function f(e,l){if(""===l)return e;const a=[];for(const n of e){const e=n.children?f(n.children,l):void 0,r=m(n).includes(l);(r||e&&e.length>0)&&a.push({...n,children:r?n.children:e})}return a}function g(e,l=[]){for(const a of e)a.children&&a.children.length>0&&(l.push(a.value),g(a.children,l));return l}export const TreeSelect=/*@__PURE__*/a.forwardRef(function(o,m){const{items:v=[],value:b,defaultValue:x,onValueChange:y,multiple:j=!1,selectableBranches:C=!1,defaultExpanded:S,expanded:w,onExpandedChange:N,open:O,defaultOpen:z,onOpenChange:M,placeholder:V,clearable:E=!1,closeOnSelect:T,searchable:k=!1,searchPlaceholder:A,locale:I,format:R,name:B,size:L="md",color:P="primary",readOnly:$=!1,disabled:q=!1,classNames:D,...F}=p(o,["size","locale"]),G=u(d,I),H=u(c,I),J=e=>null==e?[]:Array.isArray(e)?e:[e],[K,Q]=a.useState(()=>J(x)),U=void 0!==b?J(b):K,[W,X]=a.useState(z??!1),Y=O??W,[Z,_]=a.useState(""),ee=a.useMemo(()=>h(v),[v]),le=s(Z),ae=a.useMemo(()=>f(v,le),[v,le]),ne=a.useMemo(()=>""===le?void 0:g(ae),[le,ae]),[re,te]=a.useState(()=>S??[]),ie=ne??w??re,oe=e=>{e&&($||q)||(void 0===O&&X(e),e||_(""),M?.(e))},se=e=>{void 0===b&&Q(e),y?.(e)},ce=e=>e.selectable??(!(e.children&&e.children.length>0)||C),de=U.map(e=>ee.get(e)).filter(e=>void 0!==e),ue=0===de.length?V??"":R?R(de):de.map(e=>e.label).reduce((e,l,a)=>0===a?[l]:[...e,", ",l],[]),pe=l=>l.map(l=>e(n,{value:l.value,label:l.label,startIcon:l.startIcon,disabled:l.disabled||!ce(l),className:D?.item,children:l.children?pe(l.children):null},l.value));return e(t,{...F,size:L,color:P,readOnly:$,disabled:q,triggerRef:m,display:ue,empty:0===de.length,clearable:E,onClear:()=>se([]),open:Y,onOpenChange:oe,labels:i,popupClassName:D?.popup,hiddenValues:B?U.map(e=>({name:B,value:String(e)})):void 0,children:l("div",{className:"flex max-h-80 w-64 flex-col gap-2 overflow-hidden",children:[k?e("input",{type:"text",value:Z,placeholder:A??H.search,"aria-label":A??H.search,onChange:e=>_(e.currentTarget.value),className:"w-full shrink-0 bg-transparent px-1 py-1 [font:inherit] text-(--neba-fg) [outline:none] placeholder:text-(--neba-muted-fg)"}):null,e("div",{className:"min-h-0 flex-1 overflow-auto",children:0===ae.length?e("p",{className:`px-1 py-2 text-(--neba-muted-fg) ${D?.empty??""}`,children:G.empty}):e(r,{size:L,color:P,multiple:j,selected:U,onSelectedChange:e=>{const l=e.filter(e=>{const l=ee.get(e);return void 0!==l&&ce(l)&&!l.disabled});se(j?l:l.slice(-1)),(T??!j)&&oe(!1)},expanded:ie,onExpandedChange:ne?()=>{}:e=>{void 0===w&&te(e),N?.(e)},className:D?.tree,children:pe(ae)})})]})})});

package/dist/components/tree-select/index.d.ts

@@ -0,0 +1,2 @@
+export { TreeSelect } from './TreeSelect.js';
+export type { TreeSelectItem, TreeSelectProps, TreeSelectSlot } from './TreeSelect.js';

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

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

package/dist/components/tree-view/TreeView.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{ChevronIcon as a}from"../../internal/icons.js";import{controlTextClasses as l,cx as s,gapClasses as o,hasContent as i,iconClasses as c,radiusClasses as d,surfaceClasses as u,surfaceSlots as m,transitionClasses as f}from"../../internal/styles.js";const p=/*@__PURE__*/n.createContext({size:"md",density:"default",disabled:!1,expandedKeys:new Set,selectedKeys:new Set,activeKey:null,toggle:()=>{},select:()=>{},activate:()=>{},register:()=>()=>{}}),x={solid:[u,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[u,"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"},g={xs:"0.875rem",sm:"1rem",md:"1.25rem",lg:"1.5rem",xl:"1.75rem"},b={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},h={default:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-3.5"},compact:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-2",xl:"px-2.5"}},v={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.5rem]",lg:"rounded-[0.625rem]",xl:"rounded-[0.75rem]"},w={none:"",simple:"neba-tree-simple",folder:"neba-tree-folder"};function y(e){return Array.from(e.querySelectorAll('[role="treeitem"]'))}const k=e=>String(e);export const TreeView=/*@__PURE__*/n.forwardRef(function({variant:t="outline",size:r="md",color:a="primary",density:l="default",elevation:o=0,lines:i="simple",expanded:c,defaultExpanded:u,onExpandedChange:h,selected:v,defaultSelected:C,onSelectedChange:N,multiple:S=!1,disabled:K=!1,label:j,className:A,style:D,children:R,onKeyDown:E,...I},P){const[z,M]=n.useState(u??[]),[V,_]=n.useState(C??[]),[L,T]=n.useState(null),q=c??z,F=v??V,H=n.useRef(null),O=n.useCallback(e=>{H.current=e,"function"==typeof P?P(e):P&&(P.current=e)},[P]),U=n.useCallback(e=>{const t=k(e),r=c??z,n=r.some(e=>k(e)===t)?r.filter(e=>k(e)!==t):[...r,e];void 0===c&&M(n),h?.(n)},[c,z,h]),B=n.useCallback(e=>{const t=k(e),r=v??V,n=r.some(e=>k(e)===t),a=S?n?r.filter(e=>k(e)!==t):[...r,e]:[e];void 0===v&&_(a),N?.(a)},[S,v,V,N]),G=n.useRef(new Map),J=n.useCallback((e,t)=>(G.current.set(e,t),()=>{G.current.delete(e)}),[]),Q=n.useMemo(()=>q.map(k).join("\0"),[q]),W=n.useMemo(()=>F.map(k).join("\0"),[F]),X=n.useMemo(()=>({size:r,density:l,disabled:K,expandedKeys:new Set(q.map(k)),selectedKeys:new Set(F.map(k)),activeKey:L,toggle:U,select:B,activate:T,register:J}),[r,l,K,Q,W,L,U,B,J]);n.useEffect(()=>{if(null!==L&&G.current.has(L))return;const e=H.current;if(!e)return;const t=y(e);0!==t.length&&T(t[0].dataset.nebaValue??null)});const Y=s("flex list-none flex-col p-1",d[r],x[t],f,w[i],A);return e(p.Provider,{value:X,children:e("ul",{ref:O,role:"tree","aria-label":j,"aria-multiselectable":S||void 0,className:Y,style:{...m(a,o),"--n-tree-indent":g[r],"--n-tree-row":b[r],...D},onKeyDown:function(e){if(E?.(e),e.defaultPrevented)return;const t=H.current,r=e.target?.closest?.('[role="treeitem"]');if(!t||!r||!t.contains(r))return;const n=y(t),a=n.indexOf(r);if(-1===a)return;const l=t=>{t&&(e.preventDefault(),T(t.dataset.nebaValue??null),t.focus())},s=e=>{const t=e.dataset.nebaValue;t&&G.current.get(t)?.toggle()},o="rtl"===getComputedStyle(t).direction,i=o?"ArrowLeft":"ArrowRight",c=o?"ArrowRight":"ArrowLeft",d=r.getAttribute("aria-expanded");switch(e.key){case"ArrowDown":l(n[a+1]);break;case"ArrowUp":l(n[a-1]);break;case"Home":l(n[0]);break;case"End":l(n[n.length-1]);break;case i:"false"===d?(e.preventDefault(),s(r)):"true"===d&&l(n[a+1]);break;case c:"true"===d?(e.preventDefault(),s(r)):l(r.parentElement?.closest('[role="treeitem"]'));break;case"Enter":case" ":e.preventDefault(),r.click()}},...I,children:R})})});export const TreeItem=/*@__PURE__*/n.forwardRef(function({value:d,label:u,startIcon:m,endIcon:x,action:g,href:b,expandable:w,disabled:y=!1,className:C,children:N,onClick:S,...K},j){const{size:A,density:D,disabled:R,expandedKeys:E,selectedKeys:I,activeKey:P,toggle:z,select:M,activate:V,register:_}=n.useContext(p),L=n.useId(),T=d??L,q=k(T),F=n.useRef(null),H=n.useCallback(e=>{F.current=e,"function"==typeof j?j(e):j&&(j.current=e)},[j]),O=n.Children.toArray(N),U=w??O.length>0,B=U&&E.has(q),G=I.has(q),J=y||R,Q=n.useRef({toggle:()=>{}});Q.current.toggle=()=>{!J&&U&&z(T)},n.useEffect(()=>_(q,Q.current),[q,_]);const W=s("flex min-w-0 flex-1 cursor-pointer items-center text-start","h-(--n-tree-row)",h[D][A],v[A],o[A],l[A],f,c,"group-focus-visible/tree-item:[outline:2px_solid_var(--n-ring)]","group-focus-visible/tree-item:outline-offset-[-2px]",J?"cursor-not-allowed text-(--neba-disabled-fg)":G?"bg-(--n-soft-press) font-medium text-(--n-accent) hover:bg-(--n-soft-press)":"hover:bg-(--n-soft)"),X=r(t,{children:[e("span",{"aria-hidden":"true",onClick:e=>{!J&&U&&(e.stopPropagation(),e.preventDefault(),F.current?.focus(),V(q),z(T))},className:s("flex h-[1lh] w-[1.15em] shrink-0 items-center justify-center","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",U?"text-(--neba-muted-fg)":"",B?"rotate-0":"-rotate-90 rtl:rotate-90"),children:U?e(a,{}):null}),i(m)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:m}):null,e("span",{className:"min-w-0 flex-1 truncate",children:u}),i(x)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:x}):null]});return r("li",{ref:H,role:"treeitem","aria-expanded":U?B:void 0,"aria-selected":!!G||void 0,"aria-disabled":J||void 0,"data-neba-value":q,tabIndex:P===q?0:-1,className:s("group/tree-item relative block [outline:none]",C),onClick:function(e){e.stopPropagation(),J?e.preventDefault():(F.current?.focus(),V(q),S?.(e),e.defaultPrevented||(U&&z(T),M(T)))},...K,children:[r("div",{className:"flex w-full items-center",children:[b&&!J?e("a",{href:b,tabIndex:-1,className:W,"aria-current":G?"page":void 0,children:X}):e("div",{className:W,children:X}),i(g)?e("span",{className:s("flex shrink-0 items-center",h[D][A]),onClick:e=>e.stopPropagation(),children:g}):null]}),U&&B&&O.length>0?e("ul",{role:"group",className:"list-none ps-(--n-tree-indent)",children:N}):null]})});
+"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{ChevronIcon as a}from"../../internal/icons.js";import{controlTextClasses as l,cx as s,gapClasses as o,hasContent as i,iconClasses as c,radiusClasses as d,surfaceClasses as u,surfaceSlots as m,transitionClasses as f}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";const x=/*@__PURE__*/n.createContext({size:"md",density:"default",disabled:!1,expandedKeys:new Set,selectedKeys:new Set,activeKey:null,toggle:()=>{},select:()=>{},activate:()=>{},register:()=>()=>{}}),g={solid:[u,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[u,"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"},b={xs:"0.875rem",sm:"1rem",md:"1.25rem",lg:"1.5rem",xl:"1.75rem"},h={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},v={default:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-3.5"},compact:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-2",xl:"px-2.5"}},y={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.5rem]",lg:"rounded-[0.625rem]",xl:"rounded-[0.75rem]"},w={none:"",simple:"neba-tree-simple",folder:"neba-tree-folder"};function k(e){return Array.from(e.querySelectorAll('[role="treeitem"]'))}const C=e=>String(e);export const TreeView=/*@__PURE__*/n.forwardRef(function(t,r){const{variant:a="outline",size:l="md",color:o="primary",density:i="default",elevation:c=0,lines:u="simple",expanded:v,defaultExpanded:y,onExpandedChange:N,selected:S,defaultSelected:j,onSelectedChange:K,multiple:A=!1,disabled:D=!1,label:R,className:E,style:I,children:P,onKeyDown:z,...M}=p(t,["size","density","variant"]),[V,_]=n.useState(y??[]),[L,T]=n.useState(j??[]),[q,F]=n.useState(null),H=v??V,O=S??L,U=n.useRef(null),B=n.useCallback(e=>{U.current=e,"function"==typeof r?r(e):r&&(r.current=e)},[r]),G=n.useCallback(e=>{const t=C(e),r=v??V,n=r.some(e=>C(e)===t)?r.filter(e=>C(e)!==t):[...r,e];void 0===v&&_(n),N?.(n)},[v,V,N]),J=n.useCallback(e=>{const t=C(e),r=S??L,n=r.some(e=>C(e)===t),a=A?n?r.filter(e=>C(e)!==t):[...r,e]:[e];void 0===S&&T(a),K?.(a)},[A,S,L,K]),Q=n.useRef(new Map),W=n.useCallback((e,t)=>(Q.current.set(e,t),()=>{Q.current.delete(e)}),[]),X=n.useMemo(()=>H.map(C).join("\0"),[H]),Y=n.useMemo(()=>O.map(C).join("\0"),[O]),Z=n.useMemo(()=>({size:l,density:i,disabled:D,expandedKeys:new Set(H.map(C)),selectedKeys:new Set(O.map(C)),activeKey:q,toggle:G,select:J,activate:F,register:W}),[l,i,D,X,Y,q,G,J,W]);n.useEffect(()=>{if(null!==q&&Q.current.has(q))return;const e=U.current;if(!e)return;const t=k(e);0!==t.length&&F(t[0].dataset.nebaValue??null)});const $=s("flex list-none flex-col p-1",d[l],g[a],f,w[u],E);return e(x.Provider,{value:Z,children:e("ul",{ref:B,role:"tree","aria-label":R,"aria-multiselectable":A||void 0,className:$,style:{...m(o,c),"--n-tree-indent":b[l],"--n-tree-row":h[l],...I},onKeyDown:function(e){if(z?.(e),e.defaultPrevented)return;const t=U.current,r=e.target?.closest?.('[role="treeitem"]');if(!t||!r||!t.contains(r))return;const n=k(t),a=n.indexOf(r);if(-1===a)return;const l=t=>{t&&(e.preventDefault(),F(t.dataset.nebaValue??null),t.focus())},s=e=>{const t=e.dataset.nebaValue;t&&Q.current.get(t)?.toggle()},o="rtl"===getComputedStyle(t).direction,i=o?"ArrowLeft":"ArrowRight",c=o?"ArrowRight":"ArrowLeft",d=r.getAttribute("aria-expanded");switch(e.key){case"ArrowDown":l(n[a+1]);break;case"ArrowUp":l(n[a-1]);break;case"Home":l(n[0]);break;case"End":l(n[n.length-1]);break;case i:"false"===d?(e.preventDefault(),s(r)):"true"===d&&l(n[a+1]);break;case c:"true"===d?(e.preventDefault(),s(r)):l(r.parentElement?.closest('[role="treeitem"]'));break;case"Enter":case" ":e.preventDefault(),r.click()}},...M,children:P})})});export const TreeItem=/*@__PURE__*/n.forwardRef(function({value:d,label:u,startIcon:m,endIcon:p,action:g,href:b,expandable:h,disabled:w=!1,className:k,children:N,onClick:S,...j},K){const{size:A,density:D,disabled:R,expandedKeys:E,selectedKeys:I,activeKey:P,toggle:z,select:M,activate:V,register:_}=n.useContext(x),L=n.useId(),T=d??L,q=C(T),F=n.useRef(null),H=n.useCallback(e=>{F.current=e,"function"==typeof K?K(e):K&&(K.current=e)},[K]),O=n.Children.toArray(N),U=h??O.length>0,B=U&&E.has(q),G=I.has(q),J=w||R,Q=n.useRef({toggle:()=>{}});Q.current.toggle=()=>{!J&&U&&z(T)},n.useEffect(()=>_(q,Q.current),[q,_]);const W=s("flex min-w-0 flex-1 cursor-pointer items-center text-start","h-(--n-tree-row)",v[D][A],y[A],o[A],l[A],f,c,"group-focus-visible/tree-item:[outline:2px_solid_var(--n-ring)]","group-focus-visible/tree-item:outline-offset-[-2px]",J?"cursor-not-allowed text-(--neba-disabled-fg)":G?"bg-(--n-soft-press) font-medium text-(--n-accent) hover:bg-(--n-soft-press)":"hover:bg-(--n-soft)"),X=r(t,{children:[e("span",{"aria-hidden":"true",onClick:e=>{!J&&U&&(e.stopPropagation(),e.preventDefault(),F.current?.focus(),V(q),z(T))},className:s("flex h-[1lh] w-[1.15em] shrink-0 items-center justify-center","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",U?"text-(--neba-muted-fg)":"",B?"rotate-0":"-rotate-90 rtl:rotate-90"),children:U?e(a,{}):null}),i(m)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:m}):null,e("span",{className:"min-w-0 flex-1 truncate",children:u}),i(p)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:p}):null]});return r("li",{ref:H,role:"treeitem","aria-expanded":U?B:void 0,"aria-selected":!!G||void 0,"aria-disabled":J||void 0,"data-neba-value":q,tabIndex:P===q?0:-1,className:s("group/tree-item relative block [outline:none]",k),onClick:function(e){e.stopPropagation(),J?e.preventDefault():(F.current?.focus(),V(q),S?.(e),e.defaultPrevented||(U&&z(T),M(T)))},...j,children:[r("div",{className:"flex w-full items-center",children:[b&&!J?e("a",{href:b,tabIndex:-1,className:W,"aria-current":G?"page":void 0,children:X}):e("div",{className:W,children:X}),i(g)?e("span",{className:s("flex shrink-0 items-center",v[D][A]),onClick:e=>e.stopPropagation(),children:g}):null]}),U&&B&&O.length>0?e("ul",{role:"group",className:"list-none ps-(--n-tree-indent)",children:N}):null]})});