neba 1.17.1 → 1.18.0

package/dist/components/streaming-text/StreamingText.d.ts

@@ -3,9 +3,10 @@ import { useRender } from '@base-ui/react/use-render';
 import type { NebaColor } from '../../types.js';
 export interface StreamingTextProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> {
     /**
-     * The text so far. A **string** is what this is for: it is cut into words,
-     * and each one fades in as it lands. Anything else is rendered untouched,
-     * with the caret and the reserved height still around it.
+     * The text so far. A **string** is what this is for: what arrives while it
+     * streams is cut into words, and each one fades in as it lands. Anything else
+     * is rendered untouched, with the caret and the reserved height still around
+     * it.
      */
     children?: React.ReactNode;
     /**
@@ -23,10 +24,13 @@ export interface StreamingTextProps extends Omit<React.ComponentPropsWithoutRef<
     /**
      * Fades each word in as it arrives.
      *
-     * On. It costs one element per word, which is the price of the effect: a
-     * transition on the block as a whole would fade the *whole answer* every time
-     * a token landed. Turn it off for a very long answer, or where the text is
-     * being re-rendered from something other than a stream.
+     * On. A word that arrives during a stream costs one element, which is the
+     * price of the effect: a transition on the block as a whole would fade the
+     * *whole answer* every time a token landed. Text that did not arrive that
+     * way costs nothing — what the block was first drawn with while not
+     * streaming, what the server rendered, what was already there when a stream
+     * started, and what replaces it while nothing streams are drawn as plain
+     * text. Turn it off for a very long answer.
      * @default true
      */
     fade?: boolean;
@@ -61,10 +65,17 @@ export interface StreamingTextProps extends Omit<React.ComponentPropsWithoutRef<
  * is not a flourish: a transition on the block would replay the *entire* answer
  * every time a token landed.
  *
- * The fade needs no bookkeeping at all. Words are keyed by position, so a word
- * already on screen keeps its element and never animates again; only a new one
- * is a new element, and the last word grows a character at a time inside the
- * element it already has.
+ * Words are keyed by position, so a word already on screen keeps its element
+ * and never animates again; only a new one is a new element, and the last word
+ * grows a character at a time inside the element it already has. They are held
+ * in blocks of sixty-four, and a full block is never drawn again, so a token
+ * landing costs the last block rather than the whole answer.
+ *
+ * Only a stream is cut into words. Text the block is drawn with while nothing
+ * streams — a message loaded from history, a page rendered on the server — is
+ * one run of plain text, because none of it is arriving: fifty such messages
+ * drawn a word to an element were fifteen thousand elements, each with an
+ * animation to start.
  *
  * It is deliberately **not** a live region. An answer that announced itself
  * token by token would be unusable, and one that announced itself whole on

package/dist/components/streaming-text/StreamingText.js

@@ -1 +1 @@
-"use client";import{jsx as r,Fragment as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{useRender as n}from"@base-ui/react/use-render";import{segmenter as s}from"../../internal/format.js";import{cx as i,hasContent as c}from"../../internal/styles.js";const l=/[\p{Script=Han}\p{Script=Hiragana}\p{Script=Katakana}\p{Script=Thai}\p{Script=Lao}\p{Script=Khmer}\p{Script=Myanmar}]/u;export const StreamingText=/*@__PURE__*/t.forwardRef(function StreamingText({children:m,streaming:p=!1,cursor:o=!0,fade:d=!0,lines:u=1,color:f="primary",render:h,className:g,style:S,...v},x){const y="string"==typeof m?m:null,b=t.useMemo(()=>null!==y&&d?function(r){const e=r.split(/(\s+)/).filter(r=>""!==r),a=l.test(r)?s(void 0,"word"):null;return a?e.flatMap(r=>l.test(r)?[...a.segment(r)].map(r=>r.segment):[r]):e}(y):null,[y,d]),j=p&&!1!==o?!0===o?r("span",{"aria-hidden":"true",className:"neba-stream-caret"}):o:null;return n({render:h??r("div",{}),ref:x,props:{"aria-busy":p||void 0,"data-streaming":p||void 0,className:i("min-h-(--n-reserve) whitespace-pre-wrap",g),style:{"--n-reserve":`calc(${Math.max(u,0)} * 1lh)`,"--n-accent":`var(--neba-${f}-accent)`,...S},children:a(e,{children:[b?b.map((e,a)=>/\s/.test(e)?r(t.Fragment,{children:e},a):r("span",{className:"neba-stream-word",children:e},a)):m,c(j)?j:null]}),...v}})});
+"use client";import{jsx as t,Fragment as e,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{useRender as s}from"@base-ui/react/use-render";import{segmenter as a}from"../../internal/format.js";import{useLayoutEffectOnClient as i}from"../../internal/layout-effect.js";import{useHydrated as l}from"../../internal/media.js";import{cx as c,hasContent as o}from"../../internal/styles.js";const m=/[\p{Script=Han}\p{Script=Hiragana}\p{Script=Katakana}\p{Script=Thai}\p{Script=Lao}\p{Script=Khmer}\p{Script=Myanmar}]/u;function u(t){const e=t.split(/(\s+)/).filter(t=>""!==t),r=m.test(t)?a(void 0,"word"):null;return r?e.flatMap(t=>m.test(t)?[...r.segment(t)].map(t=>t.segment):[t]):e}const p=/\s/;const f=/*@__PURE__*/n.memo(function StreamBlock({text:r,joined:s}){return t(e,{children:u(r).map((e,r)=>p.test(e)||s&&0===r?t(n.Fragment,{children:e},r):t("span",{className:"neba-stream-word",children:e},r))})});function d(t,e){if(e.startsWith(t))return t;let r=0;for(;r<t.length&&t[r]===e[r];)r+=1;for(;r>0&&!p.test(e[r-1]);)r-=1;return e.slice(0,r)}export const StreamingText=/*@__PURE__*/n.forwardRef(function StreamingText({children:a,streaming:h=!1,cursor:g=!0,fade:x=!0,lines:S=1,color:j="primary",render:v,className:y,style:b,...w},N){const M="string"==typeof a?a:null,R=M??"",T=l(),[W,k]=n.useState(()=>h?T?"":R:null),F=n.useRef(R),H=n.useRef({closed:"",texts:[]}),K=x?function(t,e,r,n){return null===t?r?d(n,e):null:e.startsWith(n)?t:r?d(t,e):null}(W,R,h,F.current):W;K!==W&&k(K),i(()=>{F.current=R});let $=a;if(null!==M&&x&&null!==K){const e=M.slice(K.length),r=function(t,e){let{closed:r,texts:n}=e.startsWith(t.closed)?t:{closed:"",texts:[]};const s=e.slice(r.length);let a=0,i=0,l=0;for(const t of u(s)){if(!p.test(t)){if(64===a){const t=s.slice(i,l);n=[...n,t],r+=t,i=l,a=0}a+=1}l+=t.length}return{closed:r,texts:n,tail:s.slice(i)}}(H.current,e),n=K.at(-1),s=e.at(0),a=void 0!==n&&void 0!==s&&!p.test(n)&&!p.test(s)&&!m.test(n+s);H.current=r,$=[K,...[...r.texts,r.tail].map((e,r)=>""===e?null:t(f,{text:e,joined:a&&0===r},r))]}const B=h&&!1!==g?!0===g?t("span",{"aria-hidden":"true",className:"neba-stream-caret"}):g:null;return s({render:v??t("div",{}),ref:N,props:{"aria-busy":h||void 0,"data-streaming":h||void 0,className:c("min-h-(--n-reserve) whitespace-pre-wrap",y),style:{"--n-reserve":`calc(${Math.max(S,0)} * 1lh)`,"--n-accent":`var(--neba-${j}-accent)`,...b},children:r(e,{children:[$,o(B)?B:null]}),...w}})});

package/dist/components/tabs/Tabs.d.ts

@@ -105,6 +105,17 @@ export interface TabsProps extends Omit<NebaStyleProps, 'variant'>, Omit<React.C
      * @default 'center'
      */
     align?: NebaAlign;
+    /**
+     * Keeps every panel in the DOM while it is hidden, rather than only the one
+     * whose tab is chosen.
+     *
+     * A hidden panel that is not in the markup is not in a server render either,
+     * and a crawler reads the server render without pressing a single tab. Turn
+     * this on where what is behind the other tabs is content the page should be
+     * found by. A panel's own `keepMounted` still wins over it.
+     * @default false
+     */
+    keepMounted?: boolean;
     children?: React.ReactNode;
 }
 export interface TabProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'value' | 'color'> {
@@ -124,7 +135,7 @@ export interface TabPanelProps extends React.ComponentPropsWithoutRef<'div'> {
     /**
      * Keeps the panel in the DOM while it is hidden. For a panel that is expensive
      * to build, or that holds form state which should survive being switched away
-     * from.
+     * from. Left out, it is whatever the Tabs around it says.
      * @default false
      */
     keepMounted?: boolean;

package/dist/components/tabs/Tabs.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{glowClasses as o,spotlightSlot as n,trackPointer as l}from"../../internal/glow.js";import{Tabs as i}from"@base-ui/react/tabs";import{controlHeightClasses as r,controlHeightValues as s,controlTextClasses as c,cx as d,gapClasses as f,hasContent as u,iconClasses as b,paddingXClasses as v,radiusClasses as h,surfaceClasses as p,surfaceSlots as m,transitionClasses as x}from"../../internal/styles.js";import{observeResize as g}from"../../internal/observe.js";import{bindAxisWheel as w}from"../../internal/wheel.js";import{useStyleDefaults as y}from"../../internal/defaults.js";const z=/*@__PURE__*/a.createContext({variant:"outline",size:"md",density:"default",orientation:"horizontal",fullWidth:!1,align:"center"}),j={solid:{horizontal:`${p} inline-flex bg-(--n-panel) p-1 [box-shadow:var(--neba-plate-glass)]`,vertical:`${p} inline-flex flex-col bg-(--n-panel) p-1 [box-shadow:var(--neba-plate-glass)]`},outline:{horizontal:"flex border-b [border-color:var(--n-line)]",vertical:"flex flex-col border-e [border-color:var(--n-line)]"},text:{horizontal:"flex",vertical:"flex flex-col"}},N={solid:{horizontal:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width)",vertical:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width)"},outline:{horizontal:"absolute bottom-0 left-(--active-tab-left) h-0.5 w-(--active-tab-width)",vertical:"absolute end-0 top-(--active-tab-top) h-(--active-tab-height) w-0.5"},text:{horizontal:"absolute bottom-0 left-(--active-tab-left) h-0.5 w-(--active-tab-width)",vertical:"absolute end-0 top-(--active-tab-top) h-(--active-tab-height) w-0.5"}},T={horizontal:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width) border-b-2 [border-color:var(--n-accent)] !bg-transparent",vertical:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width) border-e-2 [border-color:var(--n-accent)] !bg-transparent"},$={solid:`${p} bg-(--n-panel-press) [box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]`,outline:"bg-(--n-accent)",text:"bg-(--n-accent)"},k={start:"justify-start",center:"justify-center",end:"justify-end"},M={solid:"text-(--neba-muted-fg) hover:text-(--neba-fg) data-[active]:text-(--n-accent)",outline:"text-(--neba-muted-fg) hover:text-(--neba-fg) data-[active]:text-(--n-accent)",text:"text-(--neba-muted-fg) hover:text-(--neba-fg) data-[active]:text-(--n-accent)"};export const Tab=/*@__PURE__*/a.forwardRef(function Tab({value:s,startIcon:p,endIcon:m,disabled:g=!1,className:w,style:y,children:j,...N},T){const{variant:$,size:E,density:P,fullWidth:C,align:R}=a.useContext(z);return t(i.Tab,{ref:T,value:s,disabled:g,style:{...g?void 0:n,...y},className:d("relative z-10 inline-flex shrink-0 cursor-pointer items-center select-none","whitespace-nowrap font-medium",k[R],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",r[E],c[E],f[E],v[P][E],"solid"===$?h[E]:"",x,b,M[$],"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)",g?"":o,C?"flex-1":"",w??""),...N,onPointerMove:l(N.onPointerMove,!g),children:[u(p)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:p}):null,j,u(m)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:m}):null]})});export const TabPanel=/*@__PURE__*/a.forwardRef(function TabPanel({value:t,keepMounted:o=!1,className:n,children:l,...r},s){const{size:c}=a.useContext(z);return e(i.Panel,{ref:s,value:t,keepMounted:o,className:["min-w-0 flex-1 text-(--neba-fg)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2","data-[starting-style]:opacity-0","[transition:opacity_var(--neba-duration)_var(--neba-ease)]",h[c],n??""].filter(Boolean).join(" "),...r,children:l})});export const Tabs=/*@__PURE__*/a.forwardRef(function Tabs(o,n){const{variant:l="outline",size:r="md",color:c="primary",density:f="default",value:u,defaultValue:b,onValueChange:v,orientation:p="horizontal",activateOnFocus:x=!1,loopFocus:k=!0,overflow:M="scroll",lines:E,wheel:P=!0,fullWidth:C=!1,align:R="center",className:V,style:W,children:_,...F}=y(o,["size","density","variant"]),A="horizontal"===p,L="wrap"===M,H=a.useRef(null),I=a.useRef(null),O=a.useMemo(()=>({variant:l,size:r,density:f,orientation:p,fullWidth:C,align:R}),[l,r,f,p,C,R]),B=[],q=[],D=e=>a.Children.forEach(e,e=>{a.isValidElement(e)&&e.type===a.Fragment?D(e.props.children):a.isValidElement(e)&&e.type===TabPanel?q.push(e):null!=e&&!1!==e&&B.push(e)});D(_);const G=B.length;return a.useEffect(()=>{const e=I.current,t=H.current;if(!e||!t)return;const a=()=>{const a=Math.abs(A?e.scrollLeft:e.scrollTop),o=A?e.clientWidth:e.clientHeight,n=A?e.scrollWidth:e.scrollHeight,l=A?"x":"y",i=A?"y":"x";t.toggleAttribute(`data-overflow-${l}-start`,a>1),t.toggleAttribute(`data-overflow-${l}-end`,n-o-a>1),t.removeAttribute(`data-overflow-${i}-start`),t.removeAttribute(`data-overflow-${i}-end`)};a(),e.addEventListener("scroll",a,{passive:!0});const o=g(e,a);return()=>{e.removeEventListener("scroll",a),o()}},[A,G]),a.useEffect(()=>{const e=I.current;if(e&&P)return w(e)},[P]),e(z.Provider,{value:O,children:t(i.Root,{ref:e=>{H.current=e,"function"==typeof n?n(e):n&&(n.current=e)},value:u,defaultValue:b,onValueChange:e=>v?.(e),orientation:p,className:d("flex min-w-0","vertical"===p?"flex-row gap-4":"flex-col gap-4",V??""),style:{...m(c,0),...W},...F,children:[t(i.List,{ref:I,activateOnFocus:x,loopFocus:k,className:d("relative shrink-0",j[l][p],"solid"===l?h[r]:"",C&&"horizontal"===p?"w-full":"",L?"flex-wrap":A?"overflow-x-auto":"overflow-y-auto",L&&void 0!==E?A?"overflow-y-auto":"overflow-x-auto":"",!L&&A?"overflow-y-hidden":"","overscroll-contain","[scrollbar-width:none] [&::-webkit-scrollbar]:hidden","neba-scroll-fade"),style:{"--n-fade":"2rem",maxHeight:L&&void 0!==E?`calc(${s[r]} * ${Math.max(1,Math.round(E))}${"solid"===l?" + 0.5rem":"outline"===l&&A?" + 1px":""})`:void 0},children:[B,e(i.Indicator,{className:["pointer-events-none",L&&"solid"!==l?T[p]:N[l][p],$[l],"solid"===l?h[r]:"rounded-full","[transition-property:left,top,width,height]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]"].join(" ")})]}),q]})})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{glowClasses as o,spotlightSlot as n,trackPointer as i}from"../../internal/glow.js";import{Tabs as l}from"@base-ui/react/tabs";import{controlHeightClasses as r,controlHeightValues as s,controlTextClasses as c,cx as d,gapClasses as u,hasContent as f,iconClasses as b,paddingXClasses as v,radiusClasses as h,surfaceClasses as p,surfaceSlots as m,transitionClasses as x}from"../../internal/styles.js";import{observeResize as g}from"../../internal/observe.js";import{bindAxisWheel as w}from"../../internal/wheel.js";import{useStyleDefaults as y}from"../../internal/defaults.js";const z=/*@__PURE__*/a.createContext({variant:"outline",size:"md",density:"default",orientation:"horizontal",fullWidth:!1,align:"center",keepMounted:!1}),j={solid:{horizontal:`${p} inline-flex bg-(--n-panel) p-1 [box-shadow:var(--neba-plate-glass)]`,vertical:`${p} inline-flex flex-col bg-(--n-panel) p-1 [box-shadow:var(--neba-plate-glass)]`},outline:{horizontal:"flex border-b [border-color:var(--n-line)]",vertical:"flex flex-col border-e [border-color:var(--n-line)]"},text:{horizontal:"flex",vertical:"flex flex-col"}},k={solid:{horizontal:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width)",vertical:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width)"},outline:{horizontal:"absolute bottom-0 left-(--active-tab-left) h-0.5 w-(--active-tab-width)",vertical:"absolute end-0 top-(--active-tab-top) h-(--active-tab-height) w-0.5"},text:{horizontal:"absolute bottom-0 left-(--active-tab-left) h-0.5 w-(--active-tab-width)",vertical:"absolute end-0 top-(--active-tab-top) h-(--active-tab-height) w-0.5"}},M={horizontal:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width) border-b-2 [border-color:var(--n-accent)] !bg-transparent",vertical:"absolute left-(--active-tab-left) top-(--active-tab-top) h-(--active-tab-height) w-(--active-tab-width) border-e-2 [border-color:var(--n-accent)] !bg-transparent"},N={solid:`${p} bg-(--n-panel-press) [box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]`,outline:"bg-(--n-accent)",text:"bg-(--n-accent)"},T={start:"justify-start",center:"justify-center",end:"justify-end"},$={solid:"text-(--neba-muted-fg) hover:text-(--neba-fg) data-[active]:text-(--n-accent)",outline:"text-(--neba-muted-fg) hover:text-(--neba-fg) data-[active]:text-(--n-accent)",text:"text-(--neba-muted-fg) hover:text-(--neba-fg) data-[active]:text-(--n-accent)"};export const Tab=/*@__PURE__*/a.forwardRef(function Tab({value:s,startIcon:p,endIcon:m,disabled:g=!1,className:w,style:y,children:j,...k},M){const{variant:N,size:E,density:P,fullWidth:C,align:R}=a.useContext(z);return t(l.Tab,{ref:M,value:s,disabled:g,style:{...g?void 0:n,...y},className:d("relative z-10 inline-flex shrink-0 cursor-pointer items-center select-none","whitespace-nowrap font-medium",T[R],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",r[E],c[E],u[E],v[P][E],"solid"===N?h[E]:"",x,b,$[N],"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)",g?"":o,C?"flex-1":"",w??""),...k,onPointerMove:i(k.onPointerMove,!g),children:[f(p)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:p}):null,j,f(m)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:m}):null]})});export const TabPanel=/*@__PURE__*/a.forwardRef(function TabPanel({value:t,keepMounted:o,className:n,children:i,...r},s){const{size:c,keepMounted:d}=a.useContext(z);return e(l.Panel,{ref:s,value:t,keepMounted:o??d,className:["min-w-0 flex-1 text-(--neba-fg)","[&[hidden]]:hidden","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2","data-[starting-style]:opacity-0","[transition:opacity_var(--neba-duration)_var(--neba-ease)]",h[c],n??""].filter(Boolean).join(" "),...r,children:i})});export const Tabs=/*@__PURE__*/a.forwardRef(function Tabs(o,n){const{variant:i="outline",size:r="md",color:c="primary",density:u="default",value:f,defaultValue:b,onValueChange:v,orientation:p="horizontal",activateOnFocus:x=!1,loopFocus:T=!0,overflow:$="scroll",lines:E,wheel:P=!0,fullWidth:C=!1,align:R="center",keepMounted:V=!1,className:W,style:_,children:F,...A}=y(o,["size","density","variant"]),L="horizontal"===p,H="wrap"===$,I=a.useRef(null),O=a.useRef(null),B=a.useMemo(()=>({variant:i,size:r,density:u,orientation:p,fullWidth:C,align:R,keepMounted:V}),[i,r,u,p,C,R,V]),q=[],D=[],G=e=>a.Children.forEach(e,e=>{a.isValidElement(e)&&e.type===a.Fragment?G(e.props.children):a.isValidElement(e)&&e.type===TabPanel?D.push(e):null!=e&&!1!==e&&q.push(e)});G(F);const J=q.length;return a.useEffect(()=>{const e=O.current,t=I.current;if(!e||!t)return;const a=()=>{const a=Math.abs(L?e.scrollLeft:e.scrollTop),o=L?e.clientWidth:e.clientHeight,n=L?e.scrollWidth:e.scrollHeight,i=L?"x":"y",l=L?"y":"x";t.toggleAttribute(`data-overflow-${i}-start`,a>1),t.toggleAttribute(`data-overflow-${i}-end`,n-o-a>1),t.removeAttribute(`data-overflow-${l}-start`),t.removeAttribute(`data-overflow-${l}-end`)};a(),e.addEventListener("scroll",a,{passive:!0});const o=g(e,a);return()=>{e.removeEventListener("scroll",a),o()}},[L,J]),a.useEffect(()=>{const e=O.current;if(e&&P)return w(e)},[P]),e(z.Provider,{value:B,children:t(l.Root,{ref:e=>{I.current=e,"function"==typeof n?n(e):n&&(n.current=e)},value:f,defaultValue:b,onValueChange:e=>v?.(e),orientation:p,className:d("flex min-w-0","vertical"===p?"flex-row gap-4":"flex-col gap-4",W??""),style:{...m(c,0),..._},...A,children:[t(l.List,{ref:O,activateOnFocus:x,loopFocus:T,className:d("relative shrink-0",j[i][p],"solid"===i?h[r]:"",C&&"horizontal"===p?"w-full":"",H?"flex-wrap":L?"overflow-x-auto":"overflow-y-auto",H&&void 0!==E?L?"overflow-y-auto":"overflow-x-auto":"",!H&&L?"overflow-y-hidden":"","overscroll-contain","[scrollbar-width:none] [&::-webkit-scrollbar]:hidden","neba-scroll-fade"),style:{"--n-fade":"2rem",maxHeight:H&&void 0!==E?`calc(${s[r]} * ${Math.max(1,Math.round(E))}${"solid"===i?" + 0.5rem":"outline"===i&&L?" + 1px":""})`:void 0},children:[q,e(l.Indicator,{className:["pointer-events-none",H&&"solid"!==i?M[p]:k[i][p],N[i],"solid"===i?h[r]:"rounded-full","[transition-property:left,top,width,height]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]"].join(" ")})]}),D]})})});

package/dist/components/text-link/TextLink.d.ts

@@ -64,6 +64,13 @@ export interface TextLinkProps extends Omit<React.ComponentPropsWithoutRef<'a'>,
      * needs it written once, on the TextLink.
      */
     render?: useRender.RenderProp;
+    /**
+     * A Tailwind utility here wins over the link's own colour, weight and line —
+     * whether it is drawn, its thickness, its offset and its colour — with or
+     * without a variant. Only Tailwind's names are read: a class from your own
+     * stylesheet needs two classes or `!important`.
+     */
+    className?: string;
     /** The label. */
     children?: React.ReactNode;
 }

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

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as e,Fragment as r}from"react/jsx-runtime";import*as i from"react";import{useRender as a}from"@base-ui/react/use-render";import{linkMessages as t,useMessages as o}from"../../internal/i18n.js";import{ExternalLinkIcon as l,LinkIcon as s}from"../../internal/icons.js";import{opensElsewhere as c,safeHref as m,safeRel as u}from"../../internal/link.js";import{controlTextLeadingClasses as d,cx as p,focusRingClasses as b,srOnlyClasses as f}from"../../internal/styles.js";import{useStyleDefaults as k}from"../../internal/defaults.js";const v={always:"[&.neba-link]:underline",hover:"[&.neba-link]:no-underline [&.neba-link]:hover:underline",none:"[&.neba-link]:no-underline"},h=["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(" "),b,"focus-visible:rounded-[0.25rem]"].join(" ");export const TextLink=/*@__PURE__*/i.forwardRef(function TextLink(i,b){const{href:g,underline:j="always",color:x,size:y,newTab:w=!1,icon:_,locale:N,render:T,className:z,style:C,children:L,...$}=k(i,["locale"]),F=o(t,N),R=_??w,q=!0===R?n(w?l:s,{}):R,A=p(h,y?d[y]:"",v[j],x?"[&.neba-link]:text-(--n-accent)":"[&.neba-link]:text-inherit",z??""),B={"--n-underline":"color-mix(in oklab, currentColor 45%, transparent)","--n-underline-hover":"currentColor","--n-ring":`var(--neba-${x??"primary"}-ring)`,...x?{"--n-accent":`var(--neba-${x}-accent)`}:null},{rel:D,target:E,...G}=$,H=w?"_blank":E,I=u(H,D),J=c(H);return a({render:T??n("a",{}),ref:b,props:{href:m(g),target:H,className:A,style:{...B,...C},children:e(r,{children:[L,q?n("span",{className:"ms-[0.25em]",children:q}):null,J?e("span",{className:f,children:[" ",F.newTab]}):null]}),...G,rel:I}})});
+"use client";import{jsx as e,jsxs as n,Fragment as r}from"react/jsx-runtime";import*as i from"react";import{useRender as t}from"@base-ui/react/use-render";import{linkMessages as o,useMessages as a}from"../../internal/i18n.js";import{ExternalLinkIcon as l,LinkIcon as s}from"../../internal/icons.js";import{opensElsewhere as c,safeHref as d,safeRel as m}from"../../internal/link.js";import{COLOR as u,FONT_WEIGHT as h,overriddenBy as f,TEXT_DECORATION_COLOR as p,TEXT_DECORATION_LINE as b,TEXT_DECORATION_THICKNESS as k,TEXT_UNDERLINE_OFFSET as x,TEXT_UNDERLINE_POSITION as v}from"../../internal/overrides.js";import{controlTextLeadingClasses as w,cx as g,focusRingClasses as j,srOnlyClasses as y}from"../../internal/styles.js";import{useStyleDefaults as _}from"../../internal/defaults.js";const N={always:["[&.neba-link]:underline","[:where(&)]:underline"],hover:["[&.neba-link]:no-underline [&.neba-link]:hover:underline","[:where(&)]:no-underline hover:[:where(&)]:underline"],none:["[&.neba-link]:no-underline","[:where(&)]:no-underline"]},T=[[h,"[&.neba-link]:[font-weight:inherit]","[:where(&)]:[font-weight:inherit]"],[k,"[&.neba-link]:[text-decoration-thickness:max(1px,0.055em)]","[:where(&)]:[text-decoration-thickness:max(1px,0.055em)]"],[x,"[&.neba-link]:underline-offset-[0.2em]","[:where(&)]:underline-offset-[0.2em]"],[v,"[&.neba-link]:[text-underline-position:from-font]","[:where(&)]:[text-underline-position:from-font]"],[p,"[&.neba-link]:decoration-(--n-underline) [&.neba-link:hover]:decoration-(--n-underline-hover)","[:where(&)]:decoration-(--n-underline) [:where(&:hover)]:decoration-(--n-underline-hover)"]],z=["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(" "),j,"focus-visible:rounded-[0.25rem]"].join(" ");export const TextLink=/*@__PURE__*/i.forwardRef(function TextLink(h,p){const{href:k,underline:x="always",color:v,size:j,newTab:C=!1,icon:L,locale:$,render:F,className:M,style:R,children:q,...A}=_(h,["locale"]),B=a(o,$),D=L??C,E=!0===D?e(C?l:s,{}):D,G=i.useMemo(()=>f(M),[M]),H=g(z,j?w[j]:"",N[x][G&b?1:0],...T.map(([e,n,r])=>G&e?r:n),v?G&u?"[:where(&)]:text-(--n-accent)":"[&.neba-link]:text-(--n-accent)":G&u?"[:where(&)]:text-inherit":"[&.neba-link]:text-inherit",M??""),I={"--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},{rel:J,target:K,...O}=A,P=C?"_blank":K,Q=m(P,J),S=c(P);return t({render:F??e("a",{}),ref:p,props:{href:d(k),target:P,className:H,style:{...I,...R},children:n(r,{children:[q,E?e("span",{className:"ms-[0.25em]",children:E}):null,S?n("span",{className:y,children:[" ",B.newTab]}):null]}),...O,rel:Q}})});

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

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

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

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{CartesianChart as o,markTransitionClasses as r}from"../../internal/chart-frame.js";import{barBandRatio as a,barMaxThickness as s,barRadius as l,formatTimeTicks as i,formatTimeValue as c,markGap as m,resolveColor as u,seriesColor as d,timeScale as f,toNumber as h}from"../../internal/chart.js";import{chartMessages as x,useMessages as p}from"../../internal/i18n.js";import{srOnlyClasses as M}from"../../internal/styles.js";import{useStyleDefaults as b}from"../../internal/defaults.js";export function TimelineChart(t){const{series:r,min:l,max:u,barSize:M,rounded:j=!0,size:$="md",density:C="default",xAxis:T,yAxis:z,locale:A,references:D,...E}=b(t,["size","density","locale"]),P=n.useMemo(()=>r.map(y),[r]),S=n.useMemo(()=>P.map(e=>e.spans),[P]),B=n.useMemo(()=>{let e=1/0,t=-1/0,n=!1;for(const o of S)for(const r of o)r&&(n=!0,e=Math.min(e,r.from),t=Math.max(t,r.to));for(const o of D??[])if("value"===(o.axis??"value"))for(const r of void 0===o.to?[o.value]:[o.value,o.to])n=!0,e=Math.min(e,r),t=Math.max(t,r);return n?{min:e,max:t}:null},[S,D]),F=n.useMemo(()=>f(B,{min:h(l)??void 0,max:h(u)??void 0,tickCount:z?.tickCount}),[B,l,u,z?.tickCount]),I=n.useMemo(()=>i(F.ticks,F.unit,A),[F,A]),N=n.useMemo(()=>r.map((e,t)=>d(e,t)),[r]),R=n.useMemo(()=>[{data:S.map(e=>e.some(Boolean)?1:null)}],[S]),q=n.useMemo(()=>{const e=g(F.unit);return("day"===e||"week"===e)&&S.some(e=>e.some(e=>null!==e&&(v(e.from)||v(e.to))))},[S,F.unit]),Y=n.useMemo(()=>{let e=0,t=1/0,n=-1/0;for(const o of S)for(const r of o)r&&(e+=1,t=Math.min(t,r.from),n=Math.max(n,r.to));return 0===e?{count:e,min:"",max:""}:{count:e,min:c(t,g(F.unit),A,q),max:c(n,g(F.unit),A,q)}},[S,F.unit,A,q]),G=n.useMemo(()=>r.map((e,t)=>e.name??`${t+1}`),[r]),H=M??s[$],J=p(x,A),K=n.useCallback(e=>{const t=[];return P.forEach((n,o)=>{const r=Math.min(H,Math.max(1,(e.band.band-m*(n.lanes-1))/n.lanes)),a=r*n.lanes+m*(n.lanes-1),s=e.plot.top+e.categoryPx(o)-a/2+r/2;n.spans.forEach((n,a)=>{if(!n||n.to<e.scale.min||n.from>e.scale.max)return;const l=e.valuePx(n.from),i=e.valuePx(n.to);t.push({series:o,index:a,x:(l+i)/2,y:s+n.lane*(r+m),r:r/2,rx:Math.max(0,(i-l)/2),ry:r/2})})}),t},[P,H]),L=n.useCallback(e=>{const t=S[e.series]?.[e.index];if(!t)return null;const n=[{seriesIndex:e.series,name:G[e.series],color:t.color??N[e.series],value:t.to-t.from,formatted:`${c(t.from,g(F.unit),A,q)} – ${c(t.to,g(F.unit),A,q)}`}];return{heading:t.span.label??G[e.series],items:n}},[S,G,N,F.unit,A,q]);return e(o,{...E,series:R,categories:G,size:$,density:C,locale:A,horizontal:!0,scale:F,references:D,brush:void 0,secondaryAxis:void 0,xAxis:T,yAxis:{tickFormat:(e,t)=>I[t]??"",...z},legend:!1,bandRatio:a[C],marks:K,markTooltip:L,summary:Y,exportRows:()=>function(e,t,n,o,r){const a=t.some(e=>e.data.some(e=>void 0!==e.label));return[["string"==typeof o?o:"",...a?[r.title]:[],r.start,r.end],...n.flatMap((n,o)=>n.map((n,r)=>[e[o],...a?[k(t[o].data[r]?.label)]:[],n?new Date(n.from):null,n?new Date(n.to):null]))]}(G,r,S,T?.label,J),table:t=>e(w,{id:t,names:G,series:r,spans:S,unit:g(F.unit),clock:q,label:E.label,corner:T?.label,locale:A}),children:t=>e(Spans,{context:t,spans:S,colors:N,rounded:j})})}function y(e){const t=e.data.map(e=>{const t=h(e.start),n=h(e.end);return null===t||null===n?null:{from:Math.min(t,n),to:Math.max(t,n),lane:0,color:e.color?u(e.color):void 0,span:e}}),n=[];return t.map((e,t)=>({one:e,index:t})).filter(e=>Boolean(e.one)).sort((e,t)=>e.one.from-t.one.from).forEach(({one:e})=>{const t=n.findIndex(t=>t<=e.from),o=-1===t?n.length:t;n[o]=e.to,e.lane=o}),{spans:t,lanes:Math.max(1,n.length)}}function Spans({context:t,spans:n,colors:o,rounded:a}){const{marks:s,activeMark:i,plot:c}=t,m=a?l:0;return e("g",{children:s.map(t=>{const a=n[t.series]?.[t.index];if(!a)return null;const s=i?.series===t.series&&i?.index===t.index,l=t.rx??t.r,u=2*(t.ry??t.r),d=Math.max(c.left,t.x-l),f=Math.min(c.left+c.width,t.x+l);if(f<c.left||d>c.left+c.width)return null;const h=Math.max(1,f-d);return e("rect",{x:d,y:t.y-u/2,width:h,height:u,rx:Math.min(m,h/2,u/2),fill:a.color??o[t.series],opacity:s?1:.92,className:r},`${t.series}-${t.index}`)})})}function v(e){const t=new Date(e);return t.getTime()!==new Date(t.getFullYear(),t.getMonth(),t.getDate()).getTime()}function g(e){return"month"===e||"quarter"===e||"year"===e?"day":e}const k=e=>"string"==typeof e||"number"==typeof e?e:null;const w=/*@__PURE__*/n.memo(function TimelineTable({id:n,names:o,series:r,spans:a,unit:s,clock:l,label:i,corner:m,locale:u}){const d=p(x,u),f=r.some(e=>e.data.some(e=>void 0!==e.label));return t("table",{id:n,className:M,children:[i?e("caption",{children:i}):null,e("thead",{children:t("tr",{children:[e("th",{scope:"col",children:m??""}),f?e("th",{scope:"col",children:d.title}):null,e("th",{scope:"col",children:d.start}),e("th",{scope:"col",children:d.end})]})}),e("tbody",{children:a.flatMap((n,a)=>n.map((n,i)=>t("tr",{children:[e("th",{scope:"row",children:o[a]}),f?e("td",{children:r[a].data[i]?.label??""}):null,e("td",{children:n?c(n.from,s,u,l):""}),e("td",{children:n?c(n.to,s,u,l):""})]},`${a}-${i}`)))})]})});
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{CartesianChart as o,chartTableClasses as a,markTransitionClasses as r,useDeferredRows as s}from"../../internal/chart-frame.js";import{barBandRatio as l,barMaxThickness as i,barRadius as c,formatTimeTicks as m,formatTimeValue as u,markGap as d,resolveColor as f,seriesColor as h,timeScale as x,toNumber as p}from"../../internal/chart.js";import{chartMessages as M,useMessages as b}from"../../internal/i18n.js";import{useStyleDefaults as y}from"../../internal/defaults.js";import{useIntlLocale as v}from"../../internal/media.js";export function TimelineChart(t){const{series:a,min:r,max:s,barSize:c,rounded:f=!0,size:C="md",density:T="default",xAxis:z,yAxis:A,locale:D,references:E,...P}=y(t,["size","density","locale"]),S=v(D),B=n.useMemo(()=>a.map(g),[a]),F=n.useMemo(()=>B.map(e=>e.spans),[B]),I=n.useMemo(()=>{let e=1/0,t=-1/0,n=!1;for(const o of F)for(const a of o)a&&(n=!0,e=Math.min(e,a.from),t=Math.max(t,a.to));for(const o of E??[])if("value"===(o.axis??"value"))for(const a of void 0===o.to?[o.value]:[o.value,o.to])n=!0,e=Math.min(e,a),t=Math.max(t,a);return n?{min:e,max:t}:null},[F,E]),N=n.useMemo(()=>x(I,{min:p(r)??void 0,max:p(s)??void 0,tickCount:A?.tickCount}),[I,r,s,A?.tickCount]),R=n.useMemo(()=>m(N.ticks,N.unit,S),[N,S]),q=n.useMemo(()=>a.map((e,t)=>h(e,t)),[a]),Y=n.useMemo(()=>[{data:F.map(e=>e.some(Boolean)?1:null)}],[F]),G=n.useMemo(()=>{const e=w(N.unit);return("day"===e||"week"===e)&&F.some(e=>e.some(e=>null!==e&&(k(e.from)||k(e.to))))},[F,N.unit]),H=n.useMemo(()=>{let e=0,t=1/0,n=-1/0;for(const o of F)for(const a of o)a&&(e+=1,t=Math.min(t,a.from),n=Math.max(n,a.to));return 0===e?{count:e,min:"",max:""}:{count:e,min:u(t,w(N.unit),S,G),max:u(n,w(N.unit),S,G)}},[F,N.unit,S,G]),J=n.useMemo(()=>a.map((e,t)=>e.name??`${t+1}`),[a]),K=c??i[C],L=b(M,D),O=n.useCallback(e=>{const t=[];return B.forEach((n,o)=>{const a=Math.min(K,Math.max(1,(e.band.band-d*(n.lanes-1))/n.lanes)),r=a*n.lanes+d*(n.lanes-1),s=e.plot.top+e.categoryPx(o)-r/2+a/2;n.spans.forEach((n,r)=>{if(!n||n.to<e.scale.min||n.from>e.scale.max)return;const l=e.valuePx(n.from),i=e.valuePx(n.to);t.push({series:o,index:r,x:(l+i)/2,y:s+n.lane*(a+d),r:a/2,rx:Math.max(0,(i-l)/2),ry:a/2})})}),t},[B,K]),Q=n.useCallback(e=>{const t=F[e.series]?.[e.index];if(!t)return null;const n=[{seriesIndex:e.series,name:J[e.series],color:t.color??q[e.series],value:t.to-t.from,formatted:`${u(t.from,w(N.unit),S,G)} – ${u(t.to,w(N.unit),S,G)}`}];return{heading:t.span.label??J[e.series],items:n}},[F,J,q,N.unit,S,G]);return e(o,{...P,series:Y,categories:J,size:C,density:T,locale:D,horizontal:!0,scale:N,references:E,brush:void 0,secondaryAxis:void 0,xAxis:z,yAxis:{tickFormat:(e,t)=>R[t]??"",...A},legend:!1,bandRatio:l[T],marks:O,markTooltip:Q,summary:H,exportRows:()=>function(e,t,n,o,a){const r=t.some(e=>e.data.some(e=>void 0!==e.label));return[["string"==typeof o?o:"",...r?[a.title]:[],a.start,a.end],...n.flatMap((n,o)=>n.map((n,a)=>[e[o],...r?[j(t[o].data[a]?.label)]:[],n?new Date(n.from):null,n?new Date(n.to):null]))]}(J,a,F,z?.label,L),table:t=>e($,{id:t,names:J,series:a,spans:F,unit:w(N.unit),clock:G,label:P.label,corner:z?.label,locale:D}),children:t=>e(Spans,{context:t,spans:F,colors:q,rounded:f})})}function g(e){const t=e.data.map(e=>{const t=p(e.start),n=p(e.end);return null===t||null===n?null:{from:Math.min(t,n),to:Math.max(t,n),lane:0,color:e.color?f(e.color):void 0,span:e}}),n=[];return t.map((e,t)=>({one:e,index:t})).filter(e=>Boolean(e.one)).sort((e,t)=>e.one.from-t.one.from).forEach(({one:e})=>{const t=n.findIndex(t=>t<=e.from),o=-1===t?n.length:t;n[o]=e.to,e.lane=o}),{spans:t,lanes:Math.max(1,n.length)}}function Spans({context:t,spans:n,colors:o,rounded:a}){const{marks:s,activeMark:l,plot:i}=t,m=a?c:0;return e("g",{children:s.map(t=>{const a=n[t.series]?.[t.index];if(!a)return null;const s=l?.series===t.series&&l?.index===t.index,c=t.rx??t.r,u=2*(t.ry??t.r),d=Math.max(i.left,t.x-c),f=Math.min(i.left+i.width,t.x+c);if(f<i.left||d>i.left+i.width)return null;const h=Math.max(1,f-d);return e("rect",{x:d,y:t.y-u/2,width:h,height:u,rx:Math.min(m,h/2,u/2),fill:a.color??o[t.series],opacity:s?1:.92,className:r},`${t.series}-${t.index}`)})})}function k(e){const t=new Date(e);return t.getTime()!==new Date(t.getFullYear(),t.getMonth(),t.getDate()).getTime()}function w(e){return"month"===e||"quarter"===e||"year"===e?"day":e}const j=e=>"string"==typeof e||"number"==typeof e?e:null;const $=/*@__PURE__*/n.memo(function TimelineTable({id:n,names:o,series:r,spans:l,unit:i,clock:c,label:m,corner:d,locale:f}){const h=b(M,f),x=v(f),p=r.some(e=>e.data.some(e=>void 0!==e.label)),y=[],g=l.reduce((e,t)=>(y.push(e),e+t.length),0),k=s({rows:g,points:g,columns:p?4:3});return t("table",{id:n,className:a,"aria-busy":k<g||void 0,children:[m?e("caption",{children:m}):null,e("thead",{children:t("tr",{children:[e("th",{scope:"col",children:d??""}),p?e("th",{scope:"col",children:h.title}):null,e("th",{scope:"col",children:h.start}),e("th",{scope:"col",children:h.end})]})}),e("tbody",{children:l.flatMap((n,a)=>n.slice(0,Math.max(0,k-y[a])).map((n,s)=>t("tr",{children:[e("th",{scope:"row",children:o[a]}),p?e("td",{children:r[a].data[s]?.label??""}):null,e("td",{children:n?u(n.from,i,x,c):""}),e("td",{children:n?u(n.to,i,x,c):""})]},`${a}-${s}`)))})]})});

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

package/dist/components/tool-call/ToolCall.d.ts

@@ -69,6 +69,17 @@ export interface ToolCallProps extends Pick<NebaStyleProps, 'size' | 'variant' |
     defaultOpen?: boolean;
     /** Called when the header opens or closes the panel. */
     onOpenChange?: (open: boolean) => void;
+    /**
+     * Keeps a closed panel in the DOM, hidden until the browser's own page search
+     * finds something in it and opens it.
+     *
+     * On by default, as on a [Collapsible](../surfaces/collapsible): a panel that
+     * is not in the markup is not in a server render either. Turn it off for a
+     * transcript of many calls with long results, where the closed panels are
+     * only worth building once they are opened.
+     * @default true
+     */
+    hiddenUntilFound?: boolean;
     /**
      * Drop shadow depth. `0` (the default) is flat — a tool call belongs to the
      * transcript it sits in rather than floating over it.

package/dist/components/tool-call/ToolCall.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{Collapsible as s}from"@base-ui/react/collapsible";import{boxPaddingXClasses as r,boxPaddingYClasses as t}from"../box/Box.js";import{ChevronIcon as o}from"../../internal/icons.js";import{formatDuration as i,runColor as c,runIcon as m,useElapsed as d}from"../../internal/run.js";import{runMessages as u,toolMessages as f,useMessages as p}from"../../internal/i18n.js";import{collapsiblePanelClasses as x,cx as b,gapClasses as h,hasContent as g,iconClasses as v,metaTextClasses as N,preformattedClasses as j,radiusClasses as w,sheetBodyClasses as y,sheetTitleClasses as k,srOnlyClasses as z,surfaceClasses as C,surfaceSlots as B,transitionClasses as O,disclosureChevronClasses as R,disclosureTriggerClasses as T}from"../../internal/styles.js";import{useStyleDefaults as _}from"../../internal/defaults.js";const E={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"},F=k;export const ToolCall=/*@__PURE__*/l.forwardRef(function ToolCall(j,k){const{variant:C="outline",size:P="md",color:S="primary",density:$="default",elevation:q=0,name:A,status:D="pending",args:G,result:H,error:I,duration:J,meta:K,icon:L,open:M,defaultOpen:Q=!1,onOpenChange:U,locale:V,labels:W,classNames:X,className:Y,style:Z,children:ee,...ae}=_(j,["size","density","variant","locale"]),ne=p(u,V),le=p(f,V),se={...ne,...le,...W},[re,te]=l.useState(Q),oe=void 0!==M,ie=oe?M:re,ce=l.useRef(D);l.useEffect(()=>{ce.current===D||"error"!==D||oe||te(!0),ce.current=D},[D,oe]);const me=d("running"===D,J),de=c(D,S),ue=void 0===L?m(D):L,fe=function(e,a,n){return"error"===e&&g(n)?n:a}(D,H,I),pe=g(G)||g(fe)||g(ee),xe=r[$][P],be=t[$][P],he=n(a,{children:[g(ue)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--n-accent)",children:ue}):null,e("span",{className:b("min-w-0 truncate font-mono font-semibold",F[P]),children:A}),e("span",{className:z,children:se[D]}),g(K)?e("span",{className:b("min-w-0 truncate text-(--neba-muted-fg)",N[P]),children:K}):null,e("span",{className:"flex-1"}),null===me?null:e("span",{className:b("shrink-0 tabular-nums text-(--neba-muted-fg)",N[P]),children:i(me,V)})]}),ge=b("flex flex-col overflow-hidden",w[P],E[C],O,v,Y??""),ve={...B(de,q),...Z};return pe?n(s.Root,{ref:k,open:ie,onOpenChange:e=>{oe||te(e),U?.(e)},"data-status":D,className:ge,style:ve,...ae,children:[n(s.Trigger,{className:b("flex w-full cursor-pointer items-center text-start",T,xe,be,h[P],O,"hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]",X?.header??""),children:[he,e("span",{className:`${R} text-(--neba-muted-fg)`,children:e(o,{})})]}),e(s.Panel,{className:x,children:n("div",{className:b("flex min-w-0 flex-col gap-2 pb-4",xe,y[P],"compact"===$?"pb-2":"",X?.body??""),children:[g(G)?e(Block,{size:P,label:se.arguments,className:X?.args,value:G}):null,g(fe)?e(Block,{size:P,label:"error"===D&&g(I)?ne.error:se.result,className:X?.result,value:fe,accent:"error"===D}):null,ee]})})]}):e("div",{ref:k,"data-status":D,className:ge,style:ve,...ae,children:e("div",{className:b("flex items-center",xe,be,h[P],X?.header??""),children:he})})});function Block({size:a,label:l,value:s,className:r,accent:t=!1}){return n("div",{className:b("flex min-w-0 flex-col gap-1",r??""),children:[e("span",{className:b("font-medium tracking-wide text-(--neba-muted-fg) uppercase",N[a]),children:l}),"string"==typeof s?e("pre",{className:b(j,"max-h-64",t?"text-(--n-accent)":""),children:s}):e("div",{className:t?"text-(--n-accent)":void 0,children:s})]})}
+"use client";import{jsx as e,Fragment as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{Collapsible as s}from"@base-ui/react/collapsible";import{boxPaddingXClasses as r,boxPaddingYClasses as t}from"../box/Box.js";import{ChevronIcon as o}from"../../internal/icons.js";import{formatDuration as i,runColor as c,runIcon as m,useElapsed as d}from"../../internal/run.js";import{runMessages as u,toolMessages as f,useMessages as p}from"../../internal/i18n.js";import{collapsiblePanelClasses as h,cx as x,gapClasses as b,hasContent as g,iconClasses as v,metaTextClasses as N,preformattedClasses as j,radiusClasses as w,sheetBodyClasses as y,sheetTitleClasses as k,srOnlyClasses as z,surfaceClasses as C,surfaceSlots as B,transitionClasses as F,disclosureChevronClasses as O,disclosureTriggerClasses as R}from"../../internal/styles.js";import{useStyleDefaults as T}from"../../internal/defaults.js";const U={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"},_=k;export const ToolCall=/*@__PURE__*/l.forwardRef(function ToolCall(j,k){const{variant:C="outline",size:E="md",color:P="primary",density:S="default",elevation:$=0,name:q,status:A="pending",args:D,result:G,error:H,duration:I,meta:J,icon:K,open:L,defaultOpen:M=!1,onOpenChange:Q,hiddenUntilFound:V=!0,locale:W,labels:X,classNames:Y,className:Z,style:ee,children:ae,...ne}=T(j,["size","density","variant","locale"]),le=p(u,W),se=p(f,W),re={...le,...se,...X},[te,oe]=l.useState(M),ie=void 0!==L,ce=ie?L:te,me=l.useRef(A);l.useEffect(()=>{me.current===A||"error"!==A||ie||oe(!0),me.current=A},[A,ie]);const de=d("running"===A,I),ue=c(A,P),fe=void 0===K?m(A):K,pe=function(e,a,n){return"error"===e&&g(n)?n:a}(A,G,H),he=g(D)||g(pe)||g(ae),xe=r[S][E],be=t[S][E],ge=n(a,{children:[g(fe)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--n-accent)",children:fe}):null,e("span",{className:x("min-w-0 truncate font-mono font-semibold",_[E]),children:q}),e("span",{className:z,children:re[A]}),g(J)?e("span",{className:x("min-w-0 truncate text-(--neba-muted-fg)",N[E]),children:J}):null,e("span",{className:"flex-1"}),null===de?null:e("span",{className:x("shrink-0 tabular-nums text-(--neba-muted-fg)",N[E]),children:i(de,W)})]}),ve=x("flex flex-col overflow-hidden",w[E],U[C],F,v,Z??""),Ne={...B(ue,$),...ee};return he?n(s.Root,{ref:k,open:ce,onOpenChange:e=>{ie||oe(e),Q?.(e)},"data-status":A,className:ve,style:Ne,...ne,children:[n(s.Trigger,{className:x("flex w-full cursor-pointer items-center text-start",R,xe,be,b[E],F,"hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]",Y?.header??""),children:[ge,e("span",{className:`${O} text-(--neba-muted-fg)`,children:e(o,{})})]}),e(s.Panel,{hiddenUntilFound:V,className:h,children:n("div",{className:x("flex min-w-0 flex-col gap-2 pb-4",xe,y[E],"compact"===S?"pb-2":"",Y?.body??""),children:[g(D)?e(Block,{size:E,label:re.arguments,className:Y?.args,value:D}):null,g(pe)?e(Block,{size:E,label:"error"===A&&g(H)?le.error:re.result,className:Y?.result,value:pe,accent:"error"===A}):null,ae]})})]}):e("div",{ref:k,"data-status":A,className:ve,style:Ne,...ne,children:e("div",{className:x("flex items-center",xe,be,b[E],Y?.header??""),children:ge})})});function Block({size:a,label:l,value:s,className:r,accent:t=!1}){return n("div",{className:x("flex min-w-0 flex-col gap-1",r??""),children:[e("span",{className:x("font-medium tracking-wide text-(--neba-muted-fg) uppercase",N[a]),children:l}),"string"==typeof s?e("pre",{className:x(j,"max-h-64",t?"text-(--n-accent)":""),children:s}):e("div",{className:t?"text-(--n-accent)":void 0,children:s})]})}

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

package/dist/components/tree-view/TreeView.d.ts

@@ -49,6 +49,17 @@ export interface TreeViewProps extends NebaStyleProps, Omit<React.ComponentProps
     disabled?: boolean;
     /** The name the tree is announced by. */
     label?: string;
+    /**
+     * Keeps the rows of a shut branch in the DOM — collapsed, inert and out of
+     * the order the arrow keys walk — instead of taking them out of it.
+     *
+     * A row that is not in the markup is not in a server render either, and a
+     * crawler reads the server render without opening a single branch. Turn this
+     * on for a tree that is navigation, so every `href` in it can be followed. A
+     * tree of thousands of rows pays for every one of them on the first render.
+     * @default false
+     */
+    keepMounted?: boolean;
     /** The top-level TreeItems. */
     children?: React.ReactNode;
 }
@@ -106,7 +117,8 @@ export interface TreeItemProps extends Omit<React.ComponentPropsWithoutRef<'li'>
  * keys are questions about the *tree* ("what is the next visible row", "where is
  * my parent"), and the only element that can answer them is the one holding all
  * of them. The rows the query returns are in document order, which is reading
- * order, because a shut branch is unmounted rather than hidden.
+ * order, because a shut branch is either unmounted or — under `keepMounted` —
+ * marked, and `treeRows` leaves a marked one out.
  */
 export declare const TreeView: React.ForwardRefExoticComponent<TreeViewProps & React.RefAttributes<HTMLUListElement>>;
 /**

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

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

package/dist/components/typography/Typography.d.ts

@@ -51,6 +51,13 @@ export interface TypographyProps extends Omit<React.ComponentPropsWithoutRef<'p'
      * escape hatch, so it behaves the same here as on Box.
      */
     render?: useRender.RenderProp;
+    /**
+     * A Tailwind utility here wins over the level's own size, leading, tracking,
+     * weight, margins and colour, with or without a variant. Only Tailwind's
+     * names are read: a class from your own stylesheet needs two classes or
+     * `!important` to beat the level.
+     */
+    className?: string;
     children?: React.ReactNode;
 }
 /**

package/dist/components/typography/Typography.js

@@ -1 +1 @@
-"use client";import*as e from"react";import{useRender as a}from"@base-ui/react/use-render";import{transitionProps as t}from"../../internal/animate.js";import{clampClasses as r,clampSlot as n,cx as p}from"../../internal/styles.js";const o={h1:"[&.neba-typography]:text-[1.875rem]/[1.2] [&.neba-typography]:tracking-[-0.02em]",h2:"[&.neba-typography]:text-[1.5rem]/[1.25] [&.neba-typography]:tracking-[-0.015em]",h3:"[&.neba-typography]:text-[1.25rem]/[1.3] [&.neba-typography]:tracking-[-0.01em]",h4:"[&.neba-typography]:text-[1.0625rem]/[1.41176] [&.neba-typography]:tracking-normal",h5:"[&.neba-typography]:text-[0.9375rem]/[1.46667] [&.neba-typography]:tracking-normal",h6:"[&.neba-typography]:text-[0.8125rem]/[1.53846] [&.neba-typography]:tracking-normal",lead:"[&.neba-typography]:text-[1.0625rem]/[1.64706] [&.neba-typography]:tracking-normal",body:"[&.neba-typography]:text-[0.8125rem]/[1.69231] [&.neba-typography]:tracking-normal",caption:"[&.neba-typography]:text-[0.75rem]/[1.5] [&.neba-typography]:tracking-normal",overline:"[&.neba-typography]:text-[0.6875rem]/[1.45455] [&.neba-typography]:tracking-[0.08em] uppercase"},y={h1:"semibold",h2:"semibold",h3:"semibold",h4:"semibold",h5:"semibold",h6:"semibold",lead:"regular",body:"regular",caption:"regular",overline:"medium"},h={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",lead:"p",body:"p",caption:"span",overline:"span"},b=new Set(["caption","overline"]),m={h1:"[&.neba-typography]:mb-4",h2:"[&.neba-typography]:mb-3.5",h3:"[&.neba-typography]:mb-3",h4:"[&.neba-typography]:mb-2.5",h5:"[&.neba-typography]:mb-2",h6:"[&.neba-typography]:mb-2",lead:"[&.neba-typography]:mb-4",body:"[&.neba-typography]:mb-3",caption:"[&.neba-typography]:mb-2",overline:"[&.neba-typography]:mb-2"},g={regular:"[&.neba-typography]:font-normal",medium:"[&.neba-typography]:font-medium",semibold:"[&.neba-typography]:font-semibold",bold:"[&.neba-typography]:font-bold"},i={start:"text-start",center:"text-center",end:"text-end",justify:"text-justify"};export const Typography=/*@__PURE__*/e.forwardRef(function Typography({level:l="body",color:s,weight:c,align:d,lines:u,gutter:x=!1,transition:f,render:k,className:v,style:j,children:w,...N},T){const E=t(f),R=p("neba-typography",o[l],g[c??y[l]],d?i[d]:"","span"!==h[l]||!d&&!x||void 0!==u&&u>1?"":"block",u?r(u):"",x?m[l]:"[&.neba-typography]:my-0",s?"[&.neba-typography]:text-(--n-accent)":b.has(l)?"[&.neba-typography]:text-(--neba-muted-fg)":"",E.className,v??"");return a({render:k??e.createElement(h[l]),ref:T,props:{className:R,style:s?{"--n-accent":`var(--neba-${s}-accent)`,...n(u),...E.style,...j}:{...n(u),...E.style,...j},children:w,...N}})});
+"use client";import*as e from"react";import{useRender as t}from"@base-ui/react/use-render";import{transitionProps as n}from"../../internal/animate.js";import{COLOR as r,FONT_SIZE as a,FONT_WEIGHT as i,LETTER_SPACING as o,LINE_HEIGHT as l,MARGIN_BOTTOM as g,MARGIN_TOP as h,overriddenBy as m}from"../../internal/overrides.js";import{clampClasses as p,clampSlot as s,cx as c}from"../../internal/styles.js";const d={h1:{size:"1.875rem",leading:"1.2",tracking:"-0.02em"},h2:{size:"1.5rem",leading:"1.25",tracking:"-0.015em"},h3:{size:"1.25rem",leading:"1.3",tracking:"-0.01em"},h4:{size:"1.0625rem",leading:"1.41176",tracking:"normal"},h5:{size:"0.9375rem",leading:"1.46667",tracking:"normal"},h6:{size:"0.8125rem",leading:"1.53846",tracking:"normal"},lead:{size:"1.0625rem",leading:"1.64706",tracking:"normal"},body:{size:"0.8125rem",leading:"1.69231",tracking:"normal"},caption:{size:"0.75rem",leading:"1.5",tracking:"normal"},overline:{size:"0.6875rem",leading:"1.45455",tracking:"0.08em"}},y={h1:"semibold",h2:"semibold",h3:"semibold",h4:"semibold",h5:"semibold",h6:"semibold",lead:"regular",body:"regular",caption:"regular",overline:"medium"},b={regular:"var(--font-weight-normal, 400)",medium:"var(--font-weight-medium, 500)",semibold:"var(--font-weight-semibold, 600)",bold:"var(--font-weight-bold, 700)"},u={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",lead:"p",body:"p",caption:"span",overline:"span"},w=new Set(["caption","overline"]),f={h1:4,h2:3.5,h3:3,h4:2.5,h5:2,h6:2,lead:4,body:3,caption:2,overline:2},k=[[a,"[&.neba-typography]:text-(length:--n-type-size)","[:where(&)]:text-(length:--n-type-size)"],[l,"[&.neba-typography]:leading-(--n-type-leading)","[:where(&)]:leading-(--n-type-leading)"],[o,"[&.neba-typography]:tracking-(--n-type-tracking)","[:where(&)]:tracking-(--n-type-tracking)"],[i,"[&.neba-typography]:font-(weight:--n-type-weight)","[:where(&)]:font-(weight:--n-type-weight)"],[g,"[&.neba-typography]:mb-(--n-type-gutter)","[:where(&)]:mb-(--n-type-gutter)"]],v={start:"text-start",center:"text-center",end:"text-end",justify:"text-justify"};export const Typography=/*@__PURE__*/e.forwardRef(function Typography({level:a="body",color:i,weight:o,align:l,lines:g,gutter:z=!1,transition:x,render:j,className:N,style:T,children:$,...E},M){const R=n(x),S=e.useMemo(()=>m(N),[N]),q=d[a],A=w.has(a),B=c("neba-typography",...k.map(([e,t,n])=>S&e?n:t),z?"":S&h?"[:where(&)]:mt-0":"[&.neba-typography]:mt-0","overline"===a?"uppercase":"",l?v[l]:"","span"!==u[a]||!l&&!z||void 0!==g&&g>1?"":"block",g?p(g):"",i?S&r?"[:where(&)]:text-(--n-accent)":"[&.neba-typography]:text-(--n-accent)":A?S&r?"[:where(&)]:text-(--neba-muted-fg)":"[&.neba-typography]:text-(--neba-muted-fg)":"",R.className,N??"");return t({render:j??e.createElement(u[a]),ref:M,props:{className:B,style:{"--n-type-size":q.size,"--n-type-leading":q.leading,"--n-type-tracking":q.tracking,"--n-type-weight":b[o??y[a]],"--n-type-gutter":z?`calc(var(--spacing, 0.25rem) * ${f[a]})`:"0",...i?{"--n-accent":`var(--neba-${i}-accent)`}:null,...s(g),...R.style,...T},children:$,...E}})});

package/dist/components/window-pane/WindowPane.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as i from"react";import{useRender as o}from"@base-ui/react/use-render";import{beginPointerDrag as r,drawnScale as s}from"../../internal/drag.js";import{actionMessages as a,useMessages as l,windowMessages as d}from"../../internal/i18n.js";import{cx as c,hasContent as u,iconClasses as h,surfaceClasses as m}from"../../internal/styles.js";import{WindowControls as f,orderControls as g,windowChrome as w,windowMetrics as p,windowSlots as b}from"../../internal/window.js";import{inertValue as x}from"../../internal/inert.js";import{useStyleDefaults as v}from"../../internal/defaults.js";function y(e,t,n){const[o,r]=i.useState(t),s=void 0!==e;return[s?e:o,i.useCallback(e=>{s||r(e),n?.(e)},[s,n])]}const z=[{edge:"n",className:"inset-x-3 top-0 h-1.5 cursor-ns-resize"},{edge:"s",className:"inset-x-3 bottom-0 h-1.5 cursor-ns-resize"},{edge:"w",className:"inset-y-3 left-0 w-1.5 cursor-ew-resize"},{edge:"e",className:"inset-y-3 right-0 w-1.5 cursor-ew-resize"},{edge:"nw",className:"top-0 left-0 size-3 cursor-nwse-resize"},{edge:"ne",className:"top-0 right-0 size-3 cursor-nesw-resize"},{edge:"sw",className:"bottom-0 left-0 size-3 cursor-nesw-resize"},{edge:"se",className:"right-0 bottom-0 size-3 cursor-nwse-resize"}],M=[];export const WindowPane=/*@__PURE__*/i.forwardRef(function WindowPane(E,N){const{os:S="macos",title:H,icon:k,actions:C,controls:L=!0,size:W="md",color:j="primary",accent:I=!1,transparency:P=0,active:D,elevation:T=2,position:A="static",draggable:O=!1,resizable:R=!1,width:B,height:X,minWidth:$=180,minHeight:F,offset:Y,defaultOffset:_,onOffsetChange:q,onResize:K,open:U,defaultOpen:G=!0,onOpenChange:J,minimized:Q,defaultMinimized:V=!1,onMinimizedChange:Z,maximized:ee,defaultMaximized:te=!1,onMaximizedChange:ne,scroll:ie=!0,locale:oe,minimizeLabel:re,maximizeLabel:se,restoreLabel:ae,closeLabel:le,resizeLabel:de,render:ce,className:ue,style:he,children:me,...fe}=v(E,["size","locale"]),ge=l(d,oe),we=i.useId(),pe=l(a,oe),be=w(S),xe=p(S,W),ve=i.useId(),[ye,ze]=y(U,G,J),[Me,Ee]=y(Q,V,Z),[Ne,Se]=y(ee,te,ne),[He,ke]=y(Y,_??{x:0,y:0},q),[Ce,Le]=i.useState(null),[We,je]=i.useState({width:B,height:X});We.width===B&&We.height===X||(je({width:B,height:X}),Le(null));const[Ie,Pe]=i.useState(!0),De=D??Ie,[Te,Ae]=i.useState(null),[Oe,Re]=i.useState(null),[Be,Xe]=i.useState(!1),[$e,Fe]=i.useState(!1),[Ye,_e]=i.useState(ye);Ye!==ye&&(_e(ye),Fe(!ye)),i.useEffect(()=>{if(!$e)return;const e=window.setTimeout(()=>Fe(!1),260);return()=>window.clearTimeout(e)},[$e]);const qe=i.useRef(null),Ke=i.useCallback(e=>{qe.current=e,"function"==typeof N?N(e):N&&(N.current=e)},[N]);i.useEffect(()=>{if(void 0!==D||!ye)return;const e=qe.current;if(!e)return;const t=e=>Pe(e);M.push(t);const n=n=>{const i=n.target;if(!(i instanceof Node))return;if(e.contains(i))return M.splice(M.indexOf(t),1),M.push(t),void Pe(!0);const o=i instanceof Element?i:i.parentElement;o?.closest(".neba-window")&&Pe(!1)};return document.addEventListener("pointerdown",n,!0),document.addEventListener("focusin",n,!0),()=>{document.removeEventListener("pointerdown",n,!0),document.removeEventListener("focusin",n,!0);const e=M.indexOf(t),i=e===M.length-1;M.splice(e,1),i&&M[M.length-1]?.(!0)}},[D,ye]);const Ue=i.useRef(null);function Ge(e,t){if(0!==e.button)return;Ue.current?.();const n=e.currentTarget,i=e.clientX,o=e.clientY,a=qe.current,l=a?s(a):{x:1,y:1};Xe(!0);const d=()=>{Ue.current=null,Xe(!1)},c=r({target:n,pointerId:e.pointerId,onMove:e=>t((e.clientX-i)/l.x,(e.clientY-o)/l.y),onEnd:d});Ue.current=()=>{c(),d()}}i.useEffect(()=>()=>Ue.current?.(),[]);const Je={width:Math.max(0,$),height:Math.max(xe.bar,F??xe.bar)};function Qe(e){Le(e),K?.(e)}const Ve=g(S,!0===L?["minimize","maximize","close"]:!1===L?[]:L),Ze=Ve.includes("maximize");i.useLayoutEffect(()=>{if(!Me||null!==Te)return;const e=qe.current,t=e?.firstElementChild;e&&t instanceof HTMLElement&&Ae(t.offsetHeight+(e.offsetHeight-e.clientHeight))},[Me,Te]),i.useEffect(()=>{if(Me||null===Oe)return;const e=window.setTimeout(()=>Re(null),400);return()=>window.clearTimeout(e)},[Me,Oe]);const et={minimize:re??ge.minimize,maximize:se??ge.maximize,restore:ae??ge.restore,close:le??pe.close},tt=e(f,{os:S,metrics:xe,controls:Ve,maximized:Ne,active:De,labels:et,onCommand:function(e){"close"===e?ze(!1):"minimize"===e?function(e){const t=qe.current,n=t?.firstElementChild;if(t&&n instanceof HTMLElement&&Ae(n.offsetHeight+(t.offsetHeight-t.clientHeight)),e&&void 0===(Ce?.height??X)&&t)return Re(t.offsetHeight),void requestAnimationFrame(()=>Ee(!0));Ee(e)}(!Me):Se(!Ne)}}),nt=u(H)?e("span",{id:ve,className:"min-w-0 truncate",children:H}):null,it=u(k)?e("span",{className:"flex shrink-0 items-center",children:k}):null,ot=t("div",{className:c("relative flex shrink-0 items-center select-none",h,O&&!Ne?"cursor-grab touch-none active:cursor-grabbing":""),style:{height:xe.bar,textShadow:"var(--n-window-bar-shadow)",fontWeight:xe.weight,paddingInlineStart:xe.padX,paddingInlineEnd:xe.padEnd,gap:Math.round(.7*xe.title),fontSize:xe.title,backgroundColor:"var(--n-window-bar)",backgroundImage:"var(--n-window-bar-image)",color:"var(--n-window-bar-fg)",borderBlockEnd:be.rule?"1px solid var(--n-window-line)":void 0},onPointerDown:function(e){if(!O||Ne)return;const t={...He},n=qe.current,i="fixed"===A?{width:document.documentElement.clientWidth,height:document.documentElement.clientHeight}:"absolute"===A&&n?.offsetParent instanceof HTMLElement?{width:n.offsetParent.clientWidth,height:n.offsetParent.clientHeight}:null,o=n?.offsetWidth??0,r=Math.min(o,48);Ge(e,(e,n)=>{const s=t.x+e,a=t.y+n;ke(i?{x:Math.min(Math.max(s,r-o),i.width-r),y:Math.min(Math.max(a,0),Math.max(0,i.height-xe.bar))}:{x:s,y:a})})},onDoubleClick:Ze?()=>Se(!Ne):void 0,children:["start"===be.controlsSide?tt:null,"center"===be.titleAlign?e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-x-0 flex items-center justify-center",style:{paddingInline:xe.controlsWidth(Ve.length)+2*xe.padX},children:t("span",{className:"flex min-w-0 items-center",style:{gap:Math.round(.5*xe.title)},children:[it,nt]})}):t(n,{children:[it,nt]}),e("span",{className:"flex-1"}),u(C)?e("span",{className:"flex shrink-0 items-center",style:{gap:Math.round(.5*xe.title)},onPointerDown:e=>e.stopPropagation(),onDoubleClick:e=>e.stopPropagation(),children:C}):null,"end"===be.controlsSide?tt:null]}),rt=Ne?{left:0,top:0,width:"100%",height:"100%"}:{left:He.x,top:He.y,width:Ce?.width??B,height:Me?Te??xe.bar:Ce?.height??X??Oe??void 0},st=o({render:ce,ref:Ke,props:{role:"group","aria-labelledby":nt?ve:void 0,className:c("neba-window relative flex min-w-0 flex-col overflow-hidden",P>0?m:"",be.glass&&0===P?"[backdrop-filter:var(--neba-blur)]":"","[transition-property:left,top,width,height,opacity,box-shadow,background-color,border-color,border-radius]","[transition-duration:var(--neba-duration-window)]","[transition-timing-function:var(--neba-ease)]","motion-reduce:[transition-duration:0ms]","data-[gesture]:[transition-property:none]",ue),"data-gesture":Be?"":void 0,inert:x(!ye),style:{opacity:ye?void 0:0,...b({os:S,color:j,accent:I,transparency:P,active:De,elevation:T}),position:"static"===A?"relative":A,...rt,borderRadius:Ne?0:`${xe.radius}px ${xe.radius}px ${xe.radiusBottom}px ${xe.radiusBottom}px`,borderStyle:"solid",borderWidth:xe.frame,borderColor:"var(--n-window-line)",backgroundColor:"var(--n-window-band)",boxShadow:"var(--n-window-shadow), var(--neba-plate-glass)",...he},children:t(n,{children:[ot,e("div",{className:c("min-h-0 flex-1",ie?"overflow-auto":"overflow-hidden"),style:{backgroundColor:"var(--n-window-body)",marginInline:xe.band.side,marginBottom:xe.band.bottom,boxShadow:xe.band.side>0?"inset 0 0 0 1px rgb(0 0 0 / 0.12)":void 0},inert:x(Me),children:me}),!R||Ne||Me?null:e("span",{id:we,hidden:!0,children:ge.resizeHint}),!R||Ne||Me?null:z.map(t=>{const n="se"===t.edge;return e("div",{role:n?"button":void 0,tabIndex:n?0:void 0,"aria-label":n?de??ge.resize:void 0,"aria-describedby":n?we:void 0,"aria-hidden":n?void 0:"true",className:c("absolute z-10 touch-none",t.className,n?"neba-hit":"",n?"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]":""),onPointerDown:e=>function(e,t){const n=qe.current;if(!n||Ne)return;const i={width:n.offsetWidth,height:n.offsetHeight,x:He.x,y:He.y},o=e.includes("e"),r=e.includes("w"),s=e.includes("n"),a=e.includes("s");Ge(t,(e,t)=>{let{width:n,height:l}=i,{x:d,y:c}=i;o&&(n=Math.max(Je.width,i.width+e)),a&&(l=Math.max(Je.height,i.height+t)),r&&(n=Math.max(Je.width,i.width-e),d=i.x+(i.width-n)),s&&(l=Math.max(Je.height,i.height-t),c=i.y+(i.height-l)),Qe({width:n,height:l}),(r||s)&&ke({x:d,y:c})})}(t.edge,e),onKeyDown:n?e=>{const t={ArrowRight:[16,0],ArrowLeft:[-16,0],ArrowDown:[0,16],ArrowUp:[0,-16]}[e.key];t&&(e.preventDefault(),function(e,t){const n=qe.current;n&&Qe({width:Math.max(Je.width,n.offsetWidth+e),height:Math.max(Je.height,n.offsetHeight+t)})}(t[0],t[1]))}:void 0},t.edge)})]}),...fe}});return ye||$e?st:null});
+"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as i from"react";import{useLayoutEffectOnClient as o}from"../../internal/layout-effect.js";import{useRender as r}from"@base-ui/react/use-render";import{beginPointerDrag as s,drawnScale as a}from"../../internal/drag.js";import{actionMessages as l,useMessages as d,windowMessages as c}from"../../internal/i18n.js";import{cx as u,hasContent as h,iconClasses as m,surfaceClasses as f}from"../../internal/styles.js";import{WindowControls as g,orderControls as w,windowChrome as p,windowMetrics as b,windowSlots as x}from"../../internal/window.js";import{inertValue as v}from"../../internal/inert.js";import{useStyleDefaults as y}from"../../internal/defaults.js";function z(e,t,n){const[o,r]=i.useState(t),s=void 0!==e;return[s?e:o,i.useCallback(e=>{s||r(e),n?.(e)},[s,n])]}const M=[{edge:"n",className:"inset-x-3 top-0 h-1.5 cursor-ns-resize"},{edge:"s",className:"inset-x-3 bottom-0 h-1.5 cursor-ns-resize"},{edge:"w",className:"inset-y-3 left-0 w-1.5 cursor-ew-resize"},{edge:"e",className:"inset-y-3 right-0 w-1.5 cursor-ew-resize"},{edge:"nw",className:"top-0 left-0 size-3 cursor-nwse-resize"},{edge:"ne",className:"top-0 right-0 size-3 cursor-nesw-resize"},{edge:"sw",className:"bottom-0 left-0 size-3 cursor-nesw-resize"},{edge:"se",className:"right-0 bottom-0 size-3 cursor-nwse-resize"}],E=[];export const WindowPane=/*@__PURE__*/i.forwardRef(function WindowPane(N,S){const{os:H="macos",title:k,icon:C,actions:L,controls:j=!0,size:W="md",color:I="primary",accent:P=!1,transparency:D=0,active:T,elevation:A=2,position:O="static",draggable:R=!1,resizable:B=!1,width:X,height:$,minWidth:F=180,minHeight:Y,offset:_,defaultOffset:q,onOffsetChange:K,onResize:U,open:G,defaultOpen:J=!0,onOpenChange:Q,minimized:V,defaultMinimized:Z=!1,onMinimizedChange:ee,maximized:te,defaultMaximized:ne=!1,onMaximizedChange:ie,scroll:oe=!0,locale:re,minimizeLabel:se,maximizeLabel:ae,restoreLabel:le,closeLabel:de,resizeLabel:ce,render:ue,className:he,style:me,children:fe,...ge}=y(N,["size","locale"]),we=d(c,re),pe=i.useId(),be=d(l,re),xe=p(H),ve=b(H,W),ye=i.useId(),[ze,Me]=z(G,J,Q),[Ee,Ne]=z(V,Z,ee),[Se,He]=z(te,ne,ie),[ke,Ce]=z(_,q??{x:0,y:0},K),[Le,je]=i.useState(null),[We,Ie]=i.useState({width:X,height:$});We.width===X&&We.height===$||(Ie({width:X,height:$}),je(null));const[Pe,De]=i.useState(!0),Te=T??Pe,[Ae,Oe]=i.useState(null),[Re,Be]=i.useState(null),[Xe,$e]=i.useState(!1),[Fe,Ye]=i.useState(!1),[_e,qe]=i.useState(ze);_e!==ze&&(qe(ze),Ye(!ze)),i.useEffect(()=>{if(!Fe)return;const e=window.setTimeout(()=>Ye(!1),260);return()=>window.clearTimeout(e)},[Fe]);const Ke=i.useRef(null),Ue=i.useCallback(e=>{Ke.current=e,"function"==typeof S?S(e):S&&(S.current=e)},[S]);i.useEffect(()=>{if(void 0!==T||!ze)return;const e=Ke.current;if(!e)return;const t=e=>De(e);E.push(t);const n=n=>{const i=n.target;if(!(i instanceof Node))return;if(e.contains(i))return E.splice(E.indexOf(t),1),E.push(t),void De(!0);const o=i instanceof Element?i:i.parentElement;o?.closest(".neba-window")&&De(!1)};return document.addEventListener("pointerdown",n,!0),document.addEventListener("focusin",n,!0),()=>{document.removeEventListener("pointerdown",n,!0),document.removeEventListener("focusin",n,!0);const e=E.indexOf(t),i=e===E.length-1;E.splice(e,1),i&&E[E.length-1]?.(!0)}},[T,ze]);const Ge=i.useRef(null);function Je(e,t){if(0!==e.button)return;Ge.current?.();const n=e.currentTarget,i=e.clientX,o=e.clientY,r=Ke.current,l=r?a(r):{x:1,y:1};$e(!0);const d=()=>{Ge.current=null,$e(!1)},c=s({target:n,pointerId:e.pointerId,onMove:e=>t((e.clientX-i)/l.x,(e.clientY-o)/l.y),onEnd:d});Ge.current=()=>{c(),d()}}i.useEffect(()=>()=>Ge.current?.(),[]);const Qe={width:Math.max(0,F),height:Math.max(ve.bar,Y??ve.bar)};function Ve(e){je(e),U?.(e)}const Ze=w(H,!0===j?["minimize","maximize","close"]:!1===j?[]:j),et=Ze.includes("maximize");o(()=>{if(!Ee||null!==Ae)return;const e=Ke.current,t=e?.firstElementChild;e&&t instanceof HTMLElement&&Oe(t.offsetHeight+(e.offsetHeight-e.clientHeight))},[Ee,Ae]),i.useEffect(()=>{if(Ee||null===Re)return;const e=window.setTimeout(()=>Be(null),400);return()=>window.clearTimeout(e)},[Ee,Re]);const tt={minimize:se??we.minimize,maximize:ae??we.maximize,restore:le??we.restore,close:de??be.close},nt=e(g,{os:H,metrics:ve,controls:Ze,maximized:Se,active:Te,labels:tt,onCommand:function(e){"close"===e?Me(!1):"minimize"===e?function(e){const t=Ke.current,n=t?.firstElementChild;if(t&&n instanceof HTMLElement&&Oe(n.offsetHeight+(t.offsetHeight-t.clientHeight)),e&&void 0===(Le?.height??$)&&t)return Be(t.offsetHeight),void requestAnimationFrame(()=>Ne(!0));Ne(e)}(!Ee):He(!Se)}}),it=h(k)?e("span",{id:ye,className:"min-w-0 truncate",children:k}):null,ot=h(C)?e("span",{className:"flex shrink-0 items-center",children:C}):null,rt=t("div",{className:u("relative flex shrink-0 items-center select-none",m,R&&!Se?"cursor-grab touch-none active:cursor-grabbing":""),style:{height:ve.bar,textShadow:"var(--n-window-bar-shadow)",fontWeight:ve.weight,paddingInlineStart:ve.padX,paddingInlineEnd:ve.padEnd,gap:Math.round(.7*ve.title),fontSize:ve.title,backgroundColor:"var(--n-window-bar)",backgroundImage:"var(--n-window-bar-image)",color:"var(--n-window-bar-fg)",borderBlockEnd:xe.rule?"1px solid var(--n-window-line)":void 0},onPointerDown:function(e){if(!R||Se)return;const t={...ke},n=Ke.current,i="fixed"===O?{width:document.documentElement.clientWidth,height:document.documentElement.clientHeight}:"absolute"===O&&n?.offsetParent instanceof HTMLElement?{width:n.offsetParent.clientWidth,height:n.offsetParent.clientHeight}:null,o=n?.offsetWidth??0,r=Math.min(o,48);Je(e,(e,n)=>{const s=t.x+e,a=t.y+n;Ce(i?{x:Math.min(Math.max(s,r-o),i.width-r),y:Math.min(Math.max(a,0),Math.max(0,i.height-ve.bar))}:{x:s,y:a})})},onDoubleClick:et?()=>He(!Se):void 0,children:["start"===xe.controlsSide?nt:null,"center"===xe.titleAlign?e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-x-0 flex items-center justify-center",style:{paddingInline:ve.controlsWidth(Ze.length)+2*ve.padX},children:t("span",{className:"flex min-w-0 items-center",style:{gap:Math.round(.5*ve.title)},children:[ot,it]})}):t(n,{children:[ot,it]}),e("span",{className:"flex-1"}),h(L)?e("span",{className:"flex shrink-0 items-center",style:{gap:Math.round(.5*ve.title)},onPointerDown:e=>e.stopPropagation(),onDoubleClick:e=>e.stopPropagation(),children:L}):null,"end"===xe.controlsSide?nt:null]}),st=Se?{left:0,top:0,width:"100%",height:"100%"}:{left:ke.x,top:ke.y,width:Le?.width??X,height:Ee?Ae??ve.bar:Le?.height??$??Re??void 0},at=r({render:ue,ref:Ue,props:{role:"group","aria-labelledby":it?ye:void 0,className:u("neba-window relative flex min-w-0 flex-col overflow-hidden",D>0?f:"",xe.glass&&0===D?"[backdrop-filter:var(--neba-blur)]":"","[transition-property:left,top,width,height,opacity,box-shadow,background-color,border-color,border-radius]","[transition-duration:var(--neba-duration-window)]","[transition-timing-function:var(--neba-ease)]","motion-reduce:[transition-duration:0ms]","data-[gesture]:[transition-property:none]",he),"data-gesture":Xe?"":void 0,inert:v(!ze),style:{opacity:ze?void 0:0,...x({os:H,color:I,accent:P,transparency:D,active:Te,elevation:A}),position:"static"===O?"relative":O,...st,borderRadius:Se?0:`${ve.radius}px ${ve.radius}px ${ve.radiusBottom}px ${ve.radiusBottom}px`,borderStyle:"solid",borderWidth:ve.frame,borderColor:"var(--n-window-line)",backgroundColor:"var(--n-window-band)",boxShadow:"var(--n-window-shadow), var(--neba-plate-glass)",...me},children:t(n,{children:[rt,e("div",{className:u("min-h-0 flex-1",oe?"overflow-auto":"overflow-hidden"),style:{backgroundColor:"var(--n-window-body)",marginInline:ve.band.side,marginBottom:ve.band.bottom,boxShadow:ve.band.side>0?"inset 0 0 0 1px rgb(0 0 0 / 0.12)":void 0},inert:v(Ee),children:fe}),!B||Se||Ee?null:e("span",{id:pe,hidden:!0,children:we.resizeHint}),!B||Se||Ee?null:M.map(t=>{const n="se"===t.edge;return e("div",{role:n?"button":void 0,tabIndex:n?0:void 0,"aria-label":n?ce??we.resize:void 0,"aria-describedby":n?pe:void 0,"aria-hidden":n?void 0:"true",className:u("absolute z-10 touch-none",t.className,n?"neba-hit":"",n?"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]":""),onPointerDown:e=>function(e,t){const n=Ke.current;if(!n||Se)return;const i={width:n.offsetWidth,height:n.offsetHeight,x:ke.x,y:ke.y},o=e.includes("e"),r=e.includes("w"),s=e.includes("n"),a=e.includes("s");Je(t,(e,t)=>{let{width:n,height:l}=i,{x:d,y:c}=i;o&&(n=Math.max(Qe.width,i.width+e)),a&&(l=Math.max(Qe.height,i.height+t)),r&&(n=Math.max(Qe.width,i.width-e),d=i.x+(i.width-n)),s&&(l=Math.max(Qe.height,i.height-t),c=i.y+(i.height-l)),Ve({width:n,height:l}),(r||s)&&Ce({x:d,y:c})})}(t.edge,e),onKeyDown:n?e=>{const t={ArrowRight:[16,0],ArrowLeft:[-16,0],ArrowDown:[0,16],ArrowUp:[0,-16]}[e.key];t&&(e.preventDefault(),function(e,t){const n=Ke.current;n&&Ve({width:Math.max(Qe.width,n.offsetWidth+e),height:Math.max(Qe.height,n.offsetHeight+t)})}(t[0],t[1]))}:void 0},t.edge)})]}),...ge}});return ze||Fe?at:null});

package/dist/hooks/useElementSize.js

@@ -1 +1 @@
-"use client";import*as t from"react";import{attachedRef as e,observeResize as i}from"../internal/observe.js";export function useElementSize(){const[n,h]=t.useState(null),[o]=t.useState(()=>e(h)),[r,s]=t.useState({width:0,height:0});return t.useLayoutEffect(()=>{if(!n)return;const t=()=>{const t=function(t){return t instanceof HTMLElement?{width:t.offsetWidth,height:t.offsetHeight}:t.getBoundingClientRect()}(n);s(e=>e.width===t.width&&e.height===t.height?e:{width:t.width,height:t.height})};return t(),i(n,t)},[n]),[o,r]}
+"use client";import*as t from"react";import{useLayoutEffectOnClient as e}from"../internal/layout-effect.js";import{attachedRef as i,observeResize as n}from"../internal/observe.js";export function useElementSize(){const[h,r]=t.useState(null),[o]=t.useState(()=>i(r)),[s,u]=t.useState({width:0,height:0});return e(()=>{if(!h)return;const t=()=>{const t=function(t){return t instanceof HTMLElement?{width:t.offsetWidth,height:t.offsetHeight}:t.getBoundingClientRect()}(h);u(e=>e.width===t.width&&e.height===t.height?e:{width:t.width,height:t.height})};return t(),n(h,t)},[h]),[o,s]}