dawn-ui-react 1.0.0-beta.3 → 1.0.0-beta.4

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.
Files changed (8) hide show
  1. package/dist/components/table/table-context.d.ts +14 -5
  2. package/dist/components/table/table-header.d.ts +1 -1
  3. package/dist/components/table/table-view-mode-toggle.d.ts +2 -0
  4. package/dist/components/table/table.types.d.ts +20 -2
  5. package/dist/components/table/table.utils.d.ts +14 -1
  6. package/dist/dawn-ui-react.js +3102 -3073
  7. package/dist/dawn-ui-react.umd.cjs +3 -3
  8. package/package.json +1 -1
package/dist/components/table/table-context.d.ts CHANGED
@@ -8,6 +8,7 @@ export declare const features: {
8
8
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
9
9
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
10
10
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
11
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
11
12
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
12
13
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
13
14
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
@@ -55,6 +56,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
55
56
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
56
57
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
57
58
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
59
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
58
60
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
59
61
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
60
62
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
@@ -101,7 +103,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
101
103
  readonly TableTextCell: ({ className, children, ref, ...props }: import('./table.types').TableTextCellProps) => import("react").JSX.Element;
102
104
  }, {
103
105
  readonly TableSelectHeader: ({ className, children, ref, ...props }: import('./table.types').TableSelectHeaderProps) => import("react").JSX.Element;
104
- }>, useAppTable: <TData extends import('@tanstack/react-table').RowData, TSelected = import('@tanstack/react-table').TableState_ColumnFiltering & import('@tanstack/react-table').TableState_ColumnSizing & import('@tanstack/react-table').TableState_ColumnVisibility & import('@tanstack/react-table').TableState_GlobalFiltering & import('@tanstack/react-table').TableState_RowPagination & import('@tanstack/react-table').TableState_RowSelection & import('@tanstack/react-table').TableState_RowSorting>(tableOptions: Omit<import('@tanstack/react-table').TableOptions<{
106
+ }>, useAppTable: <TData extends import('@tanstack/react-table').RowData, TSelected = import('@tanstack/react-table').TableState_ColumnFiltering & import('@tanstack/react-table').TableState_ColumnSizing & import('@tanstack/react-table').TableState_ColumnVisibility & import('@tanstack/react-table').TableState_GlobalFiltering & import('@tanstack/react-table').TableState_RowPagination & import('@tanstack/react-table').TableState_RowSelection & import('@tanstack/react-table').TableState_RowSorting & import('./table.utils').TableState_ViewMode>(tableOptions: Omit<import('@tanstack/react-table').TableOptions<{
105
107
  columnFacetingFeature: import('@tanstack/react-table').TableFeature;
106
108
  columnFilteringFeature: import('@tanstack/react-table').TableFeature;
107
109
  columnSizingFeature: import('@tanstack/react-table').TableFeature;
@@ -110,6 +112,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
110
112
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
111
113
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
112
114
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
115
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
113
116
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
114
117
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
115
118
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
@@ -147,7 +150,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
147
150
  datetime: import('@tanstack/react-table').CreatedSortFn<any, any>;
148
151
  basic: import('@tanstack/react-table').CreatedSortFn<any, any>;
149
152
  };
150
- }, TData>, "features">, selector?: ((state: import('@tanstack/react-table').TableState_ColumnFiltering & import('@tanstack/react-table').TableState_ColumnSizing & import('@tanstack/react-table').TableState_ColumnVisibility & import('@tanstack/react-table').TableState_GlobalFiltering & import('@tanstack/react-table').TableState_RowPagination & import('@tanstack/react-table').TableState_RowSelection & import('@tanstack/react-table').TableState_RowSorting) => TSelected) | undefined) => import('@tanstack/react-table').AppReactTable<{
153
+ }, TData>, "features">, selector?: ((state: import('@tanstack/react-table').TableState_ColumnFiltering & import('@tanstack/react-table').TableState_ColumnSizing & import('@tanstack/react-table').TableState_ColumnVisibility & import('@tanstack/react-table').TableState_GlobalFiltering & import('@tanstack/react-table').TableState_RowPagination & import('@tanstack/react-table').TableState_RowSelection & import('@tanstack/react-table').TableState_RowSorting & import('./table.utils').TableState_ViewMode) => TSelected) | undefined) => import('@tanstack/react-table').AppReactTable<{
151
154
  columnFacetingFeature: import('@tanstack/react-table').TableFeature;
152
155
  columnFilteringFeature: import('@tanstack/react-table').TableFeature;
153
156
  columnSizingFeature: import('@tanstack/react-table').TableFeature;
@@ -156,6 +159,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
156
159
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
157
160
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
158
161
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
162
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
159
163
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
160
164
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
161
165
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
@@ -201,7 +205,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
201
205
  readonly TableFilterMenu: ({ className, children, ref, ...props }: import('./table.types').TableFilterMenuProps) => import("react").JSX.Element;
202
206
  readonly TableFilterList: ({ className, children, ref, ...props }: import('./table.types').TableFilterListProps) => import("react").JSX.Element;
203
207
  readonly TableFooter: ({ className, children, ref, ...props }: import('./table.types').TableFooterProps) => import("react").JSX.Element;
204
- readonly TableHeader: ({ className, children, ref, ...props }: import('./table.types').TableHeaderProps) => import("react").JSX.Element;
208
+ readonly TableHeader: ({ className, children, ref, ...props }: import('./table.types').TableHeaderProps) => import("react").JSX.Element | null;
205
209
  readonly TableLastPage: ({ className, children, ref, ...props }: import('./table.types').TableLastPageProps) => import("react").JSX.Element;
206
210
  readonly TableNav: ({ sticky, className, children, ref, ...props }: import('./table.types').TableNavProps) => import("react").JSX.Element;
207
211
  readonly TableNextPage: ({ className, children, ref, ...props }: import('./table.types').TableNextPageProps) => import("react").JSX.Element;
@@ -212,6 +216,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
212
216
  readonly TableSortMenu: ({ className, children, ref, ...props }: import('./table.types').TableSortMenuProps) => import("react").JSX.Element;
213
217
  readonly TableSortList: ({ className, children, ref, ...props }: import('./table.types').TableSortListProps) => import("react").JSX.Element | null;
214
218
  readonly TableToolbar: ({ sticky, className, children, ref, ...props }: import('./table.types').TableToolbarProps) => import("react").JSX.Element;
219
+ readonly TableViewModeToggle: ({ className, children, ref, ...props }: import('./table.types').TableViewModeToggleProps) => import("react").JSX.Element;
215
220
  readonly TableViewport: ({ className, children, ref, ...props }: import('./table.types').TableViewportProps) => import("react").JSX.Element;
216
221
  }, {
217
222
  readonly TableCheckboxCell: ({ className, children, ref, ...props }: import('./table.types').TableCheckboxCellProps) => import("react").JSX.Element;
@@ -222,7 +227,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
222
227
  readonly TableTextCell: ({ className, children, ref, ...props }: import('./table.types').TableTextCellProps) => import("react").JSX.Element;
223
228
  }, {
224
229
  readonly TableSelectHeader: ({ className, children, ref, ...props }: import('./table.types').TableSelectHeaderProps) => import("react").JSX.Element;
225
- }>, useTableContext: <TData extends import('@tanstack/react-table').RowData = import('@tanstack/react-table').RowData, TSelected = import('@tanstack/react-table').TableState_ColumnFiltering & import('@tanstack/react-table').TableState_ColumnSizing & import('@tanstack/react-table').TableState_ColumnVisibility & import('@tanstack/react-table').TableState_GlobalFiltering & import('@tanstack/react-table').TableState_RowPagination & import('@tanstack/react-table').TableState_RowSelection & import('@tanstack/react-table').TableState_RowSorting>() => import('@tanstack/react-table').AppReactTable<{
230
+ }>, useTableContext: <TData extends import('@tanstack/react-table').RowData = import('@tanstack/react-table').RowData, TSelected = import('@tanstack/react-table').TableState_ColumnFiltering & import('@tanstack/react-table').TableState_ColumnSizing & import('@tanstack/react-table').TableState_ColumnVisibility & import('@tanstack/react-table').TableState_GlobalFiltering & import('@tanstack/react-table').TableState_RowPagination & import('@tanstack/react-table').TableState_RowSelection & import('@tanstack/react-table').TableState_RowSorting & import('./table.utils').TableState_ViewMode>() => import('@tanstack/react-table').AppReactTable<{
226
231
  columnFacetingFeature: import('@tanstack/react-table').TableFeature;
227
232
  columnFilteringFeature: import('@tanstack/react-table').TableFeature;
228
233
  columnSizingFeature: import('@tanstack/react-table').TableFeature;
@@ -231,6 +236,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
231
236
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
232
237
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
233
238
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
239
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
234
240
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
235
241
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
236
242
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
@@ -276,7 +282,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
276
282
  readonly TableFilterMenu: ({ className, children, ref, ...props }: import('./table.types').TableFilterMenuProps) => import("react").JSX.Element;
277
283
  readonly TableFilterList: ({ className, children, ref, ...props }: import('./table.types').TableFilterListProps) => import("react").JSX.Element;
278
284
  readonly TableFooter: ({ className, children, ref, ...props }: import('./table.types').TableFooterProps) => import("react").JSX.Element;
279
- readonly TableHeader: ({ className, children, ref, ...props }: import('./table.types').TableHeaderProps) => import("react").JSX.Element;
285
+ readonly TableHeader: ({ className, children, ref, ...props }: import('./table.types').TableHeaderProps) => import("react").JSX.Element | null;
280
286
  readonly TableLastPage: ({ className, children, ref, ...props }: import('./table.types').TableLastPageProps) => import("react").JSX.Element;
281
287
  readonly TableNav: ({ sticky, className, children, ref, ...props }: import('./table.types').TableNavProps) => import("react").JSX.Element;
282
288
  readonly TableNextPage: ({ className, children, ref, ...props }: import('./table.types').TableNextPageProps) => import("react").JSX.Element;
@@ -287,6 +293,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
287
293
  readonly TableSortMenu: ({ className, children, ref, ...props }: import('./table.types').TableSortMenuProps) => import("react").JSX.Element;
288
294
  readonly TableSortList: ({ className, children, ref, ...props }: import('./table.types').TableSortListProps) => import("react").JSX.Element | null;
289
295
  readonly TableToolbar: ({ sticky, className, children, ref, ...props }: import('./table.types').TableToolbarProps) => import("react").JSX.Element;
296
+ readonly TableViewModeToggle: ({ className, children, ref, ...props }: import('./table.types').TableViewModeToggleProps) => import("react").JSX.Element;
290
297
  readonly TableViewport: ({ className, children, ref, ...props }: import('./table.types').TableViewportProps) => import("react").JSX.Element;
291
298
  }, {
292
299
  readonly TableCheckboxCell: ({ className, children, ref, ...props }: import('./table.types').TableCheckboxCellProps) => import("react").JSX.Element;
@@ -306,6 +313,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
306
313
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
307
314
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
308
315
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
316
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
309
317
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
310
318
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
311
319
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
@@ -361,6 +369,7 @@ export declare const createAppColumnHelper: <TData extends import('@tanstack/rea
361
369
  rowPaginationFeature: import('@tanstack/react-table').TableFeature;
362
370
  rowSelectionFeature: import('@tanstack/react-table').TableFeature;
363
371
  rowSortingFeature: import('@tanstack/react-table').TableFeature;
372
+ viewModePlugin: import('@tanstack/react-table').TableFeature;
364
373
  filteredRowModel: (table: import('@tanstack/react-table').Table<any, any>) => () => import('@tanstack/react-table').RowModel<any, any>;
365
374
  facetedRowModel: (table: import('@tanstack/react-table').Table<any, any>, columnId: string) => () => import('@tanstack/react-table').RowModel<any, any>;
366
375
  facetedUniqueValues: (table: import('@tanstack/react-table').Table<import('@tanstack/react-table').TableFeatures, any>, columnId: string) => () => Map<any, number>;
package/dist/components/table/table-header.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { TableHeaderProps } from './table.types';
2
- export declare const TableHeader: ({ className, children, ref, ...props }: TableHeaderProps) => import("react").JSX.Element;
2
+ export declare const TableHeader: ({ className, children, ref, ...props }: TableHeaderProps) => import("react").JSX.Element | null;
package/dist/components/table/table-view-mode-toggle.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import { TableViewModeToggleProps } from './table.types';
2
+ export declare const TableViewModeToggle: ({ className, children, ref, ...props }: TableViewModeToggleProps) => import("react").JSX.Element;
package/dist/components/table/table.types.d.ts CHANGED
@@ -5,7 +5,8 @@ import { Button } from '../button';
5
5
  import { Checkbox } from '../checkbox';
6
6
  import { inputVariants } from '../input/input.types';
7
7
  import { features } from './table-context';
8
- import { Column, RowData } from '@tanstack/react-table';
8
+ import { Table_ViewMode, TableOptions_ViewMode, TableState_ViewMode } from './table.utils';
9
+ import { Column, RowData, TableFeature, TableFeatures } from '@tanstack/react-table';
9
10
  import { VariantProps } from 'class-variance-authority';
10
11
  export type TableFirstPageProps = React.ComponentProps<typeof Button>;
11
12
  export type TableFooterProps = React.ComponentProps<'tfoot'>;
@@ -39,6 +40,9 @@ export type TableContainerProps = React.ComponentProps<'div'>;
39
40
  export type TableToolbarProps = React.ComponentProps<'div'> & {
40
41
  sticky?: boolean;
41
42
  };
43
+ export type TableViewModeToggleProps = Omit<React.ComponentProps<typeof Button>, 'children'> & {
44
+ children: (isGridView: boolean) => React.ReactNode;
45
+ };
42
46
  export type TableFilterMenuProps = React.ComponentProps<'button'>;
43
47
  export type TableFilterListProps = React.ComponentProps<'ul'>;
44
48
  export type TableDateFilterFormProps<TData extends RowData> = React.ComponentProps<'form'> & {
@@ -101,11 +105,11 @@ export declare const defaultFilterOperatorLabels: {
101
105
  lessThan: string;
102
106
  between: string;
103
107
  };
108
+ export type ViewMode = 'list' | 'grid';
104
109
  export interface TableColumnMeta {
105
110
  filterVariant?: 'range' | 'select' | 'date' | 'string' | 'number';
106
111
  }
107
112
  export interface TableMeta {
108
- viewMode?: 'table' | 'grid';
109
113
  translations?: {
110
114
  filterOperatorLabels?: Partial<Record<FilterOperator, string>>;
111
115
  buttonLabels?: {
@@ -149,3 +153,17 @@ export declare const numberFilterSchema: z.ZodObject<{
149
153
  filterValueFrom: z.ZodString;
150
154
  filterValueTo: z.ZodString;
151
155
  }, z.core.$strip>;
156
+ declare module '@tanstack/react-table' {
157
+ interface Plugins {
158
+ viewModePlugin: TableFeature;
159
+ }
160
+ interface TableState_FeatureMap {
161
+ viewModePlugin: TableState_ViewMode;
162
+ }
163
+ interface TableOptions_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
164
+ viewModePlugin: TableOptions_ViewMode;
165
+ }
166
+ interface Table_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
167
+ viewModePlugin: Table_ViewMode;
168
+ }
169
+ }
package/dist/components/table/table.utils.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import { DateFilterOperator, NumberFilterOperator, StringFilterOperator } from './table.types';
1
+ import { OnChangeFn, TableFeature, Updater } from '@tanstack/react-table';
2
+ import { DateFilterOperator, NumberFilterOperator, StringFilterOperator, ViewMode } from './table.types';
2
3
  export type DateFilterValue = {
3
4
  operator: DateFilterOperator;
4
5
  date: [string, string];
@@ -15,3 +16,15 @@ export declare const selectFilterFn: import('@tanstack/react-table').CreatedFilt
15
16
  export declare const dateFilterFn: import('@tanstack/react-table').CreatedFilterFn<any, any>;
16
17
  export declare const stringFilterFn: import('@tanstack/react-table').CreatedFilterFn<any, any>;
17
18
  export declare const numberFilterFn: import('@tanstack/react-table').CreatedFilterFn<any, any>;
19
+ export interface TableState_ViewMode {
20
+ viewMode: ViewMode;
21
+ }
22
+ export interface TableOptions_ViewMode {
23
+ enableViewModeToggle?: boolean;
24
+ onViewModeChange?: OnChangeFn<ViewMode>;
25
+ }
26
+ export interface Table_ViewMode {
27
+ setViewMode: (updater: Updater<ViewMode>) => void;
28
+ toggleViewMode: (value?: ViewMode) => void;
29
+ }
30
+ export declare const viewModePlugin: TableFeature;