tembro 2.0.0 → 2.0.2

package/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 All notable changes to this project will be documented in this file.
 
+## 2.0.2 - 2026-07-08
+
+### Changed
+
+- rebuilt `AppSidebar` into a responsive navigation surface with automatic mobile drawer behavior, overlay dismissal, escape handling, and close-on-select flow
+- refreshed the `AppSidebar` and `AppShell` showcase demos so mobile and desktop sidebar behavior are both visible from the docs surface
+- synced CLI vendor copies and added navigation render coverage for the new responsive sidebar contract
+
 ## 1.0.0 - 2026-07-08
 
 ### Changed

package/dist/components/data-table/data-table.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../inputs/search-input.cjs"),i=require("../ui/table/index.cjs"),a=require("../feedback/empty-state.cjs"),o=require("../feedback/loading-state.cjs"),ee=require("./data-table-actions-column.cjs"),te=require("./data-table-bulk-actions.cjs"),ne=require("./data-table-column-visibility-menu.cjs"),re=require("./data-table-pagination.cjs"),ie=require("./data-table-toolbar.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("react/jsx-runtime"),l=require("@tanstack/react-table");var ae={compact:`h-8 px-2 py-1.5`,default:`h-10 px-2 py-2`,comfortable:`h-12 px-3 py-3`},u={compact:`px-2 py-1.5`,default:`p-2`,comfortable:`px-3 py-3`};function oe(e,t){return typeof t==`function`?t(e):t}function se(e,t){return typeof t==`function`?t(e):t}function ce(e,t){return typeof t==`function`?t(e):t}function le(e){return e==null||e===``}function d({className:e,columns:d,data:f,title:p,description:m,features:h,search:g,toolbarActions:_,rowActions:v,bulkActions:y,onRefresh:b,onExport:x,refreshLabel:ue=`Refresh`,exportLabel:de=`Export`,getRowId:fe,isLoading:S=!1,isError:pe=!1,emptyState:me,errorState:he,loadingState:C,loadingVariant:ge=`skeleton`,toolbar:w,toolbarProps:T,pagination:E,sorting:_e,onSortingChange:ve,columnVisibility:ye,onColumnVisibilityChange:be,rowSelection:xe,onRowSelectionChange:Se,enableRowSelection:Ce,renderMobileCard:D,onRowClick:O,onRowDoubleClick:we,getRowDisabled:k,density:A=`default`,striped:j=!1,bordered:M=!1,stickyHeader:N=!1,skeletonRows:Te=6,skeletonCellClassName:Ee,cellFallback:De=`-`,tableClassName:Oe,tableWrapperClassName:ke,headerCellClassName:Ae,cellClassName:je,rowClassName:Me,renderExpandedRow:P,expanded:Ne,onExpandedChange:F,getRowCanExpand:Pe,columnPinning:I,onColumnPinningChange:Fe,...Ie}){let Le=s.useMemo(()=>{let e=d;return!v||h?.rowActions===!1?e:[...e,ee.createDataTableActionsColumn({getActions:v})]},[d,h?.rowActions,v]),L=E===!1?void 0:E,Re=L?{pageIndex:L.pageIndex,pageSize:L.pageSize}:void 0,R=!!(L&&L.manual!==!1),z=xe??{},ze=Object.keys(z).length,B=(0,l.useReactTable)({data:f,columns:Le,getRowId:fe,getCoreRowModel:(0,l.getCoreRowModel)(),getPaginationRowModel:L&&!R?(0,l.getPaginationRowModel)():void 0,manualPagination:R,pageCount:L?.pageCount,state:{sorting:_e,columnVisibility:ye,rowSelection:z,pagination:Re,expanded:Ne,...I?{columnPinning:I}:{}},onSortingChange:ve,onColumnVisibilityChange:be,onRowSelectionChange:Se,onExpandedChange:F,onColumnPinningChange:Fe,enableRowSelection:Ce,getRowCanExpand:Pe,getExpandedRowModel:(0,l.getExpandedRowModel)()}),V=B.getRowModel().rows,H=B.getSelectedRowModel().rows.map(e=>e.original),U=s.useMemo(()=>({table:B,data:f,selectedRows:H}),[f,H,B]),W=B.getVisibleLeafColumns(),Be=Math.max(W.length,1),G=typeof w==`function`?w(B):w,K=typeof T==`function`?T(B):T,Ve=!!(g&&h?.search!==!1),q=!!(h?.columnVisibility&&B.getAllLeafColumns().some(e=>e.getCanHide())),J=!!(h?.refresh&&b),Y=!!(h?.export&&x),He=!!(h?.bulkActions!==!1&&y?.length),X=Ve&&g?(0,c.jsx)(r.SearchInput,{value:g.value,onValueChange:g.onValueChange,placeholder:g.placeholder??`Search...`,wrapperClassName:g.wrapperClassName??g.className,inputClassName:g.inputClassName,disabled:g.disabled,clearable:g.clearable,clearLabel:g.clearLabel,searchIcon:g.searchIcon}):void 0,Ue=(0,c.jsxs)(c.Fragment,{children:[typeof _==`function`?_(U):_,q&&(0,c.jsx)(ne.DataTableColumnVisibilityMenu,{table:B}),J&&(0,c.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,disabled:S,onClick:()=>b?.(U),children:ue}),Y&&(0,c.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,onClick:()=>x?.(U),children:de})]}),Z=He?(0,c.jsx)(te.DataTableBulkActions,{rows:H,actions:y??[],selectedLabel:()=>`Actions`,clearLabel:null,onClearSelection:()=>B.resetRowSelection(),hideWhenEmpty:!1}):void 0,We=!!(G||K||p||m||X||_||q||J||Y||Z),Ge=!!(L&&!L.hidden),Q=S&&ge===`skeleton`,Ke=e=>(0,c.jsx)(i.TableRow,{children:(0,c.jsx)(i.TableCell,{colSpan:Be,className:`p-0`,children:e})}),qe=()=>Array.from({length:Math.max(Te,1)},(e,n)=>(0,c.jsx)(i.TableRow,{"aria-hidden":`true`,children:W.map(e=>(0,c.jsx)(i.TableCell,{className:t.cn(u[A],M&&`border-r last:border-r-0`),children:(0,c.jsx)(`div`,{className:t.cn(`h-4 w-full max-w-40 animate-pulse rounded-md bg-muted`,n%3==1&&`max-w-24`,n%3==2&&`max-w-32`,Ee)})},`${e.id}-${n}`))},`skeleton-${n}`)),$=Q?null:S?(0,c.jsx)(o.LoadingState,{label:`Loading data...`,...C}):pe?(0,c.jsx)(a.EmptyState,{title:`Could not load data`,description:`Please try again.`,...he}):V.length===0?(0,c.jsx)(a.EmptyState,{...me}):null;return(0,c.jsxs)(`div`,{"data-slot":`data-table`,className:t.cn(`grid gap-3`,e),...Ie,children:[We&&(G??(0,c.jsx)(ie.DataTableToolbar,{title:p,description:m,search:X,actions:Ue,selectionActions:Z,selectedCount:ze,totalCount:L?L.rowCount??f.length:f.length,variant:`plain`,...K})),D&&(0,c.jsx)(`div`,{className:`grid gap-3 md:hidden`,children:$??(Q?(0,c.jsx)(o.LoadingState,{label:`Loading data...`,...C}):V.map(e=>(0,c.jsx)(s.Fragment,{children:D(e)},e.id)))}),(0,c.jsxs)(`div`,{"data-slot":`data-table-wrapper`,"data-density":A,"data-striped":j||void 0,"data-bordered":M||void 0,className:t.cn(`overflow-hidden rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-card shadow-[var(--aui-card-shadow,0_10px_24px_rgba(15,23,42,0.07))] backdrop-blur`,D&&`hidden md:block`,ke),children:[(0,c.jsxs)(i.Table,{containerClassName:`rounded-none border-0 bg-transparent shadow-none ring-0`,className:t.cn(`text-[0.95rem]`,Oe),children:[(0,c.jsx)(i.TableHeader,{className:t.cn(N&&`sticky top-0 z-10 shadow-sm backdrop-blur`),children:B.getHeaderGroups().map(e=>(0,c.jsx)(i.TableRow,{children:e.headers.map(e=>(0,c.jsx)(i.TableHead,{style:{width:e.getSize(),...e.column.getIsPinned()===`left`?{left:`${e.column.getStart(`left`)}px`,position:`sticky`,zIndex:N?20:11}:{},...e.column.getIsPinned()===`right`?{right:`${e.column.getAfter(`right`)}px`,position:`sticky`,zIndex:N?20:11}:{}},className:t.cn(ae[A],`bg-[color:color-mix(in_oklch,var(--card),var(--background)_10%)] text-muted-foreground`,N&&`bg-[color:color-mix(in_oklch,var(--card),transparent_12%)] backdrop-blur`,e.column.getIsPinned()&&`bg-card shadow-[1px_0_0_var(--border)]`,M&&`border-r last:border-r-0`,se(e,Ae)),children:e.isPlaceholder?null:(0,l.flexRender)(e.column.columnDef.header,e.getContext())},e.id))},e.id))}),(0,c.jsx)(i.TableBody,{children:$?Ke($):Q?qe():V.map((e,n)=>{let r=k?.(e)??!1;return(0,c.jsxs)(s.Fragment,{children:[(0,c.jsx)(i.TableRow,{"data-state":e.getIsSelected()?`selected`:void 0,"data-striped":j&&n%2==1?`true`:void 0,"data-disabled":r||void 0,className:t.cn(O&&!r&&`cursor-pointer`,!r&&`transition-colors hover:bg-[color:color-mix(in_oklch,var(--primary),transparent_96%)] data-[state=selected]:bg-[color:color-mix(in_oklch,var(--primary),transparent_90%)]`,r&&`pointer-events-none opacity-55`,oe(e,Me)),onClick:()=>{r||O?.(e)},onDoubleClick:()=>{r||we?.(e)},children:e.getVisibleCells().map(e=>{let n=(0,l.flexRender)(e.column.columnDef.cell,e.getContext());return(0,c.jsx)(i.TableCell,{style:{...e.column.getIsPinned()===`left`?{left:`${e.column.getStart(`left`)}px`,position:`sticky`,zIndex:10}:{},...e.column.getIsPinned()===`right`?{right:`${e.column.getAfter(`right`)}px`,position:`sticky`,zIndex:10}:{}},className:t.cn(u[A],e.column.getIsPinned()&&`bg-card shadow-[1px_0_0_var(--border)]`,M&&`border-r last:border-r-0`,ce(e,je)),children:le(n)?De:n},e.id)})}),e.getIsExpanded()&&P&&(0,c.jsx)(i.TableRow,{className:`bg-muted/50 hover:bg-muted/50`,children:(0,c.jsx)(i.TableCell,{colSpan:e.getVisibleCells().length,children:P(e)})})]},e.id)})})]}),Ge&&L&&(0,c.jsx)(re.DataTablePagination,{pageIndex:L.pageIndex,pageSize:L.pageSize,pageCount:L.pageCount,rowCount:L.rowCount,pageSizeOptions:L.pageSizeOptions,showPageSize:L.showPageSize,labels:L.labels,disabled:S,onPageChange:L.onPageChange,onPageSizeChange:L.onPageSizeChange})]})]})}exports.DataTable=d;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../inputs/search-input.cjs"),i=require("../ui/table/index.cjs"),a=require("../feedback/empty-state.cjs"),o=require("../feedback/loading-state.cjs"),ee=require("./data-table-actions-column.cjs"),te=require("./data-table-bulk-actions.cjs"),ne=require("./data-table-column-visibility-menu.cjs"),re=require("./data-table-pagination.cjs"),ie=require("./data-table-toolbar.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("react/jsx-runtime"),l=require("@tanstack/react-table");var ae={compact:`h-8 px-2 py-1.5`,default:`h-10 px-2 py-2`,comfortable:`h-12 px-3 py-3`},u={compact:`px-2 py-1.5`,default:`p-2`,comfortable:`px-3 py-3`};function oe(e,t){return typeof t==`function`?t(e):t}function se(e,t){return typeof t==`function`?t(e):t}function ce(e,t){return typeof t==`function`?t(e):t}function le(e){return e==null||e===``}function d({className:e,columns:d,data:f,title:p,description:m,features:h,search:g,toolbarActions:_,rowActions:v,bulkActions:y,onRefresh:b,onExport:x,refreshLabel:ue=`Refresh`,exportLabel:de=`Export`,getRowId:fe,isLoading:S=!1,isError:pe=!1,emptyState:me,errorState:he,loadingState:C,loadingVariant:ge=`skeleton`,toolbar:w,toolbarProps:T,pagination:E,sorting:_e,onSortingChange:ve,columnVisibility:ye,onColumnVisibilityChange:be,rowSelection:xe,onRowSelectionChange:Se,enableRowSelection:Ce,renderMobileCard:D,onRowClick:O,onRowDoubleClick:we,getRowDisabled:k,density:A=`default`,striped:j=!1,bordered:M=!1,stickyHeader:N=!1,skeletonRows:Te=6,skeletonCellClassName:Ee,cellFallback:De=`-`,tableClassName:Oe,tableWrapperClassName:ke,headerCellClassName:Ae,cellClassName:je,rowClassName:Me,renderExpandedRow:P,expanded:Ne,onExpandedChange:F,getRowCanExpand:Pe,columnPinning:I,onColumnPinningChange:Fe,...Ie}){let Le=s.useMemo(()=>{let e=d;return!v||h?.rowActions===!1?e:[...e,ee.createDataTableActionsColumn({getActions:v})]},[d,h?.rowActions,v]),L=E===!1?void 0:E,Re=L?{pageIndex:L.pageIndex,pageSize:L.pageSize}:void 0,R=!!(L&&L.manual!==!1),z=xe??{},ze=Object.keys(z).length,B=(0,l.useReactTable)({data:f,columns:Le,getRowId:fe,getCoreRowModel:(0,l.getCoreRowModel)(),getPaginationRowModel:L&&!R?(0,l.getPaginationRowModel)():void 0,manualPagination:R,pageCount:L?.pageCount,state:{sorting:_e,columnVisibility:ye,rowSelection:z,pagination:Re,expanded:Ne,...I?{columnPinning:I}:{}},onSortingChange:ve,onColumnVisibilityChange:be,onRowSelectionChange:Se,onExpandedChange:F,onColumnPinningChange:Fe,enableRowSelection:Ce,getRowCanExpand:Pe,getExpandedRowModel:(0,l.getExpandedRowModel)()}),V=B.getRowModel().rows,H=B.getSelectedRowModel().rows.map(e=>e.original),U=s.useMemo(()=>({table:B,data:f,selectedRows:H}),[f,H,B]),W=B.getVisibleLeafColumns(),Be=Math.max(W.length,1),G=typeof w==`function`?w(B):w,K=typeof T==`function`?T(B):T,Ve=!!(g&&h?.search!==!1),He=!!(h?.columnVisibility&&B.getAllLeafColumns().some(e=>e.getCanHide())),q=!!(h?.refresh&&b),J=!!(h?.export&&x),Ue=!!(h?.bulkActions!==!1&&y?.length),Y=He&&!!(p||m||g||_||q||J),X=Ve&&g?(0,c.jsx)(r.SearchInput,{value:g.value,onValueChange:g.onValueChange,placeholder:g.placeholder??`Search...`,wrapperClassName:g.wrapperClassName??g.className,inputClassName:g.inputClassName,disabled:g.disabled,clearable:g.clearable,clearLabel:g.clearLabel,searchIcon:g.searchIcon}):void 0,We=(0,c.jsxs)(c.Fragment,{children:[typeof _==`function`?_(U):_,Y&&(0,c.jsx)(ne.DataTableColumnVisibilityMenu,{table:B}),q&&(0,c.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,disabled:S,onClick:()=>b?.(U),children:ue}),J&&(0,c.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,onClick:()=>x?.(U),children:de})]}),Z=Ue?(0,c.jsx)(te.DataTableBulkActions,{rows:H,actions:y??[],selectedLabel:()=>`Actions`,clearLabel:null,onClearSelection:()=>B.resetRowSelection(),hideWhenEmpty:!1}):void 0,Ge=!!(G||K||p||m||X||_||Y||q||J||Z),Ke=!!(L&&!L.hidden),Q=S&&ge===`skeleton`,qe=e=>(0,c.jsx)(i.TableRow,{children:(0,c.jsx)(i.TableCell,{colSpan:Be,className:`p-0`,children:e})}),Je=()=>Array.from({length:Math.max(Te,1)},(e,n)=>(0,c.jsx)(i.TableRow,{"aria-hidden":`true`,children:W.map(e=>(0,c.jsx)(i.TableCell,{className:t.cn(u[A],M&&`border-r last:border-r-0`),children:(0,c.jsx)(`div`,{className:t.cn(`h-4 w-full max-w-40 animate-pulse rounded-md bg-muted`,n%3==1&&`max-w-24`,n%3==2&&`max-w-32`,Ee)})},`${e.id}-${n}`))},`skeleton-${n}`)),$=Q?null:S?(0,c.jsx)(o.LoadingState,{label:`Loading data...`,...C}):pe?(0,c.jsx)(a.EmptyState,{title:`Could not load data`,description:`Please try again.`,...he}):V.length===0?(0,c.jsx)(a.EmptyState,{...me}):null;return(0,c.jsxs)(`div`,{"data-slot":`data-table`,className:t.cn(`grid gap-3`,e),...Ie,children:[Ge&&(G??(0,c.jsx)(ie.DataTableToolbar,{title:p,description:m,search:X,actions:We,selectionActions:Z,selectedCount:ze,totalCount:L?L.rowCount??f.length:f.length,variant:`plain`,...K})),D&&(0,c.jsx)(`div`,{className:`grid gap-3 md:hidden`,children:$??(Q?(0,c.jsx)(o.LoadingState,{label:`Loading data...`,...C}):V.map(e=>(0,c.jsx)(s.Fragment,{children:D(e)},e.id)))}),(0,c.jsxs)(`div`,{"data-slot":`data-table-wrapper`,"data-density":A,"data-striped":j||void 0,"data-bordered":M||void 0,className:t.cn(`overflow-hidden rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-card shadow-[var(--aui-card-shadow,0_10px_24px_rgba(15,23,42,0.07))] backdrop-blur`,D&&`hidden md:block`,ke),children:[(0,c.jsxs)(i.Table,{containerClassName:`rounded-none border-0 bg-transparent shadow-none ring-0`,className:t.cn(`text-[0.95rem]`,Oe),children:[(0,c.jsx)(i.TableHeader,{className:t.cn(N&&`sticky top-0 z-10 shadow-sm backdrop-blur`),children:B.getHeaderGroups().map(e=>(0,c.jsx)(i.TableRow,{children:e.headers.map(e=>(0,c.jsx)(i.TableHead,{style:{width:e.getSize(),...e.column.getIsPinned()===`left`?{left:`${e.column.getStart(`left`)}px`,position:`sticky`,zIndex:N?20:11}:{},...e.column.getIsPinned()===`right`?{right:`${e.column.getAfter(`right`)}px`,position:`sticky`,zIndex:N?20:11}:{}},className:t.cn(ae[A],`bg-[color:color-mix(in_oklch,var(--card),var(--background)_10%)] text-muted-foreground`,N&&`bg-[color:color-mix(in_oklch,var(--card),transparent_12%)] backdrop-blur`,e.column.getIsPinned()&&`bg-card shadow-[1px_0_0_var(--border)]`,M&&`border-r last:border-r-0`,se(e,Ae)),children:e.isPlaceholder?null:(0,l.flexRender)(e.column.columnDef.header,e.getContext())},e.id))},e.id))}),(0,c.jsx)(i.TableBody,{children:$?qe($):Q?Je():V.map((e,n)=>{let r=k?.(e)??!1;return(0,c.jsxs)(s.Fragment,{children:[(0,c.jsx)(i.TableRow,{"data-state":e.getIsSelected()?`selected`:void 0,"data-striped":j&&n%2==1?`true`:void 0,"data-disabled":r||void 0,className:t.cn(O&&!r&&`cursor-pointer`,!r&&`transition-colors hover:bg-[color:color-mix(in_oklch,var(--primary),transparent_96%)] data-[state=selected]:bg-[color:color-mix(in_oklch,var(--primary),transparent_90%)]`,r&&`pointer-events-none opacity-55`,oe(e,Me)),onClick:()=>{r||O?.(e)},onDoubleClick:()=>{r||we?.(e)},children:e.getVisibleCells().map(e=>{let n=(0,l.flexRender)(e.column.columnDef.cell,e.getContext());return(0,c.jsx)(i.TableCell,{style:{...e.column.getIsPinned()===`left`?{left:`${e.column.getStart(`left`)}px`,position:`sticky`,zIndex:10}:{},...e.column.getIsPinned()===`right`?{right:`${e.column.getAfter(`right`)}px`,position:`sticky`,zIndex:10}:{}},className:t.cn(u[A],e.column.getIsPinned()&&`bg-card shadow-[1px_0_0_var(--border)]`,M&&`border-r last:border-r-0`,ce(e,je)),children:le(n)?De:n},e.id)})}),e.getIsExpanded()&&P&&(0,c.jsx)(i.TableRow,{className:`bg-muted/50 hover:bg-muted/50`,children:(0,c.jsx)(i.TableCell,{colSpan:e.getVisibleCells().length,children:P(e)})})]},e.id)})})]}),Ke&&L&&(0,c.jsx)(re.DataTablePagination,{pageIndex:L.pageIndex,pageSize:L.pageSize,pageCount:L.pageCount,rowCount:L.rowCount,pageSizeOptions:L.pageSizeOptions,showPageSize:L.showPageSize,labels:L.labels,disabled:S,onPageChange:L.onPageChange,onPageSizeChange:L.onPageSizeChange})]})]})}exports.DataTable=d;

package/dist/components/data-table/data-table.js

@@ -11,46 +11,46 @@ import { DataTablePagination as oe } from "./data-table-pagination.js";
 import { DataTableToolbar as se } from "./data-table-toolbar.js";
 import * as c from "react";
 import { Fragment as ce, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { flexRender as le, getCoreRowModel as ue, getExpandedRowModel as de, getPaginationRowModel as fe, useReactTable as pe } from "@tanstack/react-table";
+import { flexRender as d, getCoreRowModel as le, getExpandedRowModel as ue, getPaginationRowModel as de, useReactTable as fe } from "@tanstack/react-table";
 //#region src/components/data-table/data-table.tsx
-var me = {
+var pe = {
 	compact: "h-8 px-2 py-1.5",
 	default: "h-10 px-2 py-2",
 	comfortable: "h-12 px-3 py-3"
-}, d = {
+}, f = {
 	compact: "px-2 py-1.5",
 	default: "p-2",
 	comfortable: "px-3 py-3"
 };
-function he(e, t) {
+function me(e, t) {
 	return typeof t == "function" ? t(e) : t;
 }
-function ge(e, t) {
+function he(e, t) {
 	return typeof t == "function" ? t(e) : t;
 }
-function _e(e, t) {
+function ge(e, t) {
 	return typeof t == "function" ? t(e) : t;
 }
-function ve(e) {
+function _e(e) {
 	return e == null || e === "";
 }
-function f({ className: f, columns: p, data: m, title: h, description: g, features: _, search: v, toolbarActions: y, rowActions: b, bulkActions: x, onRefresh: S, onExport: C, refreshLabel: ye = "Refresh", exportLabel: be = "Export", getRowId: xe, isLoading: w = !1, isError: Se = !1, emptyState: Ce, errorState: we, loadingState: T, loadingVariant: Te = "skeleton", toolbar: E, toolbarProps: D, pagination: O, sorting: Ee, onSortingChange: De, columnVisibility: Oe, onColumnVisibilityChange: ke, rowSelection: Ae, onRowSelectionChange: je, enableRowSelection: Me, renderMobileCard: k, onRowClick: A, onRowDoubleClick: Ne, getRowDisabled: Pe, density: j = "default", striped: M = !1, bordered: N = !1, stickyHeader: P = !1, skeletonRows: Fe = 6, skeletonCellClassName: Ie, cellFallback: Le = "-", tableClassName: Re, tableWrapperClassName: ze, headerCellClassName: Be, cellClassName: Ve, rowClassName: He, renderExpandedRow: F, expanded: Ue, onExpandedChange: We, getRowCanExpand: Ge, columnPinning: I, onColumnPinningChange: Ke, ...qe }) {
+function p({ className: p, columns: m, data: h, title: g, description: _, features: v, search: y, toolbarActions: b, rowActions: x, bulkActions: S, onRefresh: C, onExport: w, refreshLabel: ve = "Refresh", exportLabel: ye = "Export", getRowId: be, isLoading: T = !1, isError: xe = !1, emptyState: Se, errorState: Ce, loadingState: we, loadingVariant: Te = "skeleton", toolbar: E, toolbarProps: D, pagination: O, sorting: Ee, onSortingChange: De, columnVisibility: Oe, onColumnVisibilityChange: ke, rowSelection: Ae, onRowSelectionChange: je, enableRowSelection: Me, renderMobileCard: k, onRowClick: A, onRowDoubleClick: Ne, getRowDisabled: Pe, density: j = "default", striped: M = !1, bordered: N = !1, stickyHeader: P = !1, skeletonRows: Fe = 6, skeletonCellClassName: Ie, cellFallback: Le = "-", tableClassName: Re, tableWrapperClassName: ze, headerCellClassName: Be, cellClassName: Ve, rowClassName: He, renderExpandedRow: F, expanded: Ue, onExpandedChange: We, getRowCanExpand: Ge, columnPinning: I, onColumnPinningChange: Ke, ...qe }) {
 	let Je = c.useMemo(() => {
-		let e = p;
-		return !b || _?.rowActions === !1 ? e : [...e, re({ getActions: b })];
+		let e = m;
+		return !x || v?.rowActions === !1 ? e : [...e, re({ getActions: x })];
 	}, [
-		p,
-		_?.rowActions,
-		b
+		m,
+		v?.rowActions,
+		x
 	]), L = O === !1 ? void 0 : O, Ye = L ? {
 		pageIndex: L.pageIndex,
 		pageSize: L.pageSize
-	} : void 0, R = !!(L && L.manual !== !1), z = Ae ?? {}, Xe = Object.keys(z).length, B = pe({
-		data: m,
+	} : void 0, R = !!(L && L.manual !== !1), z = Ae ?? {}, Xe = Object.keys(z).length, B = fe({
+		data: h,
 		columns: Je,
-		getRowId: xe,
-		getCoreRowModel: ue(),
-		getPaginationRowModel: L && !R ? fe() : void 0,
+		getRowId: be,
+		getCoreRowModel: le(),
+		getPaginationRowModel: L && !R ? de() : void 0,
 		manualPagination: R,
 		pageCount: L?.pageCount,
 		state: {
@@ -68,81 +68,81 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 		onColumnPinningChange: Ke,
 		enableRowSelection: Me,
 		getRowCanExpand: Ge,
-		getExpandedRowModel: de()
+		getExpandedRowModel: ue()
 	}), V = B.getRowModel().rows, H = B.getSelectedRowModel().rows.map((e) => e.original), U = c.useMemo(() => ({
 		table: B,
-		data: m,
+		data: h,
 		selectedRows: H
 	}), [
-		m,
+		h,
 		H,
 		B
-	]), W = B.getVisibleLeafColumns(), Ze = Math.max(W.length, 1), G = typeof E == "function" ? E(B) : E, K = typeof D == "function" ? D(B) : D, Qe = !!(v && _?.search !== !1), q = !!(_?.columnVisibility && B.getAllLeafColumns().some((e) => e.getCanHide())), J = !!(_?.refresh && S), Y = !!(_?.export && C), $e = !!(_?.bulkActions !== !1 && x?.length), X = Qe && v ? /* @__PURE__ */ l(n, {
-		value: v.value,
-		onValueChange: v.onValueChange,
-		placeholder: v.placeholder ?? "Search...",
-		wrapperClassName: v.wrapperClassName ?? v.className,
-		inputClassName: v.inputClassName,
-		disabled: v.disabled,
-		clearable: v.clearable,
-		clearLabel: v.clearLabel,
-		searchIcon: v.searchIcon
-	}) : void 0, et = /* @__PURE__ */ u(ce, { children: [
-		typeof y == "function" ? y(U) : y,
-		q && /* @__PURE__ */ l(ae, { table: B }),
-		J && /* @__PURE__ */ l(t, {
+	]), W = B.getVisibleLeafColumns(), Ze = Math.max(W.length, 1), G = typeof E == "function" ? E(B) : E, K = typeof D == "function" ? D(B) : D, Qe = !!(y && v?.search !== !1), $e = !!(v?.columnVisibility && B.getAllLeafColumns().some((e) => e.getCanHide())), q = !!(v?.refresh && C), J = !!(v?.export && w), et = !!(v?.bulkActions !== !1 && S?.length), Y = $e && !!(g || _ || y || b || q || J), X = Qe && y ? /* @__PURE__ */ l(n, {
+		value: y.value,
+		onValueChange: y.onValueChange,
+		placeholder: y.placeholder ?? "Search...",
+		wrapperClassName: y.wrapperClassName ?? y.className,
+		inputClassName: y.inputClassName,
+		disabled: y.disabled,
+		clearable: y.clearable,
+		clearLabel: y.clearLabel,
+		searchIcon: y.searchIcon
+	}) : void 0, tt = /* @__PURE__ */ u(ce, { children: [
+		typeof b == "function" ? b(U) : b,
+		Y && /* @__PURE__ */ l(ae, { table: B }),
+		q && /* @__PURE__ */ l(t, {
 			type: "button",
 			variant: "outline",
 			size: "sm",
-			disabled: w,
-			onClick: () => S?.(U),
-			children: ye
+			disabled: T,
+			onClick: () => C?.(U),
+			children: ve
 		}),
-		Y && /* @__PURE__ */ l(t, {
+		J && /* @__PURE__ */ l(t, {
 			type: "button",
 			variant: "outline",
 			size: "sm",
-			onClick: () => C?.(U),
-			children: be
+			onClick: () => w?.(U),
+			children: ye
 		})
-	] }), Z = $e ? /* @__PURE__ */ l(ie, {
+	] }), Z = et ? /* @__PURE__ */ l(ie, {
 		rows: H,
-		actions: x ?? [],
+		actions: S ?? [],
 		selectedLabel: () => "Actions",
 		clearLabel: null,
 		onClearSelection: () => B.resetRowSelection(),
 		hideWhenEmpty: !1
-	}) : void 0, tt = !!(G || K || h || g || X || y || q || J || Y || Z), nt = !!(L && !L.hidden), Q = w && Te === "skeleton", rt = (e) => /* @__PURE__ */ l(a, { children: /* @__PURE__ */ l(i, {
+	}) : void 0, nt = !!(G || K || g || _ || X || b || Y || q || J || Z), rt = !!(L && !L.hidden), Q = T && Te === "skeleton", it = (e) => /* @__PURE__ */ l(a, { children: /* @__PURE__ */ l(i, {
 		colSpan: Ze,
 		className: "p-0",
 		children: e
-	}) }), it = () => Array.from({ length: Math.max(Fe, 1) }, (t, n) => /* @__PURE__ */ l(a, {
+	}) }), at = () => Array.from({ length: Math.max(Fe, 1) }, (t, n) => /* @__PURE__ */ l(a, {
 		"aria-hidden": "true",
 		children: W.map((t) => /* @__PURE__ */ l(i, {
-			className: e(d[j], N && "border-r last:border-r-0"),
+			className: e(f[j], N && "border-r last:border-r-0"),
 			children: /* @__PURE__ */ l("div", { className: e("h-4 w-full max-w-40 animate-pulse rounded-md bg-muted", n % 3 == 1 && "max-w-24", n % 3 == 2 && "max-w-32", Ie) })
 		}, `${t.id}-${n}`))
-	}, `skeleton-${n}`)), $ = Q ? null : w ? /* @__PURE__ */ l(s, {
+	}, `skeleton-${n}`)), $ = Q ? null : T ? /* @__PURE__ */ l(s, {
 		label: "Loading data...",
-		...T
-	}) : Se ? /* @__PURE__ */ l(o, {
+		...we
+	}) : xe ? /* @__PURE__ */ l(o, {
 		title: "Could not load data",
 		description: "Please try again.",
-		...we
-	}) : V.length === 0 ? /* @__PURE__ */ l(o, { ...Ce }) : null;
+		...Ce
+	}) : V.length === 0 ? /* @__PURE__ */ l(o, { ...Se }) : null;
 	return /* @__PURE__ */ u("div", {
 		"data-slot": "data-table",
-		className: e("grid gap-3", f),
+		className: e("grid gap-3", p),
 		...qe,
 		children: [
-			tt && (G ?? /* @__PURE__ */ l(se, {
-				title: h,
-				description: g,
+			nt && (G ?? /* @__PURE__ */ l(se, {
+				title: g,
+				description: _,
 				search: X,
-				actions: et,
+				actions: tt,
 				selectionActions: Z,
 				selectedCount: Xe,
-				totalCount: L ? L.rowCount ?? m.length : m.length,
+				totalCount: L ? L.rowCount ?? h.length : h.length,
 				variant: "plain",
 				...K
 			})),
@@ -150,7 +150,7 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 				className: "grid gap-3 md:hidden",
 				children: $ ?? (Q ? /* @__PURE__ */ l(s, {
 					label: "Loading data...",
-					...T
+					...we
 				}) : V.map((e) => /* @__PURE__ */ l(c.Fragment, { children: k(e) }, e.id)))
 			}),
 			/* @__PURE__ */ u("div", {
@@ -178,16 +178,16 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 									zIndex: P ? 20 : 11
 								} : {}
 							},
-							className: e(me[j], "bg-[color:color-mix(in_oklch,var(--card),var(--background)_10%)] text-muted-foreground", P && "bg-[color:color-mix(in_oklch,var(--card),transparent_12%)] backdrop-blur", t.column.getIsPinned() && "bg-card shadow-[1px_0_0_var(--border)]", N && "border-r last:border-r-0", ge(t, Be)),
-							children: t.isPlaceholder ? null : le(t.column.columnDef.header, t.getContext())
+							className: e(pe[j], "bg-[color:color-mix(in_oklch,var(--card),var(--background)_10%)] text-muted-foreground", P && "bg-[color:color-mix(in_oklch,var(--card),transparent_12%)] backdrop-blur", t.column.getIsPinned() && "bg-card shadow-[1px_0_0_var(--border)]", N && "border-r last:border-r-0", he(t, Be)),
+							children: t.isPlaceholder ? null : d(t.column.columnDef.header, t.getContext())
 						}, t.id)) }, t.id))
-					}), /* @__PURE__ */ l(ee, { children: $ ? rt($) : Q ? it() : V.map((t, n) => {
+					}), /* @__PURE__ */ l(ee, { children: $ ? it($) : Q ? at() : V.map((t, n) => {
 						let r = Pe?.(t) ?? !1;
 						return /* @__PURE__ */ u(c.Fragment, { children: [/* @__PURE__ */ l(a, {
 							"data-state": t.getIsSelected() ? "selected" : void 0,
 							"data-striped": M && n % 2 == 1 ? "true" : void 0,
 							"data-disabled": r || void 0,
-							className: e(A && !r && "cursor-pointer", !r && "transition-colors hover:bg-[color:color-mix(in_oklch,var(--primary),transparent_96%)] data-[state=selected]:bg-[color:color-mix(in_oklch,var(--primary),transparent_90%)]", r && "pointer-events-none opacity-55", he(t, He)),
+							className: e(A && !r && "cursor-pointer", !r && "transition-colors hover:bg-[color:color-mix(in_oklch,var(--primary),transparent_96%)] data-[state=selected]:bg-[color:color-mix(in_oklch,var(--primary),transparent_90%)]", r && "pointer-events-none opacity-55", me(t, He)),
 							onClick: () => {
 								r || A?.(t);
 							},
@@ -195,7 +195,7 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 								r || Ne?.(t);
 							},
 							children: t.getVisibleCells().map((t) => {
-								let n = le(t.column.columnDef.cell, t.getContext());
+								let n = d(t.column.columnDef.cell, t.getContext());
 								return /* @__PURE__ */ l(i, {
 									style: {
 										...t.column.getIsPinned() === "left" ? {
@@ -209,8 +209,8 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 											zIndex: 10
 										} : {}
 									},
-									className: e(d[j], t.column.getIsPinned() && "bg-card shadow-[1px_0_0_var(--border)]", N && "border-r last:border-r-0", _e(t, Ve)),
-									children: ve(n) ? Le : n
+									className: e(f[j], t.column.getIsPinned() && "bg-card shadow-[1px_0_0_var(--border)]", N && "border-r last:border-r-0", ge(t, Ve)),
+									children: _e(n) ? Le : n
 								}, t.id);
 							})
 						}), t.getIsExpanded() && F && /* @__PURE__ */ l(a, {
@@ -221,7 +221,7 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 							})
 						})] }, t.id);
 					}) })]
-				}), nt && L && /* @__PURE__ */ l(oe, {
+				}), rt && L && /* @__PURE__ */ l(oe, {
 					pageIndex: L.pageIndex,
 					pageSize: L.pageSize,
 					pageCount: L.pageCount,
@@ -229,7 +229,7 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 					pageSizeOptions: L.pageSizeOptions,
 					showPageSize: L.showPageSize,
 					labels: L.labels,
-					disabled: w,
+					disabled: T,
 					onPageChange: L.onPageChange,
 					onPageSizeChange: L.onPageSizeChange
 				})]
@@ -238,4 +238,4 @@ function f({ className: f, columns: p, data: m, title: h, description: g, featur
 	});
 }
 //#endregion
-export { f as DataTable };
+export { p as DataTable };

package/dist/components/layout/app-sidebar.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/tooltip/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");function a(e){return e.items?.some(e=>!e.hidden)??!1}function o(e){return e.active?!0:e.items?.some(e=>o(e))??!1}function s({item:e,collapsed:r,depth:a,onItemSelect:o,renderLink:s}){let c={"aria-current":e.current??(e.active?`page`:void 0),"aria-disabled":e.disabled||void 0,"data-slot":`app-sidebar-item`,"data-active":e.active||void 0,"data-disabled":e.disabled||void 0,"data-depth":String(a),className:t.cn(`flex min-h-9 items-center gap-2 rounded-lg border border-transparent px-2.5 text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50`,r&&`justify-center px-2`)},l=(0,i.jsxs)(i.Fragment,{children:[e.icon&&(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon}),!r&&(0,i.jsx)(`span`,{className:`min-w-0 flex-1 truncate`,children:e.label}),!r&&e.badge&&(0,i.jsx)(`span`,{className:`shrink-0`,children:e.badge})]}),u=t=>r?(0,i.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,i.jsx)(`span`,{className:`block`,children:t})}):t;return e.href?.startsWith(`/`)?u(s?(0,i.jsx)(i.Fragment,{children:s({item:e,href:e.href,...c,onClick:t=>{if(e.disabled){t.preventDefault();return}e.onSelect?.(),o?.(e)},children:l})}):(0,i.jsx)(`a`,{href:e.href,...c,onClick:t=>{if(e.disabled){t.preventDefault();return}e.onSelect?.(),o?.(e)},children:l})):e.href?u((0,i.jsx)(`button`,{type:`button`,...c,className:t.cn(c.className,`w-full`),onClick:()=>{if(e.disabled)return;let t=e.href;if(t){if(e.onSelect?.(),o?.(e),t.startsWith(`http`)){window.open(t,`_blank`,`noopener,noreferrer`);return}window.location.assign(t)}},children:l})):u((0,i.jsx)(`button`,{type:`button`,disabled:e.disabled,...c,onClick:()=>{e.onSelect?.(),o?.(e)},children:l}))}function c({items:e,collapsed:l,depth:u,onItemSelect:d,renderLink:f}){return e.map(e=>{if(e.hidden)return null;let p=a(e),m=o(e),h=!l&&u===0&&e.sectionLabel;if(!p)return(0,i.jsxs)(r.Fragment,{children:[h?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-group-label`,className:`px-2.5 pb-1 pt-3 text-[11px] font-semibold uppercase tracking-[0.14em] text-muted-foreground first:pt-0`,children:e.sectionLabel}):null,(0,i.jsx)(s,{item:e,collapsed:l,depth:u,onItemSelect:d,renderLink:f})]},e.key);let g=e.defaultExpanded??m;return(0,i.jsxs)(`div`,{"data-slot":`app-sidebar-group`,"data-depth":u,children:[h&&(0,i.jsx)(`div`,{"data-slot":`app-sidebar-group-label`,className:`px-2.5 pb-1 pt-3 text-[11px] font-semibold uppercase tracking-[0.14em] text-muted-foreground first:pt-0`,children:e.sectionLabel}),(0,i.jsxs)(`details`,{"data-slot":`app-sidebar-group-details`,open:g,className:`group/app-sidebar-details`,children:[(0,i.jsxs)(`summary`,{"data-slot":`app-sidebar-group-trigger`,className:t.cn(`flex min-h-9 list-none items-center gap-2 rounded-lg border border-transparent text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow]`,l?`justify-center px-2`:`px-2.5`),children:[e.icon?l?(0,i.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon})}):(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,!l&&(0,i.jsx)(`span`,{className:`min-w-0 flex-1 truncate`,children:e.label}),!l&&e.badge&&(0,i.jsx)(`span`,{className:`shrink-0`,children:e.badge}),!l&&(0,i.jsx)(`span`,{"data-slot":`app-sidebar-group-chevron`,className:`ml-auto text-xs text-muted-foreground transition-transform group-open/app-sidebar-details:rotate-90`,children:`›`})]}),(0,i.jsx)(`div`,{"data-slot":`app-sidebar-group-content`,className:t.cn(`mt-1 space-y-1`,!l&&`pl-3`),children:(0,i.jsx)(c,{items:e.items??[],collapsed:l,depth:u+1,onItemSelect:d,renderLink:f})})]})]},e.key)})}function l({item:e,collapsed:r,onItemSelect:a}){let o=(0,i.jsxs)(`button`,{type:`button`,"data-slot":`app-sidebar-action`,"data-active":e.active||void 0,"data-disabled":e.disabled||void 0,className:t.cn(`flex min-h-9 items-center gap-2 rounded-lg border border-transparent px-2.5 text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50`,r&&`justify-center px-2`),disabled:e.disabled,onClick:()=>{e.disabled||(e.onSelect?.(),a?.(e))},children:[e.icon?(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,r?null:(0,i.jsx)(`span`,{className:`min-w-0 flex-1 truncate`,children:e.label}),!r&&e.badge?(0,i.jsx)(`span`,{className:`shrink-0`,children:e.badge}):null]});return r?(0,i.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,i.jsx)(`span`,{className:`block`,children:o})}):o}function u({account:e,collapsed:r}){let a=(0,i.jsxs)(`button`,{type:`button`,"data-slot":`app-sidebar-account`,className:t.cn(`flex w-full items-center gap-3 rounded-[min(var(--radius-xl),16px)] border border-transparent text-left transition-[background-color,border-color,color,box-shadow]`,r?`justify-center px-2 py-2.5`:`px-3 py-2.5`),onClick:()=>{if(e.onSelect?.(),e.href){if(e.href.startsWith(`http`)){window.open(e.href,`_blank`,`noopener,noreferrer`);return}window.location.assign(e.href)}},children:[e.avatar?(0,i.jsx)(`span`,{"data-slot":`app-sidebar-account-avatar`,className:`inline-flex size-9 shrink-0 items-center justify-center overflow-hidden rounded-full border border-border/65 bg-muted/45 text-sm font-semibold`,children:e.avatar}):null,r?null:(0,i.jsxs)(`span`,{className:`min-w-0 flex-1`,children:[(0,i.jsx)(`span`,{"data-slot":`app-sidebar-account-label`,className:`block truncate text-sm font-semibold text-foreground`,children:e.label}),e.description?(0,i.jsx)(`span`,{"data-slot":`app-sidebar-account-description`,className:`block truncate text-xs text-muted-foreground`,children:e.description}):null]})]});return r?(0,i.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,i.jsx)(`span`,{className:`block`,children:a})}):a}function d({className:e,header:a,footer:o,items:s=[],collapsed:d=!1,collapsedRail:f,railItems:p=[],footerAccount:m,secondaryActions:h=[],footerSecondary:g,tooltipOnCollapsed:_=!0,onItemSelect:v,renderItem:y,renderLink:b,children:x,...S}){let C=s.filter(e=>!e.hidden),w=p.filter(e=>!e.hidden),T=h.filter(e=>!e.hidden);return(0,i.jsxs)(`aside`,{"data-slot":`app-sidebar`,"data-collapsed":d||void 0,className:t.cn(`flex h-full min-h-0 flex-col overflow-hidden`,e),...S,children:[a&&(0,i.jsx)(`div`,{"data-slot":`app-sidebar-header`,className:`shrink-0 border-b p-3`,children:a}),(0,i.jsxs)(`nav`,{"data-slot":`app-sidebar-nav`,className:`min-h-0 flex-1 space-y-1 overflow-y-auto overscroll-contain p-2`,children:[x??C.map(e=>{if(!y)return null;let t=y(e,{collapsed:d});return!d||!_?(0,i.jsx)(r.Fragment,{children:t},e.key):(0,i.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,i.jsx)(`span`,{className:`block`,children:t})},e.key)}),!x&&!y&&(0,i.jsx)(c,{items:C,collapsed:d,depth:0,onItemSelect:v,renderLink:b})]}),(m||g||o||T.length>0||d&&(f||w.length>0))&&(0,i.jsxs)(`div`,{"data-slot":`app-sidebar-footer`,className:`shrink-0 border-t p-3`,children:[d?(0,i.jsxs)(i.Fragment,{children:[w.length>0?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-rail-actions`,className:`grid gap-2`,children:w.map(e=>(0,i.jsx)(l,{item:e,collapsed:!0,onItemSelect:v},e.key))}):null,f?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-rail`,children:f}):null]}):null,!d&&m?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-account-wrap`,className:`mb-3`,children:(0,i.jsx)(u,{account:m,collapsed:!1})}):null,!d&&T.length>0?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-secondary-actions`,className:`mb-3 grid gap-2`,children:T.map(e=>(0,i.jsx)(l,{item:e,collapsed:!1,onItemSelect:v},e.key))}):null,!d&&g?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-footer-secondary`,className:`mb-3`,children:g}):null,d&&m?(0,i.jsx)(`div`,{"data-slot":`app-sidebar-account-wrap`,children:(0,i.jsx)(u,{account:m,collapsed:!0})}):null,!d&&o]})]})}var f=d;exports.AppSidebar=d,exports.Sidebar=f;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/tooltip/index.cjs"),r=require("../../hooks/use-is-mobile.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("react/jsx-runtime");var s=1024;function c(e){return e.items?.some(e=>!e.hidden)??!1}function l(e){return e.active?!0:e.items?.some(e=>l(e))??!1}function u(e,t){e.onSelect?.(),t?.(e)}function d({item:e,collapsed:r,depth:i,onItemSelect:a,renderLink:s}){let c={"aria-current":e.current??(e.active?`page`:void 0),"aria-disabled":e.disabled||void 0,"data-slot":`app-sidebar-item`,"data-active":e.active||void 0,"data-disabled":e.disabled||void 0,"data-depth":String(i),className:t.cn(`flex min-h-9 items-center gap-2 rounded-lg border border-transparent px-2.5 text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50`,r&&`justify-center px-2`)},l=(0,o.jsxs)(o.Fragment,{children:[e.icon&&(0,o.jsx)(`span`,{className:`shrink-0`,children:e.icon}),!r&&(0,o.jsx)(`span`,{className:`min-w-0 flex-1 truncate`,children:e.label}),!r&&e.badge&&(0,o.jsx)(`span`,{className:`shrink-0`,children:e.badge})]}),d=t=>r?(0,o.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,o.jsx)(`span`,{className:`block`,children:t})}):t;return e.href?.startsWith(`/`)?d(s?(0,o.jsx)(o.Fragment,{children:s({item:e,href:e.href,...c,onClick:t=>{if(e.disabled){t.preventDefault();return}u(e,a)},children:l})}):(0,o.jsx)(`a`,{href:e.href,...c,onClick:t=>{if(e.disabled){t.preventDefault();return}u(e,a)},children:l})):e.href?d((0,o.jsx)(`button`,{type:`button`,...c,className:t.cn(c.className,`w-full`),onClick:()=>{if(e.disabled)return;let t=e.href;if(t){if(u(e,a),t.startsWith(`http`)){window.open(t,`_blank`,`noopener,noreferrer`);return}window.location.assign(t)}},children:l})):d((0,o.jsx)(`button`,{type:`button`,disabled:e.disabled,...c,onClick:()=>{e.disabled||u(e,a)},children:l}))}function f({items:e,collapsed:r,depth:a,onItemSelect:s,renderLink:u}){return e.map(e=>{if(e.hidden)return null;let p=c(e),m=l(e),h=!r&&a===0&&e.sectionLabel;if(!p)return(0,o.jsxs)(i.Fragment,{children:[h?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-group-label`,className:`px-2.5 pb-1 pt-3 text-[11px] font-semibold uppercase tracking-[0.14em] text-muted-foreground first:pt-0`,children:e.sectionLabel}):null,(0,o.jsx)(d,{item:e,collapsed:r,depth:a,onItemSelect:s,renderLink:u})]},e.key);let g=e.defaultExpanded??m;return(0,o.jsxs)(`div`,{"data-slot":`app-sidebar-group`,"data-depth":a,children:[h&&(0,o.jsx)(`div`,{"data-slot":`app-sidebar-group-label`,className:`px-2.5 pb-1 pt-3 text-[11px] font-semibold uppercase tracking-[0.14em] text-muted-foreground first:pt-0`,children:e.sectionLabel}),(0,o.jsxs)(`details`,{"data-slot":`app-sidebar-group-details`,open:g,className:`group/app-sidebar-details`,children:[(0,o.jsxs)(`summary`,{"data-slot":`app-sidebar-group-trigger`,className:t.cn(`flex min-h-9 list-none items-center gap-2 rounded-lg border border-transparent text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow]`,r?`justify-center px-2`:`px-2.5`),children:[e.icon?r?(0,o.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,o.jsx)(`span`,{className:`shrink-0`,children:e.icon})}):(0,o.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,!r&&(0,o.jsx)(`span`,{className:`min-w-0 flex-1 truncate`,children:e.label}),!r&&e.badge&&(0,o.jsx)(`span`,{className:`shrink-0`,children:e.badge}),!r&&(0,o.jsx)(`span`,{"data-slot":`app-sidebar-group-chevron`,className:`ml-auto text-xs text-muted-foreground transition-transform group-open/app-sidebar-details:rotate-90`,children:`›`})]}),(0,o.jsx)(`div`,{"data-slot":`app-sidebar-group-content`,className:t.cn(`mt-1 space-y-1`,!r&&`pl-3`),children:(0,o.jsx)(f,{items:e.items??[],collapsed:r,depth:a+1,onItemSelect:s,renderLink:u})})]})]},e.key)})}function p({item:e,collapsed:r,onItemSelect:i}){let a=(0,o.jsxs)(`button`,{type:`button`,"data-slot":`app-sidebar-action`,"data-active":e.active||void 0,"data-disabled":e.disabled||void 0,className:t.cn(`flex min-h-9 items-center gap-2 rounded-lg border border-transparent px-2.5 text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50`,r&&`justify-center px-2`),disabled:e.disabled,onClick:()=>{e.disabled||u(e,i)},children:[e.icon?(0,o.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,r?null:(0,o.jsx)(`span`,{className:`min-w-0 flex-1 truncate`,children:e.label}),!r&&e.badge?(0,o.jsx)(`span`,{className:`shrink-0`,children:e.badge}):null]});return r?(0,o.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,o.jsx)(`span`,{className:`block`,children:a})}):a}function m({account:e,collapsed:r,onAfterSelect:i}){let a=(0,o.jsxs)(`button`,{type:`button`,"data-slot":`app-sidebar-account`,className:t.cn(`flex w-full items-center gap-3 rounded-[min(var(--radius-xl),16px)] border border-transparent text-left transition-[background-color,border-color,color,box-shadow]`,r?`justify-center px-2 py-2.5`:`px-3 py-2.5`),onClick:()=>{if(e.onSelect?.(),i?.(),e.href){if(e.href.startsWith(`http`)){window.open(e.href,`_blank`,`noopener,noreferrer`);return}window.location.assign(e.href)}},children:[e.avatar?(0,o.jsx)(`span`,{"data-slot":`app-sidebar-account-avatar`,className:`inline-flex size-9 shrink-0 items-center justify-center overflow-hidden rounded-full border border-border/65 bg-muted/45 text-sm font-semibold`,children:e.avatar}):null,r?null:(0,o.jsxs)(`span`,{className:`min-w-0 flex-1`,children:[(0,o.jsx)(`span`,{"data-slot":`app-sidebar-account-label`,className:`block truncate text-sm font-semibold text-foreground`,children:e.label}),e.description?(0,o.jsx)(`span`,{"data-slot":`app-sidebar-account-description`,className:`block truncate text-xs text-muted-foreground`,children:e.description}):null]})]});return r?(0,o.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,o.jsx)(`span`,{className:`block`,children:a})}):a}function h({className:e,header:r,footer:s,items:c=[],collapsed:l=!1,collapsedRail:u,railItems:d=[],footerAccount:h,secondaryActions:g=[],footerSecondary:_,tooltipOnCollapsed:v,onItemSelect:y,renderItem:b,renderLink:x,children:S,mobile:C,mobileTitle:w,mobileDescription:T,onRequestClose:E,closeOnSelect:D=!0,...O}){let k=c.filter(e=>!e.hidden),A=d.filter(e=>!e.hidden),j=g.filter(e=>!e.hidden),M=i.useCallback(e=>{y?.(e),C&&D&&E?.()},[D,C,y,E]),N=C&&(w||T||E);return(0,o.jsxs)(`aside`,{"data-slot":`app-sidebar`,"data-collapsed":l||void 0,"data-mobile":C||void 0,className:t.cn(`flex h-full min-h-0 flex-col overflow-hidden`,e),...O,children:[(r||N)&&(0,o.jsx)(`div`,{"data-slot":`app-sidebar-header`,className:`shrink-0 border-b p-3`,children:(0,o.jsxs)(`div`,{className:`flex items-start gap-3`,children:[(0,o.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[r??null,N?(0,o.jsxs)(`div`,{className:t.cn(r&&`mt-3`),children:[w?(0,o.jsx)(`p`,{className:`text-sm font-semibold text-foreground`,children:w}):null,T?(0,o.jsx)(`p`,{className:`mt-1 text-xs leading-5 text-muted-foreground`,children:T}):null]}):null]}),C&&E?(0,o.jsx)(`button`,{type:`button`,"aria-label":`Close navigation`,"data-slot":`app-sidebar-mobile-close`,className:`inline-flex size-9 shrink-0 items-center justify-center rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] text-[color:var(--aui-page-foreground)] transition hover:bg-[color:var(--aui-control-bg)]`,onClick:E,children:(0,o.jsx)(a.XIcon,{className:`size-4`})}):null]})}),(0,o.jsxs)(`nav`,{"data-slot":`app-sidebar-nav`,className:`min-h-0 flex-1 space-y-1 overflow-y-auto overscroll-contain p-2`,children:[S??k.map(e=>{if(!b)return null;let t=b(e,{collapsed:l});return!l||!v?(0,o.jsx)(i.Fragment,{children:t},e.key):(0,o.jsx)(n.Tooltip,{content:e.tooltip??e.label,side:`right`,children:(0,o.jsx)(`span`,{className:`block`,children:t})},e.key)}),!S&&!b&&(0,o.jsx)(f,{items:k,collapsed:l,depth:0,onItemSelect:M,renderLink:x})]}),(h||_||s||j.length>0||l&&(u||A.length>0))&&(0,o.jsxs)(`div`,{"data-slot":`app-sidebar-footer`,className:`shrink-0 border-t p-3`,children:[l?(0,o.jsxs)(o.Fragment,{children:[A.length>0?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-rail-actions`,className:`grid gap-2`,children:A.map(e=>(0,o.jsx)(p,{item:e,collapsed:!0,onItemSelect:M},e.key))}):null,u?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-rail`,children:u}):null]}):null,!l&&h?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-account-wrap`,className:`mb-3`,children:(0,o.jsx)(m,{account:h,collapsed:!1,onAfterSelect:()=>{C&&D&&E?.()}})}):null,!l&&j.length>0?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-secondary-actions`,className:`mb-3 grid gap-2`,children:j.map(e=>(0,o.jsx)(p,{item:e,collapsed:!1,onItemSelect:M},e.key))}):null,!l&&_?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-footer-secondary`,className:`mb-3`,children:_}):null,l&&h?(0,o.jsx)(`div`,{"data-slot":`app-sidebar-account-wrap`,children:(0,o.jsx)(m,{account:h,collapsed:!0,onAfterSelect:()=>{C&&D&&E?.()}})}):null,!l&&s]})]})}function g({className:e,header:n,footer:c,items:l=[],collapsed:u=!1,collapsedRail:d,railItems:f=[],footerAccount:p,secondaryActions:m=[],footerSecondary:g,tooltipOnCollapsed:_=!0,responsive:v=!0,mobileBreakpoint:y=s,mobileOpen:b,defaultMobileOpen:x=!1,onMobileOpenChange:S,mobileTitle:C,mobileDescription:w,mobileToggleLabel:T=`Open navigation`,mobileToggleIcon:E,showMobileToggle:D=!0,closeOnSelect:O=!0,mobileToggleClassName:k,mobilePanelClassName:A,mobileOverlayClassName:j,renderMobileToggle:M,onItemSelect:N,renderItem:P,renderLink:F,children:I,...L}){let R=v?r.useIsMobile(y):!1,[z,B]=i.useState(x),V=b??z,H=i.useCallback(e=>{b??B(e),S?.(e)},[b,S]);i.useEffect(()=>{!R&&V&&H(!1)},[R,V,H]),i.useEffect(()=>{if(!R||!V)return;let e=document.body.style.overflow;document.body.style.overflow=`hidden`;let t=e=>{e.key===`Escape`&&H(!1)};return window.addEventListener(`keydown`,t),()=>{document.body.style.overflow=e,window.removeEventListener(`keydown`,t)}},[R,V,H]);let U={className:e,header:n,footer:c,items:l,collapsed:u,collapsedRail:d,railItems:f,footerAccount:p,secondaryActions:m,footerSecondary:g,tooltipOnCollapsed:_,closeOnSelect:O,onItemSelect:N,renderItem:P,renderLink:F,children:I,...L};if(!v||!R)return(0,o.jsx)(h,{...U});let W=(0,o.jsxs)(`button`,{type:`button`,"aria-label":V?`Close navigation`:T,"data-slot":`app-sidebar-mobile-trigger`,"data-state":V?`open`:`closed`,className:t.cn(`inline-flex min-h-10 items-center gap-2 rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-3 text-sm font-medium text-[color:var(--aui-page-foreground)] shadow-sm transition hover:bg-[color:var(--aui-page-bg-alt)]`,k),onClick:()=>H(!V),children:[(0,o.jsx)(`span`,{className:`inline-flex size-8 items-center justify-center rounded-lg bg-[color:var(--aui-page-bg-alt)]`,children:E??(0,o.jsx)(a.MenuIcon,{className:`size-4`})}),(0,o.jsx)(`span`,{children:V?`Close navigation`:T})]});return(0,o.jsxs)(o.Fragment,{children:[D?M?M({open:V,setOpen:H}):W:null,(0,o.jsxs)(`div`,{"data-slot":`app-sidebar-mobile-root`,className:`relative z-40`,children:[(0,o.jsx)(`button`,{type:`button`,"aria-label":`Dismiss navigation`,"data-slot":`app-sidebar-mobile-overlay`,"data-state":V?`open`:`closed`,className:t.cn(`fixed inset-0 z-40 bg-black/45 transition-opacity duration-200`,V?`opacity-100`:`pointer-events-none opacity-0`,j),onClick:()=>H(!1)}),(0,o.jsx)(h,{...U,mobile:!0,collapsed:!1,mobileTitle:C,mobileDescription:w,onRequestClose:()=>H(!1),"data-state":V?`open`:`closed`,role:`dialog`,"aria-modal":`true`,"aria-label":typeof C==`string`?C:`Navigation`,className:t.cn(`fixed inset-y-0 left-0 z-50 w-[min(88vw,22rem)] max-w-[22rem] border-r border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] shadow-2xl transition-transform duration-200 ease-out`,V?`translate-x-0`:`-translate-x-full`,A,e)})]})]})}var _=g;exports.AppSidebar=g,exports.Sidebar=_;

package/dist/components/layout/app-sidebar.d.ts

@@ -34,6 +34,24 @@ export type AppSidebarProps = React.ComponentProps<"aside"> & {
     secondaryActions?: AppSidebarNavItem[];
     footerSecondary?: React.ReactNode;
     tooltipOnCollapsed?: boolean;
+    responsive?: boolean;
+    mobileBreakpoint?: number;
+    mobileOpen?: boolean;
+    defaultMobileOpen?: boolean;
+    onMobileOpenChange?: (open: boolean) => void;
+    mobileTitle?: React.ReactNode;
+    mobileDescription?: React.ReactNode;
+    mobileToggleLabel?: string;
+    mobileToggleIcon?: React.ReactNode;
+    showMobileToggle?: boolean;
+    closeOnSelect?: boolean;
+    mobileToggleClassName?: string;
+    mobilePanelClassName?: string;
+    mobileOverlayClassName?: string;
+    renderMobileToggle?: (state: {
+        open: boolean;
+        setOpen: (open: boolean) => void;
+    }) => React.ReactNode;
     onItemSelect?: (item: AppSidebarNavItem) => void;
     renderItem?: (item: AppSidebarNavItem, state: {
         collapsed: boolean;
@@ -43,7 +61,7 @@ export type AppSidebarProps = React.ComponentProps<"aside"> & {
         [key: `data-${string}`]: string | boolean | undefined;
     }) => React.ReactNode;
 };
-declare function AppSidebar({ className, header, footer, items, collapsed, collapsedRail, railItems, footerAccount, secondaryActions, footerSecondary, tooltipOnCollapsed, onItemSelect, renderItem, renderLink, children, ...props }: AppSidebarProps): React.JSX.Element;
+declare function AppSidebar({ className, header, footer, items, collapsed, collapsedRail, railItems, footerAccount, secondaryActions, footerSecondary, tooltipOnCollapsed, responsive, mobileBreakpoint, mobileOpen: mobileOpenProp, defaultMobileOpen, onMobileOpenChange, mobileTitle, mobileDescription, mobileToggleLabel, mobileToggleIcon, showMobileToggle, closeOnSelect, mobileToggleClassName, mobilePanelClassName, mobileOverlayClassName, renderMobileToggle, onItemSelect, renderItem, renderLink, children, ...props }: AppSidebarProps): React.JSX.Element;
 /**
  * Canonical sidebar surface for new usage.
  */