wendang-react 0.6.2 → 0.6.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.
- package/NOTICE.md +1 -1
- package/README.md +105 -0
- package/dist/bindings/yjs.js +1 -5
- package/dist/chunks/AnchoredPanel-C7jMoPze.js +1 -0
- package/dist/chunks/DocumentExportMenu-CUMsgq3w.js +2 -0
- package/dist/chunks/Dropdown-D98tXfe0.js +3 -0
- package/dist/chunks/MindMapCanvas-CVXQXNOg.js +163 -0
- package/dist/chunks/MindMapViewer-BI8zbQM1.js +13 -0
- package/dist/chunks/SpreadsheetViewer-CoQ4VIgj.js +23 -0
- package/dist/chunks/code-highlight-BmaqTe1m.js +1 -30
- package/dist/chunks/code-highlight-engine-BFDzDPzy.js +1 -40
- package/dist/chunks/comment-hint-BhUxKjKK.js +14 -0
- package/dist/chunks/composition-state-Bl-U1R_2.js +1 -40
- package/dist/chunks/extensions-C1fCBnEs.js +14 -0
- package/dist/chunks/fuzzy-match-DYQR-4w2.js +1 -89
- package/dist/chunks/hooks-C53Dp0pr.js +1 -35
- package/dist/chunks/i18n-B0kCsIjc.js +2 -0
- package/dist/chunks/index-COeA2QcQ.js +15 -0
- package/dist/chunks/katex-WjrodtTU.js +1 -71
- package/dist/chunks/locale-DWpIJ_9X.js +1 -0
- package/dist/chunks/mind-map-controller-Ce76mETT.js +1 -0
- package/dist/chunks/mind-map-delete-CVsxdXfs.js +1 -31
- package/dist/chunks/mind-map-input-CEWRz_t6.js +1 -43
- package/dist/chunks/mind-topic-text-Bn1waxff.js +31 -0
- package/dist/chunks/popover-placement-D3xVYdkt.js +1 -47
- package/dist/chunks/worksheet-engine-c84sdD4N.js +1 -0
- package/dist/chunks/worksheet-preview-DsDVWxIM.js +1 -129
- package/dist/document/viewer.js +30 -289
- package/dist/document.js +120 -3622
- package/dist/export/json.js +1 -5
- package/dist/export/markdown.js +1 -2
- package/dist/export/mindmap.js +1 -2
- package/dist/export/pdf.js +1 -6
- package/dist/export/word.js +1 -2
- package/dist/export.js +1 -2
- package/dist/i18n.js +1 -0
- package/dist/index.js +1 -8
- package/dist/locales/en-US.js +1 -0
- package/dist/locales/es-ES.js +1 -0
- package/dist/locales/ja-JP.js +1 -0
- package/dist/locales/ko-KR.js +1 -0
- package/dist/locales/zh-CN.js +1 -0
- package/dist/locales/zh-TW.js +1 -0
- package/dist/mindmap/viewer.js +1 -6
- package/dist/mindmap.js +3 -123
- package/dist/shared.js +1 -52
- package/dist/spreadsheet/viewer.js +1 -5
- package/dist/spreadsheet/xlsx.js +1 -299
- package/dist/spreadsheet.js +2 -120
- package/dist/styles/callout.css +1 -34
- package/dist/styles/code-block.css +1 -58
- package/dist/styles/content-style.css +1 -619
- package/dist/styles/content-tokens.css +1 -29
- package/dist/styles/editor-interaction.css +1 -621
- package/dist/styles/file-video.css +1 -12
- package/dist/styles/image-preview.css +1 -103
- package/dist/styles/mind-map-block.css +1 -14
- package/dist/styles/mind-map-canvas.css +1 -80
- package/dist/styles/mind-map-comments.css +1 -93
- package/dist/styles/mind-map-details.css +1 -7
- package/dist/styles/mind-map-preview.css +1 -7
- package/dist/styles/mind-map-topic.css +1 -112
- package/dist/styles/page-picker.css +1 -47
- package/dist/styles/renderer.css +1 -45
- package/dist/styles/spreadsheet-editor.css +1 -3
- package/dist/styles/tokens.css +1 -142
- package/dist/styles/video-dialog.css +1 -41
- package/dist/styles/video-embed.css +1 -35
- package/dist/styles.css +1 -2631
- package/dist/types/editor/BlockAffordance.d.ts +5 -2
- package/dist/types/editor/CalloutView.d.ts +2 -1
- package/dist/types/editor/ImagePreview.d.ts +1 -1
- package/dist/types/editor/PagePicker.d.ts +1 -1
- package/dist/types/editor/extensions.d.ts +4 -1
- package/dist/types/engine/editor/block-commands.d.ts +1 -1
- package/dist/types/engine/editor/block-menu-hover.d.ts +16 -0
- package/dist/types/engine/editor/extensions/locale.d.ts +3 -0
- package/dist/types/engine/editor/nodes/image-nodeview.d.ts +1 -1
- package/dist/types/engine/host.d.ts +60 -2
- package/dist/types/engine/renderer/attachments.d.ts +3 -3
- package/dist/types/engine/shared/video-feedback.d.ts +1 -1
- package/dist/types/engine/worksheets/worksheet-engine.d.ts +1 -0
- package/dist/types/engine/worksheets/worksheet-xlsx.d.ts +6 -1
- package/dist/types/engine/wui/core/overlay-scrollbar.d.ts +4 -0
- package/dist/types/host-types.d.ts +2 -60
- package/dist/types/host.d.ts +8 -1
- package/dist/types/i18n.d.ts +3 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/locales/en-US.d.ts +1 -0
- package/dist/types/locales/es-ES.d.ts +1 -0
- package/dist/types/locales/ja-JP.d.ts +1 -0
- package/dist/types/locales/ko-KR.d.ts +1 -0
- package/dist/types/locales/zh-CN.d.ts +1 -0
- package/dist/types/locales/zh-TW.d.ts +1 -0
- package/dist/types/spreadsheet/xlsx.d.ts +1 -1
- package/dist/types/wui/Dropdown.d.ts +2 -1
- package/dist/types/wui/index.d.ts +2 -1
- package/integrity.json +3135 -0
- package/package.json +15 -5
- package/verify-integrity.mjs +138 -0
- package/dist/chunks/AnchoredPanel-CSXrveAT.js +0 -68
- package/dist/chunks/DocumentExportMenu-DgDXDChd.js +0 -75
- package/dist/chunks/MindMapCanvas-I5M1SIyX.js +0 -2090
- package/dist/chunks/MindMapViewer-Nu3nEVHQ.js +0 -180
- package/dist/chunks/SpreadsheetViewer-CLDlnWyM.js +0 -163
- package/dist/chunks/comment-hint-Coq1laiR.js +0 -296
- package/dist/chunks/extensions-DMQedgOl.js +0 -4210
- package/dist/chunks/host-C-V688Rq.js +0 -197
- package/dist/chunks/index-CqaMYb3A.js +0 -720
- package/dist/chunks/mind-map-controller-B6SxK3GZ.js +0 -479
- package/dist/chunks/mind-topic-text-DYQR2Dzf.js +0 -446
- package/dist/chunks/nodes-iKqTGr_N.js +0 -291
- package/dist/chunks/worksheet-engine-TJ54m0KC.js +0 -125
- package/third-party-notices/wendang-export@0.6.0-NOTICE.md.txt +0 -51
- package/third-party-notices/wendang-export@0.6.1-LICENSE.txt +0 -21
- package/third-party-notices/wendang-export@0.6.2-LICENSE.txt +0 -21
- package/third-party-notices/wendang-export@0.6.2-NOTICE.md.txt +0 -70
- /package/third-party-notices/{wendang-export@0.6.0-LICENSE.txt → wendang-export@0.6.3-LICENSE.txt} +0 -0
- /package/third-party-notices/{wendang-export@0.6.1-NOTICE.md.txt → wendang-export@0.6.3-NOTICE.md.txt} +0 -0
|
@@ -1,720 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
|
-
import { createPortal } from "react-dom";
|
|
4
|
-
import { createElement, useState, useRef, useLayoutEffect, useEffect, forwardRef, useId, useContext, createContext } from "react";
|
|
5
|
-
import { a as useContentContext } from "./host-C-V688Rq.js";
|
|
6
|
-
function resolvePlacement(position) {
|
|
7
|
-
const table = {
|
|
8
|
-
bottom: { side: "bottom", align: "center" },
|
|
9
|
-
top: { side: "top", align: "center" },
|
|
10
|
-
left: { side: "left", align: "center" },
|
|
11
|
-
right: { side: "right", align: "center" },
|
|
12
|
-
bl: { side: "bottom", align: "start" },
|
|
13
|
-
br: { side: "bottom", align: "end" },
|
|
14
|
-
tl: { side: "top", align: "start" },
|
|
15
|
-
tr: { side: "top", align: "end" }
|
|
16
|
-
};
|
|
17
|
-
return table[position ?? "bottom"] ?? table.bottom;
|
|
18
|
-
}
|
|
19
|
-
const OPPOSITE = { top: "bottom", bottom: "top", left: "right", right: "left" };
|
|
20
|
-
function placePanel(input) {
|
|
21
|
-
const gap = input.gap ?? 6;
|
|
22
|
-
const margin = input.margin ?? 8;
|
|
23
|
-
const { trigger, panel, viewport } = input;
|
|
24
|
-
const preferred = resolvePlacement(input.position);
|
|
25
|
-
const anchor = input.point ? { left: input.point.x, top: input.point.y, width: 0, height: 0 } : trigger;
|
|
26
|
-
const fits = (side2) => {
|
|
27
|
-
if (side2 === "bottom") return anchor.top + anchor.height + gap + panel.height <= viewport.height - margin;
|
|
28
|
-
if (side2 === "top") return anchor.top - gap - panel.height >= margin;
|
|
29
|
-
if (side2 === "right") return anchor.left + anchor.width + gap + panel.width <= viewport.width - margin;
|
|
30
|
-
return anchor.left - gap - panel.width >= margin;
|
|
31
|
-
};
|
|
32
|
-
let side = preferred.side;
|
|
33
|
-
if (!fits(side)) {
|
|
34
|
-
const opposite = OPPOSITE[side];
|
|
35
|
-
if (fits(opposite)) side = opposite;
|
|
36
|
-
else {
|
|
37
|
-
if (side === "top" || side === "bottom") {
|
|
38
|
-
side = anchor.top + anchor.height / 2 > viewport.height / 2 ? "top" : "bottom";
|
|
39
|
-
} else {
|
|
40
|
-
side = anchor.left + anchor.width / 2 > viewport.width / 2 ? "left" : "right";
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
let left;
|
|
45
|
-
let top;
|
|
46
|
-
if (side === "bottom" || side === "top") {
|
|
47
|
-
if (preferred.align === "start") left = anchor.left;
|
|
48
|
-
else if (preferred.align === "end") left = anchor.left + anchor.width - panel.width;
|
|
49
|
-
else left = anchor.left + anchor.width / 2 - panel.width / 2;
|
|
50
|
-
top = side === "bottom" ? anchor.top + anchor.height + gap : anchor.top - gap - panel.height;
|
|
51
|
-
} else {
|
|
52
|
-
if (preferred.align === "start") top = anchor.top;
|
|
53
|
-
else if (preferred.align === "end") top = anchor.top + anchor.height - panel.height;
|
|
54
|
-
else top = anchor.top + anchor.height / 2 - panel.height / 2;
|
|
55
|
-
left = side === "right" ? anchor.left + anchor.width + gap : anchor.left - gap - panel.width;
|
|
56
|
-
}
|
|
57
|
-
const maxLeft = Math.max(margin, viewport.width - margin - panel.width);
|
|
58
|
-
const maxTop = Math.max(margin, viewport.height - margin - panel.height);
|
|
59
|
-
left = Math.min(Math.max(left, margin), maxLeft);
|
|
60
|
-
top = Math.min(Math.max(top, margin), maxTop);
|
|
61
|
-
const horizontal = side === "top" || side === "bottom";
|
|
62
|
-
const arrowCenter = horizontal ? anchor.left + anchor.width / 2 : anchor.top + anchor.height / 2;
|
|
63
|
-
const panelStart = horizontal ? left : top;
|
|
64
|
-
const panelLength = horizontal ? panel.width : panel.height;
|
|
65
|
-
const inset = 12;
|
|
66
|
-
const arrow = Math.min(Math.max(arrowCenter - panelStart, inset), Math.max(inset, panelLength - inset));
|
|
67
|
-
return { left, top, side, arrow, arrowShift: arrow - panelLength / 2 };
|
|
68
|
-
}
|
|
69
|
-
const ICONS = {
|
|
70
|
-
// wx 版本缺少的几个通用符号(与 Lucide 同名几何一致)。
|
|
71
|
-
x: { els: [["path", { d: "M18 6 6 18" }], ["path", { d: "m6 6 12 12" }]] },
|
|
72
|
-
// ---------------------------------------------------------------- 文字格式
|
|
73
|
-
text: { els: [["path", { d: "M12 4v16" }], ["path", { d: "M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2" }], ["path", { d: "M9 20h6" }]] },
|
|
74
|
-
bold: { els: [["path", { d: "M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8" }]] },
|
|
75
|
-
italic: { els: [["line", { x1: 19, x2: 10, y1: 4, y2: 4 }], ["line", { x1: 14, x2: 5, y1: 20, y2: 20 }], ["line", { x1: 15, x2: 9, y1: 4, y2: 20 }]] },
|
|
76
|
-
underline: { els: [["path", { d: "M6 4v6a6 6 0 0 0 12 0V4" }], ["line", { x1: 4, x2: 20, y1: 20, y2: 20 }]] },
|
|
77
|
-
strike: { els: [
|
|
78
|
-
["path", { d: "M16 4H9a3 3 0 0 0-2.83 4" }],
|
|
79
|
-
["path", { d: "M14 12a4 4 0 0 1 0 8H6" }],
|
|
80
|
-
["line", { x1: 4, x2: 20, y1: 12, y2: 12 }]
|
|
81
|
-
] },
|
|
82
|
-
"inline-code": { els: [
|
|
83
|
-
["path", { d: "m18 16 4-4-4-4" }],
|
|
84
|
-
["path", { d: "m6 8-4 4 4 4" }],
|
|
85
|
-
["path", { d: "m14.5 4-5 16" }]
|
|
86
|
-
] },
|
|
87
|
-
"format-link": { els: [
|
|
88
|
-
["path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }],
|
|
89
|
-
["path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" }]
|
|
90
|
-
] },
|
|
91
|
-
unlink: { els: [
|
|
92
|
-
["path", { d: "M9 17H7A5 5 0 0 1 7 7" }],
|
|
93
|
-
["path", { d: "M15 7h2a5 5 0 0 1 4 8" }],
|
|
94
|
-
["line", { x1: 8, x2: 12, y1: 12, y2: 12 }],
|
|
95
|
-
["line", { x1: 2, x2: 22, y1: 2, y2: 22 }]
|
|
96
|
-
] },
|
|
97
|
-
edit: { els: [
|
|
98
|
-
["path", { d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }],
|
|
99
|
-
["path", { d: "m15 5 4 4" }]
|
|
100
|
-
] },
|
|
101
|
-
"zoom-in": { els: [
|
|
102
|
-
["circle", { cx: 11, cy: 11, r: 8 }],
|
|
103
|
-
["line", { x1: 21, x2: 16.65, y1: 21, y2: 16.65 }],
|
|
104
|
-
["line", { x1: 11, x2: 11, y1: 8, y2: 14 }],
|
|
105
|
-
["line", { x1: 8, x2: 14, y1: 11, y2: 11 }]
|
|
106
|
-
] },
|
|
107
|
-
// ---------------------------------------------------------------- 标题
|
|
108
|
-
h1: { els: [["path", { d: "M4 12h8" }], ["path", { d: "M4 18V6" }], ["path", { d: "M12 18V6" }], ["path", { d: "m17 12 3-2v8" }]] },
|
|
109
|
-
h2: { els: [["path", { d: "M4 12h8" }], ["path", { d: "M4 18V6" }], ["path", { d: "M12 18V6" }], ["path", { d: "M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1" }]] },
|
|
110
|
-
h3: { els: [
|
|
111
|
-
["path", { d: "M4 12h8" }],
|
|
112
|
-
["path", { d: "M4 18V6" }],
|
|
113
|
-
["path", { d: "M12 18V6" }],
|
|
114
|
-
["path", { d: "M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2" }],
|
|
115
|
-
["path", { d: "M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2" }]
|
|
116
|
-
] },
|
|
117
|
-
h4: { els: [
|
|
118
|
-
["path", { d: "M12 18V6" }],
|
|
119
|
-
["path", { d: "M17 10v3a1 1 0 0 0 1 1h3" }],
|
|
120
|
-
["path", { d: "M21 10v8" }],
|
|
121
|
-
["path", { d: "M4 12h8" }],
|
|
122
|
-
["path", { d: "M4 18V6" }]
|
|
123
|
-
] },
|
|
124
|
-
h5: { els: [
|
|
125
|
-
["path", { d: "M4 12h8" }],
|
|
126
|
-
["path", { d: "M4 18V6" }],
|
|
127
|
-
["path", { d: "M12 18V6" }],
|
|
128
|
-
["path", { d: "M17 13v-3h4" }],
|
|
129
|
-
["path", { d: "M17 17.7c.4.2.8.3 1.3.3 1.5 0 2.7-1.1 2.7-2.5S19.8 13 18.3 13H17" }]
|
|
130
|
-
] },
|
|
131
|
-
h6: { els: [
|
|
132
|
-
["path", { d: "M4 12h8" }],
|
|
133
|
-
["path", { d: "M4 18V6" }],
|
|
134
|
-
["path", { d: "M12 18V6" }],
|
|
135
|
-
["circle", { cx: 19, cy: 16, r: 2 }],
|
|
136
|
-
["path", { d: "M20 10c-2 2-3 3.5-3 6" }]
|
|
137
|
-
] },
|
|
138
|
-
// ---------------------------------------------------------------- 列表与块
|
|
139
|
-
"bullet-list": { els: [
|
|
140
|
-
["path", { d: "M3 5h.01" }],
|
|
141
|
-
["path", { d: "M3 12h.01" }],
|
|
142
|
-
["path", { d: "M3 19h.01" }],
|
|
143
|
-
["path", { d: "M8 5h13" }],
|
|
144
|
-
["path", { d: "M8 12h13" }],
|
|
145
|
-
["path", { d: "M8 19h13" }]
|
|
146
|
-
] },
|
|
147
|
-
"ordered-list": { els: [
|
|
148
|
-
["path", { d: "M11 5h10" }],
|
|
149
|
-
["path", { d: "M11 12h10" }],
|
|
150
|
-
["path", { d: "M11 19h10" }],
|
|
151
|
-
["path", { d: "M4 4h1v5" }],
|
|
152
|
-
["path", { d: "M4 9h2" }],
|
|
153
|
-
["path", { d: "M6.5 20H3.4c0-1 2.6-1.925 2.6-3.5a1.5 1.5 0 0 0-2.6-1.02" }]
|
|
154
|
-
] },
|
|
155
|
-
task: { els: [
|
|
156
|
-
["path", { d: "M13 5h8" }],
|
|
157
|
-
["path", { d: "M13 12h8" }],
|
|
158
|
-
["path", { d: "M13 19h8" }],
|
|
159
|
-
["path", { d: "m3 17 2 2 4-4" }],
|
|
160
|
-
["rect", { x: 3, y: 4, width: 6, height: 6, rx: 1 }]
|
|
161
|
-
] },
|
|
162
|
-
quote: { els: [
|
|
163
|
-
["path", { d: "M17 5H3" }],
|
|
164
|
-
["path", { d: "M21 12H8" }],
|
|
165
|
-
["path", { d: "M21 19H8" }],
|
|
166
|
-
["path", { d: "M3 12v7" }]
|
|
167
|
-
] },
|
|
168
|
-
code: { els: [
|
|
169
|
-
["path", { d: "m10 9-3 3 3 3" }],
|
|
170
|
-
["path", { d: "m14 15 3-3-3-3" }],
|
|
171
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }]
|
|
172
|
-
] },
|
|
173
|
-
link: { els: [
|
|
174
|
-
["path", { d: "M9 17H7A5 5 0 0 1 7 7h2" }],
|
|
175
|
-
["path", { d: "M15 7h2a5 5 0 1 1 0 10h-2" }],
|
|
176
|
-
["line", { x1: 8, x2: 16, y1: 12, y2: 12 }]
|
|
177
|
-
] },
|
|
178
|
-
image: { els: [
|
|
179
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
180
|
-
["circle", { cx: 9, cy: 9, r: 2 }],
|
|
181
|
-
["path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]
|
|
182
|
-
] },
|
|
183
|
-
file: { els: [
|
|
184
|
-
["path", { d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }],
|
|
185
|
-
["path", { d: "M14 2v5a1 1 0 0 0 1 1h5" }]
|
|
186
|
-
] },
|
|
187
|
-
table: { els: [
|
|
188
|
-
["path", { d: "M12 3v18" }],
|
|
189
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
190
|
-
["path", { d: "M3 9h18" }],
|
|
191
|
-
["path", { d: "M3 15h18" }]
|
|
192
|
-
] },
|
|
193
|
-
"table-header-row": { els: [
|
|
194
|
-
["path", { d: "M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v4H3z", fill: "currentColor", stroke: "none" }],
|
|
195
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
196
|
-
["path", { d: "M3 9h18" }],
|
|
197
|
-
["path", { d: "M9 9v12" }],
|
|
198
|
-
["path", { d: "M15 9v12" }]
|
|
199
|
-
] },
|
|
200
|
-
"table-header-column": { els: [
|
|
201
|
-
["path", { d: "M5 3h4v18H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z", fill: "currentColor", stroke: "none" }],
|
|
202
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
203
|
-
["path", { d: "M9 3v18" }]
|
|
204
|
-
] },
|
|
205
|
-
callout: { els: [
|
|
206
|
-
["path", { d: "M14 14a2 2 0 0 0 2-2V8h-2" }],
|
|
207
|
-
["path", { d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z" }],
|
|
208
|
-
["path", { d: "M8 14a2 2 0 0 0 2-2V8H8" }]
|
|
209
|
-
] },
|
|
210
|
-
math: { els: [["path", { d: "M18 7V5a1 1 0 0 0-1-1H6.5a.5.5 0 0 0-.4.8l4.5 6a2 2 0 0 1 0 2.4l-4.5 6a.5.5 0 0 0 .4.8H17a1 1 0 0 0 1-1v-2" }]] },
|
|
211
|
-
divider: { els: [["path", { d: "m16 16-4 4-4-4" }], ["path", { d: "M3 12h18" }], ["path", { d: "m8 8 4-4 4 4" }]] },
|
|
212
|
-
page: { els: [
|
|
213
|
-
["path", { d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }],
|
|
214
|
-
["path", { d: "M14 2v5a1 1 0 0 0 1 1h5" }],
|
|
215
|
-
["path", { d: "M9 15h6" }],
|
|
216
|
-
["path", { d: "M12 18v-6" }]
|
|
217
|
-
] },
|
|
218
|
-
// ---------------------------------------------------------------- 块手柄与操作
|
|
219
|
-
handle: { els: [
|
|
220
|
-
["circle", { cx: 9, cy: 5, r: 1 }],
|
|
221
|
-
["circle", { cx: 9, cy: 12, r: 1 }],
|
|
222
|
-
["circle", { cx: 9, cy: 19, r: 1 }],
|
|
223
|
-
["circle", { cx: 15, cy: 5, r: 1 }],
|
|
224
|
-
["circle", { cx: 15, cy: 12, r: 1 }],
|
|
225
|
-
["circle", { cx: 15, cy: 19, r: 1 }]
|
|
226
|
-
] },
|
|
227
|
-
plus: { els: [["path", { d: "M5 12h14" }], ["path", { d: "M12 5v14" }]] },
|
|
228
|
-
"chevron-down": { els: [["path", { d: "m6 9 6 6 6-6" }]] },
|
|
229
|
-
chevron: { els: [["path", { d: "m9 18 6-6-6-6" }]] },
|
|
230
|
-
check: { els: [["path", { d: "M20 6 9 17l-5-5" }]] },
|
|
231
|
-
comment: { els: [["path", { d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z" }]] },
|
|
232
|
-
cut: { els: [
|
|
233
|
-
["circle", { cx: 6, cy: 6, r: 3 }],
|
|
234
|
-
["path", { d: "M8.12 8.12 12 12" }],
|
|
235
|
-
["path", { d: "M20 4 8.12 15.88" }],
|
|
236
|
-
["circle", { cx: 6, cy: 18, r: 3 }],
|
|
237
|
-
["path", { d: "M14.8 14.8 20 20" }]
|
|
238
|
-
] },
|
|
239
|
-
copy: { els: [
|
|
240
|
-
["rect", { x: 8, y: 8, width: 14, height: 14, rx: 2, ry: 2 }],
|
|
241
|
-
["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]
|
|
242
|
-
] },
|
|
243
|
-
trash: { els: [
|
|
244
|
-
["path", { d: "M10 11v6" }],
|
|
245
|
-
["path", { d: "M14 11v6" }],
|
|
246
|
-
["path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }],
|
|
247
|
-
["path", { d: "M3 6h18" }],
|
|
248
|
-
["path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]
|
|
249
|
-
] },
|
|
250
|
-
"copy-link": { els: [
|
|
251
|
-
["path", { d: "M9 17H7A5 5 0 0 1 7 7h2" }],
|
|
252
|
-
["path", { d: "M15 7h2a5 5 0 1 1 0 10h-2" }],
|
|
253
|
-
["line", { x1: 8, x2: 16, y1: 12, y2: 12 }]
|
|
254
|
-
] },
|
|
255
|
-
share: { els: [
|
|
256
|
-
["circle", { cx: 18, cy: 5, r: 3 }],
|
|
257
|
-
["circle", { cx: 6, cy: 12, r: 3 }],
|
|
258
|
-
["circle", { cx: 18, cy: 19, r: 3 }],
|
|
259
|
-
["line", { x1: 8.59, x2: 15.42, y1: 13.51, y2: 17.49 }],
|
|
260
|
-
["line", { x1: 15.41, x2: 8.59, y1: 6.51, y2: 10.49 }]
|
|
261
|
-
] },
|
|
262
|
-
"add-below": { els: [
|
|
263
|
-
["path", { d: "M4 6h16" }],
|
|
264
|
-
["path", { d: "M4 11h16" }],
|
|
265
|
-
["path", { d: "M12 14.5v7" }],
|
|
266
|
-
["path", { d: "M8.5 18h7" }]
|
|
267
|
-
] },
|
|
268
|
-
// ---------------------------------------------------------------- 缩进与对齐
|
|
269
|
-
indent: { els: [["path", { d: "M21 5H11" }], ["path", { d: "M21 12H11" }], ["path", { d: "M21 19H11" }], ["path", { d: "m3 8 4 4-4 4" }]] },
|
|
270
|
-
outdent: { els: [["path", { d: "M21 5H11" }], ["path", { d: "M21 12H11" }], ["path", { d: "M21 19H11" }], ["path", { d: "m7 8-4 4 4 4" }]] },
|
|
271
|
-
"align-left": { els: [["path", { d: "M21 5H3" }], ["path", { d: "M15 12H3" }], ["path", { d: "M17 19H3" }]] },
|
|
272
|
-
"align-center": { els: [["path", { d: "M21 5H3" }], ["path", { d: "M17 12H7" }], ["path", { d: "M19 19H5" }]] },
|
|
273
|
-
"align-right": { els: [["path", { d: "M21 5H3" }], ["path", { d: "M21 12H9" }], ["path", { d: "M21 19H7" }]] },
|
|
274
|
-
// ---------------------------------------------------------------- 颜色
|
|
275
|
-
palette: { els: [
|
|
276
|
-
["path", { d: "M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z" }],
|
|
277
|
-
["circle", { cx: 13.5, cy: 6.5, r: 0.5, fill: "currentColor" }],
|
|
278
|
-
["circle", { cx: 17.5, cy: 10.5, r: 0.5, fill: "currentColor" }],
|
|
279
|
-
["circle", { cx: 6.5, cy: 12.5, r: 0.5, fill: "currentColor" }],
|
|
280
|
-
["circle", { cx: 8.5, cy: 7.5, r: 0.5, fill: "currentColor" }]
|
|
281
|
-
] },
|
|
282
|
-
marker: { els: [
|
|
283
|
-
["path", { d: "m9 11-6 6v3h9l3-3" }],
|
|
284
|
-
["path", { d: "m22 12-4.6 4.6a2 2 0 0 1-2.8 0l-5.2-5.2a2 2 0 0 1 0-2.8L14 4" }]
|
|
285
|
-
] },
|
|
286
|
-
// ---------------------------------------------------------------- 表格
|
|
287
|
-
"table-row-plus": { els: [
|
|
288
|
-
["rect", { x: 3, y: 3, width: 18, height: 9, rx: 2 }],
|
|
289
|
-
["path", { d: "M3 7.5h18" }],
|
|
290
|
-
["path", { d: "M12 14.5v7" }],
|
|
291
|
-
["path", { d: "M8.5 18h7" }]
|
|
292
|
-
] },
|
|
293
|
-
"table-col-plus": { els: [
|
|
294
|
-
["rect", { x: 3, y: 3, width: 9, height: 18, rx: 2 }],
|
|
295
|
-
["path", { d: "M7.5 3v18" }],
|
|
296
|
-
["path", { d: "M18 8.5v7" }],
|
|
297
|
-
["path", { d: "M14.5 12h7" }]
|
|
298
|
-
] },
|
|
299
|
-
merge: { els: [
|
|
300
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
301
|
-
["path", { d: "M8.5 9.5 11 12l-2.5 2.5" }],
|
|
302
|
-
["path", { d: "M15.5 9.5 13 12l2.5 2.5" }]
|
|
303
|
-
] },
|
|
304
|
-
split: { els: [
|
|
305
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
306
|
-
["path", { d: "M12 3v18" }],
|
|
307
|
-
["path", { d: "M7.5 9.5 5 12l2.5 2.5" }],
|
|
308
|
-
["path", { d: "M16.5 9.5 19 12l-2.5 2.5" }]
|
|
309
|
-
] },
|
|
310
|
-
// ---------------------------------------------------------------- 其它块
|
|
311
|
-
columns: { els: [
|
|
312
|
-
["rect", { x: 3, y: 3, width: 18, height: 18, rx: 2 }],
|
|
313
|
-
["path", { d: "M9 3v18" }],
|
|
314
|
-
["path", { d: "M15 3v18" }]
|
|
315
|
-
] },
|
|
316
|
-
"mind-map": { els: [
|
|
317
|
-
["rect", { x: 16, y: 16, width: 6, height: 6, rx: 1 }],
|
|
318
|
-
["rect", { x: 2, y: 16, width: 6, height: 6, rx: 1 }],
|
|
319
|
-
["rect", { x: 9, y: 2, width: 6, height: 6, rx: 1 }],
|
|
320
|
-
["path", { d: "M5 16v-3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3" }],
|
|
321
|
-
["path", { d: "M12 12V8" }]
|
|
322
|
-
] }
|
|
323
|
-
};
|
|
324
|
-
function WIcon({ name, size = 18, className, style }) {
|
|
325
|
-
const shape = ICONS[name];
|
|
326
|
-
if (!shape) return null;
|
|
327
|
-
return createElement("svg", {
|
|
328
|
-
className: ["wr-icon", className].filter(Boolean).join(" "),
|
|
329
|
-
width: size,
|
|
330
|
-
height: size,
|
|
331
|
-
viewBox: "0 0 24 24",
|
|
332
|
-
fill: shape.filled ? "currentColor" : "none",
|
|
333
|
-
stroke: "currentColor",
|
|
334
|
-
strokeWidth: 2,
|
|
335
|
-
strokeLinecap: "round",
|
|
336
|
-
strokeLinejoin: "round",
|
|
337
|
-
"aria-hidden": "true",
|
|
338
|
-
style
|
|
339
|
-
}, shape.els.map((element, index) => createElement(element[0], { key: index, ...element[1] })));
|
|
340
|
-
}
|
|
341
|
-
function moveActive(current, count, step, isDisabled = () => false) {
|
|
342
|
-
if (count <= 0) return -1;
|
|
343
|
-
let index = current;
|
|
344
|
-
for (let i = 0; i < count; i += 1) {
|
|
345
|
-
index = (index + step + count) % count;
|
|
346
|
-
if (!isDisabled(index)) return index;
|
|
347
|
-
}
|
|
348
|
-
return -1;
|
|
349
|
-
}
|
|
350
|
-
function filterOptions(options, query) {
|
|
351
|
-
const keyword = query.trim().toLowerCase();
|
|
352
|
-
if (!keyword) return [...options];
|
|
353
|
-
return options.filter((option) => option.label.toLowerCase().includes(keyword));
|
|
354
|
-
}
|
|
355
|
-
const FOCUSABLE = [
|
|
356
|
-
"a[href]",
|
|
357
|
-
"button:not([disabled])",
|
|
358
|
-
"input:not([disabled])",
|
|
359
|
-
"select:not([disabled])",
|
|
360
|
-
"textarea:not([disabled])",
|
|
361
|
-
'[tabindex]:not([tabindex="-1"])'
|
|
362
|
-
].join(",");
|
|
363
|
-
function focusableWithin(container) {
|
|
364
|
-
return Array.from(container.querySelectorAll(FOCUSABLE)).filter((element) => element.offsetParent !== null || element === document.activeElement);
|
|
365
|
-
}
|
|
366
|
-
function trapTab(container, event) {
|
|
367
|
-
if (event.key !== "Tab") return false;
|
|
368
|
-
const items = focusableWithin(container);
|
|
369
|
-
if (!items.length) return true;
|
|
370
|
-
const first = items[0];
|
|
371
|
-
const last = items[items.length - 1];
|
|
372
|
-
const active = document.activeElement;
|
|
373
|
-
if (!active || !container.contains(active)) {
|
|
374
|
-
(event.shiftKey ? last : first).focus();
|
|
375
|
-
return true;
|
|
376
|
-
}
|
|
377
|
-
if (event.shiftKey && active === first) {
|
|
378
|
-
last.focus();
|
|
379
|
-
return true;
|
|
380
|
-
}
|
|
381
|
-
if (!event.shiftKey && active === last) {
|
|
382
|
-
first.focus();
|
|
383
|
-
return true;
|
|
384
|
-
}
|
|
385
|
-
return false;
|
|
386
|
-
}
|
|
387
|
-
const scrollLocks = /* @__PURE__ */ new WeakMap();
|
|
388
|
-
function lockScroll() {
|
|
389
|
-
const body = document.body;
|
|
390
|
-
let lock = scrollLocks.get(body);
|
|
391
|
-
if (!lock) {
|
|
392
|
-
lock = { count: 0, overflow: body.style.overflow, padding: body.style.paddingRight };
|
|
393
|
-
scrollLocks.set(body, lock);
|
|
394
|
-
const scrollbar = window.innerWidth - document.documentElement.clientWidth;
|
|
395
|
-
const padding = parseFloat(getComputedStyle(body).paddingRight) || 0;
|
|
396
|
-
body.style.overflow = "hidden";
|
|
397
|
-
if (scrollbar > 0) body.style.paddingRight = `${padding + scrollbar}px`;
|
|
398
|
-
}
|
|
399
|
-
lock.count++;
|
|
400
|
-
let released = false;
|
|
401
|
-
return {
|
|
402
|
-
release: () => {
|
|
403
|
-
if (released) return;
|
|
404
|
-
released = true;
|
|
405
|
-
if (--lock.count > 0) return;
|
|
406
|
-
body.style.overflow = lock.overflow;
|
|
407
|
-
body.style.paddingRight = lock.padding;
|
|
408
|
-
scrollLocks.delete(body);
|
|
409
|
-
}
|
|
410
|
-
};
|
|
411
|
-
}
|
|
412
|
-
function buttonClasses(variant, size, narrow, block, loading) {
|
|
413
|
-
return [
|
|
414
|
-
"w-button",
|
|
415
|
-
`w-button--${variant}`,
|
|
416
|
-
`w-button--${size}`,
|
|
417
|
-
narrow ? "w-button--narrow" : "",
|
|
418
|
-
block ? "w-button--block" : "",
|
|
419
|
-
loading ? "is-loading" : ""
|
|
420
|
-
].filter(Boolean).join(" ");
|
|
421
|
-
}
|
|
422
|
-
const WButton = forwardRef(function WButton2(props, ref) {
|
|
423
|
-
const {
|
|
424
|
-
children,
|
|
425
|
-
variant,
|
|
426
|
-
size = "small",
|
|
427
|
-
narrow = false,
|
|
428
|
-
block = false,
|
|
429
|
-
loading = false,
|
|
430
|
-
htmlType,
|
|
431
|
-
icon,
|
|
432
|
-
className = "",
|
|
433
|
-
disabled,
|
|
434
|
-
...rest
|
|
435
|
-
} = props;
|
|
436
|
-
const resolved = variant ?? "default";
|
|
437
|
-
return /* @__PURE__ */ jsxs(
|
|
438
|
-
"button",
|
|
439
|
-
{
|
|
440
|
-
...rest,
|
|
441
|
-
ref,
|
|
442
|
-
type: htmlType ?? "button",
|
|
443
|
-
disabled: disabled || loading,
|
|
444
|
-
"aria-busy": loading || void 0,
|
|
445
|
-
"aria-disabled": disabled || void 0,
|
|
446
|
-
className: buttonClasses(resolved, size, narrow, block, loading) + (className ? ` ${className}` : ""),
|
|
447
|
-
children: [
|
|
448
|
-
loading ? /* @__PURE__ */ jsx("span", { className: "w-button__spinner", "aria-hidden": "true", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 16 16", width: "14", height: "14", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
449
|
-
/* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "6", opacity: "0.25" }),
|
|
450
|
-
/* @__PURE__ */ jsx("path", { d: "M14 8a6 6 0 0 0-6-6", strokeLinecap: "round" })
|
|
451
|
-
] }) }) : icon ? /* @__PURE__ */ jsx("span", { className: "w-button__icon", children: icon }) : null,
|
|
452
|
-
children ? /* @__PURE__ */ jsx("span", { className: "w-button__label", children }) : null
|
|
453
|
-
]
|
|
454
|
-
}
|
|
455
|
-
);
|
|
456
|
-
});
|
|
457
|
-
function WAlert({ children, closable = false, closeLabel = "关闭提示", onClose, tone = "info", className = "" }) {
|
|
458
|
-
const [visible, setVisible] = useState(true);
|
|
459
|
-
if (!visible) return null;
|
|
460
|
-
return /* @__PURE__ */ jsxs("div", { role: "status", "aria-label": "提示", className: `w-alert w-alert--${tone}${className ? ` ${className}` : ""}`, children: [
|
|
461
|
-
/* @__PURE__ */ jsx("span", { className: "w-alert__icon", "aria-hidden": "true", children: tone === "warning" ? "⚠" : tone === "danger" ? "❗" : tone === "success" ? "✓" : "ⓘ" }),
|
|
462
|
-
/* @__PURE__ */ jsx("span", { className: "w-alert__body", children }),
|
|
463
|
-
closable && /* @__PURE__ */ jsx(WButton, { variant: "text", size: "mini", "aria-label": closeLabel, onClick: () => {
|
|
464
|
-
setVisible(false);
|
|
465
|
-
onClose == null ? void 0 : onClose();
|
|
466
|
-
}, children: /* @__PURE__ */ jsx(WIcon, { name: "x", size: 14 }) })
|
|
467
|
-
] });
|
|
468
|
-
}
|
|
469
|
-
const LayerContext = createContext(null);
|
|
470
|
-
function LayerProvider({ layer, children }) {
|
|
471
|
-
return /* @__PURE__ */ jsx(LayerContext.Provider, { value: layer, children });
|
|
472
|
-
}
|
|
473
|
-
function useLayer(anchor, panel, open, onClose) {
|
|
474
|
-
const parent = useContext(LayerContext);
|
|
475
|
-
const layer = useRef({ children: /* @__PURE__ */ new Set(), contains: () => false });
|
|
476
|
-
layer.current.contains = (target) => {
|
|
477
|
-
var _a, _b;
|
|
478
|
-
return !!((_a = anchor.current) == null ? void 0 : _a.contains(target)) || !!((_b = panel.current) == null ? void 0 : _b.contains(target)) || [...layer.current.children].some((child) => child.contains(target));
|
|
479
|
-
};
|
|
480
|
-
useEffect(() => {
|
|
481
|
-
if (!open) return;
|
|
482
|
-
parent == null ? void 0 : parent.children.add(layer.current);
|
|
483
|
-
return () => {
|
|
484
|
-
parent == null ? void 0 : parent.children.delete(layer.current);
|
|
485
|
-
};
|
|
486
|
-
}, [open, parent]);
|
|
487
|
-
useEffect(() => {
|
|
488
|
-
if (!open) return;
|
|
489
|
-
const outside = (event) => {
|
|
490
|
-
if (event.target instanceof Node && !layer.current.contains(event.target)) onClose();
|
|
491
|
-
};
|
|
492
|
-
const escape = (event) => {
|
|
493
|
-
var _a;
|
|
494
|
-
if (event.key === "Escape" && !event.isComposing && event.keyCode !== 229 && !event.defaultPrevented && !layer.current.children.size) {
|
|
495
|
-
event.preventDefault();
|
|
496
|
-
event.stopPropagation();
|
|
497
|
-
onClose();
|
|
498
|
-
(_a = anchor.current) == null ? void 0 : _a.focus();
|
|
499
|
-
}
|
|
500
|
-
};
|
|
501
|
-
document.addEventListener("pointerdown", outside, true);
|
|
502
|
-
document.addEventListener("keydown", escape);
|
|
503
|
-
return () => {
|
|
504
|
-
document.removeEventListener("pointerdown", outside, true);
|
|
505
|
-
document.removeEventListener("keydown", escape);
|
|
506
|
-
};
|
|
507
|
-
}, [open, onClose, anchor]);
|
|
508
|
-
return layer.current;
|
|
509
|
-
}
|
|
510
|
-
function useWuiPanel(anchor, panel, open, onClose) {
|
|
511
|
-
useLayer(anchor, panel, open, onClose);
|
|
512
|
-
}
|
|
513
|
-
function WSelect({ label, ariaLabel, value, onChange, options, disabled, size = "small", searchable, width, className = "" }) {
|
|
514
|
-
const { portal } = useContentContext();
|
|
515
|
-
const [open, setOpen] = useState(false), [query, setQuery] = useState("");
|
|
516
|
-
const [active, setActive] = useState(0), [position, setPosition] = useState({ left: -9999, top: -9999 });
|
|
517
|
-
const anchor = useRef(null), panel = useRef(null), search = useRef(null);
|
|
518
|
-
const accessibilityLabel = ariaLabel ?? label;
|
|
519
|
-
const selected = options.find((option) => String(option.value) === String(value));
|
|
520
|
-
const filtered = filterOptions(options, searchable ? query : "");
|
|
521
|
-
const showSearch = searchable && options.length > 6;
|
|
522
|
-
useWuiPanel(anchor, panel, open, () => setOpen(false));
|
|
523
|
-
useLayoutEffect(() => {
|
|
524
|
-
if (!open || !portal) return;
|
|
525
|
-
const measure = () => {
|
|
526
|
-
var _a, _b;
|
|
527
|
-
const trigger = (_a = anchor.current) == null ? void 0 : _a.getBoundingClientRect(), card = (_b = panel.current) == null ? void 0 : _b.getBoundingClientRect();
|
|
528
|
-
if (!trigger || !card) return;
|
|
529
|
-
const placed = placePanel({ trigger, panel: card, position: "bl", gap: 4, viewport: { width: innerWidth, height: innerHeight } });
|
|
530
|
-
setPosition({ left: placed.left, top: placed.top });
|
|
531
|
-
};
|
|
532
|
-
measure();
|
|
533
|
-
const observer = new ResizeObserver(measure);
|
|
534
|
-
if (panel.current) observer.observe(panel.current);
|
|
535
|
-
window.addEventListener("resize", measure);
|
|
536
|
-
window.addEventListener("scroll", measure, true);
|
|
537
|
-
return () => {
|
|
538
|
-
observer.disconnect();
|
|
539
|
-
window.removeEventListener("resize", measure);
|
|
540
|
-
window.removeEventListener("scroll", measure, true);
|
|
541
|
-
};
|
|
542
|
-
}, [open, portal]);
|
|
543
|
-
useEffect(() => {
|
|
544
|
-
if (!open) return;
|
|
545
|
-
setQuery("");
|
|
546
|
-
setActive(Math.max(0, options.findIndex((option) => String(option.value) === String(value))));
|
|
547
|
-
queueMicrotask(() => {
|
|
548
|
-
var _a;
|
|
549
|
-
return (_a = search.current) == null ? void 0 : _a.focus();
|
|
550
|
-
});
|
|
551
|
-
}, [open]);
|
|
552
|
-
function choose(option) {
|
|
553
|
-
if (option.disabled) return;
|
|
554
|
-
setOpen(false);
|
|
555
|
-
if (String(option.value) !== String(value)) onChange(String(option.value));
|
|
556
|
-
}
|
|
557
|
-
function keydown(event) {
|
|
558
|
-
var _a;
|
|
559
|
-
if (event.nativeEvent.isComposing || event.keyCode === 229) return;
|
|
560
|
-
if (event.key === "Escape" && open) {
|
|
561
|
-
event.preventDefault();
|
|
562
|
-
event.stopPropagation();
|
|
563
|
-
setOpen(false);
|
|
564
|
-
(_a = anchor.current) == null ? void 0 : _a.focus();
|
|
565
|
-
return;
|
|
566
|
-
}
|
|
567
|
-
if (!open && (event.key === "Enter" || event.key === " " || event.key === "ArrowDown")) {
|
|
568
|
-
event.preventDefault();
|
|
569
|
-
setOpen(true);
|
|
570
|
-
return;
|
|
571
|
-
}
|
|
572
|
-
if (!open) return;
|
|
573
|
-
if (event.key === "ArrowDown" || event.key === "ArrowUp") {
|
|
574
|
-
event.preventDefault();
|
|
575
|
-
setActive((index) => moveActive(index, filtered.length, event.key === "ArrowDown" ? 1 : -1, (index2) => {
|
|
576
|
-
var _a2;
|
|
577
|
-
return !!((_a2 = filtered[index2]) == null ? void 0 : _a2.disabled);
|
|
578
|
-
}));
|
|
579
|
-
} else if (event.key === "Enter") {
|
|
580
|
-
event.preventDefault();
|
|
581
|
-
const option = filtered[active];
|
|
582
|
-
if (option) choose(option);
|
|
583
|
-
}
|
|
584
|
-
}
|
|
585
|
-
return /* @__PURE__ */ jsxs("div", { className: `w-select w-select--${size}${className ? ` ${className}` : ""}`, style: width ? { width } : void 0, children: [
|
|
586
|
-
/* @__PURE__ */ jsxs(
|
|
587
|
-
"button",
|
|
588
|
-
{
|
|
589
|
-
ref: anchor,
|
|
590
|
-
type: "button",
|
|
591
|
-
className: "w-select__trigger",
|
|
592
|
-
"aria-label": accessibilityLabel,
|
|
593
|
-
"aria-expanded": open,
|
|
594
|
-
"aria-haspopup": "listbox",
|
|
595
|
-
disabled,
|
|
596
|
-
onClick: () => setOpen(!open),
|
|
597
|
-
onKeyDown: keydown,
|
|
598
|
-
children: [
|
|
599
|
-
/* @__PURE__ */ jsx("span", { className: `w-select__label${selected ? "" : " is-placeholder"}`, children: (selected == null ? void 0 : selected.label) ?? label ?? "请选择" }),
|
|
600
|
-
/* @__PURE__ */ jsx("svg", { className: "w-select__caret", viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) })
|
|
601
|
-
]
|
|
602
|
-
}
|
|
603
|
-
),
|
|
604
|
-
open && portal && createPortal(/* @__PURE__ */ jsx(
|
|
605
|
-
"div",
|
|
606
|
-
{
|
|
607
|
-
ref: panel,
|
|
608
|
-
className: "w-popover w-select-popup",
|
|
609
|
-
role: "listbox",
|
|
610
|
-
"aria-label": accessibilityLabel,
|
|
611
|
-
style: { left: position.left, top: position.top },
|
|
612
|
-
children: /* @__PURE__ */ jsxs("div", { className: "w-select-panel", onKeyDown: keydown, children: [
|
|
613
|
-
showSearch && /* @__PURE__ */ jsx(
|
|
614
|
-
"input",
|
|
615
|
-
{
|
|
616
|
-
ref: search,
|
|
617
|
-
className: "w-select-search",
|
|
618
|
-
type: "text",
|
|
619
|
-
"aria-label": `${accessibilityLabel ?? "选项"}搜索`,
|
|
620
|
-
placeholder: "搜索",
|
|
621
|
-
value: query,
|
|
622
|
-
onChange: (event) => {
|
|
623
|
-
setQuery(event.target.value);
|
|
624
|
-
setActive(0);
|
|
625
|
-
},
|
|
626
|
-
autoComplete: "off"
|
|
627
|
-
}
|
|
628
|
-
),
|
|
629
|
-
/* @__PURE__ */ jsxs("div", { className: "w-select-list", role: "listbox", children: [
|
|
630
|
-
filtered.map((option, index) => /* @__PURE__ */ jsx(
|
|
631
|
-
"button",
|
|
632
|
-
{
|
|
633
|
-
type: "button",
|
|
634
|
-
role: "option",
|
|
635
|
-
"aria-selected": String(option.value) === String(value),
|
|
636
|
-
"aria-disabled": option.disabled || void 0,
|
|
637
|
-
disabled: option.disabled,
|
|
638
|
-
className: `w-select-option${index === active ? " is-active" : ""}${String(option.value) === String(value) ? " is-selected" : ""}`,
|
|
639
|
-
onMouseEnter: () => setActive(index),
|
|
640
|
-
onClick: () => choose(option),
|
|
641
|
-
children: option.label
|
|
642
|
-
},
|
|
643
|
-
String(option.value)
|
|
644
|
-
)),
|
|
645
|
-
!filtered.length && /* @__PURE__ */ jsx("div", { className: "w-select-empty", children: "无匹配选项" })
|
|
646
|
-
] })
|
|
647
|
-
] })
|
|
648
|
-
}
|
|
649
|
-
), portal)
|
|
650
|
-
] });
|
|
651
|
-
}
|
|
652
|
-
function WDialog({ title, children, onClose, fullscreen = false, hideFooter = false, footer, workspace = false, className = "", ariaLabel, escToClose = true }) {
|
|
653
|
-
const { portal } = useContentContext(), titleId = useId(), panel = useRef(null);
|
|
654
|
-
const layer = useRef({ children: /* @__PURE__ */ new Set(), contains: () => false });
|
|
655
|
-
layer.current.contains = (target) => {
|
|
656
|
-
var _a;
|
|
657
|
-
return !!((_a = panel.current) == null ? void 0 : _a.contains(target)) || [...layer.current.children].some((child) => child.contains(target));
|
|
658
|
-
};
|
|
659
|
-
const closeRef = useRef(onClose);
|
|
660
|
-
closeRef.current = onClose;
|
|
661
|
-
const escRef = useRef(escToClose);
|
|
662
|
-
escRef.current = escToClose;
|
|
663
|
-
useEffect(() => {
|
|
664
|
-
const previous = document.activeElement;
|
|
665
|
-
const node = panel.current;
|
|
666
|
-
node == null ? void 0 : node.focus();
|
|
667
|
-
const scroll = lockScroll();
|
|
668
|
-
const listener = (event) => {
|
|
669
|
-
if (!node || !node.contains(document.activeElement)) return;
|
|
670
|
-
if (event.key === "Escape" && escRef.current && !layer.current.children.size && !event.isComposing && !event.defaultPrevented) {
|
|
671
|
-
event.preventDefault();
|
|
672
|
-
event.stopPropagation();
|
|
673
|
-
closeRef.current();
|
|
674
|
-
}
|
|
675
|
-
if (trapTab(node, event)) event.preventDefault();
|
|
676
|
-
};
|
|
677
|
-
node == null ? void 0 : node.addEventListener("keydown", listener);
|
|
678
|
-
return () => {
|
|
679
|
-
node == null ? void 0 : node.removeEventListener("keydown", listener);
|
|
680
|
-
scroll.release();
|
|
681
|
-
if (previous == null ? void 0 : previous.isConnected) previous.focus();
|
|
682
|
-
};
|
|
683
|
-
}, [portal]);
|
|
684
|
-
if (!portal) return null;
|
|
685
|
-
const prefix = workspace ? "wd-dialog" : "w-dialog";
|
|
686
|
-
return /* @__PURE__ */ jsx(LayerProvider, { layer: layer.current, children: createPortal(/* @__PURE__ */ jsx("div", { className: `${prefix}-mask${fullscreen ? " is-fullscreen" : ""}`, onPointerDown: (event) => {
|
|
687
|
-
if (event.target === event.currentTarget) onClose();
|
|
688
|
-
}, children: /* @__PURE__ */ jsxs(
|
|
689
|
-
"div",
|
|
690
|
-
{
|
|
691
|
-
ref: panel,
|
|
692
|
-
role: "dialog",
|
|
693
|
-
"aria-modal": "true",
|
|
694
|
-
"aria-labelledby": ariaLabel ? void 0 : titleId,
|
|
695
|
-
tabIndex: -1,
|
|
696
|
-
"aria-label": ariaLabel,
|
|
697
|
-
className: `${prefix}${fullscreen ? " is-fullscreen" : ""}${className ? ` ${className}` : ""}`,
|
|
698
|
-
children: [
|
|
699
|
-
/* @__PURE__ */ jsxs("header", { className: `${prefix}__header`, children: [
|
|
700
|
-
/* @__PURE__ */ jsx("div", { id: titleId, className: `${prefix}__title`, children: title }),
|
|
701
|
-
/* @__PURE__ */ jsx("button", { type: "button", className: `${prefix}__close`, "aria-label": "关闭", onClick: onClose, children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "18", height: "18", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M6 6l12 12M18 6L6 18" }) }) })
|
|
702
|
-
] }),
|
|
703
|
-
/* @__PURE__ */ jsx("div", { className: `${prefix}__body`, children }),
|
|
704
|
-
!hideFooter && footer && /* @__PURE__ */ jsx("footer", { className: `${prefix}__footer`, children: footer })
|
|
705
|
-
]
|
|
706
|
-
}
|
|
707
|
-
) }), portal) });
|
|
708
|
-
}
|
|
709
|
-
export {
|
|
710
|
-
LayerProvider as L,
|
|
711
|
-
WSelect as W,
|
|
712
|
-
WButton as a,
|
|
713
|
-
WIcon as b,
|
|
714
|
-
WDialog as c,
|
|
715
|
-
WAlert as d,
|
|
716
|
-
lockScroll as l,
|
|
717
|
-
placePanel as p,
|
|
718
|
-
trapTab as t,
|
|
719
|
-
useLayer as u
|
|
720
|
-
};
|