intable 0.0.6 → 0.0.8

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 (197) hide show
  1. package/.github/copilot-instructions.md +102 -0
  2. package/README.md +16 -263
  3. package/docs/index-BaMALNy6.css +1 -0
  4. package/docs/index-CDN48t9E.js +3 -0
  5. package/docs/index-Cc4RNkLY.css +1 -0
  6. package/docs/index-MRnbkYmU.js +3 -0
  7. package/docs/index.html +15 -0
  8. package/docs/vite.svg +1 -0
  9. package/index.html +13 -0
  10. package/package.json +35 -38
  11. package/packages/intable/README.md +379 -0
  12. package/packages/intable/package.json +51 -0
  13. package/packages/intable/src/assets/ClearFormat.svg +3 -0
  14. package/packages/intable/src/assets/Forms.svg +4 -0
  15. package/packages/intable/src/assets/MergeCell.svg +4 -0
  16. package/packages/intable/src/assets/SplitCell.svg +4 -0
  17. package/packages/intable/src/assets/gap.svg +3 -0
  18. package/packages/intable/src/assets/loading.svg +12 -0
  19. package/packages/intable/src/assets/paint.svg +9 -0
  20. package/packages/intable/src/assets/solid.svg +1 -0
  21. package/packages/intable/src/components/Columns.tsx +86 -0
  22. package/packages/intable/src/components/DocTree.tsx +36 -0
  23. package/packages/intable/src/components/Menu.tsx +109 -0
  24. package/packages/intable/src/components/Popover.tsx +55 -0
  25. package/packages/intable/src/components/RecycleList.tsx +99 -0
  26. package/packages/intable/src/components/Render.tsx +26 -0
  27. package/packages/intable/src/components/Split.tsx +56 -0
  28. package/packages/intable/src/components/Tree.tsx +115 -0
  29. package/packages/intable/src/components/utils.tsx +12 -0
  30. package/packages/intable/src/hooks/index.ts +200 -0
  31. package/packages/intable/src/hooks/useDir.ts +78 -0
  32. package/packages/intable/src/hooks/useSelector.ts +91 -0
  33. package/packages/intable/src/hooks/useSort.tsx +118 -0
  34. package/packages/intable/src/hooks/useVirtualizer.ts +180 -0
  35. package/packages/intable/src/index.tsx +489 -0
  36. package/packages/intable/src/plugins/CellChangeHighlightPlugin.tsx +5 -0
  37. package/packages/intable/src/plugins/CellMergePlugin.tsx +153 -0
  38. package/packages/intable/src/plugins/CellSelectionPlugin.tsx +175 -0
  39. package/packages/intable/src/plugins/CommandPlugin.tsx +74 -0
  40. package/packages/intable/src/plugins/CopyPastePlugin.tsx +99 -0
  41. package/packages/intable/src/plugins/DiffPlugin.tsx +120 -0
  42. package/packages/intable/src/plugins/DragPlugin.tsx +81 -0
  43. package/packages/intable/src/plugins/EditablePlugin.tsx +252 -0
  44. package/packages/intable/src/plugins/ExpandPlugin.tsx +80 -0
  45. package/packages/intable/src/plugins/HeaderGroup.tsx +289 -0
  46. package/packages/intable/src/plugins/HistoryPlugin.tsx +49 -0
  47. package/packages/intable/src/plugins/MenuPlugin.tsx +195 -0
  48. package/packages/intable/src/plugins/RenderPlugin/components.tsx +51 -0
  49. package/packages/intable/src/plugins/RenderPlugin/index.tsx +81 -0
  50. package/packages/intable/src/plugins/ResizePlugin.tsx +122 -0
  51. package/packages/intable/src/plugins/RowGroupPlugin.tsx +122 -0
  52. package/packages/intable/src/plugins/RowSelectionPlugin.tsx +65 -0
  53. package/packages/intable/src/plugins/TreePlugin.tsx +212 -0
  54. package/packages/intable/src/plugins/VirtualScrollPlugin.tsx +190 -0
  55. package/packages/intable/src/plugins/ZodValidatorPlugin.tsx +61 -0
  56. package/packages/intable/src/style.scss +244 -0
  57. package/{dist → packages/intable/src}/theme/antd.scss +14 -5
  58. package/packages/intable/src/theme/dark.scss +46 -0
  59. package/{dist → packages/intable/src}/theme/element-plus.scss +6 -5
  60. package/packages/intable/src/theme/github.scss +80 -0
  61. package/packages/intable/src/theme/material.scss +73 -0
  62. package/packages/intable/src/theme/shadcn.scss +66 -0
  63. package/packages/intable/src/theme/stripe.scss +57 -0
  64. package/packages/intable/src/tree.ts +13 -0
  65. package/packages/intable/src/types/auto-imports.d.ts +13 -0
  66. package/packages/intable/src/utils.ts +122 -0
  67. package/packages/intable/src/wc.tsx +35 -0
  68. package/packages/intable/src/web-component.ts +1 -0
  69. package/packages/react/package.json +36 -0
  70. package/packages/react/src/index.ts +44 -0
  71. package/packages/react/src/plugins/antd.ts +94 -0
  72. package/packages/react/src/style.scss +12 -0
  73. package/packages/react/src/types/auto-imports.d.ts +10 -0
  74. package/packages/vue/package.json +34 -0
  75. package/packages/vue/src/index.ts +63 -0
  76. package/packages/vue/src/plugins/element-plus.ts +69 -0
  77. package/packages/vue/src/style.scss +12 -0
  78. package/packages/vue/src/types/auto-imports.d.ts +10 -0
  79. package/pnpm-workspace.yaml +2 -0
  80. package/public/vite.svg +1 -0
  81. package/scripts/build.js +184 -0
  82. package/scripts/publish.js +95 -0
  83. package/src/assets/ClearFormat.svg +3 -0
  84. package/src/assets/Forms.svg +4 -0
  85. package/src/assets/MergeCell.svg +4 -0
  86. package/src/assets/SplitCell.svg +4 -0
  87. package/src/assets/gap.svg +3 -0
  88. package/src/assets/loading.svg +12 -0
  89. package/src/assets/paint.svg +9 -0
  90. package/src/assets/solid.svg +1 -0
  91. package/src/demo-vue.ts +54 -0
  92. package/src/index.scss +105 -0
  93. package/src/index.tsx +20 -0
  94. package/src/pages/demo/BasicDemo.tsx +19 -0
  95. package/src/pages/demo/CellMergeDemo.tsx +41 -0
  96. package/src/pages/demo/CellSelectionDemo.tsx +24 -0
  97. package/src/pages/demo/CompositeDemo.tsx +60 -0
  98. package/src/pages/demo/CopyPasteDemo.tsx +26 -0
  99. package/src/pages/demo/DiffDemo.tsx +33 -0
  100. package/src/pages/demo/DragDemo.tsx +25 -0
  101. package/src/pages/demo/EditableDemo.tsx +58 -0
  102. package/src/pages/demo/ExpandDemo.tsx +32 -0
  103. package/src/pages/demo/HeaderGroupDemo.tsx +36 -0
  104. package/src/pages/demo/HistoryDemo.tsx +28 -0
  105. package/src/pages/demo/ReactDemo.tsx +59 -0
  106. package/src/pages/demo/ResizeDemo.tsx +24 -0
  107. package/src/pages/demo/RowGroupDemo.tsx +43 -0
  108. package/src/pages/demo/RowSelectionDemo.tsx +27 -0
  109. package/src/pages/demo/TreeDemo.tsx +45 -0
  110. package/src/pages/demo/VirtualScrollDemo.tsx +21 -0
  111. package/src/pages/demo/helpers.tsx +39 -0
  112. package/src/pages/demo/index.tsx +180 -0
  113. package/src/pages/index.tsx +2 -0
  114. package/src/pages/website.scss +37 -0
  115. package/src/pages/website.tsx +651 -0
  116. package/src/styles/index.scss +172 -0
  117. package/src/types/auto-imports.d.ts +13 -0
  118. package/stats.html +4949 -0
  119. package/tsconfig.app.json +34 -0
  120. package/tsconfig.json +7 -0
  121. package/tsconfig.node.json +26 -0
  122. package/vite.config.ts +70 -0
  123. package/dist/__uno.css +0 -1
  124. package/dist/chevron-right.js +0 -6
  125. package/dist/components/Columns.d.ts +0 -3
  126. package/dist/components/Columns.js +0 -71
  127. package/dist/components/DocTree.d.ts +0 -4
  128. package/dist/components/DocTree.js +0 -32
  129. package/dist/components/Menu.d.ts +0 -1
  130. package/dist/components/Menu.js +0 -107
  131. package/dist/components/Popover.d.ts +0 -14
  132. package/dist/components/Popover.js +0 -41
  133. package/dist/components/Render.d.ts +0 -4
  134. package/dist/components/Render.js +0 -20
  135. package/dist/components/Split.d.ts +0 -15
  136. package/dist/components/Split.js +0 -76
  137. package/dist/components/Tree.d.ts +0 -37
  138. package/dist/components/Tree.js +0 -82
  139. package/dist/components/utils.d.ts +0 -3
  140. package/dist/components/utils.js +0 -8
  141. package/dist/hooks/index.d.ts +0 -40
  142. package/dist/hooks/index.js +0 -157
  143. package/dist/hooks/useDir.d.ts +0 -11
  144. package/dist/hooks/useDir.js +0 -42
  145. package/dist/hooks/useSelector.d.ts +0 -16
  146. package/dist/hooks/useSelector.js +0 -35
  147. package/dist/hooks/useSort.d.ts +0 -18
  148. package/dist/hooks/useSort.js +0 -83
  149. package/dist/hooks/useVirtualizer.d.ts +0 -25
  150. package/dist/hooks/useVirtualizer.js +0 -67
  151. package/dist/index.d.ts +0 -130
  152. package/dist/index.js +0 -347
  153. package/dist/loading.js +0 -6
  154. package/dist/plugins/CellChangeHighlightPlugin.d.ts +0 -2
  155. package/dist/plugins/CellChangeHighlightPlugin.js +0 -4
  156. package/dist/plugins/CellMergePlugin.d.ts +0 -12
  157. package/dist/plugins/CellMergePlugin.js +0 -2
  158. package/dist/plugins/CellSelectionPlugin.d.ts +0 -15
  159. package/dist/plugins/CellSelectionPlugin.js +0 -115
  160. package/dist/plugins/CommandPlugin.d.ts +0 -14
  161. package/dist/plugins/CommandPlugin.js +0 -12
  162. package/dist/plugins/CopyPastePlugin.d.ts +0 -14
  163. package/dist/plugins/CopyPastePlugin.js +0 -42
  164. package/dist/plugins/DiffPlugin.d.ts +0 -23
  165. package/dist/plugins/DiffPlugin.js +0 -56
  166. package/dist/plugins/DragPlugin.d.ts +0 -14
  167. package/dist/plugins/DragPlugin.js +0 -47
  168. package/dist/plugins/EditablePlugin.d.ts +0 -48
  169. package/dist/plugins/EditablePlugin.js +0 -141
  170. package/dist/plugins/ExpandPlugin.d.ts +0 -18
  171. package/dist/plugins/ExpandPlugin.js +0 -50
  172. package/dist/plugins/HistoryPlugin.d.ts +0 -10
  173. package/dist/plugins/HistoryPlugin.js +0 -30
  174. package/dist/plugins/MenuPlugin.d.ts +0 -18
  175. package/dist/plugins/MenuPlugin.js +0 -107
  176. package/dist/plugins/RenderPlugin/components.d.ts +0 -5
  177. package/dist/plugins/RenderPlugin/components.js +0 -87
  178. package/dist/plugins/RenderPlugin/index.d.ts +0 -30
  179. package/dist/plugins/RenderPlugin/index.js +0 -49
  180. package/dist/plugins/ResizePlugin.d.ts +0 -27
  181. package/dist/plugins/ResizePlugin.js +0 -81
  182. package/dist/plugins/RowGroupPlugin.d.ts +0 -17
  183. package/dist/plugins/RowGroupPlugin.js +0 -83
  184. package/dist/plugins/RowSelectionPlugin.d.ts +0 -20
  185. package/dist/plugins/RowSelectionPlugin.js +0 -42
  186. package/dist/plugins/VirtualScrollPlugin.d.ts +0 -15
  187. package/dist/plugins/VirtualScrollPlugin.js +0 -96
  188. package/dist/plus.js +0 -6
  189. package/dist/style.css +0 -3
  190. package/dist/types/auto-imports.d.js +0 -0
  191. package/dist/utils.d.ts +0 -30
  192. package/dist/utils.js +0 -70
  193. package/dist/wc.d.ts +0 -1
  194. package/dist/wc.js +0 -21
  195. package/dist/web-component.d.ts +0 -1
  196. package/dist/web-component.js +0 -2
  197. package/dist/x.js +0 -6
@@ -1,42 +0,0 @@
1
- import { useTinykeys } from "../hooks/index.js";
2
- import { createComponent } from "solid-js/web";
3
- import { createEffect } from "solid-js";
4
- import { combineProps } from "@solid-primitives/props";
5
- const ClipboardPlugin = {
6
- name: "clipboard",
7
- rewriteProps: { Table: ({ Table: i }, { store: a }) => (o) => {
8
- let s;
9
- return useTinykeys(() => s, {
10
- "Control+C": () => {
11
- a.commands.copy(), s.classList.add("copied");
12
- },
13
- "Control+V": () => a.commands.paste()
14
- }), createEffect(() => {
15
- JSON.stringify(a.selected), s.classList.remove("copied");
16
- }), o = combineProps({
17
- ref: (e) => s = e,
18
- tabindex: -1
19
- }, o), createComponent(i, o);
20
- } },
21
- menus: (e) => [],
22
- commands: (e) => ({
23
- copy: () => {
24
- let { start: t, end: n } = e.selected;
25
- if (t.length == 0) return;
26
- let [r, i] = [t[0], n[0]].sort((e, t) => e - t), [a, o] = [t[1], n[1]].sort((e, t) => e - t), s = e.props.columns.slice(r, i + 1), c = e.props.data.slice(a, o + 1).map((e) => s.map((t) => e[t.id])).map((e) => e.join(" ")).join("\n");
27
- navigator.clipboard.writeText(c);
28
- },
29
- paste: async () => {
30
- let { start: t, end: n } = e.selected;
31
- if (t.length == 0) return;
32
- let r = (await navigator.clipboard.readText()).split("\n").map((e) => e.split(" ")), i = e.props.columns.slice(t[0], t[0] + r[0].length), a = e.props.data.slice();
33
- r.forEach((e, n) => {
34
- e = Object.fromEntries(i.map((t, n) => [t.id, e[n]])), a[t[1] + n] = {
35
- ...a[t[1] + n],
36
- ...e
37
- };
38
- }), e.selected.end = [t[0] + i.length - 1, Math.min(t[1] + r.length - 1, ctx.props.data.length - 1)], e.props.onDataChange?.(a);
39
- }
40
- })
41
- };
42
- export { ClipboardPlugin };
@@ -1,23 +0,0 @@
1
- import { type Plugin } from '..';
2
- declare module '../index' {
3
- interface TableProps {
4
- diff?: {
5
- /** @default true */ added?: boolean;
6
- /** @default true */ removed?: boolean;
7
- /** @default true */ changed?: boolean;
8
- onCommit?: (data: any, opt: {
9
- added: any[];
10
- removed: any[];
11
- changed: any[];
12
- }) => any;
13
- };
14
- }
15
- interface TableStore {
16
- diffData: any[];
17
- diffDataKeyed: () => any;
18
- }
19
- interface Commands {
20
- diffCommit(data?: any[]): void;
21
- }
22
- }
23
- export declare const DiffPlugin: Plugin;
@@ -1,56 +0,0 @@
1
- import { useTinykeys } from "../hooks/index.js";
2
- import { createComponent } from "solid-js/web";
3
- import { unwrap } from "solid-js/store";
4
- import { combineProps } from "@solid-primitives/props";
5
- import { isEqual, keyBy } from "es-toolkit";
6
- import { createLazyMemo } from "@solid-primitives/memo";
7
- import { v4 } from "uuid";
8
- import { diffArrays } from "diff";
9
- var DEL = Symbol("del"), NEW = Symbol("new");
10
- const DiffPlugin = {
11
- priority: Infinity,
12
- store: (e) => {
13
- let r = e.rawProps.data || [];
14
- return r.forEach((r) => unwrap(r)[e.rawProps.rowKey] ??= v4()), {
15
- diffData: structuredClone(unwrap(r || [])),
16
- diffDataKeyed: createLazyMemo(() => keyBy(e.diffData, (r) => r[e.props.rowKey]))
17
- };
18
- },
19
- commands: (e) => ({ async diffCommit(r = e.rawProps.data || []) {
20
- let { rowKey: a } = e.props || {};
21
- r.forEach((e) => unwrap(e)[a] ??= v4()), r = structuredClone(unwrap(r));
22
- let c = [], l = [], u = [], d = keyBy(r, (e) => e[a]);
23
- for (let i of r) {
24
- let r = e.diffDataKeyed()[i[a]];
25
- r ? isEqual(i, r) || u.push(i) : c.push(i);
26
- }
27
- for (let r of e.diffData) !d[r[a]] && l.push(r);
28
- await e.props.diff?.onCommit?.(r, {
29
- added: c,
30
- removed: l,
31
- changed: u
32
- }), c[NEW] = 0, e.diffData = r;
33
- } }),
34
- rewriteProps: {
35
- diff: ({ diff: e }) => ({
36
- added: !0,
37
- removed: !0,
38
- changed: !0,
39
- ...e
40
- }),
41
- data: ({ data: e }, { store: r }) => {
42
- let { rowKey: i, diff: a } = r.props || {};
43
- return diffArrays(r.diffData || [], e, { comparator: (e, r) => e[i] == r[i] }).flatMap((e) => e.added ? e.value.map((e) => (e[NEW] = 1, e)) : e.removed ? a.removed ? e.value.map((e) => ({
44
- ...e,
45
- [DEL]: 1,
46
- [r.internal]: 1
47
- })) : [] : e.value);
48
- },
49
- Table: ({ Table: i }, { store: o }) => (s) => (useTinykeys(() => o.table, { "Control+S": () => o.commands.diffCommit() }), s = combineProps({ tabindex: -1 }, s), createComponent(i, s)),
50
- tdProps: ({ tdProps: e }, { store: r }) => (o) => combineProps(e?.(o) || {}, { get class() {
51
- let { diff: e } = r.props || {}, a = unwrap(o.data)[r.props.rowKey];
52
- return [o.data[NEW] ? e?.added ? "bg-#dafaea" : "" : o.data[DEL] ? "bg-#ffe8e8" : o.data[r.internal] ? "" : e.changed && o.data[o.col.id] != r.diffDataKeyed()[a][o.col.id] ? "bg-#dafaea" : ""].join(" ");
53
- } })
54
- }
55
- };
56
- export { DiffPlugin };
@@ -1,14 +0,0 @@
1
- import { type Plugin } from "../index";
2
- declare module '../index' {
3
- interface TableProps {
4
- colDrag?: boolean;
5
- rowDrag?: boolean;
6
- }
7
- interface TableColumn {
8
- }
9
- interface TableStore {
10
- }
11
- interface Commands {
12
- }
13
- }
14
- export declare const DragPlugin: Plugin;
@@ -1,47 +0,0 @@
1
- import { useSort } from "../hooks/useSort.js";
2
- import { delay } from "es-toolkit";
3
- import { isMatch } from "es-toolkit/compat";
4
- const DragPlugin = {
5
- rewriteProps: {
6
- colDrag: ({ colDrag: e = !1 }) => e,
7
- rowDrag: ({ rowDrag: e = !1 }) => e
8
- },
9
- onMount(r) {
10
- let i = useSort(() => r.scroll_el, {
11
- get enable() {
12
- return r.props?.colDrag;
13
- },
14
- guideLine: { class: "col__guide-line" },
15
- draggable: (e) => ((i, a) => e.tagName == "TH" && isMatch(r.selected, { start: [i, 0] }) && !r.props?.columns[i][r.internal] && r.thead.contains(e) && delay(300).then(() => !0))(+e.getAttribute("x"), +e.getAttribute("y")),
16
- dragover: (e) => e.tagName == "THEAD",
17
- children: (e) => [...i.drag.parentElement.children].filter((e) => !r.props?.columns[e.getAttribute("x")][r.internal]),
18
- dragend: o
19
- }), a = useSort(() => r.scroll_el, {
20
- get enable() {
21
- return r.props?.rowDrag;
22
- },
23
- guideLine: { class: "row__guide-line" },
24
- draggable: (e) => ((i, a) => e.tagName == "TD" && isMatch(r.selected, { start: [0, a] }) && i == 0 && !r.props?.data[a][r.internal] && r.tbody.contains(e) && delay(300).then(() => !0))(+e.getAttribute("x"), +e.getAttribute("y")),
25
- dragover: (e) => e.tagName == "TBODY",
26
- children: (e) => [...a.over.children].filter((e) => !r.props.data[e.getAttribute("y")][r.internal]),
27
- dragend: s
28
- });
29
- async function o() {
30
- if (i.drag == i.rel) return;
31
- let [e, t] = [r.props.columns, [...r.rawProps.columns || []]], n = ((e) => e[r.raw] ?? e)(e[i.drag.getAttribute("x")]), a = ((e) => e[r.raw] ?? e)(e[i.rel.getAttribute("x")]), o = t.indexOf(n), s = t.indexOf(a);
32
- if (o < 0 || s < 0) return;
33
- t[o].fixed = t[s].fixed, t.splice(s - (o > s ? 0 : 1) + (i.type == "before" ? 0 : 1), 0, t.splice(o, 1)[0]), r.props.onColumnsChange?.(t), await Promise.resolve();
34
- let c = r.props.columns.findIndex((e) => e == n || e[r.raw] == n);
35
- c < 0 || (r.selected.start[0] = r.selected.end[0] = c);
36
- }
37
- async function s() {
38
- if (a.drag == a.rel) return;
39
- let [e, t] = [r.props.data, [...r.rawProps.data || []]], n = ((e) => e[r.raw] ?? e)(e[a.drag.getAttribute("y")]), i = ((e) => e[r.raw] ?? e)(e[a.rel.getAttribute("y")]), o = t.indexOf(n), s = t.indexOf(i);
40
- if (o < 0 || s < 0) return;
41
- t.splice(s - (o > s ? 0 : 1) + (a.type == "before" ? 0 : 1), 0, t.splice(o, 1)[0]), r.props.onDataChange?.(t), await Promise.resolve();
42
- let c = r.props.data.findIndex((e) => e == n || e[r.raw] == n);
43
- c < 0 || (r.selected.start[1] = r.selected.end[1] = c);
44
- }
45
- }
46
- };
47
- export { DragPlugin };
@@ -1,48 +0,0 @@
1
- import { type JSX } from 'solid-js';
2
- import { type Plugin, type TableColumn } from '..';
3
- declare module '../index' {
4
- interface TableProps {
5
- }
6
- interface TableColumn {
7
- editable?: boolean;
8
- editor?: string | Editor;
9
- editorProps?: any;
10
- editorPopup?: boolean;
11
- }
12
- interface TableStore {
13
- editors: {
14
- [key: string]: Editor;
15
- };
16
- }
17
- }
18
- export type Editor = (props: EditorOpt) => {
19
- el: JSX.Element;
20
- getValue: () => any;
21
- destroy: () => void;
22
- focus?: () => void;
23
- blur?: () => void;
24
- };
25
- export interface EditorOpt {
26
- col: TableColumn;
27
- data: any;
28
- value: any;
29
- eventKey?: string;
30
- ok: () => void;
31
- cancel: () => void;
32
- props?: any;
33
- }
34
- export declare const EditablePlugin: Plugin;
35
- export declare const editors: {
36
- text: Editor;
37
- number: Editor;
38
- range: Editor;
39
- date: Editor;
40
- time: Editor;
41
- datetime: Editor;
42
- color: Editor;
43
- tel: Editor;
44
- password: Editor;
45
- file: Editor;
46
- checkbox: Editor;
47
- select: Editor;
48
- };
@@ -1,141 +0,0 @@
1
- import { chooseFile, resolveOptions } from "../utils.js";
2
- import { Checkbox, Files } from "./RenderPlugin/components.js";
3
- import { Ctx } from "../index.js";
4
- import { createComponent, delegateEvents, effect, insert, memo, mergeProps, spread, template, use } from "solid-js/web";
5
- import { createComputed, createEffect, createMemo, createRoot, createSignal, on, onCleanup, useContext } from "solid-js";
6
- import { createMutable } from "solid-js/store";
7
- import { combineProps } from "@solid-primitives/props";
8
- import { delay } from "es-toolkit";
9
- import { createAsyncMemo } from "@solid-primitives/memo";
10
- var _tmpl$ = /* @__PURE__ */ template("<input style=position:absolute;margin-top:1em;width:0;height:0;pointer-events:none;opacity:0>"), _tmpl$2 = /* @__PURE__ */ template("<div class=in-cell-edit-wrapper>"), _tmpl$3 = /* @__PURE__ */ template("<input>"), _tmpl$4 = /* @__PURE__ */ template("<select>"), _tmpl$5 = /* @__PURE__ */ template("<option>"), _tmpl$6 = /* @__PURE__ */ template("<label class=\"h-full flex items-center\">");
11
- const EditablePlugin = {
12
- name: "editable",
13
- store: () => ({ editors: { ...editors } }),
14
- rewriteProps: { Td: ({ Td: i }, { store: O }) => (k) => {
15
- let A, { props: N } = useContext(Ctx), P = createMemo(() => !!k.col.editable && !k.data[O.internal] && !k.col[O.internal]), [I, L] = createSignal(!1), H = "", U = createMemo(() => (([i, O]) => k.x == i && k.y == O)(O.selected.start || [])), W = createMemo(() => U() && P() && !I()), G = createAsyncMemo(async () => {
16
- if (I()) {
17
- let i = !1, A = ((i) => typeof i == "string" ? O.editors[i] : i)(k.col.editor || "text"), j = {
18
- props: k.col.editorProps,
19
- col: k.col,
20
- eventKey: H,
21
- data: k.data,
22
- value: k.data[k.col.id],
23
- ok: () => L(!1),
24
- cancel: () => (i = !0, L(!1))
25
- }, M = A(j);
26
- return onCleanup(() => {
27
- if (!i && M.getValue() !== k.data[k.col.id]) {
28
- let i = [...N.data];
29
- i[k.y] = {
30
- ...i[k.y],
31
- [k.col.id]: M.getValue()
32
- }, N.onDataChange?.(i);
33
- }
34
- M.destroy();
35
- }), [j, M];
36
- }
37
- });
38
- createEffect(() => {
39
- G()?.[1]?.focus?.();
40
- }), createEffect(() => {
41
- if (I()) {
42
- let i = createMemo(() => JSON.stringify(O.selected));
43
- createEffect(on(i, () => L(!1), { defer: !0 }));
44
- }
45
- });
46
- let K, q = createMutable({
47
- w: 0,
48
- h: 0
49
- });
50
- return createComputed(() => I() && (q.w = A.getBoundingClientRect().width, q.h = A.getBoundingClientRect().height)), k = combineProps(k, {
51
- ref: (i) => A = i,
52
- get class() {
53
- return I() ? "is-editing" : "";
54
- },
55
- get style() {
56
- return I() ? `width: ${q.w}px; height: ${q.h}px; padding: 0; ` : "";
57
- },
58
- onClick: () => K?.focus?.(),
59
- onDblClick: () => L(P()),
60
- onKeyDown: (i) => i.key == "Escape" && G()?.[0].cancel()
61
- }), createComponent(i, mergeProps(k, { get children() {
62
- return [memo(() => memo(() => !!W())() && (() => {
63
- var i = _tmpl$();
64
- return i.addEventListener("compositionend", () => {
65
- L(!0);
66
- }), i.$$input = (i) => {
67
- H = i.target.value, L(!i.isComposing);
68
- }, i.$$keydown = (i) => {
69
- i.key == " " && i.preventDefault();
70
- }, use((i) => {
71
- K = i, delay(0).then(() => i.focus({ preventScroll: !0 }));
72
- }, i), i;
73
- })()), memo(() => memo(() => !!G()?.[1]?.el)() ? (() => {
74
- var i = _tmpl$2();
75
- return insert(i, () => G()?.[1]?.el), i;
76
- })() : k.children)];
77
- } }));
78
- } }
79
- };
80
- var createEditor = (i, k, A) => ({ eventKey: j, value: N, col: P, ok: F, cancel: I, props: L }) => createRoot((R) => {
81
- let [z, B] = createSignal(j || N), V;
82
- return createComponent(i, mergeProps({
83
- ref: (i) => V = i,
84
- class: "relative block px-2 size-full z-9 box-border resize-none outline-0",
85
- get value() {
86
- return z();
87
- },
88
- onInput: (i) => B(i instanceof Event ? i.target.value : i),
89
- onChange: (i) => (B(i instanceof Event ? i.target.value : i), A && F()),
90
- "on:pointerdown": (i) => i.stopPropagation(),
91
- "on:keydown": (i) => {
92
- i.stopPropagation(), i.key == "Enter" && F(), i.key == "Escape" && I();
93
- },
94
- get options() {
95
- return memo(() => !!P.enum)() ? resolveOptions(P.enum ?? []) : void 0;
96
- }
97
- }, k, L)), {
98
- el: V,
99
- getValue: z,
100
- focus: () => V.focus(),
101
- destroy: R
102
- };
103
- }), Input = (i) => (() => {
104
- var O = _tmpl$3();
105
- return spread(O, i, !1, !1), O;
106
- })(), text = createEditor(Input), number = createEditor(Input, { type: "number" }), range$1 = createEditor(Input, { type: "range" }), color = createEditor(Input, { type: "color" }), tel = createEditor(Input, { type: "tel" }), password = createEditor(Input, { type: "password" }), date = createEditor(Input, { type: "date" }, !0), time = createEditor(Input, { type: "time" }, !0), datetime = createEditor(Input, { type: "datetime-local" }, !0), select = createEditor((i) => (() => {
107
- var O = _tmpl$4();
108
- return spread(O, i, !1, !0), insert(O, () => i.options?.map((i) => (() => {
109
- var O = _tmpl$5();
110
- return insert(O, () => i.label), effect(() => O.value = i.value), O;
111
- })())), O;
112
- })(), {}, !0), file = createEditor((O) => createComponent(Files, mergeProps(O, {
113
- class: "relative z-9 outline-2 outline-blue min-h-a! h-a! p-1 bg-#fff",
114
- onAdd: () => chooseFile({ multiple: !0 }).then((i) => O.onChange([...O.value || [], ...i.map((i) => ({
115
- name: i.name,
116
- size: i.size
117
- }))]))
118
- }))), checkbox = createEditor((i) => (() => {
119
- var O = _tmpl$6(), A = i.ref;
120
- return typeof A == "function" ? use(A, O) : i.ref = O, insert(O, createComponent(Checkbox, mergeProps(i, {
121
- ref: () => {},
122
- onInput: () => {},
123
- class: "mx-3!"
124
- }))), O;
125
- })());
126
- const editors = {
127
- text,
128
- number,
129
- range: range$1,
130
- date,
131
- time,
132
- datetime,
133
- color,
134
- tel,
135
- password,
136
- file,
137
- checkbox,
138
- select
139
- };
140
- delegateEvents(["keydown", "input"]);
141
- export { EditablePlugin, editors };
@@ -1,18 +0,0 @@
1
- import type { JSX } from 'solid-js';
2
- import { type Plugin } from '..';
3
- import { useSelector } from '../hooks/useSelector';
4
- declare module '../index' {
5
- interface TableProps {
6
- expand?: {
7
- enable?: boolean;
8
- render?: (props: {
9
- data: any;
10
- y: number;
11
- }) => JSX.Element;
12
- };
13
- }
14
- interface Commands {
15
- expand: ReturnType<typeof useSelector<any[]>>;
16
- }
17
- }
18
- export declare const ExpandPlugin: Plugin;
@@ -1,50 +0,0 @@
1
- import { renderComponent, solidComponent } from "../components/utils.js";
2
- import { useSelector } from "../hooks/useSelector.js";
3
- import chevron_right_default from "../chevron-right.js";
4
- import { Ctx } from "../index.js";
5
- import { createComponent, effect, insert, memo, mergeProps, setAttribute, template } from "solid-js/web";
6
- import { useContext } from "solid-js";
7
- import { combineProps } from "@solid-primitives/props";
8
- import { defaultsDeep } from "es-toolkit/compat";
9
- var _tmpl$ = /* @__PURE__ */ template("<td style=width:100%>"), _tmpl$2 = /* @__PURE__ */ template("<div style=display:flex;align-items:center;width:100%;height:100%;opacity:.4>");
10
- const ExpandPlugin = {
11
- store: (e) => ({ expandCol: {
12
- id: Symbol("expand"),
13
- fixed: "left",
14
- width: 45,
15
- render: solidComponent((h) => createComponent(ArrowCell, {
16
- store: e,
17
- get data() {
18
- return h.data;
19
- }
20
- })),
21
- props: (h) => ({ onClick: () => e.commands.expand.toggle(h.data) }),
22
- [e.internal]: 1
23
- } }),
24
- commands: (e) => ({ expand: useSelector({ multiple: !0 }) }),
25
- rewriteProps: {
26
- expand: ({ expand: e }) => defaultsDeep(e, { enable: !1 }),
27
- columns: ({ columns: e }, { store: h }) => h.props.expand?.enable ? [h.expandCol, ...e] : e,
28
- Tr: ({ Tr: h }, { store: g }) => g.props.expand?.enable ? (_) => {
29
- let { props: v } = useContext(Ctx);
30
- return createComponent(h, mergeProps(_, { get children() {
31
- return memo(() => !_.data?.[g.expandCol.id])() ? _.children : (() => {
32
- var h = _tmpl$();
33
- return insert(h, (() => {
34
- var h = memo(() => !!v.expand?.render);
35
- return () => h() && renderComponent(v.expand.render, _, v.renderer);
36
- })()), effect(() => setAttribute(h, "colspan", v.columns?.length)), h;
37
- })();
38
- } }));
39
- } : h,
40
- Td: ({ Td: e }, { store: h }) => (g) => (g = combineProps(g, { onClick: () => g.col.id == h.expandCol.id && h.commands.expand.toggle(g.data) }), createComponent(e, g)),
41
- data: ({ data: e }, { store: h }) => h.commands.expand.value.length ? e?.flatMap((e) => h.commands.expand.has(e) ? [e, { [h.expandCol.id]: 1 }] : e) : e
42
- }
43
- };
44
- var ArrowCell = (e) => (() => {
45
- var h = _tmpl$2();
46
- return insert(h, createComponent(chevron_right_default, { get style() {
47
- return `transform: rotate(${e.store.commands.expand.has(e.data) ? 90 : 0}deg);`;
48
- } })), h;
49
- })();
50
- export { ExpandPlugin };
@@ -1,10 +0,0 @@
1
- import { useHistory } from '../hooks';
2
- import { type Plugin } from '..';
3
- declare module '../index' {
4
- interface TableProps {
5
- }
6
- interface TableStore {
7
- history: ReturnType<typeof useHistory>;
8
- }
9
- }
10
- export declare const HistoryPlugin: Plugin;
@@ -1,30 +0,0 @@
1
- import { useHistory, useTinykeys } from "../hooks/index.js";
2
- import { createComponent } from "solid-js/web";
3
- import { createMemo } from "solid-js";
4
- import { unwrap } from "solid-js/store";
5
- import { combineProps } from "@solid-primitives/props";
6
- import { captureStoreUpdates } from "@solid-primitives/deep";
7
- const HistoryPlugin = {
8
- store: (r) => {
9
- let i = createMemo(() => captureStoreUpdates(r.rawProps.data || [])), s;
10
- return { history: useHistory([() => {
11
- let e = i()();
12
- if (e.length) {
13
- for (let { path: r, value: i } of e) if (r.length == 0) s = structuredClone(unwrap(i));
14
- else {
15
- let e = [...s];
16
- r.reduce((e, a, s) => e[a] = s < r.length - 1 ? Array.isArray(e[a]) ? [...e[a]] : { ...e[a] } : structuredClone(unwrap(i)), e), s = e;
17
- }
18
- return s;
19
- }
20
- }, (e) => r.props.onDataChange?.(e)]) };
21
- },
22
- rewriteProps: {
23
- Table: ({ Table: e }, { store: a }) => (o) => (useTinykeys(() => a.table, {
24
- "Control+Z": () => a.history.undo(),
25
- "Control+Y": () => a.history.redo()
26
- }), o = combineProps({ tabindex: -1 }, o), createComponent(e, o)),
27
- tdProps: ({ tdProps: e }, { store: r }) => (r) => combineProps(e?.(r) || {}, {})
28
- }
29
- };
30
- export { HistoryPlugin };
@@ -1,18 +0,0 @@
1
- import { type Plugin } from '..';
2
- declare module '../index' {
3
- interface TableProps {
4
- }
5
- interface TableStore {
6
- }
7
- interface Plugin {
8
- menus?: (store: TableStore) => any[];
9
- }
10
- interface Commands {
11
- rowEquals: (a: any, b: any) => boolean;
12
- rowIndexOf: (data: any[], row: any) => number;
13
- rowChange: (row: any, i?: any) => void;
14
- addRows: (i: number, rows: any[], before?: boolean) => void;
15
- deleteRows: (i: number[]) => void;
16
- }
17
- }
18
- export declare const MenuPlugin: Plugin;
@@ -1,107 +0,0 @@
1
- import { log } from "../utils.js";
2
- import { useMemoAsync } from "../hooks/index.js";
3
- import { Menu } from "../components/Menu.js";
4
- import { createComponent, memo, mergeProps } from "solid-js/web";
5
- import { batch, createMemo, createSignal, mapArray } from "solid-js";
6
- import { combineProps } from "@solid-primitives/props";
7
- import { range, remove } from "es-toolkit";
8
- import { createEventListener } from "@solid-primitives/event-listener";
9
- import { autoPlacement, computePosition } from "@floating-ui/dom";
10
- const MenuPlugin = {
11
- name: "menu",
12
- priority: Infinity,
13
- store: (e) => ({}),
14
- rewriteProps: { Table: ({ Table: e }, { store: d }) => (m) => {
15
- let [h, g] = createSignal(), _ = mapArray(() => d.plugins || [], (e) => createMemo(() => e.menus?.(d))), v = createMemo(() => _().flatMap((e) => e() || [])), [y, b] = createSignal();
16
- function x(e) {
17
- e.preventDefault(), b({
18
- x: e.x,
19
- y: e.y
20
- });
21
- }
22
- createEventListener(document, "pointerdown", (e) => {
23
- h()?.contains(e.target) || b();
24
- });
25
- let S = useMemoAsync(() => {
26
- let e = h();
27
- if (e) return computePosition({ getBoundingClientRect: () => DOMRect.fromRect(y()) }, e, {
28
- strategy: "fixed",
29
- placement: "top-start",
30
- middleware: [autoPlacement({
31
- boundary: document.body,
32
- alignment: "start"
33
- })]
34
- }).then(({ x: e, y: o }) => ({
35
- position: "fixed",
36
- transform: `translate(${e}px, ${o}px)`,
37
- top: 0,
38
- left: 0,
39
- "z-index": 10
40
- }));
41
- });
42
- return m = combineProps({
43
- tabindex: -1,
44
- onContextMenu: x
45
- }, m), createComponent(e, mergeProps(m, { get children() {
46
- return [memo(() => memo(() => !!y())() && createComponent(Menu, {
47
- ref: g,
48
- get style() {
49
- return S() || "position: fixed";
50
- },
51
- get items() {
52
- return v();
53
- },
54
- onAction: () => b()
55
- })), memo(() => m.children)];
56
- } }));
57
- } },
58
- menus: (e) => [
59
- {
60
- label: "新增行 ↑",
61
- cb: () => e.commands.addRows(e.selected.end[1], [e.props.newRow(e.selected.end[1])])
62
- },
63
- {
64
- label: "新增行 ↓",
65
- cb: () => e.commands.addRows(e.selected.end[1], [e.props.newRow(e.selected.end[1])], !1)
66
- },
67
- {
68
- label: "删除行",
69
- cb: () => e.commands.deleteRows(range(...((e) => [e[0], e[1] + 1])([e.selected.start[1], e.selected.end[1]].sort((e, o) => e - o))))
70
- }
71
- ],
72
- commands: (o) => ({
73
- rowEquals(e, o) {
74
- return e == o;
75
- },
76
- rowIndexOf(e, s) {
77
- return e.findIndex((e) => o.commands.rowEquals(e, s));
78
- },
79
- rowChange(e, s) {
80
- let c = [...o.rawProps.data || []];
81
- s = s == null ? o.commands.rowIndexOf(c, e) : c.findIndex((e) => e == o.props.data[s]), s > -1 && (c[s] = e, o.props.onDataChange?.(c));
82
- },
83
- addRows(e, s, c = !0) {
84
- addRows(o, e, s, c);
85
- },
86
- deleteRows(s) {
87
- let { rowKey: c, data: l } = o.props, u = [...o.rawProps.data || []], d = new Set(s.map((e) => l[e]));
88
- log([...d]), remove(u, (e) => d.has(e)), o.props?.onDataChange?.(u);
89
- }
90
- })
91
- };
92
- function addRows(e, o, s, c) {
93
- let { data: l } = e.props, u = (o) => {
94
- for (c = !1; --o >= 0 && l[o]?.[e.internal];);
95
- return o >= 0 ? l[o] : null;
96
- }, f = (o) => {
97
- for (c = !0; ++o < l.length && l[o]?.[e.internal];);
98
- return o < l.length ? l[o] : null;
99
- }, p = l[o]?.[e.internal] ? c ? u(o) || f(o) : f(o) || u(o) : l[o];
100
- p && batch(() => {
101
- o = e.commands.rowIndexOf(l, p), e.selected && (e.selected.start = [0, o + (c ? 0 : 1)], e.selected.end = [Infinity, o + s.length - 1 + (c ? 0 : 1)]);
102
- }), (() => {
103
- let o = [...e.rawProps.data || []], l = p ? e.commands.rowIndexOf(o, p) + (c ? 0 : 1) : o.length;
104
- o.splice(l, 0, ...s), e.props?.onDataChange?.(o);
105
- })();
106
- }
107
- export { MenuPlugin };
@@ -1,5 +0,0 @@
1
- export declare const Checkbox: import("solid-js").Component<Record<string, any>>;
2
- export declare const Files: import("solid-js").Component<Record<string, any>>;
3
- export declare const Tags: import("solid-js").Component<Record<string, any>>;
4
- export declare const Tag: import("solid-js").Component<Record<string, any>>;
5
- export declare const evaluateFormula: (formula: string, data: any) => any;