neba 1.8.1 → 1.10.0

package/dist/components/menu/Menu.d.ts

@@ -32,6 +32,11 @@ export interface MenuProps extends MenuSurfaceProps {
     sideOffset?: number;
     /**
      * Whether the page behind is taken away while the menu is open.
+     *
+     * Left undefined rather than defaulted here on purpose: Base UI's own default
+     * is the same `true`, and it warns when the prop is set on a menu that turns
+     * out to be nested — which is every menu on a [Menubar](./menubar) and every
+     * submenu. Not passing it is how the default stays a default.
      * @default true
      */
     modal?: boolean;
@@ -71,8 +76,15 @@ export interface MenuItemProps {
     onClick?: (event: React.MouseEvent<HTMLElement>) => void;
     /** Renders the row as a real `<a>`. A menu of links has to be links. */
     href?: string;
-    /** Where the link opens — `_blank` and the rest. Ignored without `href`. */
+    /**
+     * Where the link opens — `_blank` and the rest. Ignored without `href`.
+     *
+     * Anything other than this tab also gets `rel="noopener noreferrer"`, merged
+     * with whatever `rel` was asked for, exactly as on [TextLink].
+     */
     target?: string;
+    /** The link's `rel`. The two tokens a new tab needs are added to it. */
+    rel?: string;
     /** Content before the label — an icon, a swatch, a check. */
     startIcon?: React.ReactNode;
     /** Content after the label, before any `shortcut`. */
@@ -123,7 +135,7 @@ export interface MenuGroupProps {
     children?: React.ReactNode;
     className?: string;
 }
-export interface MenuCheckboxItemProps extends Omit<MenuItemProps, 'href' | 'target' | 'startIcon' | 'onClick'> {
+export interface MenuCheckboxItemProps extends Omit<MenuItemProps, 'href' | 'target' | 'rel' | 'startIcon' | 'onClick'> {
     checked?: boolean;
     defaultChecked?: boolean;
     onCheckedChange?: (checked: boolean) => void;
@@ -143,7 +155,7 @@ export interface MenuRadioGroupProps {
     children?: React.ReactNode;
     className?: string;
 }
-export interface MenuRadioItemProps extends Omit<MenuItemProps, 'href' | 'target' | 'startIcon' | 'onClick'> {
+export interface MenuRadioItemProps extends Omit<MenuItemProps, 'href' | 'target' | 'rel' | 'startIcon' | 'onClick'> {
     /** What this row sets the group to. */
     value: string | number;
     /** @default false */
@@ -158,7 +170,7 @@ export type MenuSeparatorProps = React.ComponentPropsWithoutRef<'div'>;
  * links that are not links cannot be opened in a new tab, cannot be copied, and
  * tells a screen reader the wrong thing about every one of them.
  */
-export declare function MenuItem({ onClick, href, target, startIcon, endIcon, shortcut, description, color, closeOnClick, disabled, label, children, className, style }: MenuItemProps): React.JSX.Element;
+export declare function MenuItem({ onClick, href, target, rel, startIcon, endIcon, shortcut, description, color, closeOnClick, disabled, label, children, className, style }: MenuItemProps): React.JSX.Element;
 /** A row that ticks. The tick lands in the same slot a `startIcon` would. */
 export declare function MenuCheckboxItem({ checked, defaultChecked, onCheckedChange, endIcon, shortcut, description, color, closeOnClick, disabled, label, children, className, style }: MenuCheckboxItemProps): React.JSX.Element;
 /** One choice out of a set. Wraps the rows that make up the set. */

package/dist/components/menu/Menu.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n,Fragment as l}from"react/jsx-runtime";import*as t from"react";import{Menu as a}from"@base-ui/react/menu";import{ContextMenu as s}from"@base-ui/react/context-menu";import{MenuContext as o}from"../../internal/menu.js";import{CheckIcon as i,ChevronIcon as r,DotIcon as c}from"../../internal/icons.js";import{controlTextLeadingClasses as d,gapClasses as u,hasContent as m,iconClasses as p,metaTextClasses as h,radiusClasses as f,surfaceClasses as x,surfaceSlots as b,transitionClasses as g}from"../../internal/styles.js";const y=[x,"max-h-[min(24rem,var(--available-height))] min-w-40 overflow-y-auto overscroll-contain","border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),N={default:{xs:"px-1.5 py-0.5",sm:"px-2 py-1",md:"px-2.5 py-1.5",lg:"px-3 py-2",xl:"px-3.5 py-2.5"},compact:{xs:"px-1 py-0.5",sm:"px-1.5 py-0.5",md:"px-2 py-1",lg:"px-2.5 py-1",xl:"px-3 py-1.5"}},C={xs:f.xs,sm:f.xs,md:f.sm,lg:f.sm,xl:f.md};function v(e,n,l,t){return["relative flex w-full cursor-pointer items-center select-none",l?"text-(--n-accent)":"text-(--neba-fg)",N[n][e],C[e],u[e],d[e],g,p,"data-[highlighted]:bg-(--n-soft-hover)","data-[popup-open]:bg-(--n-soft)","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]",t??""].filter(Boolean).join(" ")}const k="flex h-[1lh] w-[1.2em] shrink-0 items-center justify-center";function O({children:l,description:t,size:a}){return m(t)?n("span",{className:"flex min-w-0 flex-1 flex-col text-start",children:[e("span",{className:"truncate",children:l}),e("span",{className:`truncate text-(--neba-muted-fg) ${h[a]}`,children:t})]}):e("span",{className:"min-w-0 flex-1 truncate text-start",children:l})}export function MenuItem({onClick:s,href:i,target:r,startIcon:c,endIcon:d,shortcut:u,description:p,color:f,closeOnClick:x=!0,disabled:g=!1,label:y,children:N,className:C,style:j}){const z=t.useContext(o),{size:I,density:M}=z,$=n(l,{children:[m(c)?e("span",{className:`${k} text-(--neba-muted-fg)`,children:c}):null,e(O,{description:p,size:I,children:N}),m(d)?e("span",{className:`${k} text-(--neba-muted-fg)`,children:d}):null,m(u)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${h[I]}`,children:u}):null]}),w=f?b(f,0):void 0,P=w||j?{...w,...j}:void 0;return void 0!==i?e(a.LinkItem,{href:i,target:r,label:y,closeOnClick:x,onClick:s,className:v(I,M,Boolean(f),C),style:P,children:$}):e(a.Item,{disabled:g,label:y,closeOnClick:x,onClick:s,className:v(I,M,Boolean(f),C),style:P,children:$})}export function MenuCheckboxItem({checked:l,defaultChecked:s,onCheckedChange:r,endIcon:c,shortcut:d,description:u,color:p,closeOnClick:f=!1,disabled:x=!1,label:g,children:y,className:N,style:C}){const{size:j,density:z}=t.useContext(o),I=p?b(p,0):void 0;return n(a.CheckboxItem,{checked:l,defaultChecked:s,onCheckedChange:e=>r?.(e),disabled:x,label:g,closeOnClick:f,className:v(j,z,Boolean(p),N),style:I||C?{...I,...C}:void 0,children:[e("span",{className:`${k} text-(--n-accent)`,children:e(a.CheckboxItemIndicator,{className:"flex items-center justify-center",children:e(i,{})})}),e(O,{description:u,size:j,children:y}),m(c)?e("span",{className:`${k} text-(--neba-muted-fg)`,children:c}):null,m(d)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${h[j]}`,children:d}):null]})}export function MenuRadioGroup({value:n,defaultValue:l,onValueChange:t,disabled:s=!1,children:o,className:i}){return e(a.RadioGroup,{value:n,defaultValue:l,onValueChange:e=>t?.(e),disabled:s,className:i,children:o})}export function MenuRadioItem({value:l,endIcon:s,shortcut:i,description:r,color:d,closeOnClick:u=!1,disabled:p=!1,label:f,children:x,className:g,style:y}){const{size:N,density:C}=t.useContext(o),j=d?b(d,0):void 0;return n(a.RadioItem,{value:l,disabled:p,label:f,closeOnClick:u,className:v(N,C,Boolean(d),g),style:j||y?{...j,...y}:void 0,children:[e("span",{className:`${k} text-(--n-accent)`,children:e(a.RadioItemIndicator,{className:"flex items-center justify-center",children:e(c,{})})}),e(O,{description:r,size:N,children:x}),m(s)?e("span",{className:`${k} text-(--neba-muted-fg)`,children:s}):null,m(i)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${h[N]}`,children:i}):null]})}export function MenuGroup({label:l,children:s,className:i}){const{size:r,density:c}=t.useContext(o);return n(a.Group,{className:i,children:[m(l)?e(a.GroupLabel,{className:[N[c][r],h[r],"font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),children:l}):null,s]})}export function MenuSeparator({className:n,...l}){return e(a.Separator,{className:["-mx-1 my-1 h-px bg-(--n-line)",n??""].filter(Boolean).join(" "),...l})}export function MenuSubmenu({label:l,startIcon:s,disabled:i=!1,side:c="right",sideOffset:u=4,children:p,className:h,style:x}){const g=t.useContext(o),{size:N,density:C,color:O}=g;return n(a.SubmenuRoot,{children:[n(a.SubmenuTrigger,{disabled:i,className:v(N,C,!1),children:[m(s)?e("span",{className:`${k} text-(--neba-muted-fg)`,children:s}):null,e("span",{className:"min-w-0 flex-1 truncate text-start",children:l}),e("span",{className:`${k} text-(--neba-muted-fg) -rotate-90`,children:e(r,{})})]}),e(a.Portal,{children:e(a.Positioner,{className:"neba-portal z-50 [outline:none]",side:c,sideOffset:u,align:"start",children:e(a.Popup,{className:[y,f[N],d[N],h??""].filter(Boolean).join(" "),style:{...b(O,3),...x},children:p})})})]})}export function Menu({size:l="md",color:s="primary",density:i="default",trigger:r,open:c,defaultOpen:u,onOpenChange:m,side:p="bottom",align:h="start",sideOffset:x=6,modal:g=!0,openOnHover:N=!1,loopFocus:C=!0,disabled:v=!1,className:k,style:O,children:j}){const z=t.useMemo(()=>({size:l,color:s,density:i}),[l,s,i]);return e(o.Provider,{value:z,children:n(a.Root,{open:c,defaultOpen:u,onOpenChange:e=>m?.(e),modal:g,loopFocus:C,disabled:v,children:[r?e(a.Trigger,{render:r,openOnHover:N,disabled:v}):null,e(a.Portal,{children:e(a.Positioner,{className:"neba-portal z-50 [outline:none]",side:p,align:h,sideOffset:x,children:e(a.Popup,{className:[y,f[l],d[l],k??""].filter(Boolean).join(" "),style:{...b(s,3),...O},children:j})})})]})})}export function ContextMenu({size:l="md",color:a="primary",density:i="default",content:r,children:c,open:u,defaultOpen:m,onOpenChange:p,loopFocus:h=!0,disabled:x=!1,className:g,style:N}){const C=t.useMemo(()=>({size:l,color:a,density:i}),[l,a,i]);return e(o.Provider,{value:C,children:n(s.Root,{open:u,defaultOpen:m,onOpenChange:e=>p?.(e),loopFocus:h,disabled:x,children:[e(s.Trigger,{children:c}),e(s.Portal,{children:e(s.Positioner,{className:"neba-portal z-50 [outline:none]",children:e(s.Popup,{className:[y,f[l],d[l],g??""].filter(Boolean).join(" "),style:{...b(a,3),...N},children:r})})})]})})}
+"use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as a from"react";import{Menu as l}from"@base-ui/react/menu";import{ContextMenu as s}from"@base-ui/react/context-menu";import{MenuContext as i}from"../../internal/menu.js";import{CheckIcon as o,ChevronIcon as r,DotIcon as c}from"../../internal/icons.js";import{safeRel as d}from"../../internal/link.js";import{controlTextLeadingClasses as u,cx as m,gapClasses as p,hasContent as h,iconClasses as x,metaTextClasses as f,radiusClasses as b,surfaceClasses as g,surfaceSlots as y,transitionClasses as N}from"../../internal/styles.js";const C=[g,"max-h-[min(24rem,var(--available-height))] min-w-40 overflow-y-auto overscroll-contain","border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),v={default:{xs:"px-1.5 py-0.5",sm:"px-2 py-1",md:"px-2.5 py-1.5",lg:"px-3 py-2",xl:"px-3.5 py-2.5"},compact:{xs:"px-1 py-0.5",sm:"px-1.5 py-0.5",md:"px-2 py-1",lg:"px-2.5 py-1",xl:"px-3 py-1.5"}},k={xs:b.xs,sm:b.xs,md:b.sm,lg:b.sm,xl:b.md};function O(e,n,t,a){return m("relative flex w-full cursor-pointer items-center select-none",t?"text-(--n-accent)":"text-(--neba-fg)",v[n][e],k[e],p[e],u[e],N,x,"data-[highlighted]:bg-(--n-soft-hover)","data-[popup-open]:bg-(--n-soft)","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]",a??"")}const z="flex h-[1lh] w-[1.2em] shrink-0 items-center justify-center";function I({children:t,description:a,size:l}){return h(a)?n("span",{className:"flex min-w-0 flex-1 flex-col text-start",children:[e("span",{className:"truncate",children:t}),e("span",{className:`truncate text-(--neba-muted-fg) ${f[l]}`,children:a})]}):e("span",{className:"min-w-0 flex-1 truncate text-start",children:t})}export function MenuItem({onClick:s,href:o,target:r,rel:c,startIcon:u,endIcon:m,shortcut:p,description:x,color:b,closeOnClick:g=!0,disabled:N=!1,label:C,children:v,className:k,style:M}){const j=a.useContext(i),{size:$,density:w}=j,P=n(t,{children:[h(u)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:u}):null,e(I,{description:x,size:$,children:v}),h(m)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:m}):null,h(p)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${f[$]}`,children:p}):null]}),R=b?y(b,0):void 0,F=R||M?{...R,...M}:void 0;return void 0!==o?e(l.LinkItem,{href:o,target:r,rel:d(r,c),label:C,closeOnClick:g,onClick:s,className:O($,w,Boolean(b),k),style:F,children:P}):e(l.Item,{disabled:N,label:C,closeOnClick:g,onClick:s,className:O($,w,Boolean(b),k),style:F,children:P})}export function MenuCheckboxItem({checked:t,defaultChecked:s,onCheckedChange:r,endIcon:c,shortcut:d,description:u,color:m,closeOnClick:p=!1,disabled:x=!1,label:b,children:g,className:N,style:C}){const{size:v,density:k}=a.useContext(i),M=m?y(m,0):void 0;return n(l.CheckboxItem,{checked:t,defaultChecked:s,onCheckedChange:e=>r?.(e),disabled:x,label:b,closeOnClick:p,className:O(v,k,Boolean(m),N),style:M||C?{...M,...C}:void 0,children:[e("span",{className:`${z} text-(--n-accent)`,children:e(l.CheckboxItemIndicator,{className:"flex items-center justify-center",children:e(o,{})})}),e(I,{description:u,size:v,children:g}),h(c)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:c}):null,h(d)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${f[v]}`,children:d}):null]})}export function MenuRadioGroup({value:n,defaultValue:t,onValueChange:a,disabled:s=!1,children:i,className:o}){return e(l.RadioGroup,{value:n,defaultValue:t,onValueChange:e=>a?.(e),disabled:s,className:o,children:i})}export function MenuRadioItem({value:t,endIcon:s,shortcut:o,description:r,color:d,closeOnClick:u=!1,disabled:m=!1,label:p,children:x,className:b,style:g}){const{size:N,density:C}=a.useContext(i),v=d?y(d,0):void 0;return n(l.RadioItem,{value:t,disabled:m,label:p,closeOnClick:u,className:O(N,C,Boolean(d),b),style:v||g?{...v,...g}:void 0,children:[e("span",{className:`${z} text-(--n-accent)`,children:e(l.RadioItemIndicator,{className:"flex items-center justify-center",children:e(c,{})})}),e(I,{description:r,size:N,children:x}),h(s)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:s}):null,h(o)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${f[N]}`,children:o}):null]})}export function MenuGroup({label:t,children:s,className:o}){const{size:r,density:c}=a.useContext(i);return n(l.Group,{className:o,children:[h(t)?e(l.GroupLabel,{className:[v[c][r],f[r],"font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),children:t}):null,s]})}export function MenuSeparator({className:n,...t}){return e(l.Separator,{className:m("-mx-1 my-1 h-px bg-(--n-line)",n??""),...t})}export function MenuSubmenu({label:t,startIcon:s,disabled:o=!1,side:c="right",sideOffset:d=4,children:p,className:x,style:f}){const g=a.useContext(i),{size:N,density:v,color:k}=g;return n(l.SubmenuRoot,{children:[n(l.SubmenuTrigger,{disabled:o,className:O(N,v,!1),children:[h(s)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:s}):null,e("span",{className:"min-w-0 flex-1 truncate text-start",children:t}),e("span",{className:`${z} text-(--neba-muted-fg) -rotate-90`,children:e(r,{})})]}),e(l.Portal,{children:e(l.Positioner,{className:"neba-portal z-50 [outline:none]",side:c,sideOffset:d,align:"start",children:e(l.Popup,{className:m(C,b[N],u[N],x??""),style:{...y(k,3),...f},children:p})})})]})}export function Menu({size:t="md",color:s="primary",density:o="default",trigger:r,open:c,defaultOpen:d,onOpenChange:p,side:h="bottom",align:x="start",sideOffset:f=6,modal:g,openOnHover:N=!1,loopFocus:v=!0,disabled:k=!1,className:O,style:z,children:I}){const M=a.useMemo(()=>({size:t,color:s,density:o}),[t,s,o]);return e(i.Provider,{value:M,children:n(l.Root,{open:c,defaultOpen:d,onOpenChange:e=>p?.(e),modal:g,loopFocus:v,disabled:k,children:[r?e(l.Trigger,{render:r,openOnHover:N,disabled:k}):null,e(l.Portal,{children:e(l.Positioner,{className:"neba-portal z-50 [outline:none]",side:h,align:x,sideOffset:f,children:e(l.Popup,{className:m(C,b[t],u[t],O??""),style:{...y(s,3),...z},children:I})})})]})})}export function ContextMenu({size:t="md",color:l="primary",density:o="default",content:r,children:c,open:d,defaultOpen:p,onOpenChange:h,loopFocus:x=!0,disabled:f=!1,className:g,style:N}){const v=a.useMemo(()=>({size:t,color:l,density:o}),[t,l,o]);return e(i.Provider,{value:v,children:n(s.Root,{open:d,defaultOpen:p,onOpenChange:e=>h?.(e),loopFocus:x,disabled:f,children:[e(s.Trigger,{children:c}),e(s.Portal,{children:e(s.Positioner,{className:"neba-portal z-50 [outline:none]",children:e(s.Popup,{className:m(C,b[t],u[t],g??""),style:{...y(l,3),...N},children:r})})})]})})}

package/dist/components/menubar/Menubar.d.ts

@@ -0,0 +1,56 @@
+import * as React from 'react';
+import type { NebaOrientation, NebaStyleProps } from '../../types.js';
+export interface MenubarProps extends Pick<NebaStyleProps, 'size' | 'color' | 'density'>, Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> {
+    /**
+     * Which way the bar runs. `vertical` is the shape a side rail of menus takes;
+     * the arrow keys follow it either way.
+     * @default 'horizontal'
+     */
+    orientation?: NebaOrientation;
+    /**
+     * Whether an open menu takes the page away. On — the default, and Base UI's —
+     * an open menu is what the pointer is talking to.
+     * @default true
+     */
+    modal?: boolean;
+    /** Whether the arrow keys wrap around at the ends of the bar. @default true */
+    loopFocus?: boolean;
+    /** Disables every menu on the bar at once. */
+    disabled?: boolean;
+    /** The menus. */
+    children?: React.ReactNode;
+}
+export interface MenubarMenuProps {
+    /** The word on the bar. */
+    label: React.ReactNode;
+    /** Content before the label. Sized in `em`, so it tracks it. */
+    startIcon?: React.ReactNode;
+    /** Unavailable. The word stays on the bar and opens nothing. */
+    disabled?: boolean;
+    /** The rows, written exactly as they are inside a [Menu](./menu). */
+    children?: React.ReactNode;
+}
+/**
+ * One menu on the bar: the word, and the rows behind it.
+ *
+ * It has no `size`, `color` or `density` of its own — all three belong to the
+ * bar, which is the only place they can be set once and hold for every menu on
+ * it. The rows inside are the same `MenuItem`, `MenuSeparator`, `MenuGroup` and
+ * `MenuSubmenu` a [Menu](./menu) takes, because it is the same menu.
+ */
+export declare function MenubarMenu({ label, startIcon, disabled, children }: MenubarMenuProps): React.JSX.Element;
+/**
+ * The strip of words at the top of an application — File, Edit, View — each of
+ * which opens a menu.
+ *
+ * What makes it a bar rather than a row of separate menus is what happens once
+ * one is open: moving along the strip walks through the others instead of
+ * closing the one you left, and the arrow keys move between the menus as well as
+ * inside them. Base UI owns all of that, along with the `menubar` role.
+ *
+ * It draws no surface of its own. A menu bar sits *on* something — a
+ * [Toolbar](../surfaces/toolbar), a [WindowPane](../surfaces/window-pane)'s
+ * title bar, a [Header](../layout/header) — and a sheet under a strip that is
+ * already on a sheet is two sheets.
+ */
+export declare const Menubar: React.ForwardRefExoticComponent<MenubarProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/menubar/Menubar.js

@@ -0,0 +1 @@
+"use client";import{jsxs as e,jsx as n}from"react/jsx-runtime";import*as t from"react";import{Menubar as o}from"@base-ui/react/menubar";import{Menu as r}from"../menu/Menu.js";import{MenuContext as s}from"../../internal/menu.js";import{controlTextClasses as a,cx as i,gapClasses as l,hasContent as c,iconClasses as d,paddingXClasses as u,radiusClasses as f,transitionClasses as m}from"../../internal/styles.js";const p={xs:"h-4.5",sm:"h-5.5",md:"h-6.5",lg:"h-8",xl:"h-10"},b=["inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap font-medium leading-none","text-(--neba-fg) bg-transparent","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",m,d,"hover:bg-(--n-soft)","data-[popup-open]:bg-(--n-soft-hover) data-[popup-open]:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]","disabled:cursor-not-allowed disabled:text-(--neba-disabled-fg) disabled:hover:bg-transparent"].join(" ");export function MenubarMenu({label:o,startIcon:i,disabled:d=!1,children:m}){const{size:h,color:x,density:v}=t.useContext(s);return n(r,{size:h,color:x,density:v,disabled:d,openOnHover:!0,sideOffset:4,trigger:e("button",{type:"button",disabled:d,className:[b,p[h],a[h],l[h],u["default"===v?"compact":v][h],f[h]].join(" "),children:[c(i)?i:null,o]}),children:m})}export const Menubar=/*@__PURE__*/t.forwardRef(function({size:e="md",color:r="primary",density:a="default",orientation:c="horizontal",modal:d=!0,loopFocus:u=!0,disabled:f=!1,className:m,style:p,children:b,...h},x){const v=t.useMemo(()=>({size:e,color:r,density:a}),[e,r,a]);return n(s.Provider,{value:v,children:n(o,{ref:x,orientation:c,modal:d,loopFocus:u,disabled:f,className:i("flex items-center","vertical"===c?"flex-col items-stretch":"flex-row",l[e],m??""),style:{"--n-soft":`var(--neba-${r}-soft)`,"--n-soft-hover":`var(--neba-${r}-soft-hover)`,"--n-accent":`var(--neba-${r}-accent)`,"--n-ring":`var(--neba-${r}-ring)`,...p},...h,children:b})})});

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

@@ -0,0 +1,2 @@
+export { Menubar, MenubarMenu } from './Menubar.js';
+export type { MenubarMenuProps, MenubarProps } from './Menubar.js';

package/dist/components/menubar/index.js

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

package/dist/components/meter/Meter.d.ts

@@ -0,0 +1,52 @@
+import * as React from 'react';
+import type { NebaColor, NebaSize, NebaThreshold } from '../../types.js';
+export interface MeterProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'children'> {
+    /**
+     * How much there is. Required, and that is the whole difference from a
+     * [ProgressLinear](./progress-linear): a meter reports a quantity that is
+     * already known, so there is no indeterminate case to have a default for.
+     */
+    value: number;
+    /** @default 0 */
+    min?: number;
+    /** @default 100 */
+    max?: number;
+    /** A name for what is being measured. Read out with the value. */
+    label?: React.ReactNode;
+    /**
+     * Shows the value as text beside the bar. A percentage of the range unless
+     * `format` says otherwise.
+     * @default false
+     */
+    showValue?: boolean;
+    /**
+     * How to write the value — `Intl.NumberFormat` options, so bytes, currencies
+     * and plain counts all work. A meter usually has real units, which is when
+     * this matters more than it does on a progress bar.
+     */
+    format?: Intl.NumberFormatOptions;
+    /**
+     * Where the bar changes colour, smallest `from` first. The family of the last
+     * threshold the value has reached wins; below all of them `color` stands.
+     */
+    thresholds?: readonly NebaThreshold[];
+    /** Thickness of the groove. Nothing else on a bar has a size. @default 'md' */
+    size?: NebaSize;
+    /** The family the bar carries before any threshold is reached. @default 'primary' */
+    color?: NebaColor;
+}
+/**
+ * How much of something there is, on a scale that is known in advance — disk
+ * used, seats taken, quota spent, a password's strength.
+ *
+ * It looks exactly like a [ProgressLinear](./progress-linear) and is not one.
+ * A progress bar is about *time*: something is happening and this is how far it
+ * has got, so it may have no value at all and it is expected to move on its own.
+ * A meter is about *quantity*: the number is already known, it does not move
+ * unless the thing it measures does, and it is meaningful to say the reading is
+ * bad — which is what `thresholds` is for.
+ *
+ * Base UI's Meter owns the semantics: `role="meter"`, the value and range
+ * attributes, and formatting the number for `aria-valuetext`.
+ */
+export declare const Meter: React.ForwardRefExoticComponent<MeterProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/meter/Meter.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Meter as l}from"@base-ui/react/meter";import{barThicknessClasses as t,progressFraction as n,progressSlots as s}from"../../internal/progress.js";import{cx as o,metaTextClasses as i,stackGapClasses as m}from"../../internal/styles.js";export const Meter=/*@__PURE__*/a.forwardRef(function({value:a,min:u=0,max:f=100,label:c,showValue:d=!1,format:b,thresholds:h,size:x="md",color:p="primary",className:v,style:g,...j},w){const N=n(a,u,f),y=function(e,r,a){if(!a||0===a.length)return r;let l=r;for(const r of a)e>=r.from&&(l=r.color);return l}(a,p,h),_=void 0!==b;return r(l.Root,{ref:w,value:a,min:u,max:f,format:b,className:o("flex w-full flex-col",m[x],v??""),style:{...s(y),...g},...j,children:[c||d?r("div",{className:["flex items-baseline gap-2",c?"justify-between":"justify-end",i[x]].join(" "),children:[c?e(l.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:c}):null,d?e(l.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>_?e:`${Math.round(100*(N??0))}%`}):null]}):null,e(l.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${t[x]}`,children:e(l.Indicator,{className:"absolute top-0 rounded-full bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease),background-color_var(--neba-duration)_var(--neba-ease)]"})})]})});

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

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

package/dist/components/meter/index.js

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

package/dist/components/mockup/Mockup.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as n from"react";import{useRender as r}from"@base-ui/react/use-render";import{transitionProps as a}from"../../internal/animate.js";import{MockupCutout as o,defaultNotch as s,elevationFilters as d,finishSlots as h,mockupChrome as l,mockupMetrics as c,resolveOs as u,shellClasses as f}from"../../internal/mockup.js";import{surfaceSlots as m}from"../../internal/styles.js";const p="undefined"==typeof document?n.useEffect:n.useLayoutEffect;export const Mockup=/*@__PURE__*/n.forwardRef(function({device:g,os:b,hardware:v="monitor",size:w="md",resolution:y,orientation:x="portrait",bezel:k="standard",finish:R="graphite",notch:N,systemUi:z=!0,scroll:$=!1,wallpaper:M,time:j="9:41",width:W,height:B,color:H="primary",elevation:C=0,transition:E,render:L,className:O,style:P,children:S,...F},I){const T=u(g,b),U=N??s(g,T),q="desktop"!==g&&"landscape"===x,A=c({device:g,size:w,resolution:y,orientation:x,bezel:k,hardware:v}),{screen:D,frame:G,body:J,stand:K,base:Q}=A,V=n.useRef(null),[X,Y]=n.useState(null);p(()=>{const e=V.current;if(!e)return;const t=()=>{const t=e.getBoundingClientRect();if(t.width<=0||t.height<=0)return;const i=Math.min(t.width/G.width,t.height/G.height);Y(e=>null!==e&&Math.abs(e-i)<1e-4?e:i)};if(t(),"undefined"==typeof ResizeObserver)return;const i=new ResizeObserver(t);return i.observe(e),()=>i.disconnect()},[G.width,G.height]);const Z=n.useCallback(e=>{V.current=e,"function"==typeof I?I(e):I&&(I.current=e)},[I]),_=z?l({os:T,notch:U,landscape:q,time:j}):{},ee=a(E),te="none"===k,ie=t("div",{className:"neba-mockup-screen relative flex flex-col overflow-hidden",style:{width:D.width,height:D.height,borderRadius:A.screenRadius,background:M??"var(--neba-surface)",boxShadow:te?void 0:"inset 0 0 0 1px var(--n-shell-shade)"},children:[_.top?.node,t("div",{className:"flex min-h-0 flex-1",children:[_.start?.node,e("div",{className:"min-w-0 flex-1 "+($?"overflow-auto":"overflow-hidden"),style:{containerType:"size",containerName:"neba-screen"},children:S})]}),_.bottom?.node,e(o,{notch:U,screen:D,landscape:q})]}),ne=["neba-mockup relative block",ee.className,O??""].filter(Boolean).join(" ");return r({render:L,ref:Z,props:{className:ne,style:{...m(H,C),...h[R],...ee.style,width:W??(void 0===B?"100%":"auto"),height:B??"auto",aspectRatio:`${G.width} / ${G.height}`,filter:d[C],...P},children:t("div",{className:"absolute top-1/2 left-1/2 flex flex-col items-center",style:{width:G.width,height:G.height,transform:`translate(-50%, -50%) scale(${X??1})`,visibility:null===X?"hidden":void 0},children:[e("div",{className:te?"":f,style:{width:J.width,height:J.height,borderRadius:A.frameRadius,paddingBlock:`${A.bezel.top}px ${A.bezel.bottom}px`,paddingInline:A.bezel.x},children:ie}),K?t(i,{children:[e("div",{"aria-hidden":"true",style:{width:K.neckWidth,height:K.neckHeight,background:"var(--n-shell-shade)",clipPath:"polygon(16% 0, 84% 0, 100% 100%, 0 100%)"}}),e("div",{"aria-hidden":"true",className:f,style:{width:K.footWidth,height:K.footHeight,borderRadius:K.footHeight/2}})]}):null,Q?e("div",{"aria-hidden":"true",className:`relative ${f}`,style:{width:Q.width,height:Q.height,borderRadius:`0 0 ${Math.round(.55*Q.height)}px ${Math.round(.55*Q.height)}px`,clipPath:"polygon(0 0, 100% 0, 98.5% 100%, 1.5% 100%)"},children:e("div",{className:"absolute top-0 left-1/2",style:{width:Q.lipWidth,height:Math.round(.34*Q.height),marginLeft:-Q.lipWidth/2,borderRadius:`0 0 ${Math.round(.2*Q.height)}px ${Math.round(.2*Q.height)}px`,background:"var(--n-shell-shade)"}})}):null]}),...F}})});
+"use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as r from"react";import{useRender as a}from"@base-ui/react/use-render";import{transitionProps as n}from"../../internal/animate.js";import{MockupCutout as o,defaultNotch as s,elevationFilters as h,finishSlots as d,mockupChrome as l,mockupMetrics as c,resolveOs as u,shellClasses as m}from"../../internal/mockup.js";import{observeResize as p}from"../../internal/observe.js";import{cx as f,surfaceSlots as g}from"../../internal/styles.js";const b="undefined"==typeof document?r.useEffect:r.useLayoutEffect;export const Mockup=/*@__PURE__*/r.forwardRef(function({device:v,os:w,hardware:y="monitor",size:x="md",resolution:k,orientation:N="portrait",bezel:R="standard",finish:$="graphite",notch:z,systemUi:M=!0,scroll:j=!1,wallpaper:W,time:H="9:41",width:B,height:C,color:E="primary",elevation:L=0,transition:P,render:S,className:F,style:I,children:T,...U},q){const A=u(v,w),D=z??s(v,A),G="desktop"!==v&&"landscape"===N,J=c({device:v,size:x,resolution:k,orientation:N,bezel:R,hardware:y}),{screen:K,frame:O,body:Q,stand:V,base:X}=J,Y=r.useRef(null),[Z,_]=r.useState(null);b(()=>{const e=Y.current;if(!e)return;const t=()=>{const t=e.getBoundingClientRect();if(t.width<=0||t.height<=0)return;const i=Math.min(t.width/O.width,t.height/O.height);_(e=>null!==e&&Math.abs(e-i)<1e-4?e:i)};return t(),p(e,t)},[O.width,O.height]);const ee=r.useCallback(e=>{Y.current=e,"function"==typeof q?q(e):q&&(q.current=e)},[q]),te=M?l({os:A,notch:D,landscape:G,time:H}):{},ie=n(P),re="none"===R,ae=t("div",{className:"neba-mockup-screen relative flex flex-col overflow-hidden",style:{width:K.width,height:K.height,borderRadius:J.screenRadius,background:W??"var(--neba-surface)",boxShadow:re?void 0:"inset 0 0 0 1px var(--n-shell-shade)"},children:[te.top?.node,t("div",{className:"flex min-h-0 flex-1",children:[te.start?.node,e("div",{className:"min-w-0 flex-1 "+(j?"overflow-auto":"overflow-hidden"),style:{containerType:"size",containerName:"neba-screen"},children:T})]}),te.bottom?.node,e(o,{notch:D,screen:K,landscape:G})]}),ne=f("neba-mockup relative block",ie.className,F??"");return a({render:S,ref:ee,props:{className:ne,style:{...g(E,L),...d[$],...ie.style,width:B??(void 0===C?"100%":"auto"),height:C??"auto",aspectRatio:`${O.width} / ${O.height}`,filter:h[L],...I},children:t("div",{className:"absolute top-1/2 left-1/2 flex flex-col items-center",style:{width:O.width,height:O.height,transform:`translate(-50%, -50%) scale(${Z??1})`,visibility:null===Z?"hidden":void 0},children:[e("div",{className:re?"":m,style:{width:Q.width,height:Q.height,borderRadius:J.frameRadius,paddingBlock:`${J.bezel.top}px ${J.bezel.bottom}px`,paddingInline:J.bezel.x},children:ae}),V?t(i,{children:[e("div",{"aria-hidden":"true",style:{width:V.neckWidth,height:V.neckHeight,background:"var(--n-shell-shade)",clipPath:"polygon(16% 0, 84% 0, 100% 100%, 0 100%)"}}),e("div",{"aria-hidden":"true",className:m,style:{width:V.footWidth,height:V.footHeight,borderRadius:V.footHeight/2}})]}):null,X?e("div",{"aria-hidden":"true",className:`relative ${m}`,style:{width:X.width,height:X.height,borderRadius:`0 0 ${Math.round(.55*X.height)}px ${Math.round(.55*X.height)}px`,clipPath:"polygon(0 0, 100% 0, 98.5% 100%, 1.5% 100%)"},children:e("div",{className:"absolute top-0 left-1/2",style:{width:X.lipWidth,height:Math.round(.34*X.height),marginLeft:-X.lipWidth/2,borderRadius:`0 0 ${Math.round(.2*X.height)}px ${Math.round(.2*X.height)}px`,background:"var(--n-shell-shade)"}})}):null]}),...U}})});

package/dist/components/navigation-menu/NavigationMenu.d.ts

@@ -0,0 +1,100 @@
+import * as React from 'react';
+import type { NebaOrientation, NebaStyleProps } from '../../types.js';
+export interface NavigationMenuProps extends Pick<NebaStyleProps, 'size' | 'color' | 'density'>, Omit<React.ComponentPropsWithoutRef<'nav'>, 'color' | 'defaultValue' | 'onChange'> {
+    /**
+     * Which way the row runs. `vertical` is a nav rail whose panels open beside
+     * it; the arrow keys follow either way.
+     * @default 'horizontal'
+     */
+    orientation?: NebaOrientation;
+    /** Which item's panel is open, by its `value`. Nullish means closed. */
+    value?: string | null;
+    /** Which starts open, for an uncontrolled menu. */
+    defaultValue?: string | null;
+    onValueChange?: (value: string | null) => void;
+    /** How long the pointer rests before a panel opens, in milliseconds. @default 50 */
+    delay?: number;
+    /** How long a panel stays after the pointer leaves, in milliseconds. @default 50 */
+    closeDelay?: number;
+    /** Distance from the row, in pixels. @default 8 */
+    sideOffset?: number;
+    /** The items. */
+    children?: React.ReactNode;
+}
+export interface NavigationMenuItemProps {
+    /** The word in the row. */
+    label: React.ReactNode;
+    /**
+     * Makes the item a plain link rather than something that opens a panel. An
+     * item with an `href` and no children is a destination, and it is announced as
+     * one — which is the whole reason a site nav is not a Menu.
+     */
+    href?: string;
+    /**
+     * Where the link opens. Ignored without `href`.
+     *
+     * Anything other than this tab also gets `rel="noopener noreferrer"`, merged
+     * with whatever `rel` was asked for, exactly as on [TextLink].
+     */
+    target?: string;
+    /** The link's `rel`. The two tokens a new tab needs are added to it. */
+    rel?: string;
+    /** Content before the label. Sized in `em`, so it tracks it. */
+    startIcon?: React.ReactNode;
+    /**
+     * Identifies the item, for a controlled menu. Defaults to nothing, which is
+     * fine for an uncontrolled one — Base UI gives each item an identity of its
+     * own.
+     */
+    value?: string;
+    /** Unavailable. The word stays in the row and opens nothing. */
+    disabled?: boolean;
+    /** How many columns the panel lays its links out in. @default 1 */
+    columns?: number;
+    /** The panel's contents — usually `NavigationMenuLink`s. */
+    children?: React.ReactNode;
+}
+export interface NavigationMenuLinkProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'color' | 'title'> {
+    /** Where it goes. */
+    href: string;
+    /** The row's name. */
+    title: React.ReactNode;
+    /** A second line under it, one step down the scale and muted. */
+    description?: React.ReactNode;
+    /** A glyph before the title. */
+    startIcon?: React.ReactNode;
+}
+/**
+ * One row inside a panel: where it goes, what it is called, and a line saying
+ * what is there.
+ *
+ * It is a real `<a>`, which is the point of the whole component — a site's
+ * navigation is a list of destinations, and a destination that is a `<div>` with
+ * a click handler is not in the link list, not on the status bar and not in a
+ * crawler's index.
+ */
+export declare const NavigationMenuLink: React.ForwardRefExoticComponent<NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>>;
+/**
+ * One word in the row, and what opens under it.
+ *
+ * With children it is a trigger and a panel; with an `href` and nothing else it
+ * is a link, and the difference is not cosmetic — the second one is announced as
+ * a destination and the first as something that expands.
+ */
+export declare function NavigationMenuItem({ label, href, target, rel, startIcon, value, disabled, columns, children }: NavigationMenuItemProps): React.JSX.Element;
+/**
+ * A site's navigation: a row of destinations, some of which open a panel of
+ * more of them.
+ *
+ * The difference from a [Menu](./menu) is what the rows *are*. A menu holds
+ * actions, so its rows are `menuitem`s and the whole thing is a widget that
+ * traps the arrow keys. This holds links, so it is a `<nav>` full of real
+ * `<a>`s — which is what puts them in the link list, on the status bar and in a
+ * crawler's index. Reach for a Menu when the row does something and for this
+ * when the row goes somewhere.
+ *
+ * One panel is open at a time and it resizes between items rather than closing
+ * and reopening, which is Base UI's doing and is what makes crossing the row
+ * read as one surface rather than three.
+ */
+export declare const NavigationMenu: React.ForwardRefExoticComponent<NavigationMenuProps & React.RefAttributes<HTMLElement>>;

package/dist/components/navigation-menu/NavigationMenu.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as n,Fragment as a}from"react/jsx-runtime";import*as t from"react";import{NavigationMenu as i}from"@base-ui/react/navigation-menu";import{ChevronIcon as r}from"../../internal/icons.js";import{safeRel as o}from"../../internal/link.js";import{controlHeightClasses as s,controlTextClasses as l,controlTextLeadingClasses as d,cx as c,gapClasses as u,hasContent as f,iconClasses as p,metaTextClasses as m,paddingXClasses as h,radiusClasses as b,surfaceClasses as v,surfaceSlots as g,transitionClasses as x}from"../../internal/styles.js";const y=/*@__PURE__*/t.createContext({size:"md",density:"default"}),N=["inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap font-medium leading-none no-underline","text-(--neba-fg) bg-transparent","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",x,p,"hover:bg-(--n-soft)","data-[popup-open]:bg-(--n-soft-hover) data-[popup-open]:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","data-[disabled]:hover:bg-transparent"].join(" "),w=[v,"relative 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] overflow-hidden","[transition:opacity_var(--neba-duration)_var(--neba-ease),width_var(--neba-duration)_var(--neba-ease),height_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),j=["flex min-w-0 cursor-pointer items-start no-underline","text-(--neba-fg) bg-transparent",x,p,"hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]"].join(" "),_={xs:"p-1",sm:"p-1.5",md:"p-2",lg:"p-2.5",xl:"p-3"};export const NavigationMenuLink=/*@__PURE__*/t.forwardRef(function({href:a,title:r,description:o,startIcon:s,className:l,children:p,...v},g){const{size:x,density:N}=t.useContext(y);return n(i.Link,{ref:g,href:a,className:c(j,b[x],u[x],h[N??"default"][x],"py-2",l??""),...v,children:[f(s)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:s}):null,n("span",{className:"flex min-w-0 flex-col gap-0.5",children:[e("span",{className:`font-medium ${d[x]}`,children:r}),f(o)?e("span",{className:`text-(--neba-muted-fg) ${m[x]}`,children:o}):null,p]})]})});export function NavigationMenuItem({label:d,href:c,target:p,rel:m,startIcon:v,value:g,disabled:x=!1,columns:w=1,children:j}){const{size:k,density:z}=t.useContext(y),C=void 0!==c&&!f(j),$=[N,s[k],l[k],u[k],h[z??"default"][k],b[k]].join(" ");return e(i.Item,{value:g,children:C?n(i.Link,{href:c,target:p,rel:o(p,m),className:$,children:[f(v)?v:null,d]}):n(a,{children:[n(i.Trigger,{disabled:x,className:$,children:[f(v)?v:null,d,e(i.Icon,{className:"flex items-center [transition:rotate_var(--neba-duration)_var(--neba-ease)] data-[popup-open]:rotate-180",children:e(r,{})})]}),e(i.Content,{className:`grid gap-1 ${_[k]}`,style:w>1?{gridTemplateColumns:`repeat(${w}, minmax(0, 1fr))`}:void 0,children:j})]})})}export const NavigationMenu=/*@__PURE__*/t.forwardRef(function({size:a="md",color:r="primary",density:o="default",orientation:s="horizontal",value:l,defaultValue:d,onValueChange:c,delay:f,closeDelay:p,sideOffset:m=8,className:h,style:v,children:x,...N},j){const _=t.useMemo(()=>({size:a,density:o}),[a,o]);return e(y.Provider,{value:_,children:n(i.Root,{ref:j,orientation:s,value:l,defaultValue:d,onValueChange:e=>c?.(e),delay:f,closeDelay:p,className:h,style:{...g(r,3),"--n-soft-hover":`var(--neba-${r}-soft-hover)`,...v},...N,children:[e(i.List,{className:["flex items-center","vertical"===s?"flex-col items-stretch":"flex-row",u[a]].join(" "),children:x}),e(i.Portal,{children:e(i.Positioner,{className:"neba-portal z-50 [outline:none]",sideOffset:m,collisionPadding:12,children:e(i.Popup,{className:`${w} ${b[a]}`,children:e(i.Viewport,{})})})})]})})});

package/dist/components/navigation-menu/index.d.ts

@@ -0,0 +1,2 @@
+export { NavigationMenu, NavigationMenuItem, NavigationMenuLink } from './NavigationMenu.js';
+export type { NavigationMenuItemProps, NavigationMenuLinkProps, NavigationMenuProps } from './NavigationMenu.js';

package/dist/components/navigation-menu/index.js

@@ -0,0 +1 @@
+export{NavigationMenu,NavigationMenuItem,NavigationMenuLink}from"./NavigationMenu.js";

package/dist/components/number-field/NumberField.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaElevation, NebaStyleProps } from '../../types.js';
+import type { NebaElevation, NebaFieldSlot, NebaSlots, NebaStyleProps } from '../../types.js';
 /**
  * Where the two steppers sit.
  *
@@ -14,6 +14,15 @@ import type { NebaElevation, NebaStyleProps } from '../../types.js';
  * nobody hits.
  */
 export type NumberFieldSteppers = 'end' | 'split' | 'none';
+/**
+ * The parts a NumberField draws behind its root.
+ *
+ * `shell` is the framed box, `control` the `<input>` inside it, and `stepper`
+ * both of the two buttons — they are one slot rather than an `increment` and a
+ * `decrement`, because a pair of steppers that do not match is not a thing
+ * anyone is trying to build.
+ */
+export type NumberFieldSlot = NebaFieldSlot | 'shell' | 'stepper';
 export interface NumberFieldProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'defaultValue' | 'children'> {
     /**
      * Drop shadow depth. `0` (the default) is flat — a field is a well, not a
@@ -99,6 +108,12 @@ export interface NumberFieldProps extends NebaStyleProps, Omit<React.ComponentPr
     /** Placeholder shown while the field is empty. */
     placeholder?: string;
     id?: string;
+    /**
+     * Class names for the parts behind the root. `className` is the root — the
+     * column holding the label, the shell and the two lines under it — so the
+     * `<input>` itself is `classNames.control`.
+     */
+    classNames?: NebaSlots<NumberFieldSlot>;
 }
 /**
  * A field that only holds a number.
@@ -114,4 +129,4 @@ export interface NumberFieldProps extends NebaStyleProps, Omit<React.ComponentPr
  * clamping, the press-and-hold repeat on the steppers, and the hidden input
  * that submits with a form.
  */
-export declare function NumberField({ variant, size, color, density, elevation, value, defaultValue, onValueChange, onValueCommitted, min, max, step, largeStep, smallStep, snapOnStep, allowWheelScrub, format, locale, steppers, incrementLabel, decrementLabel, label, description, error, invalid, startIcon, endIcon, fullWidth, disabled, readOnly, required, name, placeholder, id, className, style, ...props }: NumberFieldProps): React.JSX.Element;
+export declare function NumberField({ variant, size, color, density, elevation, value, defaultValue, onValueChange, onValueCommitted, min, max, step, largeStep, smallStep, snapOnStep, allowWheelScrub, format, locale, steppers, incrementLabel, decrementLabel, label, description, error, invalid, startIcon, endIcon, fullWidth, disabled, readOnly, required, name, placeholder, id, className, classNames, style, ...props }: NumberFieldProps): React.JSX.Element;

package/dist/components/number-field/NumberField.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{NumberField as t}from"@base-ui/react/number-field";import{Field as a}from"@base-ui/react/field";import{numberMessages as l,useMessages as i}from"../../internal/i18n.js";import{MinusIcon as r,PlusIcon as s}from"../../internal/icons.js";import{controlHeightClasses as o,controlTextLeadingClasses as c,disabledClasses as d,fieldReadOnlyClasses as m,fieldRestClasses as u,focusWithinRingClasses as p,gapClasses as f,hasContent as b,iconClasses as h,metaTextClasses as x,paddingXClasses as g,radiusClasses as v,stackGapClasses as N,surfaceSlots as j,transitionClasses as w}from"../../internal/styles.js";const y=["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent]",w,"focus-within:[transition-duration:0ms]",p,h].join(" "),k=["inline-flex size-[1.7em] shrink-0 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg) select-none","[&_svg]:size-[0.9em] [&_svg]:shrink-0","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","active:[transition-duration:0ms]","hover:bg-(--n-soft) hover:text-(--n-accent)","active:bg-(--n-soft-press)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1","disabled:cursor-not-allowed disabled:bg-transparent disabled:text-(--neba-disabled-fg)"].join(" ");export function NumberField({variant:p="outline",size:h="md",color:w="primary",density:S="default",elevation:_=0,value:V,defaultValue:C,onValueChange:I,onValueCommitted:O,min:z,max:L,step:W,largeStep:$,smallStep:q,snapOnStep:B,allowWheelScrub:D=!1,format:F,locale:R,steppers:E="end",incrementLabel:G,decrementLabel:A,label:H,description:J,error:K,invalid:M,startIcon:P,endIcon:Q,fullWidth:T=!1,disabled:U=!1,readOnly:X=!1,required:Y=!1,name:Z,placeholder:ee,id:ne,className:te,style:ae,...le}){const ie=i(l,"string"==typeof R?R:void 0),re=b(K),se=M??re,oe=se?"danger":w,ce=g[S][h],de={end:`${ce} pe-1`,split:"px-1",none:ce},me=e(t.Decrement,{"aria-label":A??ie.decrease,className:k,children:e(r,{})}),ue=e(t.Increment,{"aria-label":G??ie.increase,className:k,children:e(s,{})}),pe="none"!==E&&!X;return n(a.Root,{disabled:U,invalid:se,className:["flex-col align-top",N[h],T?"flex w-full":"inline-flex",te??""].filter(Boolean).join(" "),style:{...j(oe,_),...ae},...le,children:[H?e(a.Label,{className:[x[h],"font-medium",U?"text-(--neba-disabled-fg)":"text-(--neba-fg)"].join(" "),children:H}):null,e(t.Root,{id:ne,name:Z,className:"contents",value:V,defaultValue:C,onValueChange:e=>I?.(e),onValueCommitted:e=>O?.(e),min:z,max:L,step:W,largeStep:$,smallStep:q,snapOnStep:B,allowWheelScrub:D,format:F,locale:R,disabled:U,readOnly:X,required:Y,children:n(t.Group,{className:[y,o[h],c[h],v[h],f[h],pe?de[E]:ce,U?d[p]:X?m[p]:u[p]].join(" "),children:[pe&&"split"===E?me:null,P?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:P}):null,e(t.Input,{placeholder:ee,className:["min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","tabular-nums","split"===E&&pe?"text-center":"","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed"].filter(Boolean).join(" ")}),Q?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:Q}):null,pe&&"end"===E?n("span",{className:"flex shrink-0 items-center gap-0.5",children:[me,ue]}):null,pe&&"split"===E?ue:null]})}),J?e(a.Description,{className:`${x[h]} text-(--neba-muted-fg)`,children:J}):null,re?e(a.Error,{match:!0,className:`${x[h]} text-(--n-accent)`,children:K}):null]})}
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{NumberField as t}from"@base-ui/react/number-field";import{Field as a}from"@base-ui/react/field";import{numberMessages as l,useMessages as r}from"../../internal/i18n.js";import{MinusIcon as i,PlusIcon as s}from"../../internal/icons.js";import{controlHeightClasses as o,controlTextLeadingClasses as c,cx as d,disabledClasses as m,fieldReadOnlyClasses as u,fieldRestClasses as p,focusWithinRingClasses as f,gapClasses as b,hasContent as h,iconClasses as x,metaTextClasses as g,paddingXClasses as v,radiusClasses as N,stackGapClasses as j,surfaceSlots as w,transitionClasses as y}from"../../internal/styles.js";const k=["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent]",y,"focus-within:[transition-duration:0ms]",f,x].join(" "),S=["inline-flex size-[1.7em] shrink-0 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg) select-none","[&_svg]:size-[0.9em] [&_svg]:shrink-0","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","active:[transition-duration:0ms]","hover:bg-(--n-soft) hover:text-(--n-accent)","active:bg-(--n-soft-press)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1","disabled:cursor-not-allowed disabled:bg-transparent disabled:text-(--neba-disabled-fg)"].join(" ");export function NumberField({variant:f="outline",size:x="md",color:y="primary",density:_="default",elevation:V=0,value:C,defaultValue:I,onValueChange:O,onValueCommitted:z,min:L,max:W,step:q,largeStep:D,smallStep:F,snapOnStep:R,allowWheelScrub:B=!1,format:E,locale:G,steppers:$="end",incrementLabel:A,decrementLabel:H,label:J,description:K,error:M,invalid:P,startIcon:Q,endIcon:T,fullWidth:U=!1,disabled:X=!1,readOnly:Y=!1,required:Z=!1,name:ee,placeholder:ne,id:te,className:ae,classNames:le,style:re,...ie}){const se=r(l,"string"==typeof G?G:void 0),oe=h(M),ce=P??oe,de=ce?"danger":y,me=v[_][x],ue={end:`${me} pe-1`,split:"px-1",none:me},pe=e(t.Decrement,{"aria-label":H??se.decrease,className:d(S,le?.stepper),children:e(i,{})}),fe=e(t.Increment,{"aria-label":A??se.increase,className:d(S,le?.stepper),children:e(s,{})}),be="none"!==$&&!Y;return n(a.Root,{disabled:X,invalid:ce,className:d("flex-col align-top",j[x],U?"flex w-full":"inline-flex",ae??""),style:{...w(de,V),...re},...ie,children:[J?e(a.Label,{className:d(g[x],"font-medium",X?"text-(--neba-disabled-fg)":"text-(--neba-fg)",le?.label),children:J}):null,e(t.Root,{id:te,name:ee,className:"contents",value:C,defaultValue:I,onValueChange:e=>O?.(e),onValueCommitted:e=>z?.(e),min:L,max:W,step:q,largeStep:D,smallStep:F,snapOnStep:R,allowWheelScrub:B,format:E,locale:G,disabled:X,readOnly:Y,required:Z,children:n(t.Group,{className:d(k,o[x],c[x],N[x],b[x],be?ue[$]:me,X?m[f]:Y?u[f]:p[f],le?.shell),children:[be&&"split"===$?pe:null,Q?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:Q}):null,e(t.Input,{placeholder:ne,className:["min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","tabular-nums","split"===$&&be?"text-center":"","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",le?.control].filter(Boolean).join(" ")}),T?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:T}):null,be&&"end"===$?n("span",{className:"flex shrink-0 items-center gap-0.5",children:[pe,fe]}):null,be&&"split"===$?fe:null]})}),K?e(a.Description,{className:d(g[x],"text-(--neba-muted-fg)",le?.description),children:K}):null,e(a.Error,oe?{match:!0,className:d(g[x],"text-(--n-accent)",le?.error),children:M}:{className:d(g[x],"text-(--n-accent)",le?.error)})]})}

package/dist/components/otp-field/OtpField.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Field as n}from"@base-ui/react/field";import{OTPField as l}from"@base-ui/react/otp-field";import{cx as r,disabledClasses as i,fieldReadOnlyClasses as o,fieldRestClasses as s,metaTextClasses as m,stackGapClasses as d,surfaceSlots as u,transitionClasses as c}from"../../internal/styles.js";const p={xs:"h-7 w-6",sm:"h-8 w-7",md:"h-10 w-8",lg:"h-12 w-10",xl:"h-14 w-12"},f={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.4375rem]",lg:"rounded-[0.5625rem]",xl:"rounded-[0.6875rem]"},x={xs:"text-[0.8125rem]",sm:"text-[0.9375rem]",md:"text-[1.0625rem]",lg:"text-[1.25rem]",xl:"text-[1.5rem]"},g={default:{xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-2",xl:"gap-2.5"},compact:{xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"}},h={numeric:"numeric",alpha:"alpha",alphanumeric:"alphanumeric",any:"none"};export const OtpField=/*@__PURE__*/t.forwardRef(function({variant:b="outline",size:y="md",color:v="primary",density:N="default",elevation:V=0,length:w=6,charset:j="numeric",mask:C=!1,groupSize:F,separator:M="–",value:I,defaultValue:O,onValueChange:R,onComplete:S,onValueInvalid:k,autoSubmit:q=!1,label:z,description:_,error:A,invalid:D,name:E,required:L=!1,disabled:T=!1,readOnly:B=!1,autoFocus:G=!1,className:H,style:J,...K},P){const Q=Math.min(12,Math.max(2,Math.round(w))),U=null!=A&&!1!==A&&""!==A,W=D??U,X=W?"danger":v,Y=r("text-center font-medium [font-family:inherit]",p[y],x[y],f[y],c,"caret-(--n-accent) selection:bg-(--n-soft-press)","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-1","focus:[transition-duration:0ms]",T?i[b]:B?o[b]:s[b]),Z=F&&F>0?Math.round(F):0;return a(n.Root,{disabled:T,invalid:W,className:r("inline-flex flex-col align-top",d[y],H),style:{...u(X,V),...J},children:[z?e(n.Label,{className:r(m[y],"font-medium",T?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:z}):null,e(l.Root,{ref:P,length:Q,validationType:h[j],mask:C,name:E,required:L,disabled:T,readOnly:B,autoSubmit:q,value:I,defaultValue:O,onValueChange:e=>R?.(e),onValueComplete:e=>S?.(e),onValueInvalid:e=>k?.(e),className:r("flex items-center",g[N][y]),...K,children:Array.from({length:Q},(n,i)=>a(t.Fragment,{children:[Z>0&&i>0&&i%Z===0?e("span",{"aria-hidden":"true",className:r("select-none px-0.5 text-(--neba-muted-fg)",x[y]),children:M}):null,e(l.Input,{className:Y,autoFocus:G&&0===i})]},i))}),_?e(n.Description,{className:r(m[y],"text-(--neba-muted-fg)"),children:_}):null,U?e(n.Error,{match:!0,className:r(m[y],"text-(--n-accent)"),children:A}):null]})});
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Field as n}from"@base-ui/react/field";import{OTPField as l}from"@base-ui/react/otp-field";import{cx as r,disabledClasses as s,fieldReadOnlyClasses as i,fieldRestClasses as o,metaTextClasses as m,stackGapClasses as d,surfaceSlots as u,transitionClasses as c}from"../../internal/styles.js";const p={xs:"h-7 w-6",sm:"h-8 w-7",md:"h-10 w-8",lg:"h-12 w-10",xl:"h-14 w-12"},f={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.4375rem]",lg:"rounded-[0.5625rem]",xl:"rounded-[0.6875rem]"},x={xs:"text-[0.8125rem]",sm:"text-[0.9375rem]",md:"text-[1.0625rem]",lg:"text-[1.25rem]",xl:"text-[1.5rem]"},g={default:{xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-2",xl:"gap-2.5"},compact:{xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"}},h={numeric:"numeric",alpha:"alpha",alphanumeric:"alphanumeric",any:"none"};export const OtpField=/*@__PURE__*/t.forwardRef(function({variant:b="outline",size:y="md",color:v="primary",density:N="default",elevation:V=0,length:w=6,charset:j="numeric",mask:C=!1,groupSize:F,separator:M="–",value:I,defaultValue:O,onValueChange:R,onComplete:S,onValueInvalid:k,autoSubmit:q=!1,label:z,description:_,error:A,invalid:D,name:E,required:L=!1,disabled:T=!1,readOnly:B=!1,autoFocus:G=!1,className:H,style:J,...K},P){const Q=Math.min(12,Math.max(2,Math.round(w))),U=null!=A&&!1!==A&&""!==A,W=D??U,X=W?"danger":v,Y=r("text-center font-medium [font-family:inherit]",p[y],x[y],f[y],c,"caret-(--n-accent) selection:bg-(--n-soft-press)","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-1","focus:[transition-duration:0ms]",T?s[b]:B?i[b]:o[b]),Z=F&&F>0?Math.round(F):0;return a(n.Root,{disabled:T,invalid:W,className:r("inline-flex flex-col align-top",d[y],H),style:{...u(X,V),...J},children:[z?e(n.Label,{className:r(m[y],"font-medium",T?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:z}):null,e(l.Root,{ref:P,length:Q,validationType:h[j],mask:C,name:E,required:L,disabled:T,readOnly:B,autoSubmit:q,value:I,defaultValue:O,onValueChange:e=>R?.(e),onValueComplete:e=>S?.(e),onValueInvalid:e=>k?.(e),className:r("flex items-center",g[N][y]),...K,children:Array.from({length:Q},(n,s)=>a(t.Fragment,{children:[Z>0&&s>0&&s%Z===0?e("span",{"aria-hidden":"true",className:r("select-none px-0.5 text-(--neba-muted-fg)",x[y]),children:M}):null,e(l.Input,{className:Y,autoFocus:G&&0===s})]},s))}),_?e(n.Description,{className:r(m[y],"text-(--neba-muted-fg)"),children:_}):null,e(n.Error,U?{match:!0,className:r(m[y],"text-(--n-accent)"),children:A}:{className:r(m[y],"text-(--n-accent)")})]})});

package/dist/components/overlay/Overlay.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Dialog as r}from"@base-ui/react/dialog";import{overlayMessages as n,useMessages as t}from"../../internal/i18n.js";import{surfaceSlots as l}from"../../internal/styles.js";const i={scrim:"bg-(--neba-scrim) [backdrop-filter:blur(2px)]",blur:"[background-color:color-mix(in_oklab,var(--neba-scrim)_55%,transparent)] [backdrop-filter:blur(14px)_saturate(1.4)]",solid:"bg-(--neba-surface)",clear:""},s={start:"items-start",center:"items-center",end:"items-end"},o={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-8",xl:"p-10"},c=["[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" ");export function Overlay({open:m,defaultOpen:p,onOpenChange:d,tone:b="scrim",dismissible:f=!1,modal:u=!0,align:x="center",size:y="md",color:g="primary",locale:j,label:h,className:k,style:O,children:_,...v}){const N=t(n,j);return e(r.Root,{open:m,defaultOpen:p,modal:u,disablePointerDismissal:!f,onOpenChange:(e,a)=>{f||e||"escape-key"!==a.reason?d?.(e):a.cancel()},children:a(r.Portal,{children:[e(r.Backdrop,{className:`neba-portal fixed inset-0 z-50 ${c} ${i[b]}`}),e(r.Viewport,{className:["neba-portal fixed inset-0 z-50 flex justify-center",s[x],o[y]].join(" "),children:e(r.Popup,{"aria-label":h??N.label,className:["flex max-h-full max-w-full flex-col items-center justify-center","[outline:none]",c,k??""].filter(Boolean).join(" "),style:{...l(g,0),...O},...v,children:_})})]})})}
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Dialog as r}from"@base-ui/react/dialog";import{overlayMessages as n,useMessages as t}from"../../internal/i18n.js";import{cx as l,surfaceSlots as i}from"../../internal/styles.js";const s={scrim:"bg-(--neba-scrim) [backdrop-filter:blur(2px)]",blur:"[background-color:color-mix(in_oklab,var(--neba-scrim)_55%,transparent)] [backdrop-filter:blur(14px)_saturate(1.4)]",solid:"bg-(--neba-surface)",clear:""},o={start:"items-start",center:"items-center",end:"items-end"},c={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-8",xl:"p-10"},m=["[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" ");export function Overlay({open:p,defaultOpen:d,onOpenChange:b,tone:u="scrim",dismissible:f=!1,modal:x=!0,align:y="center",size:g="md",color:j="primary",locale:h,label:k,className:O,style:_,children:v,...N}){const z=t(n,h);return e(r.Root,{open:p,defaultOpen:d,modal:x,disablePointerDismissal:!f,onOpenChange:(e,a)=>{f||e||"escape-key"!==a.reason?b?.(e):a.cancel()},children:a(r.Portal,{children:[e(r.Backdrop,{className:`neba-portal fixed inset-0 z-50 ${m} ${s[u]}`}),e(r.Viewport,{className:["neba-portal fixed inset-0 z-50 flex justify-center",o[y],c[g]].join(" "),children:e(r.Popup,{"aria-label":k??z.label,className:l("flex max-h-full max-w-full flex-col items-center justify-center","[outline:none]",m,O??""),style:{...i(j,0),..._},...N,children:v})})]})})}

package/dist/components/page-layout/PageLayout.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as o from"react";import{layoutMessages as l,useMessages as t}from"../../internal/i18n.js";import{PageLayoutContext as r,SidebarSideContext as s}from"../../internal/page-layout.js";import{controlSlots as a,cx as i,hasContent as u,toLength as c}from"../../internal/styles.js";const d=["header","footer"];export const PageLayout=/*@__PURE__*/o.forwardRef(function({header:f,footer:p,sidebar:h,endSidebar:m,headerSpan:v="full",footerSpan:x="full",scroll:y="page",height:b="viewport",collapseBelow:w="md",sidebarOpen:g,defaultSidebarOpen:S=!1,onSidebarOpenChange:k,endSidebarOpen:C,defaultEndSidebarOpen:P=!1,onEndSidebarOpenChange:O,skipLink:N=!0,skipLabel:j,mainId:$="main",mainProps:R,locale:z,color:E="primary",className:L,style:B,children:H,...M},_){const I=t(l,z),[T,q]=o.useState(S),[A,D]=o.useState(P),F=o.useMemo(()=>({start:g??T,end:C??A}),[g,T,C,A]),G=o.useCallback((e,n)=>{if("start"===e)return void 0===g&&q(n),void k?.(n);void 0===C&&D(n),O?.(n)},[g,C,k,O]),J=o.useRef(null),K=o.useCallback(e=>{J.current=e,"function"==typeof _?_(e):_&&(_.current=e)},[_]),Q=o.useRef({header:null,footer:null}),U=o.useRef(null),V=o.useCallback(()=>{const e=J.current;if(e)for(const n of d){const o=Q.current[n],l="header"===n?v:x;if(!o){e.style.setProperty(`--n-layout-${n}`,"0px"),e.style.setProperty(`--n-layout-${n}-inset`,"0px");continue}const t=getComputedStyle(o).position,r=`${o.offsetHeight}px`,s="sticky"===t||"fixed"===t;e.style.setProperty(`--n-layout-${n}`,s&&"full"===l?r:"0px"),e.style.setProperty(`--n-layout-${n}-inset`,"fixed"===t?r:"0px")}},[v,x]),W=o.useCallback(()=>{const e=U.current;if(e){e.disconnect();for(const n of d){const o=Q.current[n];o&&e.observe(o)}}V()},[V]);o.useEffect(()=>(U.current=new ResizeObserver(()=>V()),W(),()=>{U.current?.disconnect(),U.current=null}),[V,W]);const X=o.useCallback((e,n)=>{Q.current[e]=n,W()},[W]),Y=o.useMemo(()=>({present:!0,register:X,collapseBelow:w,open:F,setOpen:G,scroll:y,locale:z}),[X,w,F,G,y,z]),Z="content"===y,ee=c("viewport"===b||"auto"===b?void 0:b),ne=void 0!==ee?"":"auto"===b?Z?"h-full":"min-h-full":Z?"h-dvh":"min-h-dvh",oe=u(f)?f:null,le=u(p)?p:null;return e(r.Provider,{value:Y,children:n("div",{ref:K,className:i("relative flex w-full flex-col",Z?"overflow-hidden":"",ne,"full"===v?"[padding-top:var(--n-layout-header-inset,0px)]":"","full"===x?"[padding-bottom:var(--n-layout-footer-inset,0px)]":"",L),style:void 0===ee?B:{...Z?{height:ee}:{minHeight:ee},...B},...M,children:[N?e("a",{href:`#${$}`,className:i("absolute start-3 top-3 z-50 size-px overflow-hidden whitespace-nowrap","[clip-path:inset(50%)] focus:size-auto focus:overflow-visible focus:[clip-path:none]","focus:rounded-(--neba-radius-md) focus:bg-(--n-fill) focus:px-4 focus:py-2","focus:font-medium focus:text-(--n-on-solid) focus:no-underline","focus:[box-shadow:var(--neba-shadow-2),var(--neba-plate-solid)]","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-2"),style:a(E,2,"solid"),children:j??I.skipToContent}):null,"full"===v?oe:null,n("div",{className:i("flex w-full flex-1",Z?"min-h-0":""),children:[u(h)?e(s.Provider,{value:"start",children:h}):null,n("div",{className:i("flex min-w-0 flex-1 flex-col",Z?"min-h-0":"","content"===v?"[padding-top:var(--n-layout-header-inset,0px)]":"","content"===x?"[padding-bottom:var(--n-layout-footer-inset,0px)]":""),children:["content"===v?oe:null,e("main",{...R,id:$,className:i("min-w-0 flex-1",Z?"min-h-0 overflow-y-auto":"",R?.className),children:H}),"content"===x?le:null]}),u(m)?e(s.Provider,{value:"end",children:m}):null]}),"full"===x?le:null]})})});
+"use client";import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as l from"react";import{layoutMessages as n,useMessages as t}from"../../internal/i18n.js";import{PageLayoutContext as r,SidebarSideContext as s}from"../../internal/page-layout.js";import{observeResize as a}from"../../internal/observe.js";import{controlSlots as i,cx as u,hasContent as c,toLength as f}from"../../internal/styles.js";const d=["header","footer"];export const PageLayout=/*@__PURE__*/l.forwardRef(function({header:p,footer:h,sidebar:m,endSidebar:v,headerSpan:x="full",footerSpan:y="full",scroll:b="page",height:g="viewport",collapseBelow:w="md",sidebarOpen:S,defaultSidebarOpen:k=!1,onSidebarOpenChange:C,endSidebarOpen:P,defaultEndSidebarOpen:j=!1,onEndSidebarOpenChange:N,skipLink:O=!0,skipLabel:$,mainId:R="main",mainProps:z,locale:E,color:L="primary",className:B,style:H,children:M,..._},I){const T=t(n,E),[q,A]=l.useState(k),[D,F]=l.useState(j),G=l.useMemo(()=>({start:S??q,end:P??D}),[S,q,P,D]),J=l.useCallback((e,o)=>{if("start"===e)return void 0===S&&A(o),void C?.(o);void 0===P&&F(o),N?.(o)},[S,P,C,N]),K=l.useRef(null),Q=l.useCallback(e=>{K.current=e,"function"==typeof I?I(e):I&&(I.current=e)},[I]),U=l.useRef({header:null,footer:null}),V=l.useRef({header:null,footer:null}),W=l.useCallback(()=>{const e=K.current;if(e)for(const o of d){const l=U.current[o],n="header"===o?x:y;if(!l){e.style.setProperty(`--n-layout-${o}`,"0px"),e.style.setProperty(`--n-layout-${o}-inset`,"0px");continue}const t=getComputedStyle(l).position,r=`${l.offsetHeight}px`,s="sticky"===t||"fixed"===t;e.style.setProperty(`--n-layout-${o}`,s&&"full"===n?r:"0px"),e.style.setProperty(`--n-layout-${o}-inset`,"fixed"===t?r:"0px")}},[x,y]),X=l.useCallback(()=>{for(const e of d){V.current[e]?.();const o=U.current[e];V.current[e]=o?a(o,()=>W()):null}W()},[W]);l.useEffect(()=>{const e=V.current;return X(),()=>{for(const o of d)e[o]?.(),e[o]=null}},[X]);const Y=l.useCallback((e,o)=>{U.current[e]=o,X()},[X]),Z=l.useMemo(()=>({present:!0,register:Y,collapseBelow:w,open:G,setOpen:J,scroll:b,locale:E}),[Y,w,G,J,b,E]),ee="content"===b,oe=f("viewport"===g||"auto"===g?void 0:g),le=void 0!==oe?"":"auto"===g?ee?"h-full":"min-h-full":ee?"h-dvh":"min-h-dvh",ne=c(p)?p:null,te=c(h)?h:null;return e(r.Provider,{value:Z,children:o("div",{ref:Q,className:u("relative flex w-full flex-col",ee?"overflow-hidden":"",le,"full"===x?"[padding-top:var(--n-layout-header-inset,0px)]":"","full"===y?"[padding-bottom:var(--n-layout-footer-inset,0px)]":"",B),style:void 0===oe?H:{...ee?{height:oe}:{minHeight:oe},...H},..._,children:[O?e("a",{href:`#${R}`,className:u("absolute start-3 top-3 z-50 size-px overflow-hidden whitespace-nowrap","[clip-path:inset(50%)] focus:size-auto focus:overflow-visible focus:[clip-path:none]","focus:rounded-(--neba-radius-md) focus:bg-(--n-fill) focus:px-4 focus:py-2","focus:font-medium focus:text-(--n-on-solid) focus:no-underline","focus:[box-shadow:var(--neba-shadow-2),var(--neba-plate-solid)]","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-2"),style:i(L,2,"solid"),children:$??T.skipToContent}):null,"full"===x?ne:null,o("div",{className:u("flex w-full flex-1",ee?"min-h-0":""),children:[c(m)?e(s.Provider,{value:"start",children:m}):null,o("div",{className:u("flex min-w-0 flex-1 flex-col",ee?"min-h-0":"","content"===x?"[padding-top:var(--n-layout-header-inset,0px)]":"","content"===y?"[padding-bottom:var(--n-layout-footer-inset,0px)]":""),children:["content"===x?ne:null,e("main",{...z,id:R,className:u("min-w-0 flex-1",ee?"min-h-0 overflow-y-auto":"",z?.className),children:M}),"content"===y?te:null]}),c(v)?e(s.Provider,{value:"end",children:v}):null]}),"full"===y?te:null]})})});

package/dist/components/pagination/Pagination.js

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

package/dist/components/panes/Panes.js

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