@rufous/ui 0.2.89 → 0.2.91
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/main.cjs +45 -42
- package/dist/main.css +29 -2
- package/dist/main.d.cts +9 -1
- package/dist/main.d.ts +9 -1
- package/dist/main.js +45 -42
- package/package.json +1 -1
package/dist/main.css
CHANGED
|
@@ -326,8 +326,7 @@
|
|
|
326
326
|
color: var(--text-color);
|
|
327
327
|
}
|
|
328
328
|
.dg-header {
|
|
329
|
-
padding: 20px 24px;
|
|
330
|
-
border-bottom: 1px solid var(--border-color);
|
|
329
|
+
padding: 20px 24px 0 24px;
|
|
331
330
|
display: flex;
|
|
332
331
|
align-items: center;
|
|
333
332
|
justify-content: space-between;
|
|
@@ -351,6 +350,32 @@
|
|
|
351
350
|
gap: 10px;
|
|
352
351
|
flex-wrap: wrap;
|
|
353
352
|
}
|
|
353
|
+
.dg-header-slot {
|
|
354
|
+
display: flex;
|
|
355
|
+
align-items: center;
|
|
356
|
+
gap: 8px;
|
|
357
|
+
}
|
|
358
|
+
.dg-toolbar {
|
|
359
|
+
padding: 10px 24px;
|
|
360
|
+
display: flex;
|
|
361
|
+
align-items: center;
|
|
362
|
+
gap: 10px;
|
|
363
|
+
flex-wrap: wrap;
|
|
364
|
+
}
|
|
365
|
+
.dg-slot--left,
|
|
366
|
+
.dg-toolbar.dg-slot--left {
|
|
367
|
+
justify-content: flex-start;
|
|
368
|
+
}
|
|
369
|
+
.dg-slot--center,
|
|
370
|
+
.dg-toolbar.dg-slot--center {
|
|
371
|
+
justify-content: center;
|
|
372
|
+
flex: 1;
|
|
373
|
+
}
|
|
374
|
+
.dg-slot--right,
|
|
375
|
+
.dg-toolbar.dg-slot--right {
|
|
376
|
+
justify-content: flex-end;
|
|
377
|
+
margin-left: auto;
|
|
378
|
+
}
|
|
354
379
|
.dg-search-wrap {
|
|
355
380
|
position: relative;
|
|
356
381
|
}
|
|
@@ -413,6 +438,8 @@
|
|
|
413
438
|
background: var(--hover-color);
|
|
414
439
|
}
|
|
415
440
|
.dg-table-wrap {
|
|
441
|
+
border-top: 2px solid var(--border-color);
|
|
442
|
+
border-bottom: 1px solid var(--border-color);
|
|
416
443
|
overflow-x: auto;
|
|
417
444
|
flex: 1;
|
|
418
445
|
}
|
package/dist/main.d.cts
CHANGED
|
@@ -819,6 +819,10 @@ interface Action<T> {
|
|
|
819
819
|
color?: string;
|
|
820
820
|
show?: (item: T) => boolean;
|
|
821
821
|
}
|
|
822
|
+
interface DataGridToolbarSlot {
|
|
823
|
+
content: React__default.ReactNode;
|
|
824
|
+
align?: 'left' | 'center' | 'right';
|
|
825
|
+
}
|
|
822
826
|
interface DataGridProps<T> {
|
|
823
827
|
columns: Column<T>[];
|
|
824
828
|
data: T[];
|
|
@@ -834,11 +838,15 @@ interface DataGridProps<T> {
|
|
|
834
838
|
field: string;
|
|
835
839
|
value: any;
|
|
836
840
|
}) => void;
|
|
841
|
+
/** Extra buttons/components rendered beside the Export button in the header row */
|
|
842
|
+
headerActions?: DataGridToolbarSlot;
|
|
843
|
+
/** Extra content rendered in a second row below the header */
|
|
844
|
+
toolbarContent?: DataGridToolbarSlot;
|
|
837
845
|
}
|
|
838
846
|
|
|
839
847
|
declare function DataGrid<T extends {
|
|
840
848
|
id: string | number;
|
|
841
|
-
}>({ columns: initialColumnsProp, data, actions, pageSize: initialPageSize, pageSizeOptions, title, className, sx, onRowDoubleClick, onCellDoubleClick, }: DataGridProps<T>): React__default.JSX.Element;
|
|
849
|
+
}>({ columns: initialColumnsProp, data, actions, pageSize: initialPageSize, pageSizeOptions, title, className, sx, onRowDoubleClick, onCellDoubleClick, headerActions, toolbarContent, }: DataGridProps<T>): React__default.JSX.Element;
|
|
842
850
|
|
|
843
851
|
type SelectOption = {
|
|
844
852
|
value: string | number;
|
package/dist/main.d.ts
CHANGED
|
@@ -819,6 +819,10 @@ interface Action<T> {
|
|
|
819
819
|
color?: string;
|
|
820
820
|
show?: (item: T) => boolean;
|
|
821
821
|
}
|
|
822
|
+
interface DataGridToolbarSlot {
|
|
823
|
+
content: React__default.ReactNode;
|
|
824
|
+
align?: 'left' | 'center' | 'right';
|
|
825
|
+
}
|
|
822
826
|
interface DataGridProps<T> {
|
|
823
827
|
columns: Column<T>[];
|
|
824
828
|
data: T[];
|
|
@@ -834,11 +838,15 @@ interface DataGridProps<T> {
|
|
|
834
838
|
field: string;
|
|
835
839
|
value: any;
|
|
836
840
|
}) => void;
|
|
841
|
+
/** Extra buttons/components rendered beside the Export button in the header row */
|
|
842
|
+
headerActions?: DataGridToolbarSlot;
|
|
843
|
+
/** Extra content rendered in a second row below the header */
|
|
844
|
+
toolbarContent?: DataGridToolbarSlot;
|
|
837
845
|
}
|
|
838
846
|
|
|
839
847
|
declare function DataGrid<T extends {
|
|
840
848
|
id: string | number;
|
|
841
|
-
}>({ columns: initialColumnsProp, data, actions, pageSize: initialPageSize, pageSizeOptions, title, className, sx, onRowDoubleClick, onCellDoubleClick, }: DataGridProps<T>): React__default.JSX.Element;
|
|
849
|
+
}>({ columns: initialColumnsProp, data, actions, pageSize: initialPageSize, pageSizeOptions, title, className, sx, onRowDoubleClick, onCellDoubleClick, headerActions, toolbarContent, }: DataGridProps<T>): React__default.JSX.Element;
|
|
842
850
|
|
|
843
851
|
type SelectOption = {
|
|
844
852
|
value: string | number;
|