@lavalogic/scoria 0.0.24 → 0.0.26
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.
|
@@ -7,10 +7,17 @@
|
|
|
7
7
|
import type { ActionsDef } from '../../../Types/Columns/Definitions/Actions/ActionsDef.svelte.js';
|
|
8
8
|
import type { TableActionButton } from '../../../Types/Columns/TableActionButton.js';
|
|
9
9
|
import type { TableCell } from '../../../Types/Columns/TableCell.js';
|
|
10
|
+
import type { Column } from '../../../Types/Columns/Column.js';
|
|
10
11
|
|
|
12
|
+
export interface ActionsColumn<T extends object> extends Column<T> {
|
|
13
|
+
columnDef: ActionsDef<T>;
|
|
14
|
+
}
|
|
15
|
+
export interface ActionsTableCell<T extends object> extends TableCell<T> {
|
|
16
|
+
column: ActionsColumn<T>;
|
|
17
|
+
}
|
|
11
18
|
export interface TableActionProps<T extends object> {
|
|
12
19
|
action: TableActionButton<T>;
|
|
13
|
-
cell:
|
|
20
|
+
cell: ActionsTableCell<T>;
|
|
14
21
|
}
|
|
15
22
|
</script>
|
|
16
23
|
|
|
@@ -18,17 +25,18 @@
|
|
|
18
25
|
const { action, cell }: TableActionProps<T> = $props();
|
|
19
26
|
|
|
20
27
|
const isEnabledPromise: boolean | Promise<boolean> = $derived.by(() => {
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
return
|
|
28
|
+
const disabled = action.isDisabled?.(cell.row.original, cell.row.index);
|
|
29
|
+
|
|
30
|
+
if (disabled != null) {
|
|
31
|
+
return !disabled;
|
|
32
|
+
}
|
|
33
|
+
return (
|
|
34
|
+
(cell.column.columnDef as ActionsDef<T>).isEnabled?.(
|
|
25
35
|
cell.row.original,
|
|
26
36
|
cell.row.index,
|
|
27
37
|
action
|
|
28
|
-
)
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
return Promise.resolve(true);
|
|
38
|
+
) ?? true
|
|
39
|
+
);
|
|
32
40
|
});
|
|
33
41
|
|
|
34
42
|
const labelPromise: Promise<string> = $derived.by(() => {
|
|
@@ -42,20 +50,25 @@
|
|
|
42
50
|
});
|
|
43
51
|
</script>
|
|
44
52
|
|
|
45
|
-
{#await
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
cell.
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
53
|
+
{#await labelPromise then label}
|
|
54
|
+
{#await isEnabledPromise then isEnabled}
|
|
55
|
+
<Button
|
|
56
|
+
fullWidth
|
|
57
|
+
size={Size.Medium}
|
|
58
|
+
colourSet={(cell.column.columnDef as ActionsDef<T>).getColourSet?.(
|
|
59
|
+
cell.row.original,
|
|
60
|
+
cell.row.index,
|
|
61
|
+
action
|
|
62
|
+
) ?? ColourSet.Secondary}
|
|
63
|
+
disabled={!isEnabled}
|
|
64
|
+
onclick={() => {
|
|
65
|
+
action.callback(cell.row.original, cell.row.index);
|
|
66
|
+
}}>{label}</Button
|
|
67
|
+
>
|
|
68
|
+
{:catch e}
|
|
69
|
+
{@debug e}
|
|
70
|
+
Error Loading Button
|
|
71
|
+
{/await}
|
|
59
72
|
{:catch e}
|
|
60
73
|
{@debug e}
|
|
61
74
|
Error Loading Button
|
|
@@ -1,8 +1,16 @@
|
|
|
1
|
+
import type { ActionsDef } from '../../../Types/Columns/Definitions/Actions/ActionsDef.svelte.js';
|
|
1
2
|
import type { TableActionButton } from '../../../Types/Columns/TableActionButton.js';
|
|
2
3
|
import type { TableCell } from '../../../Types/Columns/TableCell.js';
|
|
4
|
+
import type { Column } from '../../../Types/Columns/Column.js';
|
|
5
|
+
export interface ActionsColumn<T extends object> extends Column<T> {
|
|
6
|
+
columnDef: ActionsDef<T>;
|
|
7
|
+
}
|
|
8
|
+
export interface ActionsTableCell<T extends object> extends TableCell<T> {
|
|
9
|
+
column: ActionsColumn<T>;
|
|
10
|
+
}
|
|
3
11
|
export interface TableActionProps<T extends object> {
|
|
4
12
|
action: TableActionButton<T>;
|
|
5
|
-
cell:
|
|
13
|
+
cell: ActionsTableCell<T>;
|
|
6
14
|
}
|
|
7
15
|
declare function $$render<T extends object>(): {
|
|
8
16
|
props: TableActionProps<T>;
|
|
@@ -322,6 +322,11 @@
|
|
|
322
322
|
flex-flow: row nowrap;
|
|
323
323
|
box-sizing: border-box;
|
|
324
324
|
overflow: auto;
|
|
325
|
+
background-color: #cbd4da;
|
|
326
|
+
gap: 1px;
|
|
327
|
+
}
|
|
328
|
+
.spread_row .scrollable > .block {
|
|
329
|
+
background-color: #ffffff;
|
|
325
330
|
}
|
|
326
331
|
.spread_row .block {
|
|
327
332
|
display: flex;
|