@radui/ui 0.4.0 → 0.6.0

package/dist/components/Table.d.ts

@@ -1,39 +1,85 @@
-import React from 'react';
+import React$1, { CSSProperties } from 'react';
 
-type TableRootProps = React.ComponentPropsWithoutRef<'div'> & {
+type ColumnWidths = Record<number, number>;
+type TableResizeHandleVisibility = 'hover' | 'always';
+interface TableContextValue {
+    rootClass: string;
+    resizable: boolean;
+    resizeHandleVisibility: TableResizeHandleVisibility;
+    columnCount: number;
+    registerColumnIndex: (columnIndex: number) => void;
+    columnWidths: ColumnWidths;
+    getColumnStyle: (columnIndex: number) => CSSProperties | undefined;
+    startColumnResize: (columnIndex: number, headerElement: HTMLElement, event: React.MouseEvent | React.TouchEvent) => void;
+    handleColumnResizeKeyDown: (columnIndex: number, headerElement: HTMLElement, event: React.KeyboardEvent) => void;
+    isResizing: boolean;
+    activeColumnIndex: number | null;
+}
+
+type TableRootProps = React$1.ComponentPropsWithoutRef<'div'> & {
     customRootClass?: string;
+    resizable?: boolean;
+    defaultColumnWidths?: number[] | ColumnWidths;
+    columnWidths?: number[] | ColumnWidths;
+    onColumnWidthsChange?: (widths: ColumnWidths) => void;
+    minColumnWidth?: number;
+    resizeHandleVisibility?: TableResizeHandleVisibility;
 };
-declare const TableRoot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+
+declare const useTable: () => TableContextValue;
+declare const TableRoot: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     customRootClass?: string;
-} & React.RefAttributes<HTMLDivElement>>;
+    resizable?: boolean;
+    defaultColumnWidths?: number[] | ColumnWidths;
+    columnWidths?: number[] | ColumnWidths;
+    onColumnWidthsChange?: (widths: ColumnWidths) => void;
+    minColumnWidth?: number;
+    resizeHandleVisibility?: TableResizeHandleVisibility;
+} & React$1.RefAttributes<HTMLDivElement>>;
 
-type TableHeadProps = React.ComponentPropsWithoutRef<'thead'>;
-declare const TableHead: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React.RefAttributes<HTMLTableSectionElement>>;
+type TableHeadProps = React$1.ComponentPropsWithoutRef<'thead'>;
+declare const TableHead: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React$1.RefAttributes<HTMLTableSectionElement>>;
 
-type TableBodyProps = React.ComponentPropsWithoutRef<'tbody'>;
-declare const TableBody: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React.RefAttributes<HTMLTableSectionElement>>;
+type TableBodyProps = React$1.ComponentPropsWithoutRef<'tbody'>;
+declare const TableBody: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React$1.RefAttributes<HTMLTableSectionElement>>;
 
-type TableRowProps = React.ComponentPropsWithoutRef<'tr'>;
-declare const TableRow: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & React.RefAttributes<HTMLTableRowElement>>;
+type TableRowProps = React$1.ComponentPropsWithoutRef<'tr'>;
+declare const TableRow: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & React$1.RefAttributes<HTMLTableRowElement>>;
 
-type TableColumnCellHeaderProps = React.ComponentPropsWithoutRef<'th'>;
-declare const TableColumnCellHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "ref"> & React.RefAttributes<HTMLTableHeaderCellElement>>;
+type TableColumnCellHeaderProps = React$1.ComponentPropsWithoutRef<'th'> & {
+    columnIndex?: number;
+};
+declare const TableColumnCellHeader: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "ref"> & {
+    columnIndex?: number;
+} & React$1.RefAttributes<HTMLTableHeaderCellElement>>;
 
-type TableCellProps = React.ComponentPropsWithoutRef<'td'>;
-declare const TableCell: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "ref"> & React.RefAttributes<HTMLTableDataCellElement>>;
+type TableColumnResizeHandleProps = React$1.ComponentPropsWithoutRef<'div'> & {
+    'aria-label'?: string;
+};
+declare const TableColumnResizeHandle: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    'aria-label'?: string;
+} & React$1.RefAttributes<HTMLDivElement>>;
+
+type TableCellProps = React$1.ComponentPropsWithoutRef<'td'> & {
+    columnIndex?: number;
+};
+declare const TableCell: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "ref"> & {
+    columnIndex?: number;
+} & React$1.RefAttributes<HTMLTableDataCellElement>>;
 
-type TableProps = React.HTMLAttributes<HTMLTableElement> & {
-    children?: React.ReactNode;
+type TableProps = React$1.HTMLAttributes<HTMLTableElement> & {
+    children?: React$1.ReactNode;
 };
-interface TableComponent extends React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>> {
+interface TableComponent extends React$1.ForwardRefExoticComponent<TableProps & React$1.RefAttributes<HTMLTableElement>> {
     Root: typeof TableRoot;
     Body: typeof TableBody;
     Head: typeof TableHead;
     Row: typeof TableRow;
     Cell: typeof TableCell;
     ColumnCellHeader: typeof TableColumnCellHeader;
+    ColumnResizeHandle: typeof TableColumnResizeHandle;
 }
 declare const Table: TableComponent;
 
-export { Table as default };
-export type { TableBodyProps, TableCellProps, TableColumnCellHeaderProps, TableHeadProps, TableProps, TableRootProps, TableRowProps };
+export { Table as default, useTable };
+export type { TableBodyProps, TableCellProps, TableColumnCellHeaderProps, TableColumnResizeHandleProps, TableHeadProps, TableProps, TableResizeHandleVisibility, TableRootProps, TableRowProps };

package/dist/components/Table.js

@@ -1 +1 @@
-'use client';import e from"react";import{jsx as a}from"react/jsx-runtime";import{c as l}from"./clsx-BaVHROc5.js";import{c as r}from"./index-6If6D2Zi.js";const s="Table",c=e.forwardRef((({children:e,className:c="",customRootClass:o="",...d},t)=>{const n=r(o,s);return a("div",{ref:t,className:l(`${n}-wrapper`,c),...d,children:a("table",{className:l(n),children:e})})}));c.displayName=s;const o=e.forwardRef((({children:e,className:r="header",...s},c)=>a("thead",{ref:c,className:l(r),...s,children:e})));o.displayName="TableHead";const d=e.forwardRef((({children:e,className:r="",...s},c)=>a("tbody",{ref:c,className:l(r),...s,children:e})));d.displayName="TableBody";const t=e.forwardRef((({children:e,className:r="row",...s},c)=>a("tr",{ref:c,className:l(r),...s,children:e})));t.displayName="TableRow";const n=e.forwardRef((({children:e,className:r="cell-header",...s},c)=>a("th",{ref:c,className:l(r),...s,children:e})));n.displayName="TableColumnCellHeader";const m=e.forwardRef((({children:e,className:r="cell",...s},c)=>a("td",{ref:c,className:l(r),...s,children:e})));m.displayName="TableCell";const i=e.forwardRef((function(e,a){return console.warn("Direct usage of Table is not supported. Please use Table.Root, Table.Head, etc. instead."),null}));i.displayName="Table",i.Root=c,i.Body=d,i.Head=o,i.Row=t,i.Cell=m,i.ColumnCellHeader=n;export{i as default};
+'use client';import e,{createContext as n,useRef as t,useState as r,useCallback as o,useEffect as l,useLayoutEffect as a,useMemo as s}from"react";import{jsx as i,jsxs as c}from"react/jsx-runtime";import{c as u}from"./clsx-BaVHROc5.js";import{u as d}from"./useComponentClass-QwNivz0h.js";import{K as m}from"./keyboard-BKF7hXqL.js";import"./ThemeContext-Sm-iNANd.js";const h=n(null),f="Table",v=()=>{const n=e.useContext(h);if(!n)throw new Error("Table components must be used within a Table.Root");return n};function b(e){return e?Array.isArray(e)?Object.fromEntries(e.map(((e,n)=>[n,e]))):e:{}}const y=e.forwardRef((({children:e,className:n="",customRootClass:v="",resizable:y=!1,defaultColumnWidths:C,columnWidths:p,onColumnWidthsChange:R,minColumnWidth:z=48,resizeHandleVisibility:w="hover",...E},N)=>{const x=d(v,f),T=t(null),[g,H]=r((()=>b(C))),[L,M]=r(0),[I,j]=r(!1),[W,A]=r(null),D=t({}),O=t(0),X=t(!1),k=t(null),K=o((()=>{const e=k.current;e&&(document.removeEventListener("mousemove",e.handleMove),document.removeEventListener("mouseup",e.handleEnd),document.removeEventListener("touchmove",e.handleMove),document.removeEventListener("touchend",e.handleEnd),document.removeEventListener("touchcancel",e.handleEnd),k.current=null)}),[]);l((()=>()=>{K()}),[K]);const S=void 0!==p,P=S?b(p):g;D.current=P,O.current=L;const V=o((e=>{S||H(e),R?.(e)}),[S,R]),$=o((e=>{M((n=>Math.max(n,e+1)))}),[]),B=o((e=>{if(!y)return;const n=P[e];return void 0!==n?{width:n}:void 0}),[P,y]);a((()=>{if(!y||S||!T.current||0===L||X.current)return;const e=T.current.offsetWidth;if(e<=0)return;const n=Object.keys(D.current).length>0?function(e,n,t){const r=Array.from({length:n},((n,t)=>e[t]??0)),o=r.reduce(((e,n)=>e+n),0);if(o<=0||t<=0)return e;const l=t/o;return Object.fromEntries(r.map(((e,n)=>[n,Math.max(1,Math.round(e*l))])))}(D.current,L,e):function(e,n){const t=Math.max(1,Math.floor(n/e));return Object.fromEntries(Array.from({length:e},((e,n)=>[n,t])))}(L,e);X.current=!0,V(n)}),[L,S,y,V]);const _=o(((e,n)=>{let t=e;for(let e=0;e<Math.abs(n);e+=1)if(t=n<0?t.previousElementSibling:t.nextElementSibling,!t)return null;return t}),[]),F=o(((e,n)=>D.current[e]??n?.offsetWidth??z),[z]),G=o(((e,n,t,r)=>{const o=e+1;if(o>=O.current)return;const l=r-z,a=t-z,s=Math.max(-a,Math.min(l,n)),i=t+s,c=r-s;V({...D.current,[e]:i,[o]:c})}),[z,V]),q=o(((e,n,t)=>{if(!y||e>=O.current-1)return;t.preventDefault();const r="clientX"in t?t.clientX:t.touches[0].clientX,o=_(n,1),l=F(e,n),a=F(e+1,o);j(!0),A(e),K();const s=n=>{const t="clientX"in n?n.clientX:n.touches[0].clientX;G(e,t-r,l,a)},i=()=>{j(!1),A(null),K()};k.current={handleMove:s,handleEnd:i},document.addEventListener("mousemove",s),document.addEventListener("mouseup",i),document.addEventListener("touchmove",s),document.addEventListener("touchend",i),document.addEventListener("touchcancel",i)}),[G,K,F,_,y]),J=o(((e,n,t)=>{if(!y||e>=O.current-1)return;const r=t.shiftKey?20:5;let o=0;if(t.key===m.ARROW_LEFT?o=-r:t.key===m.ARROW_RIGHT&&(o=r),0===o)return;t.preventDefault();const l=_(n,1);G(e,o,F(e,n),F(e+1,l))}),[G,F,_,y]),Q=s((()=>({rootClass:x,resizable:y,resizeHandleVisibility:w,columnCount:L,registerColumnIndex:$,columnWidths:P,getColumnStyle:B,startColumnResize:q,handleColumnResizeKeyDown:J,isResizing:I,activeColumnIndex:W})),[W,L,P,B,J,I,$,w,y,x,q]);return i(h.Provider,{value:Q,children:i("div",{ref:N,className:u(x&&`${x}-wrapper`,n),"data-resizable":y?"":void 0,"data-resizing":y&&I?"":void 0,"data-resize-handle-visibility":y?w:void 0,...E,children:c("table",{ref:T,className:u(x),"data-resizable":y?"":void 0,style:y?{tableLayout:"fixed",width:"100%"}:void 0,children:[y&&L>0&&i("colgroup",{children:Array.from({length:L},((e,n)=>i("col",{style:B(n)},n)))}),e]})})})}));y.displayName=f;const C=e.forwardRef((({children:e,className:n="header",...t},r)=>i("thead",{ref:r,className:u(n),...t,children:e})));C.displayName="TableHead";const p=e.forwardRef((({children:e,className:n="",...t},r)=>i("tbody",{ref:r,className:u(n),...t,children:e})));p.displayName="TableBody";const R=e.forwardRef((({children:e,className:n="row",...t},r)=>i("tr",{ref:r,className:u(n),...t,children:e})));R.displayName="TableRow";const z=n(null),w=e.forwardRef((({children:n,className:t="cell-header",columnIndex:r,style:o,...l},a)=>{const{resizable:s,registerColumnIndex:c}=v(),d=s&&void 0!==r;e.useLayoutEffect((()=>{void 0!==r&&c(r)}),[r,c]);const m=i("th",{ref:a,className:u(t,d&&"resizable"),style:o,...l,children:n});return void 0===r?m:i(z.Provider,{value:{columnIndex:r},children:m})}));w.displayName="TableColumnCellHeader";const E=e.forwardRef((({className:n,"aria-label":t,...r},o)=>{const{rootClass:l,resizable:a,resizeHandleVisibility:s,columnCount:c,startColumnResize:d,handleColumnResizeKeyDown:m,isResizing:h,activeColumnIndex:f}=v(),{columnIndex:b}=(()=>{const n=e.useContext(z);if(!n)throw new Error("Table.ColumnResizeHandle must be used within a Table.ColumnCellHeader with columnIndex");return n})(),y=e.useRef(null),C=h&&f===b,p=c>0&&b>=c-1,R=e.useCallback((e=>{y.current=e?.closest("th")??null,"function"==typeof o?o(e):o&&(o.current=e)}),[o]);return!a||p?null:i("div",{...r,ref:R,"data-slot":"table-column-resize-handle","data-resize-handle-visibility":s,"data-state":C?"active":void 0,className:u(l&&`${l}-column-resize-handle`,{active:C},n),role:"separator","aria-orientation":"vertical","aria-label":t||`Resize column ${b+1}`,tabIndex:0,onMouseDown:e=>{y.current&&d(b,y.current,e)},onTouchStart:e=>{y.current&&d(b,y.current,e)},onKeyDown:e=>{y.current&&m(b,y.current,e)}})}));E.displayName="TableColumnResizeHandle";const N=e.forwardRef((({children:e,className:n="cell",columnIndex:t,style:r,...o},l)=>{const{resizable:a}=v();return i("td",{ref:l,className:u(n,a&&void 0!==t&&"resizable"),style:r,...o,children:e})}));N.displayName="TableCell";const x=e.forwardRef((function(e,n){return console.warn("Direct usage of Table is not supported. Please use Table.Root, Table.Head, etc. instead."),null}));x.displayName="Table",x.Root=y,x.Body=p,x.Head=C,x.Row=R,x.Cell=N,x.ColumnCellHeader=w,x.ColumnResizeHandle=E;export{x as default,v as useTable};

package/dist/components/Tabs.d.ts

@@ -37,6 +37,7 @@ type TabRootProps = React.ComponentPropsWithoutRef<'div'> & {
     onValueChange?: (value: string) => void;
     orientation?: 'horizontal' | 'vertical';
     dir?: 'ltr' | 'rtl';
+    loop?: boolean;
     activationMode?: 'automatic' | 'manual';
     asChild?: boolean;
 };
@@ -48,6 +49,7 @@ declare const TabRoot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLPr
     onValueChange?: (value: string) => void;
     orientation?: "horizontal" | "vertical";
     dir?: "ltr" | "rtl";
+    loop?: boolean;
     activationMode?: "automatic" | "manual";
     asChild?: boolean;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Tabs.js

@@ -1 +1 @@
-'use client';import a,{createContext as t,useContext as e,useRef as o,useCallback as r,useEffect as i}from"react";import{jsx as s}from"react/jsx-runtime";import{c as n}from"./clsx-BaVHROc5.js";import{R as l}from"./index-TYaYKM2M.js";import{P as d}from"./index-98jQ1vTr.js";import{c}from"./index-6If6D2Zi.js";import{u}from"./index-wRElCyvx.js";import"./index-BOy86lYu.js";import"./mergeRefs-B8eZ_q-T.js";const m=t(null),h=a.forwardRef((({className:a="",children:t,asChild:o=!1,...r},i)=>{const c=e(m);if(!c)throw new Error("TabList must be used within a TabRoot");const{rootClass:u,orientation:h}=c;return s(l.Group,{children:s(d.div,{ref:i,role:"tablist","aria-orientation":h,"aria-label":"todo",className:n(`${u}-list`,a),asChild:o,...r,children:t})})}));h.displayName="TabList";const f=a.forwardRef((({value:a,children:t,className:i="",disabled:c,asChild:u=!1,...h},f)=>{const b=e(m);if(!b)throw new Error("TabTrigger must be used within a TabRoot");const{tabValue:p,handleTabChange:C,rootClass:v,orientation:T,activationMode:w}=b,R=o(null),g=r((a=>{R.current=a,"function"==typeof f?f(a):f&&(f.current=a)}),[f]),N=a===p,j={};return j["data-state"]=N?"active":"inactive",j["data-orientation"]=T||"horizontal",c&&(j["data-disabled"]=""),s(l.Item,{onFocus:()=>{return a&&!c&&(t=a,void(c||(R.current&&R.current?.focus(),"automatic"===w&&C(t))));var t},children:s(d.button,{ref:g,onClick:t=>{c||a&&C(a)},className:n(`${v}-trigger`,N?"active":"",c?"disabled":"",i),role:"tab","aria-selected":N,"aria-disabled":c,disabled:c,asChild:u,...j,...h,children:t})})}));f.displayName="TabTrigger";const b="TabContent",p=a.forwardRef((({className:a="",value:t,children:o,customRootClass:r,asChild:i=!1,forceMount:l=!1,...u},h)=>{const f=c(r,b),p=e(m);if(!p)throw new Error("TabContent must be used within a TabRoot");const{tabValue:C,orientation:v}=p,T=C===t;if(!(l||T))return null;const w={};return w["data-state"]=T?"active":"inactive",w["data-orientation"]=v||"horizontal",s(d.div,{ref:h,className:n(f,a),role:"tabpanel","aria-hidden":!T,asChild:i,...w,...u,children:o})}));p.displayName=b;const C="Tabs",v=a.forwardRef((({children:a,defaultValue:t="",onValueChange:e=()=>{},customRootClass:o="",value:r,className:h,color:f,orientation:b="horizontal",dir:p="ltr",activationMode:v="automatic",asChild:T=!1,...w},R)=>{const g=c(o,C),[N,j]=u(r,t||"",e),x=a=>{j(a)};i((()=>{void 0===r&&t&&x(t)}),[t,r]);const y={rootClass:g,tabValue:N,handleTabChange:x,orientation:b,activationMode:v},V={};return V["data-orientation"]=b,s(m.Provider,{value:y,children:s(l.Root,{orientation:b,loop:!0,dir:p,asChild:!0,children:s(d.div,{ref:R,className:n(g,h),"data-rad-ui-accent-color":f,asChild:T,...V,...w,children:a})})})}));v.displayName=C;const T=a.forwardRef(((a,t)=>(console.warn("Direct usage of Tabs is not supported. Please use Tabs.Root, Tabs.List, etc. instead."),null)));T.displayName="Tabs",T.List=h,T.Content=p,T.Root=v,T.Trigger=f;export{T as default};
+'use client';import a,{createContext as t,useContext as o,useRef as e,useCallback as r,useEffect as i}from"react";import{jsx as s}from"react/jsx-runtime";import{c as n}from"./clsx-BaVHROc5.js";import{R as l}from"./index-m8Mhi26u.js";import{P as d}from"./index-XF8itt-H.js";import{u as c}from"./useComponentClass-QwNivz0h.js";import{u}from"./index-wRElCyvx.js";import"./index-CfC8-kd8.js";import"./keyboard-BKF7hXqL.js";import"./mergeRefs-B8eZ_q-T.js";import"./mergeProps-0RucjqeH.js";import"./ThemeContext-Sm-iNANd.js";const m=t(null),b=a.forwardRef((({className:a="",children:t,asChild:e=!1,...r},i)=>{const c=o(m);if(!c)throw new Error("TabList must be used within a TabRoot");const{rootClass:u,orientation:b}=c;return s(l.Group,{children:s(d.div,{ref:i,role:"tablist","aria-orientation":b,"aria-label":"todo",className:n(u&&`${u}-list`,a),"data-slot":"tabs-list",asChild:e,...r,children:t})})}));b.displayName="TabList";const h=a.forwardRef((({value:a,children:t,className:i="",disabled:c,asChild:u=!1,...b},h)=>{const f=o(m);if(!f)throw new Error("TabTrigger must be used within a TabRoot");const{tabValue:p,handleTabChange:C,rootClass:T,orientation:v,activationMode:g}=f,w=e(null),R=r((a=>{w.current=a,"function"==typeof h?h(a):h&&(h.current=a)}),[h]),N=a===p,j={};return j["data-state"]=N?"active":"inactive",j["data-orientation"]=v||"horizontal",c&&(j["data-disabled"]=""),s(l.Item,{onFocus:()=>{return a&&!c&&(t=a,void(c||(w.current&&w.current?.focus(),"automatic"===g&&C(t))));var t},children:s(d.button,{ref:R,onClick:t=>{c||a&&C(a)},className:n(T&&`${T}-trigger`,N?"active":"",c?"disabled":"",i),role:"tab","aria-selected":N,"aria-disabled":c,disabled:c,"data-slot":"tabs-trigger",asChild:u,...j,...b,children:t})})}));h.displayName="TabTrigger";const f="TabContent",p=a.forwardRef((({className:a="",value:t,children:e,customRootClass:r,asChild:i=!1,forceMount:l=!1,...u},b)=>{const h=c(r,f),p=o(m);if(!p)throw new Error("TabContent must be used within a TabRoot");const{tabValue:C,orientation:T}=p,v=C===t;if(!(l||v))return null;const g={};return g["data-state"]=v?"active":"inactive",g["data-orientation"]=T||"horizontal",s(d.div,{ref:b,className:n(h,a),role:"tabpanel","aria-hidden":!v,"data-slot":"tabs-content",asChild:i,...g,...u,children:e})}));p.displayName=f;const C="Tabs",T=a.forwardRef((({children:a,defaultValue:t="",onValueChange:o=()=>{},customRootClass:e="",value:r,className:b,color:h,orientation:f="horizontal",dir:p="ltr",loop:T=!0,activationMode:v="automatic",asChild:g=!1,...w},R)=>{const N=c(e,C),[j,x]=u(r,t||"",o),y=a=>{x(a)};i((()=>{void 0===r&&t&&y(t)}),[t,r]);const V={rootClass:N,tabValue:j,handleTabChange:y,orientation:f,activationMode:v},L={};return L["data-orientation"]=f,s(m.Provider,{value:V,children:s(l.Root,{orientation:f,loop:T,dir:p,asChild:!0,children:s(d.div,{ref:R,className:n(N,b),"data-color":h,"data-slot":"tabs-root",asChild:g,...L,...w,children:a})})})}));T.displayName=C;const v=a.forwardRef(((a,t)=>(console.warn("Direct usage of Tabs is not supported. Please use Tabs.Root, Tabs.List, etc. instead."),null)));v.displayName="Tabs",v.List=b,v.Content=p,v.Root=T,v.Trigger=h;export{v as default};

package/dist/components/Text.js

@@ -1 +1 @@
-'use client';import s,{forwardRef as e}from"react";import{c as a}from"./index-6If6D2Zi.js";import{c as t}from"./clsx-BaVHROc5.js";const r="Text",c=["div","span","p","label"],o=e((({children:e,customRootClass:o="",className:l="",as:m="p",...p},i)=>{const n=a(o,r);return c.includes(m)||(m="p"),s.createElement(m,{ref:i,className:t(n,l),...p},e)}));o.displayName=r;export{o as default};
+'use client';import s,{forwardRef as e}from"react";import{u as a}from"./useComponentClass-QwNivz0h.js";import{c as t}from"./clsx-BaVHROc5.js";import"./ThemeContext-Sm-iNANd.js";const o="Text",m=["div","span","p","label"],r=e((({children:e,customRootClass:r="",className:l="",as:c="p",...p},n)=>{const i=a(r,o);return m.includes(c)||(c="p"),s.createElement(c,{ref:n,className:t(i,l),...p},e)}));r.displayName=o;export{r as default};

package/dist/components/TextArea.js

@@ -1 +1 @@
-'use client';import{jsx as e,jsxs as a}from"react/jsx-runtime";import r from"react";import{c as s}from"./clsx-BaVHROc5.js";import{c as o}from"./index-6If6D2Zi.js";import{c as t,a as l,b as d}from"./index-3dZuI04X.js";const i="TextArea",c=r.forwardRef((({children:a,customRootClass:r="",className:c="",variant:m="",size:n="",resize:f="both",color:p="",radius:u="",...h},x)=>{const N=o(r,i),R=t("textarea",{variant:m,size:n,resize:f,radius:u}),y=d(p),b=l(R,y);return e("div",{ref:x,className:s(N,c),...h,...b,children:a})}));c.displayName=i;const m=r.forwardRef((({children:a,placeholder:r="",...s},o)=>e("textarea",{ref:o,placeholder:r,defaultValue:"string"==typeof a?a:void 0,...s})));m.displayName="TextAreaInput";const n=r.forwardRef((({customRootClass:r="",placeholder:o="",className:t="",disabled:l=!1,readonly:d=!1,children:i,...n},f)=>a(c,{ref:f,customRootClass:r,className:s(t),...n,children:[e(m,{placeholder:o,disabled:l,readOnly:d,children:i}),i]})));n.displayName="TextArea",n.Input=m,n.Root=c;export{n as default};
+'use client';import{jsx as e,jsxs as a}from"react/jsx-runtime";import r from"react";import{c as s}from"./clsx-BaVHROc5.js";import{u as o}from"./useComponentClass-QwNivz0h.js";import{c as t,a as l,b as i}from"./index-eAZUMNef.js";import"./ThemeContext-Sm-iNANd.js";const d="TextArea",c=r.forwardRef((({children:a,customRootClass:r="",className:c="",variant:m="",size:n="",resize:p="both",color:f="",radius:u="",...h},x)=>{const N=o(r,d),R=t("textarea",{variant:m,size:n,resize:p,radius:u}),y=i(f),C=l(R,y);return e("div",{ref:x,className:s(N,c),...h,...C,children:a})}));c.displayName=d;const m=r.forwardRef((({children:a,placeholder:r="",...s},o)=>e("textarea",{ref:o,placeholder:r,defaultValue:"string"==typeof a?a:void 0,...s})));m.displayName="TextAreaInput";const n=r.forwardRef((({customRootClass:r="",placeholder:o="",className:t="",disabled:l=!1,readonly:i=!1,children:d,...n},p)=>a(c,{ref:p,customRootClass:r,className:s(t),...n,children:[e(m,{placeholder:o,disabled:l,readOnly:i,children:d}),d]})));n.displayName="TextArea",n.Input=m,n.Root=c;export{n as default};

package/dist/components/TextField.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+
+type TextFieldRootProps = React.ComponentPropsWithoutRef<'div'> & {
+    className?: string;
+    customRootClass?: string;
+};
+declare const TextFieldRoot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    className?: string;
+    customRootClass?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+
+type TextFieldInputProps = React.ComponentPropsWithoutRef<'input'>;
+declare const TextFieldInput: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type TextFieldSlotProps = React.ComponentPropsWithoutRef<'div'> & {
+    side?: 'start' | 'end';
+};
+declare const TextFieldSlot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    side?: "start" | "end";
+} & React.RefAttributes<HTMLDivElement>>;
+
+type TextFieldResetProps = React.ComponentPropsWithoutRef<'button'>;
+declare const TextFieldReset: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+
+type TextFieldProps = React.ComponentPropsWithoutRef<'input'> & {
+    className?: string;
+    customRootClass?: string;
+    inputClassName?: string;
+    startSlot?: React.ReactNode;
+    endSlot?: React.ReactNode;
+};
+type TextFieldComponent = React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>> & {
+    Root: typeof TextFieldRoot;
+    Input: typeof TextFieldInput;
+    Slot: typeof TextFieldSlot;
+    Reset: typeof TextFieldReset;
+};
+declare const TextField: TextFieldComponent;
+
+export { TextField as default };
+export type { TextFieldInputProps, TextFieldProps, TextFieldResetProps, TextFieldRootProps, TextFieldSlotProps };

package/dist/components/TextField.js

@@ -0,0 +1 @@
+'use client';import{jsx as e,jsxs as t}from"react/jsx-runtime";import s from"react";import{c as a}from"./clsx-BaVHROc5.js";import{u as l}from"./useComponentClass-QwNivz0h.js";import{c as n}from"./mergeProps-0RucjqeH.js";import"./ThemeContext-Sm-iNANd.js";const r=s.createContext({rootClass:"",inputRef:{current:null},clearInput:()=>{},hasValue:!1,setHasValue:()=>!1}),o="TextField",u=s.forwardRef((({className:t="",customRootClass:n="",children:u,...c},i)=>{const d=l(n,o),p=s.useRef(null),[f,m]=s.useState(!1),h=s.useCallback((()=>{const e=p.current;if(!e)return;const t=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value")?.set;t?.call(e,""),e.dispatchEvent(new Event("input",{bubbles:!0})),m(!1),e.focus()}),[]);return e(r.Provider,{value:{rootClass:d,inputRef:p,clearInput:h,hasValue:f,setHasValue:m},children:e("div",{ref:i,className:a(d,t),"data-slot":"text-field-root",...c,children:u})})}));u.displayName=o;const c=s.forwardRef((({className:t="",type:l="text",onChange:o,onInput:u,value:c,defaultValue:i,...d},p)=>{const{rootClass:f,inputRef:m,setHasValue:h}=s.useContext(r);s.useEffect((()=>{void 0===c?void 0!==i&&h(String(i).length>0):h(String(c).length>0)}),[i,h,c]);return e("input",{ref:n(p,m),type:l,className:a(f&&`${f}-input`,t),"data-slot":"text-field-input",value:c,defaultValue:i,onInput:e=>{h(e.currentTarget.value.length>0),u?.(e)},onChange:e=>{h(e.currentTarget.value.length>0),o?.(e)},...d})}));c.displayName="TextFieldInput";const i=s.forwardRef((({children:t,className:l="",side:n,...o},u)=>{const{rootClass:c,inputRef:i}=s.useContext(r);return e("div",{ref:u,role:"presentation",className:a(c&&`${c}-slot`,l),"data-slot":"text-field-slot","data-text-field-slot":n,...o,onMouseDown:e=>{o.onMouseDown?.(e),e.defaultPrevented||(e.preventDefault(),i.current?.focus())},children:t})}));i.displayName="TextFieldSlot";const d=s.forwardRef((({className:t="",type:l="button",onClick:n,children:o,...u},c)=>{const{rootClass:i,clearInput:d,inputRef:p,hasValue:f}=s.useContext(r);return f?e("button",{ref:c,type:l,className:a(i&&`${i}-reset`,t),"data-slot":"text-field-reset",onClick:e=>{n?.(e),e.defaultPrevented||p.current?.disabled||p.current?.readOnly||d()},...u,children:o}):null}));d.displayName="TextFieldReset";const p=s.forwardRef((({className:s="",customRootClass:l="",inputClassName:n="",startSlot:r,endSlot:o,type:d="text",...p},f)=>t(u,{customRootClass:l,className:a(s),children:[r?e(i,{side:"start",children:r}):null,e(c,{ref:f,type:d,className:a(n),...p}),o?e(i,{side:"end",children:o}):null]})));p.displayName="TextField",p.Root=u,p.Input=c,p.Slot=i,p.Reset=d;export{p as default};

package/dist/components/Theme.d.ts

@@ -5,12 +5,14 @@ type ThemeProps = ComponentPropsWithoutRef<'div'> & {
     accentColor?: string;
     radius?: string;
     scaling?: string;
+    classNamespace?: string;
 };
 declare const Theme: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     appearance?: "light" | "dark" | "system";
     accentColor?: string;
     radius?: string;
     scaling?: string;
+    classNamespace?: string;
 } & React.RefAttributes<HTMLDivElement>>;
 
 export { Theme as default };

package/dist/components/Theme.js

@@ -1 +1 @@
-'use client';import{jsx as e,jsxs as r}from"react/jsx-runtime";import{forwardRef as t,useRef as a,useState as n,useEffect as i,useCallback as c}from"react";import{T as o}from"./ThemeContext-Sm-iNANd.js";const d=t((function({appearance:t="system",id:d="rad-ui-theme-container",accentColor:s="",radius:u="",scaling:m="",children:l,...h},f){const p=a(null),v=a(null),[g,y]=n(t),[k,x]=n(s),[R,T]=n(u),[j,w]=n(m),C=a(f);i((()=>{C.current=f}),[f]);const E=c((e=>{p.current=e,((e,r)=>{"function"!=typeof e?e&&(e.current=r):e(r)})(C.current,e)}),[]);return i((()=>{const e=window.matchMedia("(prefers-color-scheme: dark)"),r=e=>{"system"===t&&y(e.matches?"dark":"light")};return"system"===t?(y(e.matches?"dark":"light"),e.addEventListener("change",r)):y(t),()=>e.removeEventListener("change",r)}),[t]),i((()=>{s&&x(s)}),[s]),i((()=>{u&&T(u)}),[u]),i((()=>{m&&w(m)}),[m]),e(o.Provider,{value:{containerRef:p,portalRootRef:v},children:r("div",{ref:E,id:d,"data-rad-ui-theme":g,"data-rad-ui-accent-color":k,"data-rad-ui-radius":R,"data-rad-ui-scaling":j,...h,children:[l,e("div",{ref:v,"data-rad-ui-portal-root":""})]})})}));d.displayName="Theme";export{d as default};
+'use client';import{jsx as e,jsxs as a}from"react/jsx-runtime";import{forwardRef as r,useRef as t,useState as n,useEffect as c,useCallback as i}from"react";import{T as o}from"./ThemeContext-Sm-iNANd.js";const s=r((function({appearance:r="system",id:s="rad-ui-theme-container",accentColor:d="",radius:m="",scaling:l="",classNamespace:u,children:h,...p},f){const v=t(null),g=t(null),[y,k]=n(r),[x,N]=n(d),[R,T]=n(m),[j,w]=n(l),C=t(f);c((()=>{C.current=f}),[f]);const E=i((e=>{v.current=e,((e,a)=>{"function"!=typeof e?e&&(e.current=a):e(a)})(C.current,e)}),[]);return c((()=>{const e=window.matchMedia("(prefers-color-scheme: dark)"),a=e=>{"system"===r&&k(e.matches?"dark":"light")};return"system"===r?(k(e.matches?"dark":"light"),e.addEventListener("change",a)):k(r),()=>e.removeEventListener("change",a)}),[r]),c((()=>{d&&N(d)}),[d]),c((()=>{m&&T(m)}),[m]),c((()=>{l&&w(l)}),[l]),e(o.Provider,{value:{containerRef:v,portalRootRef:g,classNamespace:u},children:a("div",{ref:E,id:s,"data-rad-ui-theme":y,"data-rad-ui-accent-color":x,"data-rad-ui-radius":R,"data-rad-ui-scaling":j,...p,children:[h,e("div",{ref:g,"data-rad-ui-portal-root":""})]})})}));s.displayName="Theme";export{s as default};

package/dist/components/Toast.d.ts

@@ -0,0 +1,322 @@
+import React$1 from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/**
+ * Viewport corner — headless string for `data-position` (theme defines valid values).
+ * Common: `bottom-right`, `bottom-left`, `bottom-center`, `top-right`, `top-left`, `top-center`.
+ */
+type ToastPosition = string;
+interface ToastData {
+    id: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    /** Headless semantic / styling hook — forwarded as `data-variant` when set. */
+    variant?: string;
+    /** Headless — forwarded as `data-type` when set (e.g. `loading`). */
+    type?: string;
+    /** Auto-dismiss delay (ms). Base UI name: prefer `timeout`; we normalize both. */
+    duration?: number;
+    timeout?: number;
+    persistent?: boolean;
+    /**
+     * Live-region urgency — headless string; we treat `high` as `aria-live="assertive"`, otherwise `polite`.
+     */
+    priority?: string;
+    onDismiss?: () => void;
+    /** Base UI name — called when the toast begins closing. */
+    onClose?: () => void;
+    /** Base UI — after removal from the list (post-exit). */
+    onRemove?: () => void;
+    /**
+     * Incremented when `add({ id })` upserts an existing toast (pulse / replay).
+     */
+    updateKey?: number;
+    /** Base UI — toast was dropped because the stack limit was exceeded. */
+    limited?: boolean;
+    /** Base UI — props spread onto the action button (`Toast.Action`). */
+    actionProps?: React.ButtonHTMLAttributes<HTMLButtonElement> & {
+        children?: React.ReactNode;
+    };
+    /** Base UI — custom payload for render logic. */
+    data?: unknown;
+    /** Headless custom render function (Sonner-like). Receives render props. */
+    render?: (props: {
+        id: string;
+        toast: ToastData;
+        onDismiss: () => void;
+    }) => React.ReactNode;
+    /** Optional icon node. */
+    icon?: React.ReactNode;
+    /** Optional className for the toast item/content (headless). */
+    className?: string;
+    /** Optional inline styles. */
+    style?: React.CSSProperties;
+    /** Unstyled mode hint (headless - styling left to consumer). */
+    unstyled?: boolean;
+}
+/** Options for `toast()` / `manager.add()` — optional stable `id` for upsert. */
+type CreateToastInput = Omit<ToastData, 'id' | 'updateKey' | 'limited'> & {
+    id?: string;
+};
+/** Base UI `update()` / per-state `promise` payloads. */
+type ToastManagerUpdateOptions<TData = unknown> = Omit<ToastData, 'id' | 'updateKey' | 'limited'> & {
+    data?: TData;
+};
+/** Imperative API — `ToastState` singleton or `createToastManager()`. */
+interface IToastManager {
+    defaultTimeout: number;
+    subscribe: (fn: (toast: ToastData) => void) => () => void;
+    subscribeDismiss: (fn: (id: string) => void) => () => void;
+    subscribeUpdate: (fn: (id: string, partial: Partial<ToastData>) => void) => () => void;
+    create: (data: CreateToastInput) => string;
+    update: (id: string, partial: ToastManagerUpdateOptions) => void;
+    dismiss: (id: string) => void;
+    dismissAll: () => void;
+    close: (id?: string) => void;
+}
+
+/**
+ * Toast manager — Base UI–aligned imperative API (`add`, `close`, `update`, `promise`).
+ * Use `ToastState` singleton or `createToastManager()` per `<Toast.Provider toastManager={…}>`.
+ */
+
+type Subscriber = (toast: ToastData) => void;
+type DismissSubscriber = (id: string) => void;
+type UpdateSubscriber = (id: string, partial: Partial<ToastData>) => void;
+declare class ToastManager implements IToastManager {
+    defaultTimeout: number;
+    private subscribers;
+    private dismissSubscribers;
+    private updateSubscribers;
+    subscribe(fn: Subscriber): () => void;
+    subscribeDismiss(fn: DismissSubscriber): () => void;
+    subscribeUpdate(fn: UpdateSubscriber): () => void;
+    /** `id` optional — omit for auto id; reuse `id` to upsert (provider bumps `updateKey`). */
+    create(data: CreateToastInput): string;
+    update(id: string, partial: ToastManagerUpdateOptions): void;
+    dismiss(id: string): void;
+    dismissAll(): void;
+    /** Base UI — `close(id?)` dismisses one or all. */
+    close(id?: string): void;
+}
+declare const ToastState: ToastManager;
+declare function createToastManager(options?: {
+    timeout?: number;
+}): ToastManager;
+type ToastOptions$1 = Omit<ToastData, 'id' | 'variant' | 'updateKey' | 'limited'>;
+/** Per-state options for `promise()` (string shortcut or full toast fields). */
+type ToastPromiseState = string | Omit<CreateToastInput, 'id' | 'updateKey'>;
+type ToastPromiseMessages<T> = {
+    loading: ToastPromiseState;
+    success: ToastPromiseState | ((data: T) => ToastPromiseState);
+    error: ToastPromiseState | ((err: unknown) => ToastPromiseState);
+    /** Optional Sonner-style description fields */
+    description?: ToastPromiseState | ((data: T) => ToastPromiseState);
+};
+/**
+ * Track a promise with a persistent loading toast, then success or error.
+ * Pass `manager` to target a non-default provider instance.
+ */
+declare function promiseToast<T>(promiseLike: Promise<T>, messages: ToastPromiseMessages<T>, options?: ToastOptions$1, manager?: IToastManager): Promise<T>;
+declare function createToast(options: CreateToastInput): string;
+declare function createToast(title: string, options?: CreateToastInput): string;
+declare const toast: typeof createToast & {
+    success: (titleOrOptions: string | CreateToastInput, options?: CreateToastInput) => string;
+    error: (titleOrOptions: string | CreateToastInput, options?: CreateToastInput) => string;
+    warning: (titleOrOptions: string | CreateToastInput, options?: CreateToastInput) => string;
+    info: (titleOrOptions: string | CreateToastInput, options?: CreateToastInput) => string;
+    loading: (titleOrOptions: string | CreateToastInput, options?: CreateToastInput) => string;
+    dismiss: (id?: string) => void;
+    dismissAll: () => void;
+    close: (id?: string) => void;
+    promise: typeof promiseToast;
+    message: typeof createToast;
+    custom: (renderFn: (id: string) => React.ReactNode, options?: Omit<CreateToastInput, "render">) => string;
+};
+
+type ToastProviderProps = {
+    children: React$1.ReactNode;
+    customRootClass?: string;
+    position?: ToastPosition;
+    expand?: boolean;
+    gap?: number;
+    /** @deprecated Prefer Base UI name `limit`. */
+    maxToasts?: number;
+    /** Base UI — max visible stack size (default `3`). */
+    limit?: number;
+    /** Base UI — default auto-dismiss ms (default `5000`). */
+    timeout?: number;
+    /** Sonner alias */
+    duration?: number;
+    /** Base UI — isolate queue / use outside React tree (pair with `createToastManager()`). */
+    toastManager?: ToastManager;
+    /** Optional className passthrough for viewport region if needed (headless) */
+    className?: string;
+    /** Optional inline styles for the default viewport. */
+    style?: React$1.CSSProperties;
+    /** Sonner-like props (headless passthroughs where applicable) */
+    richColors?: boolean;
+    closeButton?: boolean;
+    offset?: number | string;
+    mobileOffset?: number | string | {
+        top?: number | string;
+        bottom?: number | string;
+        left?: number | string;
+        right?: number | string;
+    };
+    theme?: 'light' | 'dark' | 'system';
+    dir?: 'ltr' | 'rtl' | 'auto';
+    swipeDirections?: string[];
+    visibleToasts?: number;
+    toastOptions?: Record<string, any>;
+    /** Sonner prop aliases/completeness */
+    invert?: boolean;
+    pauseWhenPageIsHidden?: boolean;
+    icons?: Record<string, React$1.ReactNode>;
+    loadingIcon?: React$1.ReactNode;
+    rtl?: boolean;
+    hotkey?: string[];
+    containerAriaLabel?: string;
+    dragThreshold?: number;
+};
+declare const ToastProvider: React$1.FC<ToastProviderProps>;
+
+type ToastPortalProps = {
+    children: React$1.ReactNode;
+    /** Override the portal container. Defaults to the Theme portal root, then document.body. */
+    container?: HTMLElement | null;
+};
+declare const ToastPortal: React$1.FC<ToastPortalProps>;
+
+type ToastViewportProps = {
+    children: React$1.ReactNode;
+    className?: string;
+    style?: React$1.CSSProperties;
+};
+declare const ToastViewport: React$1.FC<ToastViewportProps>;
+
+type ToastRootProps = {
+    toast: ToastData;
+    className?: string;
+    children: React$1.ReactNode;
+};
+declare const ToastRoot: React$1.FC<ToastRootProps>;
+
+type ToastContentProps = React$1.HTMLAttributes<HTMLDivElement>;
+declare const ToastContent: React$1.ForwardRefExoticComponent<ToastContentProps & React$1.RefAttributes<HTMLDivElement>>;
+
+type ToastTitleProps = React$1.HTMLAttributes<HTMLHeadingElement>;
+/** Base UI renders a heading — use `h2` for landmark semantics. */
+declare const ToastTitle: React$1.ForwardRefExoticComponent<ToastTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
+
+type ToastDescriptionProps = React$1.HTMLAttributes<HTMLParagraphElement>;
+declare const ToastDescription: React$1.ForwardRefExoticComponent<ToastDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
+
+type ToastCloseProps = React$1.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const ToastClose: React$1.ForwardRefExoticComponent<ToastCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+type ToastActionProps = React$1.ButtonHTMLAttributes<HTMLButtonElement>;
+/**
+ * Base UI–style action button — merges `toast.actionProps` then your props.
+ */
+declare const ToastAction: React$1.ForwardRefExoticComponent<ToastActionProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+type ToastOptions = Omit<ToastData, 'id' | 'variant' | 'updateKey' | 'limited'>;
+/** Mirrors [Base UI `useToastManager`](https://base-ui.com/react/components/toast#useToastManager). */
+interface ToastManagerReturn {
+    toasts: ToastData[];
+    add: (data: CreateToastInput) => string;
+    /** Base UI */
+    close: (toastId?: string) => void;
+    /** Base UI */
+    update: <TData = unknown>(toastId: string, options: ToastManagerUpdateOptions<TData>) => void;
+    promise: <T>(p: Promise<T>, messages: ToastPromiseMessages<T>, options?: ToastOptions) => Promise<T>;
+    /** @deprecated Use `close(id)`. */
+    dismiss: (id?: string) => void;
+    /** @deprecated Use `close()` with no args. */
+    dismissAll: () => void;
+    /** Sonner-like helpers */
+    success?: (data: CreateToastInput | string, options?: CreateToastInput) => string;
+    error?: (data: CreateToastInput | string, options?: CreateToastInput) => string;
+    warning?: (data: CreateToastInput | string, options?: CreateToastInput) => string;
+    info?: (data: CreateToastInput | string, options?: CreateToastInput) => string;
+    loading?: (data: CreateToastInput | string, options?: CreateToastInput) => string;
+}
+/**
+ * Must be called inside a `<Toast.Provider>`.
+ * Returns the live toast list and the same imperative API as Base UI’s manager.
+ */
+declare function useToastManager(): ToastManagerReturn;
+
+type ToasterProps = Omit<ToastProviderProps, 'children'> & {
+    children?: React$1.ReactNode;
+    className?: string;
+    style?: React$1.CSSProperties;
+    containerClassName?: string;
+    containerStyle?: React$1.CSSProperties;
+};
+/**
+ * Sonner-compatible Toaster wrapper.
+ * Renders a default viewport and portal. Can be used as a drop-in replacement.
+ */
+declare function Toaster({ children, className, style, containerClassName, containerStyle, ...providerProps }: ToasterProps): react_jsx_runtime.JSX.Element;
+declare namespace Toaster {
+    var displayName: string;
+}
+
+/**
+ * Toast — headless, composable notification system.
+ *
+ * ## Anatomy
+ * ```tsx
+ * <Toast.Provider>          // wrap your app — owns state & stacking engine
+ *   <Toast.Portal>          // portals into the theme root
+ *     <Toast.Viewport>      // the <ol>, handles hover expand
+ *       {toasts.map(t => (
+ *         <Toast.Root key={t.id} toast={t}>   // <li>, owns timer & swipe
+ *           <Toast.Content>                   // card wrapper, clips height
+ *             <Toast.Title>{t.title}</Toast.Title>
+ *             <Toast.Description>{t.description}</Toast.Description>
+ *             // optional — merges toast.actionProps
+ *             <Toast.Action />
+ *             <Toast.Close />
+ *           </Toast.Content>
+ *         </Toast.Root>
+ *       ))}
+ *     </Toast.Viewport>
+ *   </Toast.Portal>
+ * </Toast.Provider>
+ * ```
+ *
+ * ## Adding toasts (Base UI–aligned)
+ * ```tsx
+ * const manager = Toast.useToastManager();
+ * manager.add({ title: 'Saved!', variant: 'success', timeout: 4000 });
+ * manager.close(id);       // one toast
+ * manager.close();         // all
+ * manager.update(id, { title: 'Updated' });
+ * manager.promise(fetch('/api'), { loading: '…', success: (d) => 'Done', error: (e) => 'Failed' });
+ * manager.add({ id: 'save-status', title: 'Draft saved' }); // same id → upsert + `updateKey` / pulse
+ * ```
+ *
+ * Optional isolated queue: `const tm = createToastManager({ timeout: 5000 });` then
+ * `<Toast.Provider toastManager={tm} limit={3}>`.
+ */
+
+interface ToastNamespace {
+    Provider: typeof ToastProvider;
+    Portal: typeof ToastPortal;
+    Viewport: typeof ToastViewport;
+    Root: typeof ToastRoot;
+    Content: typeof ToastContent;
+    Title: typeof ToastTitle;
+    Description: typeof ToastDescription;
+    Action: typeof ToastAction;
+    Close: typeof ToastClose;
+    useToastManager: typeof useToastManager;
+    Toaster: typeof Toaster;
+}
+declare const Toast: ToastNamespace;
+
+export { ToastManager, ToastState, Toaster, createToastManager, Toast as default, promiseToast, toast, useToastManager };
+export type { CreateToastInput, IToastManager, ToastActionProps, ToastCloseProps, ToastContentProps, ToastData, ToastDescriptionProps, ToastManagerReturn, ToastManagerUpdateOptions, ToastPortalProps, ToastPosition, ToastPromiseMessages, ToastPromiseState, ToastProviderProps, ToastRootProps, ToastTitleProps, ToastViewportProps };

package/dist/components/Toast.js

@@ -0,0 +1 @@
+'use client';import{jsx as e,Fragment as t,jsxs as s}from"react/jsx-runtime";import i,{createContext as o,useMemo as r,useEffect as n,useState as a,useCallback as d,useContext as c,useRef as l}from"react";import{u}from"./useComponentClass-QwNivz0h.js";import{createPortal as m}from"react-dom";import{T as p}from"./ThemeContext-Sm-iNANd.js";import{c as f}from"./clsx-BaVHROc5.js";const h=o({rootClass:"",position:"bottom-right",expand:!1,gap:14,maxToasts:3,defaultToastTimeout:4e3,toastManager:void 0,isHovered:!1,setIsHovered:()=>{},heights:new Map,updateHeight:()=>{},unlinkStackHeight:()=>{},removeToast:()=>{},toasts:[],visibleToasts:[],viewportClassName:void 0,viewportStyle:void 0,containerAriaLabel:"Notifications",offset:void 0,mobileOffset:void 0,theme:void 0,dir:void 0,richColors:!1,invert:!1,pauseWhenPageIsHidden:!0,closeButton:!1,icons:void 0,loadingIcon:void 0,swipeDirections:void 0,dragThreshold:void 0}),v=o(null);let b=0;class g{constructor(){this.defaultTimeout=4e3,this.subscribers=new Set,this.dismissSubscribers=new Set,this.updateSubscribers=new Set}subscribe(e){return this.subscribers.add(e),()=>this.subscribers.delete(e)}subscribeDismiss(e){return this.dismissSubscribers.add(e),()=>this.dismissSubscribers.delete(e)}subscribeUpdate(e){return this.updateSubscribers.add(e),()=>this.updateSubscribers.delete(e)}create(e){const{id:t,timeout:s,duration:i,...o}=e,r=t??`toast-${++b}-${Math.random().toString(36).slice(2,7)}`,n={...o,id:r,duration:i??s??this.defaultTimeout};return this.subscribers.forEach((e=>e(n))),r}update(e,t){const s=function(e){const{timeout:t,...s}=e;return void 0!==t?{...s,duration:t,timeout:t}:s}(t);this.updateSubscribers.forEach((t=>t(e,s)))}dismiss(e){this.dismissSubscribers.forEach((t=>t(e)))}dismissAll(){this.dismissSubscribers.forEach((e=>e("__all__")))}close(e){void 0===e?this.dismissAll():this.dismiss(e)}}const y=new g;function w(e){const t=new g;return void 0!==e?.timeout&&(t.defaultTimeout=e.timeout),t}function T(e){return"string"==typeof e?{title:e}:e}function x(e,t,s,i=y){const o=T(t.loading),r=i.create({persistent:!0,variant:"default",...s,...o});return e.then((e=>{i.dismiss(r);const o=function(e,t){return T("function"==typeof e?e(t):e)}(t.success,e);i.create({variant:"success",...s,...o})})).catch((e=>{i.dismiss(r);const o=function(e,t){return T("function"==typeof e?e(t):e)}(t.error,e);i.create({variant:"error",...s,...o})})),e}function N(e,t){return"string"==typeof e?y.create({title:e,...t}):y.create(e)}function C(e){return(t,s)=>"string"==typeof t?y.create({title:t,variant:e,...s}):y.create({variant:e,...t})}const A=Object.assign(N,{success:C("success"),error:C("error"),warning:C("warning"),info:C("info"),loading:C("loading"),dismiss:e=>void 0===e?y.dismissAll():y.dismiss(e),dismissAll:()=>y.dismissAll(),close:e=>y.close(e),promise:x,message:N,custom:(e,t)=>y.create({...t,render:({id:t})=>e(t)})}),M=({children:t,customRootClass:s="",position:i="bottom-right",expand:o=!1,gap:c=14,maxToasts:l,limit:m,timeout:p,duration:f,toastManager:v,className:b,style:g,richColors:w,closeButton:T,offset:x,mobileOffset:N,theme:C,dir:A,swipeDirections:M,visibleToasts:S,toastOptions:H,invert:P,pauseWhenPageIsHidden:D=!0,icons:$,loadingIcon:I,rtl:k,hotkey:R,containerAriaLabel:_,dragThreshold:j})=>{const E=m??l??S??3,K=r((()=>v??y),[v]),B=p??f??4e3;n((()=>{K.defaultTimeout=B}),[K,B]);const L=u(s,"Toast"),[O,F]=a([]),[W,U]=a(!1),[q,z]=a(new Map);n((()=>{const e=K.subscribe((e=>{F((t=>{const s={...H,...e},i=t.findIndex((t=>t.id===e.id));if(-1!==i){const e=t[i],o=[...t];return o[i]={...s,updateKey:(e.updateKey??0)+1},o}return[{...s,updateKey:0},...t].slice(0,2*E)}))})),t=K.subscribeDismiss((e=>{"__all__"===e&&F([])})),s=K.subscribeUpdate(((e,t)=>{F((s=>s.map((s=>s.id===e?{...s,...t}:s))))}));return()=>{e(),t(),s()}}),[K,E,H]);const V=d((e=>{F((t=>{const s=t.find((t=>t.id===e));return s?.onRemove?.(),t.filter((t=>t.id!==e))})),z((t=>{const s=new Map(t);return s.delete(e),s}))}),[]),Y=d(((e,t)=>{z((s=>{if(s.get(e)===t)return s;const i=new Map(s);return i.set(e,t),i}))}),[]),G=d((e=>{z((t=>{if(!t.has(e))return t;const s=new Map(t);return s.delete(e),s}))}),[]),J=O.slice(0,E);return e(h.Provider,{value:{rootClass:L,position:i,expand:o,gap:c,maxToasts:E,defaultToastTimeout:B,toastManager:K,isHovered:W,setIsHovered:U,heights:q,updateHeight:Y,unlinkStackHeight:G,removeToast:V,toasts:O,visibleToasts:J,viewportClassName:b,viewportStyle:g,containerAriaLabel:_??"Notifications",offset:x,mobileOffset:N,theme:C,dir:k?"rtl":A,richColors:w??!1,invert:P??!1,pauseWhenPageIsHidden:D,closeButton:T??!1,icons:$,loadingIcon:I,swipeDirections:M,dragThreshold:j},children:t})};M.displayName="ToastProvider";const S=({children:e,container:t})=>{const s=c(p),[i,o]=a(!1);if(n((()=>{o(!0)}),[]),!i)return null;const r=t??s?.portalRootRef.current??document.body;return m(e,r)};function H(e){if(void 0!==e)return"number"==typeof e?`${e}px`:e}S.displayName="ToastPortal";const P=({children:t,className:s,style:i})=>{const{rootClass:o,position:r,expand:n,isHovered:a,setIsHovered:d,heights:u,gap:m,visibleToasts:p,viewportClassName:v,viewportStyle:b,containerAriaLabel:g,offset:y,mobileOffset:w,theme:T,dir:x,richColors:N,invert:C}=c(h),A=l(null),M=n||a,S=u.get(p[0]?.id)??0,P=p[1]?u.get(p[1].id)??0:0,D=S>0?S:P,$=M?p.reduce(((e,t)=>e+(u.get(t.id)??0)),0)+Math.max(0,p.length-1)*m:D+m*Math.max(0,p.length-1);return e("ol",{ref:A,role:"region","aria-label":g,tabIndex:-1,"data-position":r,"data-expanded":M?"":void 0,"data-theme":T,"data-rich-colors":N?"":void 0,"data-invert":C?"":void 0,dir:x,className:f(o&&`${o}-viewport`,v,s),style:{...b,"--viewport-height":`${$}px`,"--toast-frontmost-height":`${D}px`,"--toast-offset":H(y),"--toast-mobile-offset":H("object"==typeof w?void 0:w),"--toast-mobile-offset-top":H("object"==typeof w?w.top:void 0),"--toast-mobile-offset-bottom":H("object"==typeof w?w.bottom:void 0),"--toast-mobile-offset-left":H("object"==typeof w?w.left:void 0),"--toast-mobile-offset-right":H("object"==typeof w?w.right:void 0),...i},onMouseEnter:()=>d(!0),onMouseLeave:()=>d(!1),onFocusCapture:()=>d(!0),onBlurCapture:e=>{A.current?.contains(e.relatedTarget)||d(!1)},children:t})};P.displayName="ToastViewport";const D=({toast:t,className:s,children:i})=>{const{rootClass:o,position:r,expand:u,isHovered:m,heights:p,gap:b,toasts:g,visibleToasts:y,updateHeight:w,unlinkStackHeight:T,removeToast:x,defaultToastTimeout:N,toastManager:C,pauseWhenPageIsHidden:A,swipeDirections:M,dragThreshold:S}=c(h),H=l(null),P=l(null),D=t.duration??t.timeout??N,$=l(D),I=l(null),[k,R]=a(!1),[_,j]=a(!0),[E,K]=a(!1),[B,L]=a(!1),O=l(-1),F=l(-1),W=l(!1),U=l({y:0,time:0}),q=l(0),z=r.startsWith("top"),V=u||m,Y=y.findIndex((e=>e.id===t.id)),G=0===Y,J=!G&&!V,Q=g.length>0&&t.id===g[g.length-1]?.id,X=p.get(t.id)??0,Z=p.get(y[0]?.id)??0,ee=y[1]?p.get(y[1].id)??0:0,te=Z>0?Z:ee>0?ee:X;let se=0;for(let e=0;e<Y;e++)se+=(p.get(y[e]?.id)??0)+b;n((()=>{if(E)return;if(!H.current)return;const e=H.current,s=()=>{const s=e.offsetHeight;s>0&&w(t.id,s)};s();const i=new ResizeObserver(s);return i.observe(e),()=>i.disconnect()}),[t.id,w,E]),n((()=>{const e=requestAnimationFrame((()=>{R(!0);const e=setTimeout((()=>j(!1)),420);return()=>clearTimeout(e)}));return()=>cancelAnimationFrame(e)}),[]),n((()=>{const e=O.current,t=F.current,s=y.length,i=-1!==e&&Y>e&&-1!==Y&&!E,o=t>s&&-1!==Y&&!E&&Y===e,r=t>s&&-1!==Y&&!E&&-1!==e&&e>Y;if(O.current=Y,F.current=s,i||o||r){L(!0);const e=requestAnimationFrame((()=>L(!1)));return()=>cancelAnimationFrame(e)}}),[Y,E,y.length]);const[ie,oe]=a((()=>"undefined"!=typeof document&&document.hidden));n((()=>{const e=()=>oe(document.hidden);return document.addEventListener("visibilitychange",e),()=>document.removeEventListener("visibilitychange",e)}),[]);const re=d((()=>{if(!E){if(-1===Y)return t.onClose?.(),t.onDismiss?.(),T(t.id),void x(t.id);T(t.id),K(!0),t.onClose?.(),t.onDismiss?.()}}),[Y,E,t,T,x]),ne=l(re);n((()=>{ne.current=re}),[re]),n((()=>{if(!C)return;return C.subscribeDismiss((e=>{"__all__"!==e&&e===t.id&&ne.current()}))}),[t.id,C]);const ae=d((()=>{P.current&&(clearTimeout(P.current),P.current=null),null!==I.current&&($.current-=Date.now()-I.current,I.current=null)}),[]),de=d((()=>{t.persistent||$.current<=0||(I.current=Date.now(),P.current=setTimeout((()=>ne.current()),$.current))}),[t.persistent]);n((()=>{$.current=t.duration??t.timeout??N,ae()}),[t.updateKey,t.duration,t.timeout,N,ae]),n((()=>((!A||!ie)&&(Q||V)&&!E?de():ae(),ae)),[V,ie,Q,E,A,de,ae,t.updateKey]),n((()=>{if(!E)return;const e=window.setTimeout((()=>x(t.id)),200);return()=>clearTimeout(e)}),[E,x,t.id]);const ce=d((e=>{W.current=!0,U.current={y:e.clientY,time:Date.now()},H.current?.setPointerCapture(e.pointerId),ae()}),[ae]),le=d((e=>{if(!W.current||!H.current)return;const t=e.clientY-U.current.y,s=t*(z?-1:1)<0?.2*t:t;q.current=s,H.current.style.setProperty("--swipe-y",`${s}px`),H.current.setAttribute("data-swiping","")}),[z]),ue=d((e=>{if(!W.current||!H.current)return;W.current=!1,H.current.removeAttribute("data-swiping");const t=q.current,s=Date.now()-U.current.time,i=Math.abs(t)/s,o=z?-1:1,r=z?"up":"down",n=!M?.length||M.includes(r),a=S??40;n&&t*o>0&&(Math.abs(t)>=a||i>.11)?re():(q.current=0,H.current.style.setProperty("--swipe-y","0px"),de())}),[S,z,re,de,M]);if(-1===Y&&!E)return null;const me=t.updateKey&&t.updateKey>0?t.updateKey%2==0?"even":"odd":void 0,pe=V?1:Math.max(.82,1-.05*Y);let fe;if(E)fe=0;else if(V)fe=z?se:-se;else{fe=(z?1:-1)*(14*Y+(1-pe)*(te>0?te:X))}const he={"--swipe-y":"0px","--toast-swipe-movement-x":"0px","--toast-swipe-movement-y":"var(--swipe-y, 0px)","--toast-height":`${X}px`,"--scale":pe,"--y":`${fe}px`,"--toast-lift":z?1:-1,"--front-height":`${Z>0?Z:ee>0?ee:X}px`,"--toast-index":Y,"--toast-offset-y":`${z?se:-se}px`,zIndex:10-Y};return e(v.Provider,{value:{toast:t,index:Y,isExpanded:V,isFront:G,isBehind:J,dismiss:re},children:e("li",{ref:H,role:"status","aria-live":"high"===t.priority?"assertive":"polite","aria-atomic":"true","data-variant":t.variant??void 0,"data-type":t.type??void 0,"data-limited":t.limited?"":void 0,"data-mounted":k?"":void 0,"data-entering":_&&G?"":void 0,"data-restack-skip":B?"":void 0,"data-leaving":E?"":void 0,"data-expanded":V?"":void 0,"data-front":G?"":void 0,"data-behind":J?"":void 0,"data-pulse":me,"data-update-key":t.updateKey??0,"data-toast-id":t.id,className:f(o&&`${o}-item`,t.className,s),style:{...he,...t.style},onPointerDown:ce,onPointerMove:le,onPointerUp:ue,children:t.render?t.render({id:t.id,toast:t,onDismiss:re}):i})})};D.displayName="ToastRoot";const $=i.forwardRef((({className:t,children:s,...i},o)=>{const{rootClass:r}=c(h),n=c(v);return e("div",{ref:o,className:f(r&&`${r}-content`,t),"data-behind":n?.isBehind?"":void 0,"data-expanded":n?.isExpanded?"":void 0,...i,children:s})}));$.displayName="ToastContent";const I=i.forwardRef((({className:t,children:s,...i},o)=>{const{rootClass:r}=c(h);return e("h2",{ref:o,className:f(r&&`${r}-title`,t),...i,children:s})}));I.displayName="ToastTitle";const k=i.forwardRef((({className:t,children:s,...i},o)=>{const{rootClass:r}=c(h);return e("p",{ref:o,className:f(r&&`${r}-description`,t),...i,children:s})}));k.displayName="ToastDescription";const R=i.forwardRef((({className:t,children:s,onClick:i,...o},r)=>{const{rootClass:n}=c(h),a=c(v);return e("button",{ref:r,type:"button","aria-label":"Close notification",className:f(n&&`${n}-close`,t),onClick:e=>{i?.(e),a?.dismiss()},...o,children:s??"×"})}));R.displayName="ToastClose";const _=i.forwardRef((({className:t,children:s,type:i="button",...o},r)=>{const{rootClass:n}=c(h),a=c(v),d=a?.toast.actionProps;return e("button",{ref:r,type:i,className:f(n&&`${n}-action`,t),...d,...o,children:s??d?.children})}));function j(){const e=c(h),t=e.toastManager??y,s=e=>(s,i)=>"string"==typeof s?t.create({title:s,variant:e,...i}):t.create({variant:e,...s});return{toasts:[...e.toasts].reverse(),add:(e,s)=>"string"==typeof e?t.create({title:e,...s}):t.create(e),close:e=>t.close(e),update:(e,s)=>t.update(e,s),promise:(e,s,i)=>x(e,s,i,t),dismiss:e=>void 0===e?t.dismissAll():t.dismiss(e),dismissAll:()=>t.dismissAll(),success:s("success"),error:s("error"),warning:s("warning"),info:s("info"),loading:s("loading")}}function E(){const{toasts:o}=j(),{closeButton:r,icons:n,loadingIcon:a}=i.useContext(h);return e(t,{children:o.map((t=>e(D,{toast:t,children:s($,{children:[t.icon??("loading"===t.type?a:void 0)??n?.[t.variant??t.type??""],e(I,{children:t.title}),t.description&&e(k,{children:t.description}),t.actionProps&&e(_,{}),r&&e(R,{})]})},t.id)))})}function K({children:t,className:s,style:i,containerClassName:o,containerStyle:r,...n}){return e(M,{...n,children:e(S,{children:e("div",{className:o,style:r,children:e(P,{className:s,style:i,children:t??e(E,{})})})})})}_.displayName="ToastAction",K.displayName="Toaster";const B={Provider:M,Portal:S,Viewport:P,Root:D,Content:$,Title:I,Description:k,Action:_,Close:R,useToastManager:j,Toaster:K};export{g as ToastManager,y as ToastState,K as Toaster,w as createToastManager,B as default,x as promiseToast,A as toast,j as useToastManager};

package/dist/components/Toggle.js

@@ -1 +1 @@
-'use client';import{jsx as s}from"react/jsx-runtime";import{forwardRef as e}from"react";import{c as r}from"./clsx-BaVHROc5.js";import{c as a}from"./index-6If6D2Zi.js";import{u as o}from"./index-wRElCyvx.js";import{T as d}from"./index-BZVbVgqN.js";import"./index-BOy86lYu.js";import"./index-98jQ1vTr.js";import"./index-CXzybYmm.js";const i="Toggle",t=e((({defaultPressed:e=!1,customRootClass:t="",children:m,className:n="",color:l="",pressed:c,onPressedChange:p,asChild:f=!1,...x},j)=>{const[u,h]=o(c,e,p),C=a(t,i),g={};return l&&(g["data-rad-ui-accent-color"]=l),s(d,{ref:j,className:r(C,n),pressed:u,onPressedChange:h,"data-state":u?"on":"off","data-disabled":x.disabled?"":void 0,asChild:f,...x,...g,children:m})}));t.displayName=i;export{t as default};
+'use client';import{jsx as s}from"react/jsx-runtime";import{forwardRef as e}from"react";import{c as o}from"./clsx-BaVHROc5.js";import{u as r}from"./useComponentClass-QwNivz0h.js";import{u as a}from"./index-wRElCyvx.js";import{T as t}from"./index-C09ZQH_q.js";import"./ThemeContext-Sm-iNANd.js";import"./index-CfC8-kd8.js";import"./index-XF8itt-H.js";import"./mergeProps-0RucjqeH.js";import"./index-CXzybYmm.js";import"./keyboard-BKF7hXqL.js";const d="Toggle",i=e((({defaultPressed:e=!1,customRootClass:i="",children:m,className:n="",color:p="",pressed:l,onPressedChange:c,asChild:j=!1,...f},x)=>{const[u,C]=a(l,e,c),h=r(i,d),g={};return p&&(g["data-color"]=p),s(t,{ref:x,className:o(h,n),pressed:u,onPressedChange:C,"data-state":u?"on":"off","data-disabled":f.disabled?"":void 0,asChild:j,...f,...g,children:m})}));i.displayName=d;export{i as default};