@chalabi/svelte-sheets 2.0.6 → 2.0.7
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/Readme.md +16 -0
- package/dist/Sheet.svelte +4 -1
- package/dist/Sheet.svelte.d.ts +2 -0
- package/package.json +1 -1
package/Readme.md
CHANGED
|
@@ -88,6 +88,22 @@ Common flags:
|
|
|
88
88
|
- `editable`: false to disable edits (equivalent to readOnly)
|
|
89
89
|
- `disableHover`: true to disable hover-based selection updates
|
|
90
90
|
|
|
91
|
+
Boolean cells (Checkboxes):
|
|
92
|
+
|
|
93
|
+
- `booleanColumns`: array of column indices to render as checkboxes (e.g., `[2, 5]`)
|
|
94
|
+
- `booleanRows`: array of row indices to render as checkboxes (e.g., `[3, 7]`)
|
|
95
|
+
|
|
96
|
+
Boolean cells display a checkmark (✓) for `true` values and a crossed circle (⦻) for `false` values. Users can click to toggle between true/false. The first row (headers) is automatically excluded from boolean rendering.
|
|
97
|
+
|
|
98
|
+
Example:
|
|
99
|
+
```js
|
|
100
|
+
let options = {
|
|
101
|
+
tableHeight: "70vh",
|
|
102
|
+
booleanColumns: [5], // Column 5 will show checkboxes
|
|
103
|
+
booleanRows: [10], // Row 10 will show checkboxes
|
|
104
|
+
};
|
|
105
|
+
```
|
|
106
|
+
|
|
91
107
|
Theme:
|
|
92
108
|
|
|
93
109
|
- `theme`: set to `"dark"` for the bundled dark tokens (default is `"light"`)
|
package/dist/Sheet.svelte
CHANGED
|
@@ -18,8 +18,9 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
18
18
|
}
|
|
19
19
|
return t;
|
|
20
20
|
};
|
|
21
|
-
import { onMount, tick } from "svelte";
|
|
21
|
+
import { onMount, tick, createEventDispatcher } from "svelte";
|
|
22
22
|
import * as XLSX from "xlsx";
|
|
23
|
+
const dispatch = createEventDispatcher();
|
|
23
24
|
import { resizable } from "./actions/index.js";
|
|
24
25
|
import { draggable } from "./actions/draggable.js";
|
|
25
26
|
import { defaultconfig } from "./defaultconfig.js";
|
|
@@ -232,6 +233,8 @@ function toggleBooleanCell(colIndex, rowIndex) {
|
|
|
232
233
|
else {
|
|
233
234
|
data[rowIndex][colIndex] = newValue;
|
|
234
235
|
}
|
|
236
|
+
// Dispatch inputchange event for boolean toggle
|
|
237
|
+
dispatch('inputchange', { value: newValue, row: { i: rowIndex }, column: { i: colIndex } });
|
|
235
238
|
historyPush(data, rows, columns, style);
|
|
236
239
|
cmdz = false;
|
|
237
240
|
}
|
package/dist/Sheet.svelte.d.ts
CHANGED
|
@@ -34,6 +34,8 @@ declare const Sheet: $$__sveltets_2_IsomorphicComponent<{
|
|
|
34
34
|
endX?: number;
|
|
35
35
|
onInputChange?: (value: any, row: any, column: any) => void;
|
|
36
36
|
}, {
|
|
37
|
+
inputchange: CustomEvent<any>;
|
|
38
|
+
} & {
|
|
37
39
|
[evt: string]: CustomEvent<any>;
|
|
38
40
|
}, {}, {
|
|
39
41
|
onInputChange: (value: any, row: any, column: any) => void;
|