neba 0.0.1 → 1.0.0

package/dist/components/pagination/Pagination.d.ts

@@ -0,0 +1,65 @@
+import * as React from 'react';
+import type { NebaElevation, NebaStyleProps } from '../../types';
+export interface PaginationProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'nav'>, 'color' | 'onChange'> {
+    /** How many pages there are. Fewer than two and the whole control renders nothing. */
+    count: number;
+    /** The current page, 1-based. Use with `onPageChange` for a controlled set. */
+    page?: number;
+    /** Which page starts current, for an uncontrolled one. @default 1 */
+    defaultPage?: number;
+    onPageChange?: (page: number) => void;
+    /**
+     * How many pages are always shown on either side of the current one.
+     * @default 1
+     */
+    siblingCount?: number;
+    /**
+     * How many pages are always shown at each end, whatever the current page is.
+     * `0` drops the first and last page from the row, leaving only the window.
+     * @default 1
+     */
+    boundaryCount?: number;
+    /** Shows the jump-to-first and jump-to-last steppers. @default false */
+    showEdges?: boolean;
+    /** Shows the previous and next steppers. @default true */
+    showArrows?: boolean;
+    /**
+     * Drop shadow depth of the page buttons. `0` (the default) is flat.
+     * @default 0
+     */
+    elevation?: NebaElevation;
+    /** Unavailable. Every button in the row stops answering. */
+    disabled?: boolean;
+    /** Accessible name of the `<nav>`. @default 'Pagination' */
+    label?: string;
+    /** Accessible name of a page button. @default `Page ${page}` */
+    pageLabel?: (page: number) => string;
+    /** @default 'Previous page' */
+    previousLabel?: string;
+    /** @default 'Next page' */
+    nextLabel?: string;
+    /** @default 'First page' */
+    firstLabel?: string;
+    /** @default 'Last page' */
+    lastLabel?: string;
+}
+/**
+ * A row of page numbers.
+ *
+ * Every button in it is a real `Button`, which is the point: a pagination is not
+ * a new kind of control, it is buttons in a row that happen to know about each
+ * other. Reusing the component means the row inherits the acrylic surface, the
+ * press-instant/release-slow signature, the focus ring and every future change
+ * to any of them for free — and it means a `lg` pagination lines up with a `lg`
+ * button beside it, because it *is* one.
+ *
+ * `variant` sets how the pages at rest look; the current page is always `solid`,
+ * which is the one thing the row has to say without being read. That is why the
+ * default here is `text` rather than the `solid` a lone Button takes — nine
+ * filled buttons in a row say that all nine are the primary action.
+ *
+ * The markup is a `<nav>` around a `<ul>` because that is what a screen reader
+ * needs to hear: a named landmark it can skip, holding a list whose length says
+ * how far the pages go, with `aria-current="page"` marking where it is.
+ */
+export declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLElement>>;

package/dist/components/pagination/Pagination.js

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

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

@@ -0,0 +1,2 @@
+export { Pagination } from './Pagination';
+export type { PaginationProps } from './Pagination';

package/dist/components/pagination/index.js

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

package/dist/components/progress-box/ProgressBox.d.ts

@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { type ProgressSharedProps } from '../../internal/progress';
+import type { NebaColor, NebaSize } from '../../types';
+export interface ProgressBoxProps extends ProgressSharedProps {
+    /** Size of one plate. */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /**
+     * How many plates the row is made of.
+     *
+     * Four by default: enough that the wave reads as a wave, few enough that a
+     * determinate row can be counted at a glance rather than measured. Set it to
+     * the number of steps when the thing being waited on genuinely has steps.
+     * @default 4
+     */
+    count?: number;
+}
+/**
+ * A row of acrylic plates that light up.
+ *
+ * The third shape, and the one that is about the material rather than about the
+ * quantity. A bar and a ring both say "this much of it is done"; a row of
+ * plates says "this is working" in the library's own vocabulary — the same cut
+ * sheet, the same hairline, the same fill — which is what makes it the right
+ * one for a loading state inside a Neba surface where a foreign grey spinner
+ * would look borrowed.
+ *
+ * It answers a value when it has one: the plates fill left to right, the last
+ * one partially, so four plates read as a four-segment bar. Without a value
+ * they cycle, each held back by its own index.
+ */
+export declare const ProgressBox: React.ForwardRefExoticComponent<ProgressBoxProps & React.RefAttributes<HTMLDivElement>>;

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

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

package/dist/components/progress-box/index.d.ts

@@ -0,0 +1,2 @@
+export { ProgressBox } from './ProgressBox';
+export type { ProgressBoxProps } from './ProgressBox';

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

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

package/dist/components/progress-circular/ProgressCircular.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { type ProgressSharedProps } from '../../internal/progress';
+import type { NebaColor, NebaSize } from '../../types';
+export interface ProgressCircularProps extends ProgressSharedProps {
+    /** Diameter of the ring. Sits just under the control ladder at every step. */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+}
+/**
+ * A ring that fills, and the one to reach for when there is no room for a bar —
+ * inside a button, at the end of a table row, next to a field.
+ *
+ * The value and the label sit *beside* the ring rather than inside it. A number
+ * in the middle of a dial is the picture everyone has of this component, and it
+ * only works at two of the five sizes: at `xs` the ring is fourteen pixels
+ * across and there is nowhere for "40%" to go. Beside it, every size reads.
+ */
+export declare const ProgressCircular: React.ForwardRefExoticComponent<ProgressCircularProps & React.RefAttributes<HTMLDivElement>>;

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

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

package/dist/components/progress-circular/index.d.ts

@@ -0,0 +1,2 @@
+export { ProgressCircular } from './ProgressCircular';
+export type { ProgressCircularProps } from './ProgressCircular';

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

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

package/dist/components/progress-linear/ProgressLinear.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { type ProgressSharedProps } from '../../internal/progress';
+import type { NebaColor, NebaSize } from '../../types';
+export interface ProgressLinearProps extends ProgressSharedProps {
+    /** Thickness of the groove. Nothing else on a bar has a size. */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+}
+/**
+ * A bar that fills. The workhorse: it is the only one of the three that can
+ * show *how much* is left at a glance, because length is the one quantity a
+ * reader can compare without counting.
+ *
+ * Base UI's Progress owns the semantics — `role="progressbar"`, the value and
+ * range attributes, `aria-valuetext`, and dropping the value entirely when the
+ * bar is indeterminate — and it also computes the fill width, so the determinate
+ * case here is a class list and nothing else.
+ */
+export declare const ProgressLinear: React.ForwardRefExoticComponent<ProgressLinearProps & React.RefAttributes<HTMLDivElement>>;

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

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

package/dist/components/progress-linear/index.d.ts

@@ -0,0 +1,2 @@
+export { ProgressLinear } from './ProgressLinear';
+export type { ProgressLinearProps } from './ProgressLinear';

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

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

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

@@ -0,0 +1,51 @@
+import * as React from 'react';
+import { Radio as BaseUIRadio } from '@base-ui/react/radio';
+import { RadioGroup as BaseUIRadioGroup } from '@base-ui/react/radio-group';
+import type { NebaColor, NebaOrientation, NebaSize } from '../../types';
+export interface RadioGroupProps extends Omit<React.ComponentPropsWithoutRef<typeof BaseUIRadioGroup>, 'className' | 'style' | 'render'> {
+    /** @default 'md' */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /**
+     * Which way the options stack. Vertical by default — a column of options is
+     * scannable at any length, and a row silently becomes unreadable the moment
+     * one label is longer than expected.
+     * @default 'vertical'
+     */
+    orientation?: NebaOrientation;
+    /** The question the options answer. Rendered as the group's legend. */
+    label?: React.ReactNode;
+    /** Helper text under the label. */
+    description?: React.ReactNode;
+    /** Error message below the options. Its presence also turns the group invalid. */
+    error?: React.ReactNode;
+    /** Forces the invalid state without a message. Defaults to `!!error`. */
+    invalid?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export interface RadioProps extends Omit<React.ComponentPropsWithoutRef<typeof BaseUIRadio.Root>, 'className' | 'style' | 'render' | 'children'> {
+    /** The text beside the dot. Wired to it by Base UI's Field. */
+    label?: React.ReactNode;
+    /** Helper text under the label. */
+    description?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * One option in a RadioGroup.
+ *
+ * It has no `size` and no `color` of its own — both come from the group, which
+ * is the only place they can be set once and mean the same thing for every
+ * option in the set.
+ */
+export declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLElement>>;
+/**
+ * A set of options where exactly one is chosen.
+ *
+ * Base UI owns the roving tab index and the arrow-key navigation, which is the
+ * whole reason a radio group is a component at all rather than a `<div>` full of
+ * inputs: the set takes one tab stop, and the arrows move within it.
+ */
+export declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;

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

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

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

@@ -0,0 +1,2 @@
+export { Radio, RadioGroup } from './RadioGroup';
+export type { RadioGroupProps, RadioProps } from './RadioGroup';

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

@@ -0,0 +1 @@
+export{Radio,RadioGroup}from"./RadioGroup";

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

@@ -0,0 +1,76 @@
+import * as React from 'react';
+import type { NebaElevation, NebaStyleProps } from '../../types';
+/**
+ * What a Select's value may be.
+ *
+ * Deliberately not generic over arbitrary objects. A select is a form control,
+ * its value is what a form submits, and every escape from that — object values,
+ * custom equality, a stringifier for the trigger — buys flexibility by making
+ * the common case harder to write. Keep the identifier here and look the object
+ * up on the other side.
+ */
+export type SelectValue = string | number;
+export interface SelectOption {
+    /** Submitted, and what `value` / `onValueChange` speak in. */
+    value: SelectValue;
+    /** Shown in the list and in the trigger. Defaults to the value itself. */
+    label?: React.ReactNode;
+    /** Unavailable, but still listed — the option exists, it just cannot be picked. */
+    disabled?: boolean;
+}
+export interface SelectProps extends NebaStyleProps {
+    /**
+     * The options, as data. There is no `<Select.Option>` to compose: what a
+     * caller has is almost always an array already, and the list has to be
+     * available to the trigger before the popup has ever been opened.
+     */
+    items: readonly SelectOption[];
+    /** The chosen value. Use with `onValueChange` for a controlled select. */
+    value?: SelectValue | null;
+    /** The initially chosen value, for an uncontrolled select. */
+    defaultValue?: SelectValue | null;
+    onValueChange?: (value: SelectValue | null) => void;
+    /** Shown in the trigger while nothing is chosen. */
+    placeholder?: React.ReactNode;
+    /**
+     * Drop shadow depth of the *trigger*. The popup has its own, fixed: it
+     * genuinely floats above the page, which is the one case elevation is for.
+     * @default 0
+     */
+    elevation?: NebaElevation;
+    /** Label above the trigger, wired to it by Base UI's Field. */
+    label?: React.ReactNode;
+    /** Helper text below the trigger. */
+    description?: React.ReactNode;
+    /** Error message below. Its presence also turns the select invalid. */
+    error?: React.ReactNode;
+    /** Forces the invalid state without a message. Defaults to `!!error`. */
+    invalid?: boolean;
+    /** Content placed before the value. Sized in `em`, so it tracks the text. */
+    startIcon?: React.ReactNode;
+    /** Stretches to the width of the container. */
+    fullWidth?: boolean;
+    /** Unavailable. */
+    disabled?: boolean;
+    /** The value is shown but cannot be changed. */
+    readOnly?: boolean;
+    /** Whether a value must be chosen before the form is submitted. */
+    required?: boolean;
+    /** Identifies the field when a form is submitted. */
+    name?: string;
+    id?: string;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * One value chosen from a list of them.
+ *
+ * The trigger is a TextField's shell wearing a chevron, on purpose: a form where
+ * the select is a different height, radius or colour from the fields around it
+ * is a form that looks assembled rather than designed.
+ *
+ * Base UI owns everything hard about this — the popup's positioning and flipping,
+ * the focus trap, typeahead, the hidden input that makes it submit — and the
+ * work here is the surface it all wears.
+ */
+export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/select/Select.js

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

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

@@ -0,0 +1,2 @@
+export { Select } from './Select';
+export type { SelectOption, SelectProps, SelectValue } from './Select';

package/dist/components/select/index.js

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

package/dist/components/slider/Slider.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { Slider as BaseUISlider } from '@base-ui/react/slider';
+import type { NebaColor, NebaOrientation, NebaSize } from '../../types';
+type BaseSliderProps = Omit<React.ComponentPropsWithoutRef<typeof BaseUISlider.Root>, 'className' | 'style' | 'render' | 'children' | 'orientation'>;
+export interface SliderProps extends BaseSliderProps {
+    /** @default 'md' */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /**
+     * Which way the slider runs. A vertical slider has no length of its own, so
+     * give it a height — the default `h-40` is a starting point, not a rule.
+     * @default 'horizontal'
+     */
+    orientation?: NebaOrientation;
+    /** The label above the track. */
+    label?: React.ReactNode;
+    /** Helper text below the track. */
+    description?: React.ReactNode;
+    /**
+     * Shows the current value beside the label. Pass a function to format it —
+     * the raw numbers and Base UI's already-localised strings are both handed in.
+     * @default false
+     */
+    showValue?: boolean | ((formatted: readonly string[], values: readonly number[]) => React.ReactNode);
+    /** Class names for the wrapper, not for the track. */
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * A value chosen along a range.
+ *
+ * Pass an array to `value` or `defaultValue` and it becomes a range slider with
+ * one thumb per entry — there is no separate `range` prop, because the shape of
+ * the value already says which one this is.
+ */
+export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/slider/Slider.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{Slider as r}from"@base-ui/react/slider";import{metaTextClasses as n,surfaceClasses as s,transitionClasses as o}from"../../internal/styles";const t={xs:"h-1",sm:"h-1.5",md:"h-1.5",lg:"h-2",xl:"h-2.5"},i={xs:"w-1",sm:"w-1.5",md:"w-1.5",lg:"w-2",xl:"w-2.5"},c={xs:"size-3",sm:"size-3.5",md:"size-4",lg:"size-5",xl:"size-6"},d={xs:"h-4",sm:"h-4.5",md:"h-5",lg:"h-6",xl:"h-7"},f={xs:"w-4",sm:"w-4.5",md:"w-5",lg:"w-6",xl:"w-7"},u="rounded-full bg-(--n-soft)",m=`rounded-full bg-(--n-fill) ${o}`,h=["rounded-full border bg-(--neba-surface)",s,"[border-color:var(--n-line-hover)]","[box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]","cursor-grab select-none active:cursor-grabbing",o,"hover:[box-shadow:var(--neba-shadow-2),0_0_0_4px_var(--n-soft)]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2","data-[dragging]:[box-shadow:var(--neba-shadow-1),0_0_0_6px_var(--n-soft-hover)]"].join(" ");export const Slider=a.forwardRef(function({size:a="md",color:s="primary",orientation:o="horizontal",label:b,description:x,showValue:v=!1,disabled:g=!1,className:w,style:p,...$},_){const y="vertical"===o,N={"--n-fill":`var(--neba-${s}-fill)`,"--n-accent":`var(--neba-${s}-accent)`,"--n-soft":`var(--neba-${s}-soft)`,"--n-soft-hover":`var(--neba-${s}-soft-hover)`,"--n-line-hover":`var(--neba-${s}-line-hover)`,"--n-ring":`var(--neba-${s}-ring)`},j=$.value??$.defaultValue,z=Array.isArray(j)?j.length:1;return l(r.Root,{ref:_,orientation:o,disabled:g,className:["flex",y?"w-fit flex-col items-center gap-2":"w-full flex-col gap-1.5",g?"[filter:saturate(0.25)] opacity-70 [&_*]:cursor-not-allowed":"",w??""].filter(Boolean).join(" "),style:{...N,...p},...$,children:[b||v?l("div",{className:`flex w-full items-baseline gap-2 ${n[a]}`,children:[b?e(r.Label,{className:g?"font-medium text-(--neba-disabled-fg)":"font-medium text-(--neba-fg)",children:b}):null,v?e(r.Value,{className:"ms-auto tabular-nums text-(--neba-muted-fg)",children:"function"==typeof v?v:null}):null]}):null,e(r.Control,{className:["flex touch-none select-none items-center justify-center",y?`${f[a]} h-40 flex-col`:`w-full ${d[a]}`].join(" "),children:l(r.Track,{className:[u,y?`${i[a]} h-full`:`${t[a]} w-full`].join(" "),children:[e(r.Indicator,{className:m}),Array.from({length:z},(l,n)=>e(r.Thumb,{index:n,className:`${h} ${c[a]}`},n))]})}),x?e("div",{className:`${n[a]} text-(--neba-muted-fg)`,children:x}):null]})});

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

@@ -0,0 +1,2 @@
+export { Slider } from './Slider';
+export type { SliderProps } from './Slider';

package/dist/components/slider/index.js

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

package/dist/components/switch/Switch.d.ts

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import { Switch as BaseUISwitch } from '@base-ui/react/switch';
+import type { NebaColor, NebaSize } from '../../types';
+/** Which side of the track the label sits on. */
+export type SwitchLabelPlacement = 'start' | 'end';
+type BaseSwitchProps = Omit<React.ComponentPropsWithoutRef<typeof BaseUISwitch.Root>, 'className' | 'style' | 'render' | 'children'>;
+export interface SwitchProps extends BaseSwitchProps {
+    /** @default 'md' */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /** The text beside the track. Wired to it by Base UI's Field. */
+    label?: React.ReactNode;
+    /** Helper text under the label. */
+    description?: React.ReactNode;
+    /** Error message below. Its presence also turns the switch invalid. */
+    error?: React.ReactNode;
+    /** Forces the invalid state without a message. Defaults to `!!error`. */
+    invalid?: boolean;
+    /**
+     * Which side the label sits on. `end` reads as a caption for the control;
+     * `start` is for a settings list, where the labels form a column and every
+     * switch lines up on the right.
+     * @default 'end'
+     */
+    labelPlacement?: SwitchLabelPlacement;
+    /** Class names for the field wrapper, not for the track. */
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * An immediate on/off.
+ *
+ * The difference from a Checkbox is not visual, it is temporal: a checkbox is a
+ * value that gets submitted with a form, a switch takes effect the moment it
+ * moves. If there is a Save button underneath, it should have been a checkbox.
+ */
+export declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLElement>>;
+export {};

package/dist/components/switch/Switch.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as a,Fragment as r}from"react/jsx-runtime";import*as n from"react";import{Switch as l}from"@base-ui/react/switch";import{Field as o}from"@base-ui/react/field";import{controlTextClasses as t,metaTextClasses as i,surfaceClasses as c}from"../../internal/styles";const s={xs:"h-3.5 w-6",sm:"h-4 w-7",md:"h-5 w-9",lg:"h-6 w-11",xl:"h-7 w-13"},d={xs:"data-[checked]:left-[calc(100%-0.75rem)]",sm:"data-[checked]:left-[calc(100%-0.875rem)]",md:"data-[checked]:left-[calc(100%-1.125rem)]",lg:"data-[checked]:left-[calc(100%-1.375rem)]",xl:"data-[checked]:left-[calc(100%-1.625rem)]"},b=["relative inline-flex shrink-0 border","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","rounded-full","[transition-property:background-color,border-color,box-shadow]","[transition-duration:var(--neba-duration-fill),var(--neba-duration),var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),h=[c,"cursor-pointer bg-(--n-panel) [border-color:var(--n-line)]","[box-shadow:var(--neba-plate-glass)]","hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]","data-[checked]:bg-(--n-fill) data-[checked]:[border-color:transparent]","data-[checked]:[box-shadow:var(--neba-plate-solid)]","data-[checked]:hover:bg-(--n-fill-hover)"].join(" "),f=[c,"cursor-default bg-(--n-panel) [border-color:var(--n-line)]","[box-shadow:var(--neba-plate-glass)] [filter:saturate(0.55)]","data-[checked]:bg-(--n-fill) data-[checked]:[border-color:transparent]"].join(" "),m=["cursor-not-allowed bg-transparent [border-color:var(--neba-disabled-border)] shadow-none","data-[checked]:bg-(--neba-disabled-bg)"].join(" "),v=["absolute inset-y-0.5 left-0.5 aspect-square rounded-full bg-(--neba-surface)","[box-shadow:var(--neba-shadow-1)]","[transition:left_var(--neba-duration)_var(--neba-ease)]"].join(" ");export const Switch=n.forwardRef(function({size:n="md",color:c="primary",label:u,description:p,error:g,invalid:x,labelPlacement:w="end",disabled:k=!1,readOnly:j=!1,className:$,style:N,...y},_){const R=null!=g&&!1!==g&&""!==g,B=x??R,O=B?"danger":c,S={"--n-fill":`var(--neba-${O}-fill)`,"--n-fill-hover":`var(--neba-${O}-fill-hover)`,"--n-accent":`var(--neba-${O}-accent)`,"--n-panel":"var(--neba-panel)","--n-panel-hover":"var(--neba-panel-hover)","--n-line":`var(--neba-${O}-line)`,"--n-line-hover":`var(--neba-${O}-line-hover)`,"--n-ring":`var(--neba-${O}-ring)`},q=e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(l.Root,{ref:_,className:[b,s[n],k?m:j?f:h].join(" "),disabled:k,readOnly:j,...y,children:e(l.Thumb,{className:`${v} ${d[n]}`})})}),z=u||p?a("span",{className:["flex min-w-0 flex-col gap-0.5","start"===w?"flex-1":""].filter(Boolean).join(" "),children:[u?e(o.Label,{className:["leading-[1.4]",k?"text-(--neba-disabled-fg)":"cursor-pointer text-(--neba-fg)"].join(" "),children:u}):null,p?e(o.Description,{className:`${i[n]} text-(--neba-muted-fg)`,children:p}):null]}):null;return a(o.Root,{disabled:k,invalid:B,className:["inline-flex flex-col gap-1 align-top",$??""].filter(Boolean).join(" "),style:{...S,...N},children:[e("div",{className:`flex items-start gap-2.5 ${t[n]}`,children:a(r,"start"===w?{children:[z,q]}:{children:[q,z]})}),R?e(o.Error,{match:!0,className:`${i[n]} text-(--n-accent)`,children:g}):null]})});

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

@@ -0,0 +1,2 @@
+export { Switch } from './Switch';
+export type { SwitchLabelPlacement, SwitchProps } from './Switch';

package/dist/components/switch/index.js

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

package/dist/components/table/Table.d.ts

@@ -0,0 +1,80 @@
+import * as React from 'react';
+import { type BoxProps } from '../box/Box';
+import type { NebaAlign } from '../../types';
+/** Which edge the text in a column lines up against. */
+export type TableAlign = NebaAlign;
+/**
+ * A column: its heading, its default width, and how to get a cell out of a row.
+ *
+ * This is the whole reason Table takes data rather than markup. A `<td>` written
+ * out per row can silently disagree with the `<th>` above it about how many
+ * there are or what order they come in; a column list cannot.
+ */
+export interface TableColumn<Row> {
+    /**
+     * Identifies the column, and — unless `render` says otherwise — names the
+     * property to read off each row.
+     */
+    key: string;
+    /** The heading. Defaults to the `key`, which is usually not what you want. */
+    label?: React.ReactNode;
+    /**
+     * The column's default width. A number is pixels; a string is any CSS length
+     * (`'30%'`, `'12rem'`, `'minmax(...)'` is not — this is a `<col>`, not a grid).
+     *
+     * "Default" is meant: the table still balances the columns to fill its width,
+     * so this is a starting proportion rather than a guarantee.
+     */
+    width?: number | string;
+    /**
+     * Text alignment. Numbers usually want `end` so their digits line up in a
+     * column; everything else wants `start`.
+     * @default 'start'
+     */
+    align?: TableAlign;
+    /**
+     * Renders the cell. Without it the cell is `row[key]` rendered as-is, which
+     * covers strings and numbers and nothing else.
+     */
+    render?: (row: Row, index: number) => React.ReactNode;
+}
+export interface TableProps<Row> extends Omit<BoxProps, 'padded' | 'children' | 'render' | 'title'> {
+    /** The columns, in the order they appear. */
+    headers: readonly TableColumn<Row>[];
+    /** The rows. */
+    items: readonly Row[];
+    /**
+     * A stable key per row. Defaults to the row's index, which is fine for a
+     * static table and wrong for one that sorts or filters.
+     */
+    getRowKey?: (row: Row, index: number) => React.Key;
+    /** Shown above the table, and read out as its accessible name. */
+    caption?: React.ReactNode;
+    /** What to show instead of rows when `items` is empty. */
+    empty?: React.ReactNode;
+    /**
+     * Tints every other row. Useful for a wide table where the eye has to track
+     * across; noise on a narrow one.
+     * @default false
+     */
+    striped?: boolean;
+    /** Lights the row under the pointer. @default false */
+    hoverable?: boolean;
+    /**
+     * Pins the header while the body scrolls. Only does anything if something
+     * around the table actually constrains its height.
+     * @default false
+     */
+    stickyHeader?: boolean;
+    /** Makes rows activatable. Also turns on the hover treatment. */
+    onRowClick?: (row: Row, index: number) => void;
+}
+/**
+ * A grid of data.
+ *
+ * The sheet is a Box — `variant`, `size`, `color`, `density` and `elevation` all
+ * pass straight through, so a table is styled on the same axes as everything it
+ * might sit next to. What Table adds is the part that is genuinely tabular: the
+ * columns, the rows, and the fact that the two cannot drift apart.
+ */
+export declare function Table<Row>({ headers, items, getRowKey, caption, empty, striped, hoverable, stickyHeader, onRowClick, size, density, className, ...boxProps }: TableProps<Row>): React.JSX.Element;

package/dist/components/table/Table.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Box as r}from"../box/Box";import{controlTextLeadingClasses as a,metaTextClasses as l,paddingXValues as n}from"../../internal/styles";const o={default:{xs:"0.25rem",sm:"0.375rem",md:"0.625rem",lg:"0.75rem",xl:"0.875rem"},compact:{xs:"0.125rem",sm:"0.25rem",md:"0.375rem",lg:"0.5rem",xl:"0.625rem"}},s=["[--n-row:transparent]","[transition:background-color_var(--neba-duration)_var(--neba-ease)]"].join(" "),i={borderTop:"1px solid var(--n-line)",backgroundColor:"var(--n-row)"};export function Table({headers:d,items:c,getRowKey:m,caption:p,empty:h,striped:b=!1,hoverable:x=!1,stickyHeader:y=!1,onRowClick:g,size:f="md",density:u="default",className:v,...w}){const k=n[u][f],N=o[u][f],j=Boolean(g),$=x||j,B={padding:`${N} ${k}`},C={...B,backgroundColor:"var(--n-panel-press)"};return e(r,{size:f,density:u,padded:!1,className:["overflow-x-auto",v??""].filter(Boolean).join(" "),...w,children:t("table",{className:`w-full text-start ${a[f]} text-(--neba-fg)`,style:{borderCollapse:"collapse"},children:[p?e("caption",{className:`${l[f]} text-(--neba-muted-fg)`,style:{...B,textAlign:"start"},children:p}):null,e("colgroup",{children:d.map(t=>e("col",{style:void 0===t.width?void 0:{width:"number"==typeof t.width?`${t.width}px`:t.width}},t.key))}),e("thead",{children:e("tr",{children:d.map(t=>e("th",{scope:"col",className:["font-semibold whitespace-nowrap text-(--neba-muted-fg)",y?"sticky top-0 z-10 [backdrop-filter:var(--neba-blur)]":""].filter(Boolean).join(" "),style:{...C,textAlign:t.align??"start"},children:t.label??t.key},t.key))})}),e("tbody",{children:0===c.length?e("tr",{className:s,style:i,children:e("td",{colSpan:d.length,className:"text-(--neba-muted-fg)",style:{padding:`2rem ${k}`,textAlign:"center"},children:h??"No data"})}):c.map((t,r)=>e("tr",{className:[s,b&&r%2==1?"[--n-row:var(--n-panel-hover)]":"",$?"hover:[--n-row:var(--n-soft)]":"",j?"cursor-pointer":""].filter(Boolean).join(" "),style:i,onClick:g?()=>g(t,r):void 0,children:d.map(a=>e("td",{style:{...B,textAlign:a.align??"start"},children:a.render?a.render(t,r):t[a.key]},a.key))},m?m(t,r):r))})]})})}

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

@@ -0,0 +1,2 @@
+export { Table } from './Table';
+export type { TableAlign, TableColumn, TableProps } from './Table';

package/dist/components/table/index.js

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