dgz-ui-shared 1.2.13 → 1.2.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/Loader-D_jX_Wgx.cjs.js.map +1 -1
- package/dist/chunks/Loader-zvzAi0F6.es.js.map +1 -1
- package/dist/components/datatable/index.cjs.js +1 -1
- package/dist/components/datatable/index.cjs.js.map +1 -1
- package/dist/components/datatable/index.es.js +1 -1
- package/dist/components/datatable/index.es.js.map +1 -1
- package/dist/components/form/index.cjs.js.map +1 -1
- package/dist/components/form/index.es.js.map +1 -1
- package/dist/components/scroll/index.cjs.js.map +1 -1
- package/dist/components/scroll/index.es.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/types/components/form/MySwitch.d.ts +1 -0
- package/dist/types/components/form/MySwitch.d.ts.map +1 -1
- package/dist/types/components/loader/Loader.d.ts +1 -0
- package/dist/types/components/loader/Loader.d.ts.map +1 -1
- package/dist/types/components/scroll/ScrollArea.d.ts +3 -1
- package/dist/types/components/scroll/ScrollArea.d.ts.map +1 -1
- package/dist/types/stories/Button.d.ts +15 -0
- package/dist/types/stories/Button.d.ts.map +1 -0
- package/dist/types/stories/Button.stories.d.ts +24 -0
- package/dist/types/stories/Button.stories.d.ts.map +1 -0
- package/dist/types/stories/Header.d.ts +12 -0
- package/dist/types/stories/Header.d.ts.map +1 -0
- package/dist/types/stories/Header.stories.d.ts +19 -0
- package/dist/types/stories/Header.stories.d.ts.map +1 -0
- package/dist/types/stories/Page.d.ts +3 -0
- package/dist/types/stories/Page.d.ts.map +1 -0
- package/dist/types/stories/Page.stories.d.ts +13 -0
- package/dist/types/stories/Page.stories.d.ts.map +1 -0
- package/package.json +15 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loader-D_jX_Wgx.cjs.js","sources":["../../src/components/loader/Loader.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Spin from './Spin';\n\n/**\n * Loader shows a centered spinning indicator inside a container.\n *\n * @param props - Optional div HTML attributes.\n */\nconst Loader = (props?: HTMLAttributes<HTMLDivElement>) => {\n return (\n <div\n className=\"text-item-primary mx-auto flex w-full items-center justify-center p-4\"\n {...props}\n >\n <Spin className=\"text-item-primary size-6\" />\n </div>\n );\n};\n\nexport default Loader;\n"],"names":["Loader","props","jsx","Spin"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Loader-D_jX_Wgx.cjs.js","sources":["../../src/components/loader/Loader.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Spin from './Spin';\n\n/**\n * Loader shows a centered spinning indicator inside a container.\n *\n * @param props - Optional div HTML attributes.\n * @returns A loader component with a spinning indicator.\n */\nconst Loader = (props?: HTMLAttributes<HTMLDivElement>) => {\n return (\n <div\n className=\"text-item-primary mx-auto flex w-full items-center justify-center p-4\"\n {...props}\n >\n <Spin className=\"text-item-primary size-6\" />\n </div>\n );\n};\n\nexport default Loader;\n"],"names":["Loader","props","jsx","Spin"],"mappings":"sFASMA,EAAUC,GAEZC,EAAAA,IAAC,MAAA,CACC,UAAU,wEACT,GAAGD,EAEJ,SAAAC,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,0BAAA,CAA2B,CAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loader-zvzAi0F6.es.js","sources":["../../src/components/loader/Loader.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Spin from './Spin';\n\n/**\n * Loader shows a centered spinning indicator inside a container.\n *\n * @param props - Optional div HTML attributes.\n */\nconst Loader = (props?: HTMLAttributes<HTMLDivElement>) => {\n return (\n <div\n className=\"text-item-primary mx-auto flex w-full items-center justify-center p-4\"\n {...props}\n >\n <Spin className=\"text-item-primary size-6\" />\n </div>\n );\n};\n\nexport default Loader;\n"],"names":["Loader","props","jsx","Spin"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"Loader-zvzAi0F6.es.js","sources":["../../src/components/loader/Loader.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Spin from './Spin';\n\n/**\n * Loader shows a centered spinning indicator inside a container.\n *\n * @param props - Optional div HTML attributes.\n * @returns A loader component with a spinning indicator.\n */\nconst Loader = (props?: HTMLAttributes<HTMLDivElement>) => {\n return (\n <div\n className=\"text-item-primary mx-auto flex w-full items-center justify-center p-4\"\n {...props}\n >\n <Spin className=\"text-item-primary size-6\" />\n </div>\n );\n};\n\nexport default Loader;\n"],"names":["Loader","props","jsx","Spin"],"mappings":";;AASA,MAAMA,IAAS,CAACC,MAEZ,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,UAAA,gBAAAC,EAACC,GAAA,EAAK,WAAU,2BAAA,CAA2B;AAAA,EAAA;AAAA;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../chunks/index-ClQFzqcq.cjs.js"),m=require("dgz-ui/button"),M=require("dgz-ui/dropdown"),b=require("dgz-ui/utils"),A=require("../../chunks/lodash-BjH0kD7j.cjs.js"),o=require("lucide-react"),y=require("react"),P=require("react-i18next"),B=require("../../chunks/useSortable-B3LF1tg8.cjs.js"),ee=require("../../chunks/Actions-CXOiCjx0.cjs.js"),le=require("../../chunks/ExportData-CrB0H1Ts.cjs.js"),G=require("../../chunks/Search-hHeGlXqd.cjs.js"),se=require("../../chunks/Loader-D_jX_Wgx.cjs.js"),u=require("../../chunks/MyPagination-CnF3468f.cjs.js"),I=require("dgz-ui/form"),i=require("dgz-ui/table"),Q=require("../../chunks/SortOrder-81BrXp3i.cjs.js"),te=require("../../chunks/Empty-BYOOFAab.cjs.js"),X=({rows:s=[],columns:T,onRowClick:E,rowKey:N,params:c={page:1,limit:u.DEFAULT_LIMIT},hasNumbers:k=!1,hasCheckbox:w=!1,selectedItems:R,onSelectedItemsChange:v,onSortOrderChange:F,isStickyHeader:t,className:H,...O})=>{const{sortObject:r,handleSort:p}=B.useSortable({sortField:c==null?void 0:c.sortField,sortOrder:c==null?void 0:c.sortOrder,onSortOrderChange:F}),{selectedRows:g,isRowSelected:h,isAllRowsSelected:j,handleSelectAllRows:$,handleSelectRow:D}=B.useDataTable({rows:s,defaultSelectedRows:R});return y.useEffect(()=>{JSON.stringify(R)!==JSON.stringify(g)&&g&&(v==null||v(g))},[g,R,v]),e.jsxs(i.Table,{...O,className:b.cn("relative",H),children:[e.jsx(i.TableHeader,{className:b.cn("bg-bg",t&&"sticky top-0 z-1"),children:e.jsxs(i.TableRow,{children:[w&&e.jsx(i.TableHead,{className:"w-12 p-3",children:e.jsx(I.Checkbox,{className:"mt-1",checked:j(N),onCheckedChange:l=>$(N,!!l),"aria-label":"Select all"})}),k&&e.jsx(i.TableHead,{className:"w-12 p-2",children:"#"}),T.filter(l=>!l.hidden).map(l=>e.jsx(i.TableHead,{style:l.styles,className:b.cn("p-2",l.sortable&&"cursor-pointer"),onClick:()=>l.sortable&&p(l.dataIndex),children:e.jsxs("div",{className:"flex items-center gap-2",children:[l.name," ",l.sortable&&((r==null?void 0:r.sortField)===l.key?e.jsxs(e.Fragment,{children:[(r==null?void 0:r.sortOrder)===Q.SortOrder.DESC&&e.jsx(o.ArrowDownWideNarrow,{size:15}),(r==null?void 0:r.sortOrder)===Q.SortOrder.ASC&&e.jsx(o.ArrowUpWideNarrow,{size:15})]}):e.jsx(o.ArrowUpDown,{size:15}))]})},l.key))]})}),e.jsx(i.TableBody,{className:"[&>tr:nth-child(even)]:bg-bg-secondary",children:s.length?s.map((l,q)=>e.jsxs(i.TableRow,{onClick:()=>E==null?void 0:E(l),className:b.cn(E&&"cursor-pointer"),"data-state":h(l[N])&&"selected",children:[w&&e.jsx(i.TableCell,{className:"w-12 p-3",onClick:x=>x.stopPropagation(),children:e.jsx(I.Checkbox,{className:"mt-1",checked:h(l[N]),onCheckedChange:x=>D(l[N],!!x),"aria-label":"Select row"})}),k&&e.jsx(i.TableCell,{className:"w-12 p-2",children:(c.page-1)*(c.limit||u.DEFAULT_LIMIT)+q+1}),T.filter(x=>!x.hidden).map(x=>e.jsx(i.TableCell,{className:"text-body-xs-medium max-w-xs p-2",style:x.styles,children:x.render?x.render(A.lodashExports.get(l,x.dataIndex),l):A.lodashExports.get(l,x.dataIndex,"")},`${q}-${x.key}`))]},`${l[N]}`)):e.jsx(i.TableRow,{children:e.jsx(i.TableCell,{colSpan:k?w?T.length+2:T.length+1:T.length,children:e.jsx(te.Empty,{})})})})]})},de=({dataSource:s,columns:T,onRowClick:E,rowKey:N,hasNumbers:c,hasSearch:k,exportOptions:w,hasCheckbox:R,hasPagination:v,isStickyHeader:F,onParamChange:t,dataKey:H="docs",loading:O,tableKey:r,filters:p,actions:g,handleFilterChange:h,params:j,exportLoading:$=!1,onColumnsUpdate:D,hasColumnsVisibilityDropdown:l,onSelectedItemsChange:q,actionProps:x,filterWrapperProps:Y,exportOptionsProps:Z,columnsVisibilityProps:n,paginationProps:U,searchProps:f,...K})=>{var J;const{t:W}=P.useTranslation(),[z,S]=y.useState([]),{formattedColumns:L,handleColumnsChange:C,resetColumns:V}=B.useColumns({key:r,columns:T});return y.useEffect(()=>{D==null||D(L)},[L,D]),y.useEffect(()=>{q==null||q(z)},[z,q]),e.jsxs("div",{className:"border-border-alpha-light flex grow flex-col overflow-auto rounded-xl border shadow-xs",children:[(k||l&&r||!A.lodashExports.isEmpty(w)||!A.lodashExports.isEmpty(p))&&e.jsxs("div",{className:"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row",children:[e.jsx("div",{className:"w-full shrink",children:k&&e.jsx(G.Search,{...f,inputProps:{...f==null?void 0:f.inputProps,className:b.cn("h-8",(J=f==null?void 0:f.inputProps)==null?void 0:J.className)},className:b.cn("max-w-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../chunks/index-ClQFzqcq.cjs.js"),m=require("dgz-ui/button"),M=require("dgz-ui/dropdown"),b=require("dgz-ui/utils"),A=require("../../chunks/lodash-BjH0kD7j.cjs.js"),o=require("lucide-react"),y=require("react"),P=require("react-i18next"),B=require("../../chunks/useSortable-B3LF1tg8.cjs.js"),ee=require("../../chunks/Actions-CXOiCjx0.cjs.js"),le=require("../../chunks/ExportData-CrB0H1Ts.cjs.js"),G=require("../../chunks/Search-hHeGlXqd.cjs.js"),se=require("../../chunks/Loader-D_jX_Wgx.cjs.js"),u=require("../../chunks/MyPagination-CnF3468f.cjs.js"),I=require("dgz-ui/form"),i=require("dgz-ui/table"),Q=require("../../chunks/SortOrder-81BrXp3i.cjs.js"),te=require("../../chunks/Empty-BYOOFAab.cjs.js"),X=({rows:s=[],columns:T,onRowClick:E,rowKey:N,params:c={page:1,limit:u.DEFAULT_LIMIT},hasNumbers:k=!1,hasCheckbox:w=!1,selectedItems:R,onSelectedItemsChange:v,onSortOrderChange:F,isStickyHeader:t,className:H,...O})=>{const{sortObject:r,handleSort:p}=B.useSortable({sortField:c==null?void 0:c.sortField,sortOrder:c==null?void 0:c.sortOrder,onSortOrderChange:F}),{selectedRows:g,isRowSelected:h,isAllRowsSelected:j,handleSelectAllRows:$,handleSelectRow:D}=B.useDataTable({rows:s,defaultSelectedRows:R});return y.useEffect(()=>{JSON.stringify(R)!==JSON.stringify(g)&&g&&(v==null||v(g))},[g,R,v]),e.jsxs(i.Table,{...O,className:b.cn("relative",H),children:[e.jsx(i.TableHeader,{className:b.cn("bg-bg",t&&"sticky top-0 z-1"),children:e.jsxs(i.TableRow,{children:[w&&e.jsx(i.TableHead,{className:"w-12 p-3",children:e.jsx(I.Checkbox,{className:"mt-1",checked:j(N),onCheckedChange:l=>$(N,!!l),"aria-label":"Select all"})}),k&&e.jsx(i.TableHead,{className:"w-12 p-2",children:"#"}),T.filter(l=>!l.hidden).map(l=>e.jsx(i.TableHead,{style:l.styles,className:b.cn("p-2",l.sortable&&"cursor-pointer"),onClick:()=>l.sortable&&p(l.dataIndex),children:e.jsxs("div",{className:"flex items-center gap-2",children:[l.name," ",l.sortable&&((r==null?void 0:r.sortField)===l.key?e.jsxs(e.Fragment,{children:[(r==null?void 0:r.sortOrder)===Q.SortOrder.DESC&&e.jsx(o.ArrowDownWideNarrow,{size:15}),(r==null?void 0:r.sortOrder)===Q.SortOrder.ASC&&e.jsx(o.ArrowUpWideNarrow,{size:15})]}):e.jsx(o.ArrowUpDown,{size:15}))]})},l.key))]})}),e.jsx(i.TableBody,{className:"[&>tr:nth-child(even)]:bg-bg-secondary",children:s.length?s.map((l,q)=>e.jsxs(i.TableRow,{onClick:()=>E==null?void 0:E(l),className:b.cn(E&&"cursor-pointer"),"data-state":h(l[N])&&"selected",children:[w&&e.jsx(i.TableCell,{className:"w-12 p-3",onClick:x=>x.stopPropagation(),children:e.jsx(I.Checkbox,{className:"mt-1",checked:h(l[N]),onCheckedChange:x=>D(l[N],!!x),"aria-label":"Select row"})}),k&&e.jsx(i.TableCell,{className:"w-12 p-2",children:(c.page-1)*(c.limit||u.DEFAULT_LIMIT)+q+1}),T.filter(x=>!x.hidden).map(x=>e.jsx(i.TableCell,{className:"text-body-xs-medium max-w-xs p-2",style:x.styles,children:x.render?x.render(A.lodashExports.get(l,x.dataIndex),l):A.lodashExports.get(l,x.dataIndex,"")},`${q}-${x.key}`))]},`${l[N]}`)):e.jsx(i.TableRow,{children:e.jsx(i.TableCell,{colSpan:k?w?T.length+2:T.length+1:T.length,children:e.jsx(te.Empty,{})})})})]})},de=({dataSource:s,columns:T,onRowClick:E,rowKey:N,hasNumbers:c,hasSearch:k,exportOptions:w,hasCheckbox:R,hasPagination:v,isStickyHeader:F,onParamChange:t,dataKey:H="docs",loading:O,tableKey:r,filters:p,actions:g,handleFilterChange:h,params:j,exportLoading:$=!1,onColumnsUpdate:D,hasColumnsVisibilityDropdown:l,onSelectedItemsChange:q,actionProps:x,filterWrapperProps:Y,exportOptionsProps:Z,columnsVisibilityProps:n,paginationProps:U,searchProps:f,...K})=>{var J;const{t:W}=P.useTranslation(),[z,S]=y.useState([]),{formattedColumns:L,handleColumnsChange:C,resetColumns:V}=B.useColumns({key:r,columns:T});return y.useEffect(()=>{D==null||D(L)},[L,D]),y.useEffect(()=>{q==null||q(z)},[z,q]),e.jsxs("div",{className:"border-border-alpha-light flex grow flex-col overflow-auto rounded-xl border shadow-xs",children:[(k||l&&r||!A.lodashExports.isEmpty(w)||!A.lodashExports.isEmpty(p))&&e.jsxs("div",{className:"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row",children:[e.jsx("div",{className:"w-full shrink",children:k&&e.jsx(G.Search,{...f,inputProps:{...f==null?void 0:f.inputProps,className:b.cn("h-8",(J=f==null?void 0:f.inputProps)==null?void 0:J.className)},className:b.cn("max-w-78 [&_button]:-top-1",f==null?void 0:f.className),defaultValue:A.lodashExports.get(j,"search",""),onSearchChange:d=>t==null?void 0:t({...j,search:d,page:1})})}),e.jsxs("div",{className:"flex shrink-0 items-center justify-end gap-3",children:[w&&e.jsx(le.ExportData,{...Z,options:w,loading:$}),l&&r&&e.jsxs(M.DropdownMenu,{children:[e.jsx(M.DropdownMenuTrigger,{asChild:!0,...n==null?void 0:n.triggerProps,children:e.jsx(m.Button,{variant:"secondary",size:"sm",className:"ml-auto rounded-lg px-3",children:(n==null?void 0:n.title)||e.jsxs(e.Fragment,{children:[e.jsx(a.yn,{})," ",e.jsx("span",{className:"hidden lg:inline!",children:W("Customize columns")}),e.jsx(a.f1,{})]})})}),e.jsxs(M.DropdownMenuContent,{align:"end",...n==null?void 0:n.contentProps,children:[e.jsxs(M.DropdownMenuItem,{className:"capitalize",onClick:V,children:[e.jsx(o.RefreshCw,{})," ",(n==null?void 0:n.resetText)||W("Reset columns")]}),e.jsx(M.DropdownMenuSeparator,{}),L.map(d=>e.jsx(M.DropdownMenuCheckboxItem,{className:"capitalize",checked:!d.hidden,onCheckedChange:_=>C(d,!_),children:d.name},d.key))]})]}),g&&e.jsx(ee.Actions,{...x,actions:g}),p&&e.jsx(G.FilterWrapper,{...Y,filters:p,params:j,onChange:h,onFilter:d=>{t==null||t({...j,...d,page:1}),h==null||h(d)}})]})]}),e.jsx("div",{className:"flex flex-col overflow-auto border-y",children:O?e.jsx(se.Loader,{}):e.jsx(X,{...K,params:{page:(s==null?void 0:s.page)||1,limit:s==null?void 0:s.limit,...j},rows:A.lodashExports.get(s,H,[]),rowKey:N,selectedItems:z,isStickyHeader:F,columns:L,hasCheckbox:R,hasNumbers:c,onRowClick:E,onSelectedItemsChange:S,onSortOrderChange:({sortField:d,sortOrder:_})=>{t==null||t({...j,sortField:d,sortOrder:_})}})}),v&&e.jsxs("div",{className:"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row",children:[e.jsx("div",{className:"text-sm",children:e.jsx(u.MyLimitSelect,{onLimitChange:d=>t==null?void 0:t({...j,limit:d,page:1}),defaultValue:s==null?void 0:s.limit})}),e.jsx("div",{className:"text-muted-foreground text-sm",children:W("{{selectedCount}} of {{total}} row(s) selected",{selectedCount:z.length,total:(s==null?void 0:s.total)||0})}),e.jsx("div",{children:e.jsx(u.MyPagination,{...U,onPageChange:d=>t==null?void 0:t({...j,page:d}),currentPage:s==null?void 0:s.page,totalPages:s==null?void 0:s.totalPages})})]})]})};exports.DataTable=de;exports.MyTable=X;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/datatable/MyTable.tsx","../../../src/components/datatable/DataTable.tsx"],"sourcesContent":["import { Checkbox } from 'dgz-ui/form';\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from 'dgz-ui/table';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport {\n ArrowDownWideNarrow,\n ArrowUpDown,\n ArrowUpWideNarrow,\n} from 'lucide-react';\nimport { type ComponentProps, useEffect } from 'react';\nimport { SortOrder } from '../../enums';\nimport { useDataTable, useSortable, type UseSortableProps } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { Empty } from '../empty';\nimport { DEFAULT_LIMIT } from '../pagination/MyLimitSelect';\n\n/**\n * Props for the MyTable component.\n * @template TData - The type of data in the table.\n */\nexport interface MyTableProps<TData> extends ComponentProps<'table'> {\n /** Array of data rows to display. */\n rows?: TData[];\n /** Column definitions. */\n columns: ColumnType<TData>[];\n /** Callback when a row is clicked. */\n onRowClick?: (row: TData) => void;\n /** Whether to show row numbers. */\n hasNumbers?: boolean;\n /** Whether to show selection checkboxes. */\n hasCheckbox?: boolean;\n /** Unique key for each row. */\n rowKey: keyof TData;\n /** Current table parameters (page, limit, sort). */\n params?: Record<string, unknown>;\n /** Total number of items (optional, often used with pagination context). */\n total?: number;\n /** Array of currently selected item keys. */\n selectedItems?: TData[keyof TData][];\n /** Callback when selected items change. */\n onSelectedItemsChange?: (selectedItems: TData[keyof TData][]) => void;\n /** Callback when sort order changes. */\n onSortOrderChange?: (\n params: Omit<UseSortableProps<TData>, 'onSortOrderChange'>\n ) => void;\n /** Whether the header should stick to the top. */\n isStickyHeader?: true;\n}\n\n/**\n * MyTable renders a generic data table with optional numbering, selection checkboxes,\n * sortable columns and sticky header. It is a presentational component and delegates\n * sorting/selection state via hooks and callbacks.\n *\n * @template TData - The row data type.\n * @param props - Component props.\n * @returns React element containing the table.\n */\nexport const MyTable = <TData,>({\n rows = [],\n columns,\n onRowClick,\n rowKey,\n params = {\n page: 1,\n limit: DEFAULT_LIMIT,\n },\n hasNumbers = false,\n hasCheckbox = false,\n selectedItems,\n onSelectedItemsChange,\n onSortOrderChange,\n isStickyHeader,\n className,\n ...props\n}: MyTableProps<TData>) => {\n const { sortObject, handleSort } = useSortable<TData>({\n sortField: params?.sortField as keyof TData | undefined,\n sortOrder: params?.sortOrder as SortOrder | undefined,\n onSortOrderChange,\n });\n const {\n selectedRows,\n isRowSelected,\n isAllRowsSelected,\n handleSelectAllRows,\n handleSelectRow,\n } = useDataTable<TData>({ rows, defaultSelectedRows: selectedItems });\n\n useEffect(() => {\n if (\n JSON.stringify(selectedItems) !== JSON.stringify(selectedRows) &&\n selectedRows\n ) {\n onSelectedItemsChange?.(selectedRows);\n }\n }, [selectedRows, selectedItems, onSelectedItemsChange]);\n\n return (\n <Table {...props} className={cn('relative', className)}>\n <TableHeader\n className={cn('bg-bg', isStickyHeader && 'sticky top-0 z-1')}\n >\n <TableRow>\n {hasCheckbox && (\n <TableHead className={'w-12 p-3'}>\n <Checkbox\n className={'mt-1'}\n checked={isAllRowsSelected(rowKey)}\n onCheckedChange={(value) =>\n handleSelectAllRows(rowKey, !!value)\n }\n aria-label=\"Select all\"\n />\n </TableHead>\n )}\n {hasNumbers && <TableHead className={'w-12 p-2'}>#</TableHead>}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableHead\n key={column.key}\n style={column.styles}\n className={cn('p-2', column.sortable && 'cursor-pointer')}\n onClick={() => column.sortable && handleSort(column.dataIndex)}\n >\n <div className={'flex items-center gap-2'}>\n {column.name}{' '}\n {column.sortable &&\n (sortObject?.sortField === column.key ? (\n <>\n {sortObject?.sortOrder === SortOrder.DESC && (\n <ArrowDownWideNarrow size={15} />\n )}\n {sortObject?.sortOrder === SortOrder.ASC && (\n <ArrowUpWideNarrow size={15} />\n )}\n </>\n ) : (\n <ArrowUpDown size={15} />\n ))}\n </div>\n </TableHead>\n ))}\n </TableRow>\n </TableHeader>\n <TableBody className={'[&>tr:nth-child(even)]:bg-bg-secondary'}>\n {rows.length ? (\n rows.map((row, index) => (\n <TableRow\n key={`${row[rowKey]}`}\n onClick={() => onRowClick?.(row)}\n className={cn(onRowClick && 'cursor-pointer')}\n data-state={isRowSelected(row[rowKey]) && 'selected'}\n >\n {hasCheckbox && (\n <TableCell\n className={'w-12 p-3'}\n onClick={(evt) => evt.stopPropagation()}\n >\n <Checkbox\n className={'mt-1'}\n checked={isRowSelected(row[rowKey])}\n onCheckedChange={(value) =>\n handleSelectRow(row[rowKey], !!value)\n }\n aria-label=\"Select row\"\n />\n </TableCell>\n )}\n {hasNumbers && (\n <TableCell className={'w-12 p-2'}>\n {((params.page as number) - 1) *\n ((params.limit || DEFAULT_LIMIT) as number) +\n index +\n 1}\n </TableCell>\n )}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableCell\n className={'text-body-xs-medium max-w-xs p-2'}\n style={column.styles}\n key={`${index}-${column.key}`}\n >\n {column.render\n ? column.render(get(row, column.dataIndex), row)\n : get(row, column.dataIndex, '')}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={\n hasNumbers\n ? hasCheckbox\n ? columns.length + 2\n : columns.length + 1\n : columns.length\n }\n >\n <Empty />\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n );\n};\n","import { RiArrowDownSLine, RiLayoutColumnLine } from '@remixicon/react';\nimport { Button } from 'dgz-ui/button';\nimport {\n type DropdownContainerProps,\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from 'dgz-ui/dropdown';\nimport { cn } from 'dgz-ui/utils';\nimport { get, isEmpty } from 'lodash';\nimport { RefreshCw } from 'lucide-react';\nimport { type ReactNode, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useColumns } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { type ActionInterface, Actions, type ActionsProps } from '../actions';\nimport {\n ExportData,\n type ExportDataInterface,\n type ExportDataProps,\n} from '../export';\nimport {\n type FilterInterface,\n FilterWrapper,\n type FilterWrapperProps,\n Search,\n type SearchProps,\n} from '../filters';\nimport { Loader } from '../loader';\nimport { MyLimitSelect, MyPagination } from '../pagination';\nimport type { MyPaginationProps } from '../pagination/MyPagination.tsx';\nimport { MyTable, type MyTableProps } from './MyTable';\n\n/**\n * Minimal pagination wrapper contract used by `DataTable`.\n *\n * Notes\n * - Only `page`, `limit`, and `totalPages` are required. Other fields are optional and\n * may be provided by your API for convenience.\n * - The actual rows array can be stored in any key, controlled via `dataKey` prop\n * (defaults to `\"docs\"`).\n */\nexport interface PaginationInterface<TData> {\n /** Array of rows for the current page. Used when `dataKey` is set to `\"docs\"`. */\n docs?: TData[];\n /** Zero-based index of the first item on the current page (if provided by API). */\n offset?: number;\n /** Page size (items per page). */\n limit: number;\n /** Total number of pages available. */\n totalPages: number;\n /** Total number of items across all pages (if available). */\n total?: number;\n /** Current page number (1-based). */\n page: number;\n /** Convenience counter for the first item index on the page (if provided). */\n pagingCounter?: number;\n /** Whether a previous page exists. */\n hasPrevPage?: boolean;\n /** Whether a next page exists. */\n hasNextPage?: boolean;\n /** Previous page number, if available. */\n prevPage?: number;\n /** Next page number, if available. */\n nextPage?: number;\n}\n\n/**\n * Props for the DataTable component.\n *\n * @template TData - Row data type.\n * @template TPaginationData - Pagination wrapper type.\n */\nexport interface DataTableProps<\n TData,\n TPaginationData extends PaginationInterface<TData>,\n> extends Omit<MyTableProps<TData>, 'rows'> {\n /** Pagination data source. */\n dataSource?: TPaginationData;\n /** Callback for parameter changes (pagination, sorting, filtering). */\n onParamChange?: (param: Record<string, unknown>) => void;\n /** Whether to enable pagination. */\n hasPagination?: true;\n /** Options for the export data dropdown. */\n exportOptions?: ExportDataInterface[];\n /** Whether to enable search functionality. */\n hasSearch?: true;\n /** Whether the table data is loading. */\n loading?: boolean;\n /** Array of filters to display. */\n filters?: FilterInterface[];\n /** Array of actions to display. */\n actions?: ActionInterface[];\n /** Callback for filter changes. */\n handleFilterChange?: (filters: Record<string, unknown>) => void;\n /** Unique key for the table, used for column persistence. */\n tableKey: string;\n /** The key in dataSource where the data array is located. Defaults to \"docs\". */\n dataKey?: keyof TPaginationData;\n /** Whether to show the columns visibility dropdown. */\n hasColumnsVisibilityDropdown?: true;\n /** Callback when columns are updated (e.g., visibility toggled). */\n onColumnsUpdate?: (columns: ColumnType<TData>[]) => void;\n /** Whether the export action is loading. */\n exportLoading?: boolean;\n /** Props for the Actions component. */\n actionProps?: Partial<ActionsProps>;\n /** Props for the FilterWrapper component. */\n filterWrapperProps?: Partial<FilterWrapperProps>;\n /** Props for the ExportData component. */\n exportOptionsProps?: Partial<ExportDataProps>;\n searchProps?: Partial<SearchProps>;\n paginationProps?: Partial<MyPaginationProps>;\n /** Props for the columns visibility dropdown. */\n columnsVisibilityProps?: DropdownContainerProps & {\n title?: ReactNode;\n resetText?: ReactNode;\n };\n}\n\n/**\n * DataTable is a composable, high-level table that brings together search, filters,\n * column visibility management, header actions, exporting, and pagination.\n * It renders `MyTable` for rows and, when enabled, shows header controls and a footer with pagination.\n *\n * Generic Types\n * - `TData` — Row data shape (type of each item in the rows array).\n * - `TPaginationData` — Pagination wrapper type containing rows and pagination meta; defaults to\n * `PaginationInterface<TData>`.\n *\n * Key Behaviors\n * - Emits `onParamChange` when search text, filters, page, limit, or sort order change.\n * - Persists column visibility per `tableKey` via `useColumns` and informs parent with `onColumnsUpdate`.\n * - Renders header controls only when the related feature is enabled/has content.\n *\n * Props Overview\n * - `dataSource` — Paginated data source object that contains rows (see `dataKey`) and pagination metadata.\n * - `columns` — Column definitions passed to `MyTable`.\n * - `onRowClick` — Callback when a row is clicked.\n * - `rowKey` — Property name used as a unique row key.\n * - `hasNumbers` — Whether to show the row numbers column.\n * - `hasSearch` — Set to `true` to display the search input in the header.\n * - `exportOptions` — Export menu options shown by `ExportData` (see `ExportDataInterface[]`).\n * - `exportLoading` — When `true`, shows a spinner in the Export button to indicate an export action is in progress.\n * - `hasCheckbox` — Whether to show the selection checkbox column.\n * - `hasPagination` — Set to `true` to render the pagination footer.\n * - `isStickyHeader` — Whether to keep the table header sticky.\n * - `onParamChange` — Emits parameter changes for pagination/sorting/search/filters.\n * - `dataKey` — Key within `dataSource` that contains the row array. Defaults to `\"docs\"`.\n * - `loading` — If `true`, shows a loading state instead of the table rows.\n * - `tableKey` — Unique key for persisting column visibility state.\n * - `filters` — Filter configurations to render in the header.\n * - `actions` — Header actions independent of selected rows.\n * - `handleFilterChange` — Callback executed when filter values change.\n * - `params` — Current list parameters (pagination, sort, search, filters).\n * - `hasColumnsVisibilityDropdown` — Set to `true` to show the columns customize dropdown.\n * - `onColumnsUpdate` — Notifies parent whenever the internal columns state changes (after formatting/visibility).\n * - `actionProps` — Props passed to the `Actions` component.\n * - `filterWrapperProps` — Props passed to the `FilterWrapper` component.\n * - `exportOptionsProps` — Props passed to the `ExportData` component.\n * - `columnsVisibilityProps` — Props passed to the columns visibility dropdown.\n * - `onSelectedItemsChange` — Callback when selected rows change (requires `hasCheckbox`).\n *\n * Accessibility\n * - Header controls and dropdowns reuse shared primitives that include keyboard and ARIA support.\n *\n * Internationalization\n * - Text such as \"Export\", \"Customize columns\", and \"Reset columns\" are resolved via `react-i18next`.\n *\n * Usage Examples\n * 1) Minimal paginated table (uses default `dataKey = \"docs\"`)\n * ```tsx\n * type User = { id: string; name: string };\n * const data = { docs: [{ id: '1', name: 'Ada' }], page: 1, limit: 10, totalPages: 1 };\n *\n * <DataTable<User>\n * tableKey=\"users-table\"\n * columns={[{ key: 'name', name: 'Name' }]}\n * rowKey=\"id\"\n * dataSource={data}\n * hasPagination\n * />\n * ```\n *\n * 2) Custom `dataKey` and column visibility persistence\n * ```tsx\n * type Row = { id: number; title: string };\n * const payload = { items: [{ id: 1, title: 'Hello' }], page: 1, limit: 20, totalPages: 1 };\n *\n * <DataTable<Row>\n * tableKey=\"posts\"\n * columns={[{ key: 'title', name: 'Title' }]}\n * rowKey=\"id\"\n * dataSource={payload}\n * dataKey=\"items\"\n * hasColumnsVisibilityDropdown\n * />\n * ```\n *\n * 3) Responding to user interactions via `onParamChange`\n * ```tsx\n * const [params, setParams] = useState({ page: 1, limit: 10 });\n *\n * <DataTable\n * tableKey=\"logs\"\n * columns={[{ key: 'message', name: 'Message' }]}\n * rowKey=\"id\"\n * params={params}\n * onParamChange={setParams}\n * hasSearch\n * hasPagination\n * />\n * ```\n *\n * Notes and Best Practices\n * - Ensure `rowKey` points to a stable unique field in `TData` to avoid key collisions.\n * - When arrays like `exportOptions`, `filters`, or `actions` are empty, their sections are not rendered.\n * - Sorting emits `{ sortField, sortOrder }` through `onParamChange` when the user toggles a column sort.\n *\n * Returns\n * - React element that renders a complete data table experience.\n */\nexport const DataTable = <\n TData,\n TPaginationData extends PaginationInterface<TData> =\n PaginationInterface<TData>,\n>({\n dataSource,\n columns,\n onRowClick,\n rowKey,\n hasNumbers,\n hasSearch,\n exportOptions,\n hasCheckbox,\n hasPagination,\n isStickyHeader,\n onParamChange,\n dataKey = 'docs',\n loading,\n tableKey,\n filters,\n actions,\n handleFilterChange,\n params,\n exportLoading = false,\n onColumnsUpdate,\n hasColumnsVisibilityDropdown,\n onSelectedItemsChange,\n actionProps,\n filterWrapperProps,\n exportOptionsProps,\n columnsVisibilityProps,\n paginationProps,\n searchProps,\n ...props\n}: DataTableProps<TData, TPaginationData>) => {\n const { t } = useTranslation();\n const [selectedRows, setSelectedRows] = useState<TData[keyof TData][]>([]);\n const { formattedColumns, handleColumnsChange, resetColumns } =\n useColumns<TData>({ key: tableKey, columns });\n\n useEffect(() => {\n onColumnsUpdate?.(formattedColumns);\n }, [formattedColumns, onColumnsUpdate]);\n\n useEffect(() => {\n onSelectedItemsChange?.(selectedRows);\n }, [selectedRows, onSelectedItemsChange]);\n\n return (\n <div\n className={\n 'border-border-alpha-light flex grow flex-col overflow-auto rounded-xl border shadow-xs'\n }\n >\n {(hasSearch ||\n (hasColumnsVisibilityDropdown && tableKey) ||\n !isEmpty(exportOptions) ||\n !isEmpty(filters)) && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className={'w-full shrink'}>\n {hasSearch && (\n <Search\n {...searchProps}\n inputProps={{\n ...searchProps?.inputProps,\n className: cn('h-8', searchProps?.inputProps?.className),\n }}\n className={cn(\n 'max-w-64 [&_button]:-top-1',\n searchProps?.className\n )}\n defaultValue={get(params, 'search', '') as string}\n onSearchChange={(search) =>\n onParamChange?.({ ...params, search, page: 1 })\n }\n />\n )}\n </div>\n <div className={'flex shrink-0 items-center justify-end gap-3'}>\n {exportOptions && (\n <ExportData\n {...exportOptionsProps}\n options={exportOptions}\n loading={exportLoading}\n />\n )}\n {hasColumnsVisibilityDropdown && tableKey && (\n <DropdownMenu>\n <DropdownMenuTrigger\n asChild\n {...columnsVisibilityProps?.triggerProps}\n >\n <Button\n variant=\"secondary\"\n size={'sm'}\n className={'ml-auto rounded-lg px-3'}\n >\n {columnsVisibilityProps?.title || (\n <>\n <RiLayoutColumnLine />{' '}\n <span className={'hidden lg:inline!'}>\n {t('Customize columns')}\n </span>\n <RiArrowDownSLine />\n </>\n )}\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n align=\"end\"\n {...columnsVisibilityProps?.contentProps}\n >\n <DropdownMenuItem\n className=\"capitalize\"\n onClick={resetColumns}\n >\n <RefreshCw />{' '}\n {columnsVisibilityProps?.resetText || t('Reset columns')}\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n {formattedColumns.map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.key}\n className=\"capitalize\"\n checked={!column.hidden}\n onCheckedChange={(value) =>\n handleColumnsChange(column, !value)\n }\n >\n {column.name}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n )}\n {actions && <Actions {...actionProps} actions={actions} />}\n {filters && (\n <FilterWrapper\n {...filterWrapperProps}\n filters={filters}\n params={params}\n onChange={handleFilterChange}\n onFilter={(filter) => {\n onParamChange?.({ ...params, ...filter, page: 1 });\n handleFilterChange?.(filter);\n }}\n />\n )}\n </div>\n </div>\n )}\n <div className={'flex flex-col overflow-auto border-y'}>\n {!loading ? (\n <MyTable<TData>\n {...props}\n params={{\n page: dataSource?.page || 1,\n limit: dataSource?.limit,\n ...params,\n }}\n rows={get(dataSource, dataKey, []) as TData[]}\n rowKey={rowKey}\n selectedItems={selectedRows}\n isStickyHeader={isStickyHeader}\n columns={formattedColumns}\n hasCheckbox={hasCheckbox}\n hasNumbers={hasNumbers}\n onRowClick={onRowClick}\n onSelectedItemsChange={setSelectedRows}\n onSortOrderChange={({ sortField, sortOrder }) => {\n onParamChange?.({ ...params, sortField, sortOrder });\n }}\n />\n ) : (\n <Loader />\n )}\n </div>\n {hasPagination && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className=\"text-sm\">\n <MyLimitSelect\n onLimitChange={(limit) =>\n onParamChange?.({ ...params, limit, page: 1 })\n }\n defaultValue={dataSource?.limit}\n />\n </div>\n <div className=\"text-muted-foreground text-sm\">\n {t('{{selectedCount}} of {{total}} row(s) selected', {\n selectedCount: selectedRows.length,\n total: dataSource?.total || 0,\n })}\n </div>\n <div>\n <MyPagination\n {...paginationProps}\n onPageChange={(page) => onParamChange?.({ ...params, page })}\n currentPage={dataSource?.page}\n totalPages={dataSource?.totalPages}\n />\n </div>\n </div>\n )}\n </div>\n );\n};\n"],"names":["MyTable","rows","columns","onRowClick","rowKey","params","DEFAULT_LIMIT","hasNumbers","hasCheckbox","selectedItems","onSelectedItemsChange","onSortOrderChange","isStickyHeader","className","props","sortObject","handleSort","useSortable","selectedRows","isRowSelected","isAllRowsSelected","handleSelectAllRows","handleSelectRow","useDataTable","useEffect","jsxs","Table","cn","jsx","TableHeader","TableRow","TableHead","Checkbox","value","column","Fragment","SortOrder","ArrowDownWideNarrow","ArrowUpWideNarrow","ArrowUpDown","TableBody","row","index","TableCell","evt","get","Empty","DataTable","dataSource","hasSearch","exportOptions","hasPagination","onParamChange","dataKey","loading","tableKey","filters","actions","handleFilterChange","exportLoading","onColumnsUpdate","hasColumnsVisibilityDropdown","actionProps","filterWrapperProps","exportOptionsProps","columnsVisibilityProps","paginationProps","searchProps","t","useTranslation","setSelectedRows","useState","formattedColumns","handleColumnsChange","resetColumns","useColumns","isEmpty","Search","_a","search","ExportData","DropdownMenu","DropdownMenuTrigger","Button","RiLayoutColumnLine","RiArrowDownSLine","DropdownMenuContent","DropdownMenuItem","RefreshCw","DropdownMenuSeparator","DropdownMenuCheckboxItem","Actions","FilterWrapper","filter","Loader","sortField","sortOrder","MyLimitSelect","limit","MyPagination","page"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/datatable/MyTable.tsx","../../../src/components/datatable/DataTable.tsx"],"sourcesContent":["import { Checkbox } from 'dgz-ui/form';\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from 'dgz-ui/table';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport {\n ArrowDownWideNarrow,\n ArrowUpDown,\n ArrowUpWideNarrow,\n} from 'lucide-react';\nimport { type ComponentProps, useEffect } from 'react';\nimport { SortOrder } from '../../enums';\nimport { useDataTable, useSortable, type UseSortableProps } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { Empty } from '../empty';\nimport { DEFAULT_LIMIT } from '../pagination/MyLimitSelect';\n\n/**\n * Props for the MyTable component.\n * @template TData - The type of data in the table.\n */\nexport interface MyTableProps<TData> extends ComponentProps<'table'> {\n /** Array of data rows to display. */\n rows?: TData[];\n /** Column definitions. */\n columns: ColumnType<TData>[];\n /** Callback when a row is clicked. */\n onRowClick?: (row: TData) => void;\n /** Whether to show row numbers. */\n hasNumbers?: boolean;\n /** Whether to show selection checkboxes. */\n hasCheckbox?: boolean;\n /** Unique key for each row. */\n rowKey: keyof TData;\n /** Current table parameters (page, limit, sort). */\n params?: Record<string, unknown>;\n /** Total number of items (optional, often used with pagination context). */\n total?: number;\n /** Array of currently selected item keys. */\n selectedItems?: TData[keyof TData][];\n /** Callback when selected items change. */\n onSelectedItemsChange?: (selectedItems: TData[keyof TData][]) => void;\n /** Callback when sort order changes. */\n onSortOrderChange?: (\n params: Omit<UseSortableProps<TData>, 'onSortOrderChange'>\n ) => void;\n /** Whether the header should stick to the top. */\n isStickyHeader?: true;\n}\n\n/**\n * MyTable renders a generic data table with optional numbering, selection checkboxes,\n * sortable columns and sticky header. It is a presentational component and delegates\n * sorting/selection state via hooks and callbacks.\n *\n * @template TData - The row data type.\n * @param props - Component props.\n * @returns React element containing the table.\n */\nexport const MyTable = <TData,>({\n rows = [],\n columns,\n onRowClick,\n rowKey,\n params = {\n page: 1,\n limit: DEFAULT_LIMIT,\n },\n hasNumbers = false,\n hasCheckbox = false,\n selectedItems,\n onSelectedItemsChange,\n onSortOrderChange,\n isStickyHeader,\n className,\n ...props\n}: MyTableProps<TData>) => {\n const { sortObject, handleSort } = useSortable<TData>({\n sortField: params?.sortField as keyof TData | undefined,\n sortOrder: params?.sortOrder as SortOrder | undefined,\n onSortOrderChange,\n });\n const {\n selectedRows,\n isRowSelected,\n isAllRowsSelected,\n handleSelectAllRows,\n handleSelectRow,\n } = useDataTable<TData>({ rows, defaultSelectedRows: selectedItems });\n\n useEffect(() => {\n if (\n JSON.stringify(selectedItems) !== JSON.stringify(selectedRows) &&\n selectedRows\n ) {\n onSelectedItemsChange?.(selectedRows);\n }\n }, [selectedRows, selectedItems, onSelectedItemsChange]);\n\n return (\n <Table {...props} className={cn('relative', className)}>\n <TableHeader\n className={cn('bg-bg', isStickyHeader && 'sticky top-0 z-1')}\n >\n <TableRow>\n {hasCheckbox && (\n <TableHead className={'w-12 p-3'}>\n <Checkbox\n className={'mt-1'}\n checked={isAllRowsSelected(rowKey)}\n onCheckedChange={(value) =>\n handleSelectAllRows(rowKey, !!value)\n }\n aria-label=\"Select all\"\n />\n </TableHead>\n )}\n {hasNumbers && <TableHead className={'w-12 p-2'}>#</TableHead>}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableHead\n key={column.key}\n style={column.styles}\n className={cn('p-2', column.sortable && 'cursor-pointer')}\n onClick={() => column.sortable && handleSort(column.dataIndex)}\n >\n <div className={'flex items-center gap-2'}>\n {column.name}{' '}\n {column.sortable &&\n (sortObject?.sortField === column.key ? (\n <>\n {sortObject?.sortOrder === SortOrder.DESC && (\n <ArrowDownWideNarrow size={15} />\n )}\n {sortObject?.sortOrder === SortOrder.ASC && (\n <ArrowUpWideNarrow size={15} />\n )}\n </>\n ) : (\n <ArrowUpDown size={15} />\n ))}\n </div>\n </TableHead>\n ))}\n </TableRow>\n </TableHeader>\n <TableBody className={'[&>tr:nth-child(even)]:bg-bg-secondary'}>\n {rows.length ? (\n rows.map((row, index) => (\n <TableRow\n key={`${row[rowKey]}`}\n onClick={() => onRowClick?.(row)}\n className={cn(onRowClick && 'cursor-pointer')}\n data-state={isRowSelected(row[rowKey]) && 'selected'}\n >\n {hasCheckbox && (\n <TableCell\n className={'w-12 p-3'}\n onClick={(evt) => evt.stopPropagation()}\n >\n <Checkbox\n className={'mt-1'}\n checked={isRowSelected(row[rowKey])}\n onCheckedChange={(value) =>\n handleSelectRow(row[rowKey], !!value)\n }\n aria-label=\"Select row\"\n />\n </TableCell>\n )}\n {hasNumbers && (\n <TableCell className={'w-12 p-2'}>\n {((params.page as number) - 1) *\n ((params.limit || DEFAULT_LIMIT) as number) +\n index +\n 1}\n </TableCell>\n )}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableCell\n className={'text-body-xs-medium max-w-xs p-2'}\n style={column.styles}\n key={`${index}-${column.key}`}\n >\n {column.render\n ? column.render(get(row, column.dataIndex), row)\n : get(row, column.dataIndex, '')}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={\n hasNumbers\n ? hasCheckbox\n ? columns.length + 2\n : columns.length + 1\n : columns.length\n }\n >\n <Empty />\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n );\n};\n","import { RiArrowDownSLine, RiLayoutColumnLine } from '@remixicon/react';\nimport { Button } from 'dgz-ui/button';\nimport {\n type DropdownContainerProps,\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from 'dgz-ui/dropdown';\nimport { cn } from 'dgz-ui/utils';\nimport { get, isEmpty } from 'lodash';\nimport { RefreshCw } from 'lucide-react';\nimport { type ReactNode, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useColumns } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { type ActionInterface, Actions, type ActionsProps } from '../actions';\nimport {\n ExportData,\n type ExportDataInterface,\n type ExportDataProps,\n} from '../export';\nimport {\n type FilterInterface,\n FilterWrapper,\n type FilterWrapperProps,\n Search,\n type SearchProps,\n} from '../filters';\nimport { Loader } from '../loader';\nimport { MyLimitSelect, MyPagination } from '../pagination';\nimport type { MyPaginationProps } from '../pagination/MyPagination.tsx';\nimport { MyTable, type MyTableProps } from './MyTable';\n\n/**\n * Minimal pagination wrapper contract used by `DataTable`.\n *\n * Notes\n * - Only `page`, `limit`, and `totalPages` are required. Other fields are optional and\n * may be provided by your API for convenience.\n * - The actual rows array can be stored in any key, controlled via `dataKey` prop\n * (defaults to `\"docs\"`).\n */\nexport interface PaginationInterface<TData> {\n /** Array of rows for the current page. Used when `dataKey` is set to `\"docs\"`. */\n docs?: TData[];\n /** Zero-based index of the first item on the current page (if provided by API). */\n offset?: number;\n /** Page size (items per page). */\n limit: number;\n /** Total number of pages available. */\n totalPages: number;\n /** Total number of items across all pages (if available). */\n total?: number;\n /** Current page number (1-based). */\n page: number;\n /** Convenience counter for the first item index on the page (if provided). */\n pagingCounter?: number;\n /** Whether a previous page exists. */\n hasPrevPage?: boolean;\n /** Whether a next page exists. */\n hasNextPage?: boolean;\n /** Previous page number, if available. */\n prevPage?: number;\n /** Next page number, if available. */\n nextPage?: number;\n}\n\n/**\n * Props for the DataTable component.\n *\n * @template TData - Row data type.\n * @template TPaginationData - Pagination wrapper type.\n */\nexport interface DataTableProps<\n TData,\n TPaginationData extends PaginationInterface<TData>,\n> extends Omit<MyTableProps<TData>, 'rows'> {\n /** Pagination data source. */\n dataSource?: TPaginationData;\n /** Callback for parameter changes (pagination, sorting, filtering). */\n onParamChange?: (param: Record<string, unknown>) => void;\n /** Whether to enable pagination. */\n hasPagination?: true;\n /** Options for the export data dropdown. */\n exportOptions?: ExportDataInterface[];\n /** Whether to enable search functionality. */\n hasSearch?: true;\n /** Whether the table data is loading. */\n loading?: boolean;\n /** Array of filters to display. */\n filters?: FilterInterface[];\n /** Array of actions to display. */\n actions?: ActionInterface[];\n /** Callback for filter changes. */\n handleFilterChange?: (filters: Record<string, unknown>) => void;\n /** Unique key for the table, used for column persistence. */\n tableKey: string;\n /** The key in dataSource where the data array is located. Defaults to \"docs\". */\n dataKey?: keyof TPaginationData;\n /** Whether to show the columns visibility dropdown. */\n hasColumnsVisibilityDropdown?: true;\n /** Callback when columns are updated (e.g., visibility toggled). */\n onColumnsUpdate?: (columns: ColumnType<TData>[]) => void;\n /** Whether the export action is loading. */\n exportLoading?: boolean;\n /** Props for the Actions component. */\n actionProps?: Partial<ActionsProps>;\n /** Props for the FilterWrapper component. */\n filterWrapperProps?: Partial<FilterWrapperProps>;\n /** Props for the ExportData component. */\n exportOptionsProps?: Partial<ExportDataProps>;\n searchProps?: Partial<SearchProps>;\n paginationProps?: Partial<MyPaginationProps>;\n /** Props for the columns visibility dropdown. */\n columnsVisibilityProps?: DropdownContainerProps & {\n title?: ReactNode;\n resetText?: ReactNode;\n };\n}\n\n/**\n * DataTable is a composable, high-level table that brings together search, filters,\n * column visibility management, header actions, exporting, and pagination.\n * It renders `MyTable` for rows and, when enabled, shows header controls and a footer with pagination.\n *\n * Generic Types\n * - `TData` — Row data shape (type of each item in the rows array).\n * - `TPaginationData` — Pagination wrapper type containing rows and pagination meta; defaults to\n * `PaginationInterface<TData>`.\n *\n * Key Behaviors\n * - Emits `onParamChange` when search text, filters, page, limit, or sort order change.\n * - Persists column visibility per `tableKey` via `useColumns` and informs parent with `onColumnsUpdate`.\n * - Renders header controls only when the related feature is enabled/has content.\n *\n * Props Overview\n * - `dataSource` — Paginated data source object that contains rows (see `dataKey`) and pagination metadata.\n * - `columns` — Column definitions passed to `MyTable`.\n * - `onRowClick` — Callback when a row is clicked.\n * - `rowKey` — Property name used as a unique row key.\n * - `hasNumbers` — Whether to show the row numbers column.\n * - `hasSearch` — Set to `true` to display the search input in the header.\n * - `exportOptions` — Export menu options shown by `ExportData` (see `ExportDataInterface[]`).\n * - `exportLoading` — When `true`, shows a spinner in the Export button to indicate an export action is in progress.\n * - `hasCheckbox` — Whether to show the selection checkbox column.\n * - `hasPagination` — Set to `true` to render the pagination footer.\n * - `isStickyHeader` — Whether to keep the table header sticky.\n * - `onParamChange` — Emits parameter changes for pagination/sorting/search/filters.\n * - `dataKey` — Key within `dataSource` that contains the row array. Defaults to `\"docs\"`.\n * - `loading` — If `true`, shows a loading state instead of the table rows.\n * - `tableKey` — Unique key for persisting column visibility state.\n * - `filters` — Filter configurations to render in the header.\n * - `actions` — Header actions independent of selected rows.\n * - `handleFilterChange` — Callback executed when filter values change.\n * - `params` — Current list parameters (pagination, sort, search, filters).\n * - `hasColumnsVisibilityDropdown` — Set to `true` to show the columns customize dropdown.\n * - `onColumnsUpdate` — Notifies parent whenever the internal columns state changes (after formatting/visibility).\n * - `actionProps` — Props passed to the `Actions` component.\n * - `filterWrapperProps` — Props passed to the `FilterWrapper` component.\n * - `exportOptionsProps` — Props passed to the `ExportData` component.\n * - `columnsVisibilityProps` — Props passed to the columns visibility dropdown.\n * - `onSelectedItemsChange` — Callback when selected rows change (requires `hasCheckbox`).\n *\n * Accessibility\n * - Header controls and dropdowns reuse shared primitives that include keyboard and ARIA support.\n *\n * Internationalization\n * - Text such as \"Export\", \"Customize columns\", and \"Reset columns\" are resolved via `react-i18next`.\n *\n * Usage Examples\n * 1) Minimal paginated table (uses default `dataKey = \"docs\"`)\n * ```tsx\n * type User = { id: string; name: string };\n * const data = { docs: [{ id: '1', name: 'Ada' }], page: 1, limit: 10, totalPages: 1 };\n *\n * <DataTable<User>\n * tableKey=\"users-table\"\n * columns={[{ key: 'name', name: 'Name' }]}\n * rowKey=\"id\"\n * dataSource={data}\n * hasPagination\n * />\n * ```\n *\n * 2) Custom `dataKey` and column visibility persistence\n * ```tsx\n * type Row = { id: number; title: string };\n * const payload = { items: [{ id: 1, title: 'Hello' }], page: 1, limit: 20, totalPages: 1 };\n *\n * <DataTable<Row>\n * tableKey=\"posts\"\n * columns={[{ key: 'title', name: 'Title' }]}\n * rowKey=\"id\"\n * dataSource={payload}\n * dataKey=\"items\"\n * hasColumnsVisibilityDropdown\n * />\n * ```\n *\n * 3) Responding to user interactions via `onParamChange`\n * ```tsx\n * const [params, setParams] = useState({ page: 1, limit: 10 });\n *\n * <DataTable\n * tableKey=\"logs\"\n * columns={[{ key: 'message', name: 'Message' }]}\n * rowKey=\"id\"\n * params={params}\n * onParamChange={setParams}\n * hasSearch\n * hasPagination\n * />\n * ```\n *\n * Notes and Best Practices\n * - Ensure `rowKey` points to a stable unique field in `TData` to avoid key collisions.\n * - When arrays like `exportOptions`, `filters`, or `actions` are empty, their sections are not rendered.\n * - Sorting emits `{ sortField, sortOrder }` through `onParamChange` when the user toggles a column sort.\n *\n * Returns\n * - React element that renders a complete data table experience.\n */\nexport const DataTable = <\n TData,\n TPaginationData extends PaginationInterface<TData> =\n PaginationInterface<TData>,\n>({\n dataSource,\n columns,\n onRowClick,\n rowKey,\n hasNumbers,\n hasSearch,\n exportOptions,\n hasCheckbox,\n hasPagination,\n isStickyHeader,\n onParamChange,\n dataKey = 'docs',\n loading,\n tableKey,\n filters,\n actions,\n handleFilterChange,\n params,\n exportLoading = false,\n onColumnsUpdate,\n hasColumnsVisibilityDropdown,\n onSelectedItemsChange,\n actionProps,\n filterWrapperProps,\n exportOptionsProps,\n columnsVisibilityProps,\n paginationProps,\n searchProps,\n ...props\n}: DataTableProps<TData, TPaginationData>) => {\n const { t } = useTranslation();\n const [selectedRows, setSelectedRows] = useState<TData[keyof TData][]>([]);\n const { formattedColumns, handleColumnsChange, resetColumns } =\n useColumns<TData>({ key: tableKey, columns });\n\n useEffect(() => {\n onColumnsUpdate?.(formattedColumns);\n }, [formattedColumns, onColumnsUpdate]);\n\n useEffect(() => {\n onSelectedItemsChange?.(selectedRows);\n }, [selectedRows, onSelectedItemsChange]);\n\n return (\n <div\n className={\n 'border-border-alpha-light flex grow flex-col overflow-auto rounded-xl border shadow-xs'\n }\n >\n {(hasSearch ||\n (hasColumnsVisibilityDropdown && tableKey) ||\n !isEmpty(exportOptions) ||\n !isEmpty(filters)) && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className={'w-full shrink'}>\n {hasSearch && (\n <Search\n {...searchProps}\n inputProps={{\n ...searchProps?.inputProps,\n className: cn('h-8', searchProps?.inputProps?.className),\n }}\n className={cn(\n 'max-w-78 [&_button]:-top-1',\n searchProps?.className\n )}\n defaultValue={get(params, 'search', '') as string}\n onSearchChange={(search) =>\n onParamChange?.({ ...params, search, page: 1 })\n }\n />\n )}\n </div>\n <div className={'flex shrink-0 items-center justify-end gap-3'}>\n {exportOptions && (\n <ExportData\n {...exportOptionsProps}\n options={exportOptions}\n loading={exportLoading}\n />\n )}\n {hasColumnsVisibilityDropdown && tableKey && (\n <DropdownMenu>\n <DropdownMenuTrigger\n asChild\n {...columnsVisibilityProps?.triggerProps}\n >\n <Button\n variant=\"secondary\"\n size={'sm'}\n className={'ml-auto rounded-lg px-3'}\n >\n {columnsVisibilityProps?.title || (\n <>\n <RiLayoutColumnLine />{' '}\n <span className={'hidden lg:inline!'}>\n {t('Customize columns')}\n </span>\n <RiArrowDownSLine />\n </>\n )}\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n align=\"end\"\n {...columnsVisibilityProps?.contentProps}\n >\n <DropdownMenuItem\n className=\"capitalize\"\n onClick={resetColumns}\n >\n <RefreshCw />{' '}\n {columnsVisibilityProps?.resetText || t('Reset columns')}\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n {formattedColumns.map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.key}\n className=\"capitalize\"\n checked={!column.hidden}\n onCheckedChange={(value) =>\n handleColumnsChange(column, !value)\n }\n >\n {column.name}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n )}\n {actions && <Actions {...actionProps} actions={actions} />}\n {filters && (\n <FilterWrapper\n {...filterWrapperProps}\n filters={filters}\n params={params}\n onChange={handleFilterChange}\n onFilter={(filter) => {\n onParamChange?.({ ...params, ...filter, page: 1 });\n handleFilterChange?.(filter);\n }}\n />\n )}\n </div>\n </div>\n )}\n <div className={'flex flex-col overflow-auto border-y'}>\n {!loading ? (\n <MyTable<TData>\n {...props}\n params={{\n page: dataSource?.page || 1,\n limit: dataSource?.limit,\n ...params,\n }}\n rows={get(dataSource, dataKey, []) as TData[]}\n rowKey={rowKey}\n selectedItems={selectedRows}\n isStickyHeader={isStickyHeader}\n columns={formattedColumns}\n hasCheckbox={hasCheckbox}\n hasNumbers={hasNumbers}\n onRowClick={onRowClick}\n onSelectedItemsChange={setSelectedRows}\n onSortOrderChange={({ sortField, sortOrder }) => {\n onParamChange?.({ ...params, sortField, sortOrder });\n }}\n />\n ) : (\n <Loader />\n )}\n </div>\n {hasPagination && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className=\"text-sm\">\n <MyLimitSelect\n onLimitChange={(limit) =>\n onParamChange?.({ ...params, limit, page: 1 })\n }\n defaultValue={dataSource?.limit}\n />\n </div>\n <div className=\"text-muted-foreground text-sm\">\n {t('{{selectedCount}} of {{total}} row(s) selected', {\n selectedCount: selectedRows.length,\n total: dataSource?.total || 0,\n })}\n </div>\n <div>\n <MyPagination\n {...paginationProps}\n onPageChange={(page) => onParamChange?.({ ...params, page })}\n currentPage={dataSource?.page}\n totalPages={dataSource?.totalPages}\n />\n </div>\n </div>\n )}\n </div>\n );\n};\n"],"names":["MyTable","rows","columns","onRowClick","rowKey","params","DEFAULT_LIMIT","hasNumbers","hasCheckbox","selectedItems","onSelectedItemsChange","onSortOrderChange","isStickyHeader","className","props","sortObject","handleSort","useSortable","selectedRows","isRowSelected","isAllRowsSelected","handleSelectAllRows","handleSelectRow","useDataTable","useEffect","jsxs","Table","cn","jsx","TableHeader","TableRow","TableHead","Checkbox","value","column","Fragment","SortOrder","ArrowDownWideNarrow","ArrowUpWideNarrow","ArrowUpDown","TableBody","row","index","TableCell","evt","get","Empty","DataTable","dataSource","hasSearch","exportOptions","hasPagination","onParamChange","dataKey","loading","tableKey","filters","actions","handleFilterChange","exportLoading","onColumnsUpdate","hasColumnsVisibilityDropdown","actionProps","filterWrapperProps","exportOptionsProps","columnsVisibilityProps","paginationProps","searchProps","t","useTranslation","setSelectedRows","useState","formattedColumns","handleColumnsChange","resetColumns","useColumns","isEmpty","Search","_a","search","ExportData","DropdownMenu","DropdownMenuTrigger","Button","RiLayoutColumnLine","RiArrowDownSLine","DropdownMenuContent","DropdownMenuItem","RefreshCw","DropdownMenuSeparator","DropdownMenuCheckboxItem","Actions","FilterWrapper","filter","Loader","sortField","sortOrder","MyLimitSelect","limit","MyPagination","page"],"mappings":"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"}
|
|
@@ -180,7 +180,7 @@ const Le = ({
|
|
|
180
180
|
className: E("h-8", (G = w == null ? void 0 : w.inputProps) == null ? void 0 : G.className)
|
|
181
181
|
},
|
|
182
182
|
className: E(
|
|
183
|
-
"max-w-
|
|
183
|
+
"max-w-78 [&_button]:-top-1",
|
|
184
184
|
w == null ? void 0 : w.className
|
|
185
185
|
),
|
|
186
186
|
defaultValue: A.get(n, "search", ""),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../../../src/components/datatable/MyTable.tsx","../../../src/components/datatable/DataTable.tsx"],"sourcesContent":["import { Checkbox } from 'dgz-ui/form';\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from 'dgz-ui/table';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport {\n ArrowDownWideNarrow,\n ArrowUpDown,\n ArrowUpWideNarrow,\n} from 'lucide-react';\nimport { type ComponentProps, useEffect } from 'react';\nimport { SortOrder } from '../../enums';\nimport { useDataTable, useSortable, type UseSortableProps } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { Empty } from '../empty';\nimport { DEFAULT_LIMIT } from '../pagination/MyLimitSelect';\n\n/**\n * Props for the MyTable component.\n * @template TData - The type of data in the table.\n */\nexport interface MyTableProps<TData> extends ComponentProps<'table'> {\n /** Array of data rows to display. */\n rows?: TData[];\n /** Column definitions. */\n columns: ColumnType<TData>[];\n /** Callback when a row is clicked. */\n onRowClick?: (row: TData) => void;\n /** Whether to show row numbers. */\n hasNumbers?: boolean;\n /** Whether to show selection checkboxes. */\n hasCheckbox?: boolean;\n /** Unique key for each row. */\n rowKey: keyof TData;\n /** Current table parameters (page, limit, sort). */\n params?: Record<string, unknown>;\n /** Total number of items (optional, often used with pagination context). */\n total?: number;\n /** Array of currently selected item keys. */\n selectedItems?: TData[keyof TData][];\n /** Callback when selected items change. */\n onSelectedItemsChange?: (selectedItems: TData[keyof TData][]) => void;\n /** Callback when sort order changes. */\n onSortOrderChange?: (\n params: Omit<UseSortableProps<TData>, 'onSortOrderChange'>\n ) => void;\n /** Whether the header should stick to the top. */\n isStickyHeader?: true;\n}\n\n/**\n * MyTable renders a generic data table with optional numbering, selection checkboxes,\n * sortable columns and sticky header. It is a presentational component and delegates\n * sorting/selection state via hooks and callbacks.\n *\n * @template TData - The row data type.\n * @param props - Component props.\n * @returns React element containing the table.\n */\nexport const MyTable = <TData,>({\n rows = [],\n columns,\n onRowClick,\n rowKey,\n params = {\n page: 1,\n limit: DEFAULT_LIMIT,\n },\n hasNumbers = false,\n hasCheckbox = false,\n selectedItems,\n onSelectedItemsChange,\n onSortOrderChange,\n isStickyHeader,\n className,\n ...props\n}: MyTableProps<TData>) => {\n const { sortObject, handleSort } = useSortable<TData>({\n sortField: params?.sortField as keyof TData | undefined,\n sortOrder: params?.sortOrder as SortOrder | undefined,\n onSortOrderChange,\n });\n const {\n selectedRows,\n isRowSelected,\n isAllRowsSelected,\n handleSelectAllRows,\n handleSelectRow,\n } = useDataTable<TData>({ rows, defaultSelectedRows: selectedItems });\n\n useEffect(() => {\n if (\n JSON.stringify(selectedItems) !== JSON.stringify(selectedRows) &&\n selectedRows\n ) {\n onSelectedItemsChange?.(selectedRows);\n }\n }, [selectedRows, selectedItems, onSelectedItemsChange]);\n\n return (\n <Table {...props} className={cn('relative', className)}>\n <TableHeader\n className={cn('bg-bg', isStickyHeader && 'sticky top-0 z-1')}\n >\n <TableRow>\n {hasCheckbox && (\n <TableHead className={'w-12 p-3'}>\n <Checkbox\n className={'mt-1'}\n checked={isAllRowsSelected(rowKey)}\n onCheckedChange={(value) =>\n handleSelectAllRows(rowKey, !!value)\n }\n aria-label=\"Select all\"\n />\n </TableHead>\n )}\n {hasNumbers && <TableHead className={'w-12 p-2'}>#</TableHead>}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableHead\n key={column.key}\n style={column.styles}\n className={cn('p-2', column.sortable && 'cursor-pointer')}\n onClick={() => column.sortable && handleSort(column.dataIndex)}\n >\n <div className={'flex items-center gap-2'}>\n {column.name}{' '}\n {column.sortable &&\n (sortObject?.sortField === column.key ? (\n <>\n {sortObject?.sortOrder === SortOrder.DESC && (\n <ArrowDownWideNarrow size={15} />\n )}\n {sortObject?.sortOrder === SortOrder.ASC && (\n <ArrowUpWideNarrow size={15} />\n )}\n </>\n ) : (\n <ArrowUpDown size={15} />\n ))}\n </div>\n </TableHead>\n ))}\n </TableRow>\n </TableHeader>\n <TableBody className={'[&>tr:nth-child(even)]:bg-bg-secondary'}>\n {rows.length ? (\n rows.map((row, index) => (\n <TableRow\n key={`${row[rowKey]}`}\n onClick={() => onRowClick?.(row)}\n className={cn(onRowClick && 'cursor-pointer')}\n data-state={isRowSelected(row[rowKey]) && 'selected'}\n >\n {hasCheckbox && (\n <TableCell\n className={'w-12 p-3'}\n onClick={(evt) => evt.stopPropagation()}\n >\n <Checkbox\n className={'mt-1'}\n checked={isRowSelected(row[rowKey])}\n onCheckedChange={(value) =>\n handleSelectRow(row[rowKey], !!value)\n }\n aria-label=\"Select row\"\n />\n </TableCell>\n )}\n {hasNumbers && (\n <TableCell className={'w-12 p-2'}>\n {((params.page as number) - 1) *\n ((params.limit || DEFAULT_LIMIT) as number) +\n index +\n 1}\n </TableCell>\n )}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableCell\n className={'text-body-xs-medium max-w-xs p-2'}\n style={column.styles}\n key={`${index}-${column.key}`}\n >\n {column.render\n ? column.render(get(row, column.dataIndex), row)\n : get(row, column.dataIndex, '')}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={\n hasNumbers\n ? hasCheckbox\n ? columns.length + 2\n : columns.length + 1\n : columns.length\n }\n >\n <Empty />\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n );\n};\n","import { RiArrowDownSLine, RiLayoutColumnLine } from '@remixicon/react';\nimport { Button } from 'dgz-ui/button';\nimport {\n type DropdownContainerProps,\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from 'dgz-ui/dropdown';\nimport { cn } from 'dgz-ui/utils';\nimport { get, isEmpty } from 'lodash';\nimport { RefreshCw } from 'lucide-react';\nimport { type ReactNode, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useColumns } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { type ActionInterface, Actions, type ActionsProps } from '../actions';\nimport {\n ExportData,\n type ExportDataInterface,\n type ExportDataProps,\n} from '../export';\nimport {\n type FilterInterface,\n FilterWrapper,\n type FilterWrapperProps,\n Search,\n type SearchProps,\n} from '../filters';\nimport { Loader } from '../loader';\nimport { MyLimitSelect, MyPagination } from '../pagination';\nimport type { MyPaginationProps } from '../pagination/MyPagination.tsx';\nimport { MyTable, type MyTableProps } from './MyTable';\n\n/**\n * Minimal pagination wrapper contract used by `DataTable`.\n *\n * Notes\n * - Only `page`, `limit`, and `totalPages` are required. Other fields are optional and\n * may be provided by your API for convenience.\n * - The actual rows array can be stored in any key, controlled via `dataKey` prop\n * (defaults to `\"docs\"`).\n */\nexport interface PaginationInterface<TData> {\n /** Array of rows for the current page. Used when `dataKey` is set to `\"docs\"`. */\n docs?: TData[];\n /** Zero-based index of the first item on the current page (if provided by API). */\n offset?: number;\n /** Page size (items per page). */\n limit: number;\n /** Total number of pages available. */\n totalPages: number;\n /** Total number of items across all pages (if available). */\n total?: number;\n /** Current page number (1-based). */\n page: number;\n /** Convenience counter for the first item index on the page (if provided). */\n pagingCounter?: number;\n /** Whether a previous page exists. */\n hasPrevPage?: boolean;\n /** Whether a next page exists. */\n hasNextPage?: boolean;\n /** Previous page number, if available. */\n prevPage?: number;\n /** Next page number, if available. */\n nextPage?: number;\n}\n\n/**\n * Props for the DataTable component.\n *\n * @template TData - Row data type.\n * @template TPaginationData - Pagination wrapper type.\n */\nexport interface DataTableProps<\n TData,\n TPaginationData extends PaginationInterface<TData>,\n> extends Omit<MyTableProps<TData>, 'rows'> {\n /** Pagination data source. */\n dataSource?: TPaginationData;\n /** Callback for parameter changes (pagination, sorting, filtering). */\n onParamChange?: (param: Record<string, unknown>) => void;\n /** Whether to enable pagination. */\n hasPagination?: true;\n /** Options for the export data dropdown. */\n exportOptions?: ExportDataInterface[];\n /** Whether to enable search functionality. */\n hasSearch?: true;\n /** Whether the table data is loading. */\n loading?: boolean;\n /** Array of filters to display. */\n filters?: FilterInterface[];\n /** Array of actions to display. */\n actions?: ActionInterface[];\n /** Callback for filter changes. */\n handleFilterChange?: (filters: Record<string, unknown>) => void;\n /** Unique key for the table, used for column persistence. */\n tableKey: string;\n /** The key in dataSource where the data array is located. Defaults to \"docs\". */\n dataKey?: keyof TPaginationData;\n /** Whether to show the columns visibility dropdown. */\n hasColumnsVisibilityDropdown?: true;\n /** Callback when columns are updated (e.g., visibility toggled). */\n onColumnsUpdate?: (columns: ColumnType<TData>[]) => void;\n /** Whether the export action is loading. */\n exportLoading?: boolean;\n /** Props for the Actions component. */\n actionProps?: Partial<ActionsProps>;\n /** Props for the FilterWrapper component. */\n filterWrapperProps?: Partial<FilterWrapperProps>;\n /** Props for the ExportData component. */\n exportOptionsProps?: Partial<ExportDataProps>;\n searchProps?: Partial<SearchProps>;\n paginationProps?: Partial<MyPaginationProps>;\n /** Props for the columns visibility dropdown. */\n columnsVisibilityProps?: DropdownContainerProps & {\n title?: ReactNode;\n resetText?: ReactNode;\n };\n}\n\n/**\n * DataTable is a composable, high-level table that brings together search, filters,\n * column visibility management, header actions, exporting, and pagination.\n * It renders `MyTable` for rows and, when enabled, shows header controls and a footer with pagination.\n *\n * Generic Types\n * - `TData` — Row data shape (type of each item in the rows array).\n * - `TPaginationData` — Pagination wrapper type containing rows and pagination meta; defaults to\n * `PaginationInterface<TData>`.\n *\n * Key Behaviors\n * - Emits `onParamChange` when search text, filters, page, limit, or sort order change.\n * - Persists column visibility per `tableKey` via `useColumns` and informs parent with `onColumnsUpdate`.\n * - Renders header controls only when the related feature is enabled/has content.\n *\n * Props Overview\n * - `dataSource` — Paginated data source object that contains rows (see `dataKey`) and pagination metadata.\n * - `columns` — Column definitions passed to `MyTable`.\n * - `onRowClick` — Callback when a row is clicked.\n * - `rowKey` — Property name used as a unique row key.\n * - `hasNumbers` — Whether to show the row numbers column.\n * - `hasSearch` — Set to `true` to display the search input in the header.\n * - `exportOptions` — Export menu options shown by `ExportData` (see `ExportDataInterface[]`).\n * - `exportLoading` — When `true`, shows a spinner in the Export button to indicate an export action is in progress.\n * - `hasCheckbox` — Whether to show the selection checkbox column.\n * - `hasPagination` — Set to `true` to render the pagination footer.\n * - `isStickyHeader` — Whether to keep the table header sticky.\n * - `onParamChange` — Emits parameter changes for pagination/sorting/search/filters.\n * - `dataKey` — Key within `dataSource` that contains the row array. Defaults to `\"docs\"`.\n * - `loading` — If `true`, shows a loading state instead of the table rows.\n * - `tableKey` — Unique key for persisting column visibility state.\n * - `filters` — Filter configurations to render in the header.\n * - `actions` — Header actions independent of selected rows.\n * - `handleFilterChange` — Callback executed when filter values change.\n * - `params` — Current list parameters (pagination, sort, search, filters).\n * - `hasColumnsVisibilityDropdown` — Set to `true` to show the columns customize dropdown.\n * - `onColumnsUpdate` — Notifies parent whenever the internal columns state changes (after formatting/visibility).\n * - `actionProps` — Props passed to the `Actions` component.\n * - `filterWrapperProps` — Props passed to the `FilterWrapper` component.\n * - `exportOptionsProps` — Props passed to the `ExportData` component.\n * - `columnsVisibilityProps` — Props passed to the columns visibility dropdown.\n * - `onSelectedItemsChange` — Callback when selected rows change (requires `hasCheckbox`).\n *\n * Accessibility\n * - Header controls and dropdowns reuse shared primitives that include keyboard and ARIA support.\n *\n * Internationalization\n * - Text such as \"Export\", \"Customize columns\", and \"Reset columns\" are resolved via `react-i18next`.\n *\n * Usage Examples\n * 1) Minimal paginated table (uses default `dataKey = \"docs\"`)\n * ```tsx\n * type User = { id: string; name: string };\n * const data = { docs: [{ id: '1', name: 'Ada' }], page: 1, limit: 10, totalPages: 1 };\n *\n * <DataTable<User>\n * tableKey=\"users-table\"\n * columns={[{ key: 'name', name: 'Name' }]}\n * rowKey=\"id\"\n * dataSource={data}\n * hasPagination\n * />\n * ```\n *\n * 2) Custom `dataKey` and column visibility persistence\n * ```tsx\n * type Row = { id: number; title: string };\n * const payload = { items: [{ id: 1, title: 'Hello' }], page: 1, limit: 20, totalPages: 1 };\n *\n * <DataTable<Row>\n * tableKey=\"posts\"\n * columns={[{ key: 'title', name: 'Title' }]}\n * rowKey=\"id\"\n * dataSource={payload}\n * dataKey=\"items\"\n * hasColumnsVisibilityDropdown\n * />\n * ```\n *\n * 3) Responding to user interactions via `onParamChange`\n * ```tsx\n * const [params, setParams] = useState({ page: 1, limit: 10 });\n *\n * <DataTable\n * tableKey=\"logs\"\n * columns={[{ key: 'message', name: 'Message' }]}\n * rowKey=\"id\"\n * params={params}\n * onParamChange={setParams}\n * hasSearch\n * hasPagination\n * />\n * ```\n *\n * Notes and Best Practices\n * - Ensure `rowKey` points to a stable unique field in `TData` to avoid key collisions.\n * - When arrays like `exportOptions`, `filters`, or `actions` are empty, their sections are not rendered.\n * - Sorting emits `{ sortField, sortOrder }` through `onParamChange` when the user toggles a column sort.\n *\n * Returns\n * - React element that renders a complete data table experience.\n */\nexport const DataTable = <\n TData,\n TPaginationData extends PaginationInterface<TData> =\n PaginationInterface<TData>,\n>({\n dataSource,\n columns,\n onRowClick,\n rowKey,\n hasNumbers,\n hasSearch,\n exportOptions,\n hasCheckbox,\n hasPagination,\n isStickyHeader,\n onParamChange,\n dataKey = 'docs',\n loading,\n tableKey,\n filters,\n actions,\n handleFilterChange,\n params,\n exportLoading = false,\n onColumnsUpdate,\n hasColumnsVisibilityDropdown,\n onSelectedItemsChange,\n actionProps,\n filterWrapperProps,\n exportOptionsProps,\n columnsVisibilityProps,\n paginationProps,\n searchProps,\n ...props\n}: DataTableProps<TData, TPaginationData>) => {\n const { t } = useTranslation();\n const [selectedRows, setSelectedRows] = useState<TData[keyof TData][]>([]);\n const { formattedColumns, handleColumnsChange, resetColumns } =\n useColumns<TData>({ key: tableKey, columns });\n\n useEffect(() => {\n onColumnsUpdate?.(formattedColumns);\n }, [formattedColumns, onColumnsUpdate]);\n\n useEffect(() => {\n onSelectedItemsChange?.(selectedRows);\n }, [selectedRows, onSelectedItemsChange]);\n\n return (\n <div\n className={\n 'border-border-alpha-light flex grow flex-col overflow-auto rounded-xl border shadow-xs'\n }\n >\n {(hasSearch ||\n (hasColumnsVisibilityDropdown && tableKey) ||\n !isEmpty(exportOptions) ||\n !isEmpty(filters)) && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className={'w-full shrink'}>\n {hasSearch && (\n <Search\n {...searchProps}\n inputProps={{\n ...searchProps?.inputProps,\n className: cn('h-8', searchProps?.inputProps?.className),\n }}\n className={cn(\n 'max-w-64 [&_button]:-top-1',\n searchProps?.className\n )}\n defaultValue={get(params, 'search', '') as string}\n onSearchChange={(search) =>\n onParamChange?.({ ...params, search, page: 1 })\n }\n />\n )}\n </div>\n <div className={'flex shrink-0 items-center justify-end gap-3'}>\n {exportOptions && (\n <ExportData\n {...exportOptionsProps}\n options={exportOptions}\n loading={exportLoading}\n />\n )}\n {hasColumnsVisibilityDropdown && tableKey && (\n <DropdownMenu>\n <DropdownMenuTrigger\n asChild\n {...columnsVisibilityProps?.triggerProps}\n >\n <Button\n variant=\"secondary\"\n size={'sm'}\n className={'ml-auto rounded-lg px-3'}\n >\n {columnsVisibilityProps?.title || (\n <>\n <RiLayoutColumnLine />{' '}\n <span className={'hidden lg:inline!'}>\n {t('Customize columns')}\n </span>\n <RiArrowDownSLine />\n </>\n )}\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n align=\"end\"\n {...columnsVisibilityProps?.contentProps}\n >\n <DropdownMenuItem\n className=\"capitalize\"\n onClick={resetColumns}\n >\n <RefreshCw />{' '}\n {columnsVisibilityProps?.resetText || t('Reset columns')}\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n {formattedColumns.map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.key}\n className=\"capitalize\"\n checked={!column.hidden}\n onCheckedChange={(value) =>\n handleColumnsChange(column, !value)\n }\n >\n {column.name}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n )}\n {actions && <Actions {...actionProps} actions={actions} />}\n {filters && (\n <FilterWrapper\n {...filterWrapperProps}\n filters={filters}\n params={params}\n onChange={handleFilterChange}\n onFilter={(filter) => {\n onParamChange?.({ ...params, ...filter, page: 1 });\n handleFilterChange?.(filter);\n }}\n />\n )}\n </div>\n </div>\n )}\n <div className={'flex flex-col overflow-auto border-y'}>\n {!loading ? (\n <MyTable<TData>\n {...props}\n params={{\n page: dataSource?.page || 1,\n limit: dataSource?.limit,\n ...params,\n }}\n rows={get(dataSource, dataKey, []) as TData[]}\n rowKey={rowKey}\n selectedItems={selectedRows}\n isStickyHeader={isStickyHeader}\n columns={formattedColumns}\n hasCheckbox={hasCheckbox}\n hasNumbers={hasNumbers}\n onRowClick={onRowClick}\n onSelectedItemsChange={setSelectedRows}\n onSortOrderChange={({ sortField, sortOrder }) => {\n onParamChange?.({ ...params, sortField, sortOrder });\n }}\n />\n ) : (\n <Loader />\n )}\n </div>\n {hasPagination && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className=\"text-sm\">\n <MyLimitSelect\n onLimitChange={(limit) =>\n onParamChange?.({ ...params, limit, page: 1 })\n }\n defaultValue={dataSource?.limit}\n />\n </div>\n <div className=\"text-muted-foreground text-sm\">\n {t('{{selectedCount}} of {{total}} row(s) selected', {\n selectedCount: selectedRows.length,\n total: dataSource?.total || 0,\n })}\n </div>\n <div>\n <MyPagination\n {...paginationProps}\n onPageChange={(page) => onParamChange?.({ ...params, page })}\n currentPage={dataSource?.page}\n totalPages={dataSource?.totalPages}\n />\n </div>\n </div>\n )}\n </div>\n );\n};\n"],"names":["MyTable","rows","columns","onRowClick","rowKey","params","DEFAULT_LIMIT","hasNumbers","hasCheckbox","selectedItems","onSelectedItemsChange","onSortOrderChange","isStickyHeader","className","props","sortObject","handleSort","useSortable","selectedRows","isRowSelected","isAllRowsSelected","handleSelectAllRows","handleSelectRow","useDataTable","useEffect","jsxs","Table","cn","jsx","TableHeader","TableRow","TableHead","Checkbox","value","column","Fragment","SortOrder","ArrowDownWideNarrow","ArrowUpWideNarrow","ArrowUpDown","TableBody","row","index","TableCell","evt","get","Empty","DataTable","dataSource","hasSearch","exportOptions","hasPagination","onParamChange","dataKey","loading","tableKey","filters","actions","handleFilterChange","exportLoading","onColumnsUpdate","hasColumnsVisibilityDropdown","actionProps","filterWrapperProps","exportOptionsProps","columnsVisibilityProps","paginationProps","searchProps","t","useTranslation","setSelectedRows","useState","formattedColumns","handleColumnsChange","resetColumns","useColumns","isEmpty","Search","_a","search","ExportData","DropdownMenu","DropdownMenuTrigger","Button","RiLayoutColumnLine","RiArrowDownSLine","DropdownMenuContent","DropdownMenuItem","RefreshCw","DropdownMenuSeparator","DropdownMenuCheckboxItem","Actions","FilterWrapper","filter","Loader","sortField","sortOrder","MyLimitSelect","limit","MyPagination","page"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../../src/components/datatable/MyTable.tsx","../../../src/components/datatable/DataTable.tsx"],"sourcesContent":["import { Checkbox } from 'dgz-ui/form';\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from 'dgz-ui/table';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport {\n ArrowDownWideNarrow,\n ArrowUpDown,\n ArrowUpWideNarrow,\n} from 'lucide-react';\nimport { type ComponentProps, useEffect } from 'react';\nimport { SortOrder } from '../../enums';\nimport { useDataTable, useSortable, type UseSortableProps } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { Empty } from '../empty';\nimport { DEFAULT_LIMIT } from '../pagination/MyLimitSelect';\n\n/**\n * Props for the MyTable component.\n * @template TData - The type of data in the table.\n */\nexport interface MyTableProps<TData> extends ComponentProps<'table'> {\n /** Array of data rows to display. */\n rows?: TData[];\n /** Column definitions. */\n columns: ColumnType<TData>[];\n /** Callback when a row is clicked. */\n onRowClick?: (row: TData) => void;\n /** Whether to show row numbers. */\n hasNumbers?: boolean;\n /** Whether to show selection checkboxes. */\n hasCheckbox?: boolean;\n /** Unique key for each row. */\n rowKey: keyof TData;\n /** Current table parameters (page, limit, sort). */\n params?: Record<string, unknown>;\n /** Total number of items (optional, often used with pagination context). */\n total?: number;\n /** Array of currently selected item keys. */\n selectedItems?: TData[keyof TData][];\n /** Callback when selected items change. */\n onSelectedItemsChange?: (selectedItems: TData[keyof TData][]) => void;\n /** Callback when sort order changes. */\n onSortOrderChange?: (\n params: Omit<UseSortableProps<TData>, 'onSortOrderChange'>\n ) => void;\n /** Whether the header should stick to the top. */\n isStickyHeader?: true;\n}\n\n/**\n * MyTable renders a generic data table with optional numbering, selection checkboxes,\n * sortable columns and sticky header. It is a presentational component and delegates\n * sorting/selection state via hooks and callbacks.\n *\n * @template TData - The row data type.\n * @param props - Component props.\n * @returns React element containing the table.\n */\nexport const MyTable = <TData,>({\n rows = [],\n columns,\n onRowClick,\n rowKey,\n params = {\n page: 1,\n limit: DEFAULT_LIMIT,\n },\n hasNumbers = false,\n hasCheckbox = false,\n selectedItems,\n onSelectedItemsChange,\n onSortOrderChange,\n isStickyHeader,\n className,\n ...props\n}: MyTableProps<TData>) => {\n const { sortObject, handleSort } = useSortable<TData>({\n sortField: params?.sortField as keyof TData | undefined,\n sortOrder: params?.sortOrder as SortOrder | undefined,\n onSortOrderChange,\n });\n const {\n selectedRows,\n isRowSelected,\n isAllRowsSelected,\n handleSelectAllRows,\n handleSelectRow,\n } = useDataTable<TData>({ rows, defaultSelectedRows: selectedItems });\n\n useEffect(() => {\n if (\n JSON.stringify(selectedItems) !== JSON.stringify(selectedRows) &&\n selectedRows\n ) {\n onSelectedItemsChange?.(selectedRows);\n }\n }, [selectedRows, selectedItems, onSelectedItemsChange]);\n\n return (\n <Table {...props} className={cn('relative', className)}>\n <TableHeader\n className={cn('bg-bg', isStickyHeader && 'sticky top-0 z-1')}\n >\n <TableRow>\n {hasCheckbox && (\n <TableHead className={'w-12 p-3'}>\n <Checkbox\n className={'mt-1'}\n checked={isAllRowsSelected(rowKey)}\n onCheckedChange={(value) =>\n handleSelectAllRows(rowKey, !!value)\n }\n aria-label=\"Select all\"\n />\n </TableHead>\n )}\n {hasNumbers && <TableHead className={'w-12 p-2'}>#</TableHead>}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableHead\n key={column.key}\n style={column.styles}\n className={cn('p-2', column.sortable && 'cursor-pointer')}\n onClick={() => column.sortable && handleSort(column.dataIndex)}\n >\n <div className={'flex items-center gap-2'}>\n {column.name}{' '}\n {column.sortable &&\n (sortObject?.sortField === column.key ? (\n <>\n {sortObject?.sortOrder === SortOrder.DESC && (\n <ArrowDownWideNarrow size={15} />\n )}\n {sortObject?.sortOrder === SortOrder.ASC && (\n <ArrowUpWideNarrow size={15} />\n )}\n </>\n ) : (\n <ArrowUpDown size={15} />\n ))}\n </div>\n </TableHead>\n ))}\n </TableRow>\n </TableHeader>\n <TableBody className={'[&>tr:nth-child(even)]:bg-bg-secondary'}>\n {rows.length ? (\n rows.map((row, index) => (\n <TableRow\n key={`${row[rowKey]}`}\n onClick={() => onRowClick?.(row)}\n className={cn(onRowClick && 'cursor-pointer')}\n data-state={isRowSelected(row[rowKey]) && 'selected'}\n >\n {hasCheckbox && (\n <TableCell\n className={'w-12 p-3'}\n onClick={(evt) => evt.stopPropagation()}\n >\n <Checkbox\n className={'mt-1'}\n checked={isRowSelected(row[rowKey])}\n onCheckedChange={(value) =>\n handleSelectRow(row[rowKey], !!value)\n }\n aria-label=\"Select row\"\n />\n </TableCell>\n )}\n {hasNumbers && (\n <TableCell className={'w-12 p-2'}>\n {((params.page as number) - 1) *\n ((params.limit || DEFAULT_LIMIT) as number) +\n index +\n 1}\n </TableCell>\n )}\n {columns\n .filter((column) => !column.hidden)\n .map((column) => (\n <TableCell\n className={'text-body-xs-medium max-w-xs p-2'}\n style={column.styles}\n key={`${index}-${column.key}`}\n >\n {column.render\n ? column.render(get(row, column.dataIndex), row)\n : get(row, column.dataIndex, '')}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={\n hasNumbers\n ? hasCheckbox\n ? columns.length + 2\n : columns.length + 1\n : columns.length\n }\n >\n <Empty />\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n );\n};\n","import { RiArrowDownSLine, RiLayoutColumnLine } from '@remixicon/react';\nimport { Button } from 'dgz-ui/button';\nimport {\n type DropdownContainerProps,\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from 'dgz-ui/dropdown';\nimport { cn } from 'dgz-ui/utils';\nimport { get, isEmpty } from 'lodash';\nimport { RefreshCw } from 'lucide-react';\nimport { type ReactNode, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useColumns } from '../../hooks';\nimport type { ColumnType } from '../../types';\nimport { type ActionInterface, Actions, type ActionsProps } from '../actions';\nimport {\n ExportData,\n type ExportDataInterface,\n type ExportDataProps,\n} from '../export';\nimport {\n type FilterInterface,\n FilterWrapper,\n type FilterWrapperProps,\n Search,\n type SearchProps,\n} from '../filters';\nimport { Loader } from '../loader';\nimport { MyLimitSelect, MyPagination } from '../pagination';\nimport type { MyPaginationProps } from '../pagination/MyPagination.tsx';\nimport { MyTable, type MyTableProps } from './MyTable';\n\n/**\n * Minimal pagination wrapper contract used by `DataTable`.\n *\n * Notes\n * - Only `page`, `limit`, and `totalPages` are required. Other fields are optional and\n * may be provided by your API for convenience.\n * - The actual rows array can be stored in any key, controlled via `dataKey` prop\n * (defaults to `\"docs\"`).\n */\nexport interface PaginationInterface<TData> {\n /** Array of rows for the current page. Used when `dataKey` is set to `\"docs\"`. */\n docs?: TData[];\n /** Zero-based index of the first item on the current page (if provided by API). */\n offset?: number;\n /** Page size (items per page). */\n limit: number;\n /** Total number of pages available. */\n totalPages: number;\n /** Total number of items across all pages (if available). */\n total?: number;\n /** Current page number (1-based). */\n page: number;\n /** Convenience counter for the first item index on the page (if provided). */\n pagingCounter?: number;\n /** Whether a previous page exists. */\n hasPrevPage?: boolean;\n /** Whether a next page exists. */\n hasNextPage?: boolean;\n /** Previous page number, if available. */\n prevPage?: number;\n /** Next page number, if available. */\n nextPage?: number;\n}\n\n/**\n * Props for the DataTable component.\n *\n * @template TData - Row data type.\n * @template TPaginationData - Pagination wrapper type.\n */\nexport interface DataTableProps<\n TData,\n TPaginationData extends PaginationInterface<TData>,\n> extends Omit<MyTableProps<TData>, 'rows'> {\n /** Pagination data source. */\n dataSource?: TPaginationData;\n /** Callback for parameter changes (pagination, sorting, filtering). */\n onParamChange?: (param: Record<string, unknown>) => void;\n /** Whether to enable pagination. */\n hasPagination?: true;\n /** Options for the export data dropdown. */\n exportOptions?: ExportDataInterface[];\n /** Whether to enable search functionality. */\n hasSearch?: true;\n /** Whether the table data is loading. */\n loading?: boolean;\n /** Array of filters to display. */\n filters?: FilterInterface[];\n /** Array of actions to display. */\n actions?: ActionInterface[];\n /** Callback for filter changes. */\n handleFilterChange?: (filters: Record<string, unknown>) => void;\n /** Unique key for the table, used for column persistence. */\n tableKey: string;\n /** The key in dataSource where the data array is located. Defaults to \"docs\". */\n dataKey?: keyof TPaginationData;\n /** Whether to show the columns visibility dropdown. */\n hasColumnsVisibilityDropdown?: true;\n /** Callback when columns are updated (e.g., visibility toggled). */\n onColumnsUpdate?: (columns: ColumnType<TData>[]) => void;\n /** Whether the export action is loading. */\n exportLoading?: boolean;\n /** Props for the Actions component. */\n actionProps?: Partial<ActionsProps>;\n /** Props for the FilterWrapper component. */\n filterWrapperProps?: Partial<FilterWrapperProps>;\n /** Props for the ExportData component. */\n exportOptionsProps?: Partial<ExportDataProps>;\n searchProps?: Partial<SearchProps>;\n paginationProps?: Partial<MyPaginationProps>;\n /** Props for the columns visibility dropdown. */\n columnsVisibilityProps?: DropdownContainerProps & {\n title?: ReactNode;\n resetText?: ReactNode;\n };\n}\n\n/**\n * DataTable is a composable, high-level table that brings together search, filters,\n * column visibility management, header actions, exporting, and pagination.\n * It renders `MyTable` for rows and, when enabled, shows header controls and a footer with pagination.\n *\n * Generic Types\n * - `TData` — Row data shape (type of each item in the rows array).\n * - `TPaginationData` — Pagination wrapper type containing rows and pagination meta; defaults to\n * `PaginationInterface<TData>`.\n *\n * Key Behaviors\n * - Emits `onParamChange` when search text, filters, page, limit, or sort order change.\n * - Persists column visibility per `tableKey` via `useColumns` and informs parent with `onColumnsUpdate`.\n * - Renders header controls only when the related feature is enabled/has content.\n *\n * Props Overview\n * - `dataSource` — Paginated data source object that contains rows (see `dataKey`) and pagination metadata.\n * - `columns` — Column definitions passed to `MyTable`.\n * - `onRowClick` — Callback when a row is clicked.\n * - `rowKey` — Property name used as a unique row key.\n * - `hasNumbers` — Whether to show the row numbers column.\n * - `hasSearch` — Set to `true` to display the search input in the header.\n * - `exportOptions` — Export menu options shown by `ExportData` (see `ExportDataInterface[]`).\n * - `exportLoading` — When `true`, shows a spinner in the Export button to indicate an export action is in progress.\n * - `hasCheckbox` — Whether to show the selection checkbox column.\n * - `hasPagination` — Set to `true` to render the pagination footer.\n * - `isStickyHeader` — Whether to keep the table header sticky.\n * - `onParamChange` — Emits parameter changes for pagination/sorting/search/filters.\n * - `dataKey` — Key within `dataSource` that contains the row array. Defaults to `\"docs\"`.\n * - `loading` — If `true`, shows a loading state instead of the table rows.\n * - `tableKey` — Unique key for persisting column visibility state.\n * - `filters` — Filter configurations to render in the header.\n * - `actions` — Header actions independent of selected rows.\n * - `handleFilterChange` — Callback executed when filter values change.\n * - `params` — Current list parameters (pagination, sort, search, filters).\n * - `hasColumnsVisibilityDropdown` — Set to `true` to show the columns customize dropdown.\n * - `onColumnsUpdate` — Notifies parent whenever the internal columns state changes (after formatting/visibility).\n * - `actionProps` — Props passed to the `Actions` component.\n * - `filterWrapperProps` — Props passed to the `FilterWrapper` component.\n * - `exportOptionsProps` — Props passed to the `ExportData` component.\n * - `columnsVisibilityProps` — Props passed to the columns visibility dropdown.\n * - `onSelectedItemsChange` — Callback when selected rows change (requires `hasCheckbox`).\n *\n * Accessibility\n * - Header controls and dropdowns reuse shared primitives that include keyboard and ARIA support.\n *\n * Internationalization\n * - Text such as \"Export\", \"Customize columns\", and \"Reset columns\" are resolved via `react-i18next`.\n *\n * Usage Examples\n * 1) Minimal paginated table (uses default `dataKey = \"docs\"`)\n * ```tsx\n * type User = { id: string; name: string };\n * const data = { docs: [{ id: '1', name: 'Ada' }], page: 1, limit: 10, totalPages: 1 };\n *\n * <DataTable<User>\n * tableKey=\"users-table\"\n * columns={[{ key: 'name', name: 'Name' }]}\n * rowKey=\"id\"\n * dataSource={data}\n * hasPagination\n * />\n * ```\n *\n * 2) Custom `dataKey` and column visibility persistence\n * ```tsx\n * type Row = { id: number; title: string };\n * const payload = { items: [{ id: 1, title: 'Hello' }], page: 1, limit: 20, totalPages: 1 };\n *\n * <DataTable<Row>\n * tableKey=\"posts\"\n * columns={[{ key: 'title', name: 'Title' }]}\n * rowKey=\"id\"\n * dataSource={payload}\n * dataKey=\"items\"\n * hasColumnsVisibilityDropdown\n * />\n * ```\n *\n * 3) Responding to user interactions via `onParamChange`\n * ```tsx\n * const [params, setParams] = useState({ page: 1, limit: 10 });\n *\n * <DataTable\n * tableKey=\"logs\"\n * columns={[{ key: 'message', name: 'Message' }]}\n * rowKey=\"id\"\n * params={params}\n * onParamChange={setParams}\n * hasSearch\n * hasPagination\n * />\n * ```\n *\n * Notes and Best Practices\n * - Ensure `rowKey` points to a stable unique field in `TData` to avoid key collisions.\n * - When arrays like `exportOptions`, `filters`, or `actions` are empty, their sections are not rendered.\n * - Sorting emits `{ sortField, sortOrder }` through `onParamChange` when the user toggles a column sort.\n *\n * Returns\n * - React element that renders a complete data table experience.\n */\nexport const DataTable = <\n TData,\n TPaginationData extends PaginationInterface<TData> =\n PaginationInterface<TData>,\n>({\n dataSource,\n columns,\n onRowClick,\n rowKey,\n hasNumbers,\n hasSearch,\n exportOptions,\n hasCheckbox,\n hasPagination,\n isStickyHeader,\n onParamChange,\n dataKey = 'docs',\n loading,\n tableKey,\n filters,\n actions,\n handleFilterChange,\n params,\n exportLoading = false,\n onColumnsUpdate,\n hasColumnsVisibilityDropdown,\n onSelectedItemsChange,\n actionProps,\n filterWrapperProps,\n exportOptionsProps,\n columnsVisibilityProps,\n paginationProps,\n searchProps,\n ...props\n}: DataTableProps<TData, TPaginationData>) => {\n const { t } = useTranslation();\n const [selectedRows, setSelectedRows] = useState<TData[keyof TData][]>([]);\n const { formattedColumns, handleColumnsChange, resetColumns } =\n useColumns<TData>({ key: tableKey, columns });\n\n useEffect(() => {\n onColumnsUpdate?.(formattedColumns);\n }, [formattedColumns, onColumnsUpdate]);\n\n useEffect(() => {\n onSelectedItemsChange?.(selectedRows);\n }, [selectedRows, onSelectedItemsChange]);\n\n return (\n <div\n className={\n 'border-border-alpha-light flex grow flex-col overflow-auto rounded-xl border shadow-xs'\n }\n >\n {(hasSearch ||\n (hasColumnsVisibilityDropdown && tableKey) ||\n !isEmpty(exportOptions) ||\n !isEmpty(filters)) && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className={'w-full shrink'}>\n {hasSearch && (\n <Search\n {...searchProps}\n inputProps={{\n ...searchProps?.inputProps,\n className: cn('h-8', searchProps?.inputProps?.className),\n }}\n className={cn(\n 'max-w-78 [&_button]:-top-1',\n searchProps?.className\n )}\n defaultValue={get(params, 'search', '') as string}\n onSearchChange={(search) =>\n onParamChange?.({ ...params, search, page: 1 })\n }\n />\n )}\n </div>\n <div className={'flex shrink-0 items-center justify-end gap-3'}>\n {exportOptions && (\n <ExportData\n {...exportOptionsProps}\n options={exportOptions}\n loading={exportLoading}\n />\n )}\n {hasColumnsVisibilityDropdown && tableKey && (\n <DropdownMenu>\n <DropdownMenuTrigger\n asChild\n {...columnsVisibilityProps?.triggerProps}\n >\n <Button\n variant=\"secondary\"\n size={'sm'}\n className={'ml-auto rounded-lg px-3'}\n >\n {columnsVisibilityProps?.title || (\n <>\n <RiLayoutColumnLine />{' '}\n <span className={'hidden lg:inline!'}>\n {t('Customize columns')}\n </span>\n <RiArrowDownSLine />\n </>\n )}\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent\n align=\"end\"\n {...columnsVisibilityProps?.contentProps}\n >\n <DropdownMenuItem\n className=\"capitalize\"\n onClick={resetColumns}\n >\n <RefreshCw />{' '}\n {columnsVisibilityProps?.resetText || t('Reset columns')}\n </DropdownMenuItem>\n <DropdownMenuSeparator />\n {formattedColumns.map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.key}\n className=\"capitalize\"\n checked={!column.hidden}\n onCheckedChange={(value) =>\n handleColumnsChange(column, !value)\n }\n >\n {column.name}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n )}\n {actions && <Actions {...actionProps} actions={actions} />}\n {filters && (\n <FilterWrapper\n {...filterWrapperProps}\n filters={filters}\n params={params}\n onChange={handleFilterChange}\n onFilter={(filter) => {\n onParamChange?.({ ...params, ...filter, page: 1 });\n handleFilterChange?.(filter);\n }}\n />\n )}\n </div>\n </div>\n )}\n <div className={'flex flex-col overflow-auto border-y'}>\n {!loading ? (\n <MyTable<TData>\n {...props}\n params={{\n page: dataSource?.page || 1,\n limit: dataSource?.limit,\n ...params,\n }}\n rows={get(dataSource, dataKey, []) as TData[]}\n rowKey={rowKey}\n selectedItems={selectedRows}\n isStickyHeader={isStickyHeader}\n columns={formattedColumns}\n hasCheckbox={hasCheckbox}\n hasNumbers={hasNumbers}\n onRowClick={onRowClick}\n onSelectedItemsChange={setSelectedRows}\n onSortOrderChange={({ sortField, sortOrder }) => {\n onParamChange?.({ ...params, sortField, sortOrder });\n }}\n />\n ) : (\n <Loader />\n )}\n </div>\n {hasPagination && (\n <div className=\"flex shrink-0 flex-col items-center justify-between gap-3 p-4 lg:flex-row\">\n <div className=\"text-sm\">\n <MyLimitSelect\n onLimitChange={(limit) =>\n onParamChange?.({ ...params, limit, page: 1 })\n }\n defaultValue={dataSource?.limit}\n />\n </div>\n <div className=\"text-muted-foreground text-sm\">\n {t('{{selectedCount}} of {{total}} row(s) selected', {\n selectedCount: selectedRows.length,\n total: dataSource?.total || 0,\n })}\n </div>\n <div>\n <MyPagination\n {...paginationProps}\n onPageChange={(page) => onParamChange?.({ ...params, page })}\n currentPage={dataSource?.page}\n totalPages={dataSource?.totalPages}\n />\n </div>\n </div>\n )}\n </div>\n );\n};\n"],"names":["MyTable","rows","columns","onRowClick","rowKey","params","DEFAULT_LIMIT","hasNumbers","hasCheckbox","selectedItems","onSelectedItemsChange","onSortOrderChange","isStickyHeader","className","props","sortObject","handleSort","useSortable","selectedRows","isRowSelected","isAllRowsSelected","handleSelectAllRows","handleSelectRow","useDataTable","useEffect","jsxs","Table","cn","jsx","TableHeader","TableRow","TableHead","Checkbox","value","column","Fragment","SortOrder","ArrowDownWideNarrow","ArrowUpWideNarrow","ArrowUpDown","TableBody","row","index","TableCell","evt","get","Empty","DataTable","dataSource","hasSearch","exportOptions","hasPagination","onParamChange","dataKey","loading","tableKey","filters","actions","handleFilterChange","exportLoading","onColumnsUpdate","hasColumnsVisibilityDropdown","actionProps","filterWrapperProps","exportOptionsProps","columnsVisibilityProps","paginationProps","searchProps","t","useTranslation","setSelectedRows","useState","formattedColumns","handleColumnsChange","resetColumns","useColumns","isEmpty","Search","_a","search","ExportData","DropdownMenu","DropdownMenuTrigger","Button","RiLayoutColumnLine","RiArrowDownSLine","DropdownMenuContent","DropdownMenuItem","RefreshCw","DropdownMenuSeparator","DropdownMenuCheckboxItem","Actions","FilterWrapper","filter","Loader","sortField","sortOrder","MyLimitSelect","limit","MyPagination","page"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/form/MyCheckbox.tsx","../../../src/components/form/MyDatePicker.tsx","../../../src/components/form/MyDateRangePicker.tsx","../../../src/components/form/MyHtmlEditor.tsx","../../../src/components/form/MyMaskInput.tsx","../../../src/components/form/MyRadio.tsx","../../../src/components/form/MySwitch.tsx","../../../src/components/form/MyTextarea.tsx","../../../src/components/form/MyTimePicker.tsx"],"sourcesContent":["import {\n Checkbox,\n type CheckboxProps,\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n} from 'dgz-ui/form';\nimport { useId } from 'react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyCheckbox component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyCheckboxProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & CheckboxProps;\n\n/**\n * MyCheckbox is a checkbox component with optional react-hook-form integration.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the checkbox.\n * @param rules - The `react-hook-form` validation rules.\n * @param props - Checkbox and form item props.\n * @returns A checkbox component wrapped with form handling logic.\n */\nexport const MyCheckbox = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n ...props\n}: MyCheckboxProps<TFieldValues>) => {\n const id = useId();\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormLabel className={'block'} htmlFor={props.id || id}>\n <FormItem className=\"flex flex-row items-start gap-3\">\n <FormControl>\n <Checkbox\n id={props.id || id}\n checked={field.value}\n onCheckedChange={field.onChange}\n {...props}\n />\n </FormControl>\n <div className=\"space-y-1 leading-none\">\n {label && <div>{label}</div>}\n </div>\n </FormItem>\n </FormLabel>\n )}\n />\n )) ||\n null\n );\n};\n","import dayjs from 'dayjs';\nimport { Calendar, type CalendarProps, DATE } from 'dgz-ui/calendar';\nimport {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n Input,\n type InputProps,\n} from 'dgz-ui/form';\nimport { Popover, PopoverContent, PopoverTrigger } from 'dgz-ui/popover';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport { Calendar1 } from 'lucide-react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyDatePicker component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyDatePickerProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n Omit<CalendarProps, 'mode' | 'disabled'> & {\n /** Date format string for display. */\n format?: string;\n inputProps?: Omit<InputProps, 'onSelect'>;\n placeholder?: string;\n disabled?: boolean;\n };\n\n/**\n * MyDatePicker shows a calendar popover to pick a single date, integrated with react-hook-form.\n * Can also be used standalone when no control/name are provided.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the date picker.\n * @param required - Whether the field is required.\n * @param rules - The `react-hook-form` validation rules.\n * @param format - The date format for display.\n * @param placeholder - The placeholder text when no date selected.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param register - The `react-hook-form` register function.\n * @param disabled - Whether the date picker is disabled.\n * @param inputProps - Props passed to the underlying Input component.\n * @param props - Calendar, button and form item props.\n * @returns A date picker component integrated with react-hook-form.\n */\nexport const MyDatePicker = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n rules,\n format = DATE,\n floatingError,\n placeholder,\n disabled,\n register,\n className,\n inputProps,\n ...props\n}: MyDatePickerProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field, formState }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <Popover>\n <PopoverTrigger asChild>\n <FormControl>\n <div className={'relative'}>\n <Input\n {...inputProps}\n variant={\n get(formState.errors, `${name}.message`)\n ? 'failure'\n : 'default'\n }\n disabled={disabled}\n {...field}\n readOnly\n placeholder={placeholder || 'Pick a date'}\n value={dayjs(field.value).format(format)}\n className={cn('m-0 text-start', className)}\n />\n <Calendar1\n className={cn(\n 'text-secondary absolute top-2.5 right-2 size-5',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n </div>\n </FormControl>\n </PopoverTrigger>\n {!disabled && (\n <PopoverContent className=\"w-auto p-0\" align=\"start\">\n <Calendar\n {...props}\n mode=\"single\"\n selected={field.value}\n onSelect={field.onChange}\n />\n </PopoverContent>\n )}\n </Popover>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\nimport { DateRangePicker, type DateRangePickerProps } from '../datepicker';\n\n/**\n * Props for the MyDateRangePicker component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyDateRangePickerProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n Omit<DateRangePickerProps, 'required'> & {\n required?: boolean;\n };\n\n/**\n * MyDateRangePicker renders a date range selector integrated with react-hook-form.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the date range picker.\n * @param required - Whether the field is required.\n * @param rules - The `react-hook-form` validation rules.\n * @param format - The date format for display.\n * @param placeholder - The placeholder text when no date is selected.\n * @param props - DateRangePicker props and form item props.\n * @returns A date range picker integrated with react-hook-form.\n */\nexport const MyDateRangePicker = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n rules,\n placeholder,\n floatingError,\n ...props\n}: MyDateRangePickerProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field, formState }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <DateRangePicker\n {...props}\n error={`${get(formState.errors, name, '')}`}\n selected={field.value}\n onRangeSelected={field.onChange}\n placeholder={placeholder}\n />\n </FormControl>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n HtmlEditor,\n type HtmlEditorProps,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyHtmlEditor component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyHtmlEditorProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n HtmlEditorProps & {\n /** Whether the field is required. */\n required?: boolean;\n };\n\n/**\n * MyHtmlEditor is a rich-text HTML editor with optional react-hook-form integration.\n * Works in both controlled (with control/name) and uncontrolled modes.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the HTML editor.\n * @param rules - The `react-hook-form` validation rules.\n * @param required - Whether the field is required.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - HtmlEditor and form item props.\n * @returns React element rendering an HtmlEditor with label, helper text, and validation message.\n */\nexport const MyHtmlEditor = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n required,\n floatingError,\n ...props\n}: MyHtmlEditorProps<TFieldValues>) => {\n return name && control ? (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <HtmlEditor {...field} {...props} />\n </FormControl>\n <FormMessage className={cn(floatingError && 'absolute -bottom-5')} />\n </FormItem>\n )}\n />\n ) : (\n <HtmlEditor {...props} />\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n MaskInput,\n type MaskInputProps,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyMaskInput component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyMaskInputProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n MaskInputProps & {\n /** Whether the field is required. */\n required?: boolean;\n };\n\n/**\n * MyMaskInput is an input component with masking support and optional react-hook-form integration.\n * Works in both controlled (with control/name) and uncontrolled modes. By default it uses a space as\n * thousands separator, underscores as placeholder characters, lazy formatting disabled, and returns\n * unmasked value on change.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the mask input.\n * @param rules - The `react-hook-form` validation rules.\n * @param required - Whether the field is required.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - MaskInput and form item props.\n * @returns React element rendering a masked input with label, helper text, and validation message.\n */\nexport const MyMaskInput = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n required,\n floatingError,\n ...props\n}: MyMaskInputProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <MaskInput\n thousandsSeparator={' '}\n lazy={false}\n placeholderChar=\"_\"\n unmask\n {...field}\n {...props}\n onAccept={(value) => field.onChange(value)}\n />\n </FormControl>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n RadioGroupItem,\n} from 'dgz-ui/form';\nimport React, { useId } from 'react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\ntype RadioItemProps = React.ComponentPropsWithoutRef<typeof RadioGroupItem>;\n\n/**\n * Props for the MyRadio component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyRadioProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & RadioItemProps;\n\n/**\n * MyRadio is a radio input that can integrate with react-hook-form when control and name are provided.\n * Falls back to an uncontrolled radio item when not used inside a form.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the radio input.\n * @param rules - The `react-hook-form` validation rules.\n * @param value - The value of the radio input.\n * @param props - Radio item and form item props.\n * @returns A radio button item.\n */\nconst MyRadio = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n value,\n ...props\n}: MyRadioProps<TFieldValues>) => {\n const id = useId();\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormLabel className={'block'} htmlFor={props.id || id}>\n <FormItem className=\"flex flex-row items-start gap-3\">\n <FormControl>\n <RadioGroupItem\n id={props.id || id}\n value={value}\n checked={field.value === value}\n onClick={() => {\n if (field.value !== value) {\n field.onChange(value);\n }\n }}\n {...props}\n />\n </FormControl>\n <div className=\"space-y-1 leading-none\">\n {label && <div>{label}</div>}\n </div>\n </FormItem>\n </FormLabel>\n )}\n />\n )) ||\n null\n );\n};\n\nexport { MyRadio };\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n Switch,\n type SwitchProps,\n} from 'dgz-ui/form';\nimport { useId } from 'react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MySwitch component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MySwitchProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & SwitchProps;\n\n/**\n * MySwitch is a toggle switch with optional react-hook-form integration.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the switch.\n * @param rules - The `react-hook-form` validation rules.\n * @param props - Switch and form item props.\n */\nexport const MySwitch = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n ...props\n}: MySwitchProps<TFieldValues>) => {\n const id = useId();\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormLabel className={'block'} htmlFor={props.id || id}>\n <FormItem className=\"flex flex-row items-start gap-3\">\n <FormControl>\n <Switch\n id={props.id || id}\n className={'m-0'}\n checked={field.value}\n onCheckedChange={field.onChange}\n {...props}\n />\n </FormControl>\n <div className=\"space-y-1 leading-none\">\n {label && <div>{label}</div>}\n </div>\n </FormItem>\n </FormLabel>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n Textarea,\n type TextareaProps,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyTextarea component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyTextareaProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & TextareaProps;\n\n/**\n * MyTextarea is a textarea component with optional react-hook-form integration.\n * Supports floating error message styling.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the textarea.\n * @param required - Whether the field is required.\n * @param rules - The `react-hook-form` validation rules.\n * @param className - Custom CSS class name.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - Textarea and form item props.\n * @returns A textarea component integrated with react-hook-form.\n */\nexport const MyTextarea = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n rules,\n className,\n floatingError,\n ...props\n}: MyTextareaProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field, formState }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <Textarea\n variant={\n get(formState.errors, `${name}.message`)\n ? 'failure'\n : 'default'\n }\n {...props}\n {...field}\n className={cn(className)}\n />\n </FormControl>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import { TimePicker, type TimePickerProps } from 'dgz-ui/calendar';\nimport {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyTimePicker component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyTimePickerProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n TimePickerProps & {\n /** Whether the field is required. */\n required?: boolean;\n /** Custom CSS class name. */\n className?: string;\n };\n\n/**\n * MyTimePicker is a time selection input with optional react-hook-form integration.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the time picker.\n * @param required - Whether the field is required.\n * @param className - Custom CSS class name.\n * @param rules - The `react-hook-form` validation rules.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - TimePicker and form item props.\n * @returns A time picker component integrated with react-hook-form.\n */\nexport const MyTimePicker = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n className,\n rules,\n floatingError,\n ...props\n}: MyTimePickerProps<TFieldValues>) => {\n return name && control ? (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <TimePicker {...field} {...props} />\n </FormControl>\n <FormMessage className={cn(floatingError && 'absolute -bottom-5')} />\n </FormItem>\n )}\n />\n ) : (\n <TimePicker className={'mt-2'} {...props} />\n );\n};\n"],"names":["MyCheckbox","control","name","label","rules","props","id","useId","jsx","FormField","field","FormLabel","jsxs","FormItem","FormControl","Checkbox","MyDatePicker","required","format","DATE","floatingError","placeholder","disabled","register","className","inputProps","formState","cn","Popover","PopoverTrigger","Input","get","dayjs","Calendar1","PopoverContent","Calendar","FormMessage","MyDateRangePicker","DateRangePicker","MyHtmlEditor","HtmlEditor","MyMaskInput","MaskInput","value","MyRadio","RadioGroupItem","MySwitch","Switch","MyTextarea","Textarea","MyTimePicker","TimePicker"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../../src/components/form/MyCheckbox.tsx","../../../src/components/form/MyDatePicker.tsx","../../../src/components/form/MyDateRangePicker.tsx","../../../src/components/form/MyHtmlEditor.tsx","../../../src/components/form/MyMaskInput.tsx","../../../src/components/form/MyRadio.tsx","../../../src/components/form/MySwitch.tsx","../../../src/components/form/MyTextarea.tsx","../../../src/components/form/MyTimePicker.tsx"],"sourcesContent":["import {\n Checkbox,\n type CheckboxProps,\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n} from 'dgz-ui/form';\nimport { useId } from 'react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyCheckbox component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyCheckboxProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & CheckboxProps;\n\n/**\n * MyCheckbox is a checkbox component with optional react-hook-form integration.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the checkbox.\n * @param rules - The `react-hook-form` validation rules.\n * @param props - Checkbox and form item props.\n * @returns A checkbox component wrapped with form handling logic.\n */\nexport const MyCheckbox = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n ...props\n}: MyCheckboxProps<TFieldValues>) => {\n const id = useId();\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormLabel className={'block'} htmlFor={props.id || id}>\n <FormItem className=\"flex flex-row items-start gap-3\">\n <FormControl>\n <Checkbox\n id={props.id || id}\n checked={field.value}\n onCheckedChange={field.onChange}\n {...props}\n />\n </FormControl>\n <div className=\"space-y-1 leading-none\">\n {label && <div>{label}</div>}\n </div>\n </FormItem>\n </FormLabel>\n )}\n />\n )) ||\n null\n );\n};\n","import dayjs from 'dayjs';\nimport { Calendar, type CalendarProps, DATE } from 'dgz-ui/calendar';\nimport {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n Input,\n type InputProps,\n} from 'dgz-ui/form';\nimport { Popover, PopoverContent, PopoverTrigger } from 'dgz-ui/popover';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport { Calendar1 } from 'lucide-react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyDatePicker component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyDatePickerProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n Omit<CalendarProps, 'mode' | 'disabled'> & {\n /** Date format string for display. */\n format?: string;\n inputProps?: Omit<InputProps, 'onSelect'>;\n placeholder?: string;\n disabled?: boolean;\n };\n\n/**\n * MyDatePicker shows a calendar popover to pick a single date, integrated with react-hook-form.\n * Can also be used standalone when no control/name are provided.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the date picker.\n * @param required - Whether the field is required.\n * @param rules - The `react-hook-form` validation rules.\n * @param format - The date format for display.\n * @param placeholder - The placeholder text when no date selected.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param register - The `react-hook-form` register function.\n * @param disabled - Whether the date picker is disabled.\n * @param inputProps - Props passed to the underlying Input component.\n * @param props - Calendar, button and form item props.\n * @returns A date picker component integrated with react-hook-form.\n */\nexport const MyDatePicker = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n rules,\n format = DATE,\n floatingError,\n placeholder,\n disabled,\n register,\n className,\n inputProps,\n ...props\n}: MyDatePickerProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field, formState }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <Popover>\n <PopoverTrigger asChild>\n <FormControl>\n <div className={'relative'}>\n <Input\n {...inputProps}\n variant={\n get(formState.errors, `${name}.message`)\n ? 'failure'\n : 'default'\n }\n disabled={disabled}\n {...field}\n readOnly\n placeholder={placeholder || 'Pick a date'}\n value={dayjs(field.value).format(format)}\n className={cn('m-0 text-start', className)}\n />\n <Calendar1\n className={cn(\n 'text-secondary absolute top-2.5 right-2 size-5',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n </div>\n </FormControl>\n </PopoverTrigger>\n {!disabled && (\n <PopoverContent className=\"w-auto p-0\" align=\"start\">\n <Calendar\n {...props}\n mode=\"single\"\n selected={field.value}\n onSelect={field.onChange}\n />\n </PopoverContent>\n )}\n </Popover>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\nimport { DateRangePicker, type DateRangePickerProps } from '../datepicker';\n\n/**\n * Props for the MyDateRangePicker component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyDateRangePickerProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n Omit<DateRangePickerProps, 'required'> & {\n required?: boolean;\n };\n\n/**\n * MyDateRangePicker renders a date range selector integrated with react-hook-form.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the date range picker.\n * @param required - Whether the field is required.\n * @param rules - The `react-hook-form` validation rules.\n * @param format - The date format for display.\n * @param placeholder - The placeholder text when no date is selected.\n * @param props - DateRangePicker props and form item props.\n * @returns A date range picker integrated with react-hook-form.\n */\nexport const MyDateRangePicker = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n rules,\n placeholder,\n floatingError,\n ...props\n}: MyDateRangePickerProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field, formState }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <DateRangePicker\n {...props}\n error={`${get(formState.errors, name, '')}`}\n selected={field.value}\n onRangeSelected={field.onChange}\n placeholder={placeholder}\n />\n </FormControl>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n HtmlEditor,\n type HtmlEditorProps,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyHtmlEditor component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyHtmlEditorProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n HtmlEditorProps & {\n /** Whether the field is required. */\n required?: boolean;\n };\n\n/**\n * MyHtmlEditor is a rich-text HTML editor with optional react-hook-form integration.\n * Works in both controlled (with control/name) and uncontrolled modes.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the HTML editor.\n * @param rules - The `react-hook-form` validation rules.\n * @param required - Whether the field is required.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - HtmlEditor and form item props.\n * @returns React element rendering an HtmlEditor with label, helper text, and validation message.\n */\nexport const MyHtmlEditor = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n required,\n floatingError,\n ...props\n}: MyHtmlEditorProps<TFieldValues>) => {\n return name && control ? (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <HtmlEditor {...field} {...props} />\n </FormControl>\n <FormMessage className={cn(floatingError && 'absolute -bottom-5')} />\n </FormItem>\n )}\n />\n ) : (\n <HtmlEditor {...props} />\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n MaskInput,\n type MaskInputProps,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyMaskInput component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyMaskInputProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n MaskInputProps & {\n /** Whether the field is required. */\n required?: boolean;\n };\n\n/**\n * MyMaskInput is an input component with masking support and optional react-hook-form integration.\n * Works in both controlled (with control/name) and uncontrolled modes. By default it uses a space as\n * thousands separator, underscores as placeholder characters, lazy formatting disabled, and returns\n * unmasked value on change.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the mask input.\n * @param rules - The `react-hook-form` validation rules.\n * @param required - Whether the field is required.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - MaskInput and form item props.\n * @returns React element rendering a masked input with label, helper text, and validation message.\n */\nexport const MyMaskInput = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n required,\n floatingError,\n ...props\n}: MyMaskInputProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <MaskInput\n thousandsSeparator={' '}\n lazy={false}\n placeholderChar=\"_\"\n unmask\n {...field}\n {...props}\n onAccept={(value) => field.onChange(value)}\n />\n </FormControl>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n RadioGroupItem,\n} from 'dgz-ui/form';\nimport React, { useId } from 'react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\ntype RadioItemProps = React.ComponentPropsWithoutRef<typeof RadioGroupItem>;\n\n/**\n * Props for the MyRadio component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyRadioProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & RadioItemProps;\n\n/**\n * MyRadio is a radio input that can integrate with react-hook-form when control and name are provided.\n * Falls back to an uncontrolled radio item when not used inside a form.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the radio input.\n * @param rules - The `react-hook-form` validation rules.\n * @param value - The value of the radio input.\n * @param props - Radio item and form item props.\n * @returns A radio button item.\n */\nconst MyRadio = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n value,\n ...props\n}: MyRadioProps<TFieldValues>) => {\n const id = useId();\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormLabel className={'block'} htmlFor={props.id || id}>\n <FormItem className=\"flex flex-row items-start gap-3\">\n <FormControl>\n <RadioGroupItem\n id={props.id || id}\n value={value}\n checked={field.value === value}\n onClick={() => {\n if (field.value !== value) {\n field.onChange(value);\n }\n }}\n {...props}\n />\n </FormControl>\n <div className=\"space-y-1 leading-none\">\n {label && <div>{label}</div>}\n </div>\n </FormItem>\n </FormLabel>\n )}\n />\n )) ||\n null\n );\n};\n\nexport { MyRadio };\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n Switch,\n type SwitchProps,\n} from 'dgz-ui/form';\nimport { useId } from 'react';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MySwitch component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MySwitchProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & SwitchProps;\n\n/**\n * MySwitch is a toggle switch with optional react-hook-form integration.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the switch.\n * @param rules - The `react-hook-form` validation rules.\n * @param props - Switch and form item props.\n * @returns A toggle switch component, or null if name or control are missing.\n */\nexport const MySwitch = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n rules,\n ...props\n}: MySwitchProps<TFieldValues>) => {\n const id = useId();\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormLabel className={'block'} htmlFor={props.id || id}>\n <FormItem className=\"flex flex-row items-start gap-3\">\n <FormControl>\n <Switch\n id={props.id || id}\n className={'m-0'}\n checked={field.value}\n onCheckedChange={field.onChange}\n {...props}\n />\n </FormControl>\n <div className=\"space-y-1 leading-none\">\n {label && <div>{label}</div>}\n </div>\n </FormItem>\n </FormLabel>\n )}\n />\n )) ||\n null\n );\n};\n","import {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n Textarea,\n type TextareaProps,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport { get } from 'lodash';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyTextarea component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyTextareaProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> & TextareaProps;\n\n/**\n * MyTextarea is a textarea component with optional react-hook-form integration.\n * Supports floating error message styling.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the textarea.\n * @param required - Whether the field is required.\n * @param rules - The `react-hook-form` validation rules.\n * @param className - Custom CSS class name.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - Textarea and form item props.\n * @returns A textarea component integrated with react-hook-form.\n */\nexport const MyTextarea = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n rules,\n className,\n floatingError,\n ...props\n}: MyTextareaProps<TFieldValues>) => {\n return (\n (name && control && (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field, formState }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <Textarea\n variant={\n get(formState.errors, `${name}.message`)\n ? 'failure'\n : 'default'\n }\n {...props}\n {...field}\n className={cn(className)}\n />\n </FormControl>\n <FormMessage\n className={cn(floatingError && 'absolute -bottom-5')}\n />\n </FormItem>\n )}\n />\n )) ||\n null\n );\n};\n","import { TimePicker, type TimePickerProps } from 'dgz-ui/calendar';\nimport {\n FormControl,\n FormField,\n FormItem,\n type FormItemProps,\n FormLabel,\n FormMessage,\n} from 'dgz-ui/form';\nimport { cn } from 'dgz-ui/utils';\nimport type { FieldPath, FieldValues } from 'react-hook-form';\n\n/**\n * Props for the MyTimePicker component.\n * @template TFieldValues - The type of the form values.\n */\nexport type MyTimePickerProps<TFieldValues extends FieldValues> =\n FormItemProps<TFieldValues> &\n TimePickerProps & {\n /** Whether the field is required. */\n required?: boolean;\n /** Custom CSS class name. */\n className?: string;\n };\n\n/**\n * MyTimePicker is a time selection input with optional react-hook-form integration.\n *\n * @template TFieldValues - Form values type used by react-hook-form.\n * @param control - The `react-hook-form` control object.\n * @param name - The name of the field in `react-hook-form`.\n * @param label - The label to display for the time picker.\n * @param required - Whether the field is required.\n * @param className - Custom CSS class name.\n * @param rules - The `react-hook-form` validation rules.\n * @param floatingError - Whether to show the error message in a floating container.\n * @param props - TimePicker and form item props.\n * @returns A time picker component integrated with react-hook-form.\n */\nexport const MyTimePicker = <TFieldValues extends FieldValues>({\n control,\n name,\n label,\n required,\n className,\n rules,\n floatingError,\n ...props\n}: MyTimePickerProps<TFieldValues>) => {\n return name && control ? (\n <FormField<TFieldValues, FieldPath<TFieldValues>>\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <FormItem className={cn(floatingError && 'space-y-0')}>\n {label && (\n <FormLabel className={'block'}>\n {label} {required && <span className={'text-red-600'}>*</span>}\n </FormLabel>\n )}\n <FormControl>\n <TimePicker {...field} {...props} />\n </FormControl>\n <FormMessage className={cn(floatingError && 'absolute -bottom-5')} />\n </FormItem>\n )}\n />\n ) : (\n <TimePicker className={'mt-2'} {...props} />\n );\n};\n"],"names":["MyCheckbox","control","name","label","rules","props","id","useId","jsx","FormField","field","FormLabel","jsxs","FormItem","FormControl","Checkbox","MyDatePicker","required","format","DATE","floatingError","placeholder","disabled","register","className","inputProps","formState","cn","Popover","PopoverTrigger","Input","get","dayjs","Calendar1","PopoverContent","Calendar","FormMessage","MyDateRangePicker","DateRangePicker","MyHtmlEditor","HtmlEditor","MyMaskInput","MaskInput","value","MyRadio","RadioGroupItem","MySwitch","Switch","MyTextarea","Textarea","MyTimePicker","TimePicker"],"mappings":"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"}
|