@sia.soul/sia-react-ui 0.1.22 → 0.1.24
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/Select-O_yY51vc.d.ts +307 -0
- package/dist/Select-W_xpkpOW.d.cts +307 -0
- package/dist/chart.cjs +1401 -1160
- package/dist/chart.css +21 -0
- package/dist/chart.js +4 -4
- package/dist/{chunk-3TRRBMXY.js → chunk-6R7JY7IY.js} +44 -21
- package/dist/{chunk-TZGUBGA4.js → chunk-6WBABNAX.js} +4 -3
- package/dist/{chunk-OKP4DIQH.js → chunk-GUXAWU63.js} +29 -26
- package/dist/{chunk-QJ4OQNQ4.js → chunk-LA7O3PN4.js} +4 -3
- package/dist/{chunk-7RNS52YG.js → chunk-LIYCU2GU.js} +349 -278
- package/dist/{chunk-KLI65JVD.js → chunk-LRPQ5FGE.js} +68 -186
- package/dist/chunk-NSSPGXNM.js +284 -0
- package/dist/{chunk-YT6E3X2K.js → chunk-OH6YILJW.js} +4 -3
- package/dist/{chunk-RWGSZW32.js → chunk-RGXVPS37.js} +7 -6
- package/dist/{chunk-VN6PIPP7.js → chunk-T2QIW4OO.js} +8 -7
- package/dist/{core-DeZknKwc.d.ts → core-BOzLwiXG.d.ts} +40 -158
- package/dist/{core-C5OnrCi4.d.cts → core-tbb9ZiBY.d.cts} +40 -158
- package/dist/core.cjs +1656 -1443
- package/dist/core.css +60 -0
- package/dist/core.d.cts +2 -2
- package/dist/core.d.ts +2 -2
- package/dist/core.js +8 -6
- package/dist/index.cjs +3801 -3580
- package/dist/index.css +60 -0
- package/dist/index.d.cts +33 -16
- package/dist/index.d.ts +33 -16
- package/dist/index.js +94 -85
- package/dist/markdown-editor.cjs +269 -28
- package/dist/markdown-editor.css +20 -0
- package/dist/markdown-editor.js +2 -2
- package/dist/rich-text-editor.cjs +1156 -1031
- package/dist/rich-text-editor.css +20 -0
- package/dist/rich-text-editor.js +4 -4
- package/dist/{select-date-range-CGRb3-W8.d.ts → select-date-range-BjqFUeU6.d.ts} +1 -1
- package/dist/{select-date-range-DDmYGDD4.d.cts → select-date-range-C9w8z3G8.d.cts} +1 -1
- package/dist/select-date-range.cjs +1209 -1061
- package/dist/select-date-range.css +20 -0
- package/dist/select-date-range.d.cts +2 -2
- package/dist/select-date-range.d.ts +2 -2
- package/dist/select-date-range.js +5 -5
- package/package.json +2 -2
- package/dist/Select-4hGJt3RJ.d.cts +0 -142
- package/dist/Select-BNSE67xn.d.ts +0 -142
- package/dist/chunk-3VJ4CZDQ.js +0 -43
|
@@ -0,0 +1,284 @@
|
|
|
1
|
+
// src/components/titleTooltip.tsx
|
|
2
|
+
import { createRoot } from "react-dom/client";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
var documents = /* @__PURE__ */ new WeakSet();
|
|
5
|
+
function withTitleTooltip(props) {
|
|
6
|
+
if (!props || typeof props !== "object" || !("title" in props)) return props;
|
|
7
|
+
const { title, ...rest } = props;
|
|
8
|
+
if (typeof document !== "undefined") installTitleTooltips(document);
|
|
9
|
+
return { ...rest, "data-sia-title": title == null ? void 0 : String(title) };
|
|
10
|
+
}
|
|
11
|
+
function installTitleTooltips(doc) {
|
|
12
|
+
if (documents.has(doc)) return;
|
|
13
|
+
documents.add(doc);
|
|
14
|
+
let hovered = null;
|
|
15
|
+
let focused = null;
|
|
16
|
+
let active = null;
|
|
17
|
+
let pending = null;
|
|
18
|
+
let timer;
|
|
19
|
+
let root;
|
|
20
|
+
let observer;
|
|
21
|
+
let tooltipId = "";
|
|
22
|
+
const candidate = (target) => {
|
|
23
|
+
if (!(target instanceof Element)) return null;
|
|
24
|
+
const element = target.closest("[data-sia-title]");
|
|
25
|
+
return element?.getAttribute("data-sia-title") && !element.closest(".sia-floating") ? element : null;
|
|
26
|
+
};
|
|
27
|
+
const hasExplicitTooltip = (target) => target instanceof Element && Boolean(target.closest(".sia-floating"));
|
|
28
|
+
const hide = () => {
|
|
29
|
+
clearTimeout(timer);
|
|
30
|
+
pending = null;
|
|
31
|
+
observer?.disconnect();
|
|
32
|
+
observer = void 0;
|
|
33
|
+
if (active) {
|
|
34
|
+
const ids = (active.getAttribute("aria-describedby") ?? "").split(/\s+/).filter((id) => id && id !== tooltipId);
|
|
35
|
+
if (ids.length) active.setAttribute("aria-describedby", ids.join(" "));
|
|
36
|
+
else active.removeAttribute("aria-describedby");
|
|
37
|
+
}
|
|
38
|
+
active = null;
|
|
39
|
+
root?.render(null);
|
|
40
|
+
};
|
|
41
|
+
const render = () => {
|
|
42
|
+
const text = active?.getAttribute("data-sia-title");
|
|
43
|
+
if (!active?.isConnected || !text) {
|
|
44
|
+
hide();
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
if (!root) {
|
|
48
|
+
const host = doc.createElement("div");
|
|
49
|
+
host.setAttribute("data-sia-title-tooltip-host", "");
|
|
50
|
+
doc.body.append(host);
|
|
51
|
+
root = createRoot(host);
|
|
52
|
+
tooltipId = `sia-title-tooltip-${Math.random().toString(36).slice(2)}`;
|
|
53
|
+
}
|
|
54
|
+
const ids = new Set((active.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean));
|
|
55
|
+
ids.add(tooltipId);
|
|
56
|
+
active.setAttribute("aria-describedby", [...ids].join(" "));
|
|
57
|
+
root.render(/* @__PURE__ */ jsx(
|
|
58
|
+
PopupPortal,
|
|
59
|
+
{
|
|
60
|
+
anchorRef: { current: active },
|
|
61
|
+
placement: "top-start",
|
|
62
|
+
id: tooltipId,
|
|
63
|
+
role: "tooltip",
|
|
64
|
+
className: "sia-title-tooltip",
|
|
65
|
+
children: text
|
|
66
|
+
}
|
|
67
|
+
));
|
|
68
|
+
};
|
|
69
|
+
const show = (element) => {
|
|
70
|
+
if (!element && !active && !pending) return;
|
|
71
|
+
if (element && (element === active || element === pending)) return;
|
|
72
|
+
hide();
|
|
73
|
+
if (!element) return;
|
|
74
|
+
pending = element;
|
|
75
|
+
timer = setTimeout(() => {
|
|
76
|
+
pending = null;
|
|
77
|
+
if (!element.isConnected) return;
|
|
78
|
+
active = element;
|
|
79
|
+
render();
|
|
80
|
+
if (!active) return;
|
|
81
|
+
observer = new MutationObserver(() => {
|
|
82
|
+
if (!active?.isConnected) hide();
|
|
83
|
+
else if (active.getAttribute("data-sia-title") !== doc.getElementById(tooltipId)?.textContent) render();
|
|
84
|
+
});
|
|
85
|
+
observer.observe(doc.body, { childList: true, subtree: true, attributes: true, attributeFilter: ["data-sia-title"] });
|
|
86
|
+
}, 250);
|
|
87
|
+
};
|
|
88
|
+
doc.addEventListener("pointerover", (event) => {
|
|
89
|
+
if (event.pointerType === "touch") return;
|
|
90
|
+
hovered = candidate(event.target);
|
|
91
|
+
if (hasExplicitTooltip(event.target)) hide();
|
|
92
|
+
else show(hovered ?? focused);
|
|
93
|
+
}, true);
|
|
94
|
+
doc.addEventListener("pointermove", (event) => {
|
|
95
|
+
if (event.pointerType === "touch" || event.buttons) return;
|
|
96
|
+
hovered = candidate(event.target);
|
|
97
|
+
if (!hasExplicitTooltip(event.target)) show(hovered ?? focused);
|
|
98
|
+
}, true);
|
|
99
|
+
doc.addEventListener("pointerout", (event) => {
|
|
100
|
+
if (event.pointerType === "touch") return;
|
|
101
|
+
hovered = candidate(event.relatedTarget);
|
|
102
|
+
if (hasExplicitTooltip(event.relatedTarget)) hide();
|
|
103
|
+
else show(hovered ?? focused);
|
|
104
|
+
}, true);
|
|
105
|
+
doc.addEventListener("focusin", (event) => {
|
|
106
|
+
focused = candidate(event.target);
|
|
107
|
+
if (hasExplicitTooltip(event.target)) hide();
|
|
108
|
+
else show(focused ?? hovered);
|
|
109
|
+
}, true);
|
|
110
|
+
doc.addEventListener("focusout", (event) => {
|
|
111
|
+
focused = candidate(event.relatedTarget);
|
|
112
|
+
show(hovered ?? focused);
|
|
113
|
+
}, true);
|
|
114
|
+
doc.addEventListener("pointerdown", hide, true);
|
|
115
|
+
doc.addEventListener("keydown", (event) => {
|
|
116
|
+
if (event.key === "Escape") hide();
|
|
117
|
+
}, true);
|
|
118
|
+
doc.addEventListener("scroll", hide, true);
|
|
119
|
+
doc.defaultView?.addEventListener("blur", () => {
|
|
120
|
+
hovered = focused = null;
|
|
121
|
+
hide();
|
|
122
|
+
});
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// src/components/PopupPortal.tsx
|
|
126
|
+
import { forwardRef, useLayoutEffect, useRef, useState } from "react";
|
|
127
|
+
import { createPortal } from "react-dom";
|
|
128
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
129
|
+
function setForwardedRef(ref, value) {
|
|
130
|
+
if (typeof ref === "function") ref(value);
|
|
131
|
+
else if (ref) ref.current = value;
|
|
132
|
+
}
|
|
133
|
+
function clamp(value, min, max) {
|
|
134
|
+
return Math.min(Math.max(value, min), Math.max(min, max));
|
|
135
|
+
}
|
|
136
|
+
var PopupPortal = forwardRef(function PopupPortal2({
|
|
137
|
+
anchorRef,
|
|
138
|
+
open = true,
|
|
139
|
+
placement = "bottom-start",
|
|
140
|
+
offset = 6,
|
|
141
|
+
viewportPadding = 8,
|
|
142
|
+
className = "",
|
|
143
|
+
style,
|
|
144
|
+
children,
|
|
145
|
+
...props
|
|
146
|
+
}, forwardedRef) {
|
|
147
|
+
const popupRef = useRef(null);
|
|
148
|
+
const [position, setPosition] = useState();
|
|
149
|
+
useLayoutEffect(() => {
|
|
150
|
+
if (!open || typeof document === "undefined") {
|
|
151
|
+
setPosition(void 0);
|
|
152
|
+
return;
|
|
153
|
+
}
|
|
154
|
+
const update = () => {
|
|
155
|
+
const anchor = anchorRef.current;
|
|
156
|
+
const popup = popupRef.current;
|
|
157
|
+
if (!anchor || !popup) return;
|
|
158
|
+
const anchorRect = anchor.getBoundingClientRect();
|
|
159
|
+
const popupRect = popup.getBoundingClientRect();
|
|
160
|
+
const viewportWidth = document.documentElement.clientWidth;
|
|
161
|
+
const viewportHeight = document.documentElement.clientHeight;
|
|
162
|
+
let resolvedPlacement = placement;
|
|
163
|
+
const availableBelow = Math.max(0, viewportHeight - viewportPadding - anchorRect.bottom - offset);
|
|
164
|
+
const availableAbove = Math.max(0, anchorRect.top - offset - viewportPadding);
|
|
165
|
+
const availableRight = Math.max(0, viewportWidth - viewportPadding - anchorRect.right - offset);
|
|
166
|
+
const availableLeft = Math.max(0, anchorRect.left - offset - viewportPadding);
|
|
167
|
+
const horizontalSide = placement.startsWith("right") || placement.startsWith("left");
|
|
168
|
+
if (horizontalSide) {
|
|
169
|
+
const prefersRight = placement.startsWith("right");
|
|
170
|
+
const fitsRight = popupRect.width <= availableRight;
|
|
171
|
+
const fitsLeft = popupRect.width <= availableLeft;
|
|
172
|
+
if (prefersRight && !fitsRight && (fitsLeft || availableLeft > availableRight)) {
|
|
173
|
+
resolvedPlacement = placement.replace("right", "left");
|
|
174
|
+
} else if (!prefersRight && !fitsLeft && (fitsRight || availableRight > availableLeft)) {
|
|
175
|
+
resolvedPlacement = placement.replace("left", "right");
|
|
176
|
+
}
|
|
177
|
+
} else {
|
|
178
|
+
const prefersBottom = placement.startsWith("bottom");
|
|
179
|
+
const fitsBelow = popupRect.height <= availableBelow;
|
|
180
|
+
const fitsAbove = popupRect.height <= availableAbove;
|
|
181
|
+
if (prefersBottom && !fitsBelow && (fitsAbove || availableAbove > availableBelow)) {
|
|
182
|
+
resolvedPlacement = placement.replace("bottom", "top");
|
|
183
|
+
} else if (!prefersBottom && !fitsAbove && (fitsBelow || availableBelow > availableAbove)) {
|
|
184
|
+
resolvedPlacement = placement.replace("top", "bottom");
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
const resolvedHorizontalSide = resolvedPlacement.startsWith("right") || resolvedPlacement.startsWith("left");
|
|
188
|
+
const top = resolvedHorizontalSide ? resolvedPlacement.endsWith("end") ? anchorRect.bottom - popupRect.height : anchorRect.top : resolvedPlacement.startsWith("bottom") ? anchorRect.bottom + offset : anchorRect.top - popupRect.height - offset;
|
|
189
|
+
const availableHeight = resolvedHorizontalSide ? Math.max(0, viewportHeight - viewportPadding * 2) : resolvedPlacement.startsWith("bottom") ? availableBelow : availableAbove;
|
|
190
|
+
const alignedLeft = resolvedHorizontalSide ? resolvedPlacement.startsWith("right") ? anchorRect.right + offset : anchorRect.left - popupRect.width - offset : resolvedPlacement.endsWith("end") ? anchorRect.right - popupRect.width : anchorRect.left;
|
|
191
|
+
const next = {
|
|
192
|
+
top: clamp(top, viewportPadding, viewportHeight - popupRect.height - viewportPadding),
|
|
193
|
+
left: clamp(alignedLeft, viewportPadding, viewportWidth - popupRect.width - viewportPadding),
|
|
194
|
+
anchorWidth: anchorRect.width,
|
|
195
|
+
availableHeight,
|
|
196
|
+
placement: resolvedPlacement
|
|
197
|
+
};
|
|
198
|
+
setPosition((current) => current && current.top === next.top && current.left === next.left && current.anchorWidth === next.anchorWidth && current.availableHeight === next.availableHeight && current.placement === next.placement ? current : next);
|
|
199
|
+
};
|
|
200
|
+
update();
|
|
201
|
+
window.addEventListener("resize", update);
|
|
202
|
+
window.addEventListener("scroll", update, true);
|
|
203
|
+
const observer = new ResizeObserver(update);
|
|
204
|
+
if (anchorRef.current) observer.observe(anchorRef.current);
|
|
205
|
+
if (popupRef.current) observer.observe(popupRef.current);
|
|
206
|
+
return () => {
|
|
207
|
+
window.removeEventListener("resize", update);
|
|
208
|
+
window.removeEventListener("scroll", update, true);
|
|
209
|
+
observer.disconnect();
|
|
210
|
+
};
|
|
211
|
+
}, [anchorRef, offset, open, placement, viewportPadding]);
|
|
212
|
+
if (!open || typeof document === "undefined") return null;
|
|
213
|
+
return createPortal(
|
|
214
|
+
/* @__PURE__ */ jsx2(
|
|
215
|
+
"div",
|
|
216
|
+
{
|
|
217
|
+
ref: (node) => {
|
|
218
|
+
popupRef.current = node;
|
|
219
|
+
setForwardedRef(forwardedRef, node);
|
|
220
|
+
},
|
|
221
|
+
className: `sia-popup-portal ${className}`.trim(),
|
|
222
|
+
"data-sia-popup-layer": "",
|
|
223
|
+
"data-placement": position?.placement ?? placement,
|
|
224
|
+
style: {
|
|
225
|
+
...style,
|
|
226
|
+
"--sia-popup-anchor-width": `${position?.anchorWidth ?? anchorRef.current?.getBoundingClientRect().width ?? 0}px`,
|
|
227
|
+
"--sia-popup-available-height": position ? `${position.availableHeight}px` : void 0,
|
|
228
|
+
top: position?.top ?? 0,
|
|
229
|
+
left: position?.left ?? 0,
|
|
230
|
+
visibility: position ? "visible" : "hidden"
|
|
231
|
+
},
|
|
232
|
+
...withTitleTooltip(props),
|
|
233
|
+
children
|
|
234
|
+
}
|
|
235
|
+
),
|
|
236
|
+
document.body
|
|
237
|
+
);
|
|
238
|
+
});
|
|
239
|
+
|
|
240
|
+
// src/components/shared.ts
|
|
241
|
+
import { createContext, useCallback, useContext, useState as useState2 } from "react";
|
|
242
|
+
var ControlSizeContext = createContext("medium");
|
|
243
|
+
function useControlSize(size) {
|
|
244
|
+
const inherited = useContext(ControlSizeContext);
|
|
245
|
+
return size ?? inherited;
|
|
246
|
+
}
|
|
247
|
+
var PlaceholderModeContext = createContext("default");
|
|
248
|
+
function usePlaceholderMode(mode) {
|
|
249
|
+
const inherited = useContext(PlaceholderModeContext);
|
|
250
|
+
return mode ?? inherited;
|
|
251
|
+
}
|
|
252
|
+
function useControllableState({ value, defaultValue, onChange }) {
|
|
253
|
+
const [internalValue, setInternalValue] = useState2(defaultValue);
|
|
254
|
+
const controlled = value !== void 0;
|
|
255
|
+
const currentValue = controlled ? value : internalValue;
|
|
256
|
+
const setValue = useCallback((nextValue) => {
|
|
257
|
+
if (Object.is(currentValue, nextValue)) return;
|
|
258
|
+
if (!controlled) setInternalValue(nextValue);
|
|
259
|
+
onChange?.(nextValue);
|
|
260
|
+
}, [controlled, currentValue, onChange]);
|
|
261
|
+
return [currentValue, setValue];
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
// src/components/FloatingPlaceholder.tsx
|
|
265
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
266
|
+
function useFloatingPlaceholder({ mode, placeholder, filled, active = false }) {
|
|
267
|
+
const enabled = usePlaceholderMode(mode) === "floating" && Boolean(placeholder);
|
|
268
|
+
return {
|
|
269
|
+
enabled,
|
|
270
|
+
className: enabled ? ` sia-placeholder-floating${filled ? " sia-placeholder-floating--filled" : ""}${active ? " sia-placeholder-floating--active" : ""}` : "",
|
|
271
|
+
label: enabled ? /* @__PURE__ */ jsx3("span", { className: "sia-floating-placeholder", "aria-hidden": "true", children: placeholder }) : null
|
|
272
|
+
};
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
export {
|
|
276
|
+
PopupPortal,
|
|
277
|
+
withTitleTooltip,
|
|
278
|
+
ControlSizeContext,
|
|
279
|
+
useControlSize,
|
|
280
|
+
PlaceholderModeContext,
|
|
281
|
+
usePlaceholderMode,
|
|
282
|
+
useControllableState,
|
|
283
|
+
useFloatingPlaceholder
|
|
284
|
+
};
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import {
|
|
2
2
|
useControlSize,
|
|
3
|
-
useFloatingPlaceholder
|
|
4
|
-
|
|
3
|
+
useFloatingPlaceholder,
|
|
4
|
+
withTitleTooltip
|
|
5
|
+
} from "./chunk-NSSPGXNM.js";
|
|
5
6
|
|
|
6
7
|
// src/components/TextArea.tsx
|
|
7
8
|
import { forwardRef, useId, useState } from "react";
|
|
@@ -39,7 +40,7 @@ var TextArea = forwardRef(function TextArea2({
|
|
|
39
40
|
/* @__PURE__ */ jsx(
|
|
40
41
|
"textarea",
|
|
41
42
|
{
|
|
42
|
-
...props,
|
|
43
|
+
...withTitleTooltip(props),
|
|
43
44
|
ref,
|
|
44
45
|
id: textAreaId,
|
|
45
46
|
className: "sia-textarea",
|
|
@@ -2,13 +2,14 @@ import {
|
|
|
2
2
|
Dropdown,
|
|
3
3
|
Icon,
|
|
4
4
|
Input
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-LRPQ5FGE.js";
|
|
6
6
|
import {
|
|
7
7
|
Button
|
|
8
|
-
} from "./chunk-
|
|
8
|
+
} from "./chunk-6WBABNAX.js";
|
|
9
9
|
import {
|
|
10
|
-
useFloatingPlaceholder
|
|
11
|
-
|
|
10
|
+
useFloatingPlaceholder,
|
|
11
|
+
withTitleTooltip
|
|
12
|
+
} from "./chunk-NSSPGXNM.js";
|
|
12
13
|
|
|
13
14
|
// src/components/RichTextEditor.tsx
|
|
14
15
|
import { useEffect, useMemo, useRef, useState } from "react";
|
|
@@ -42,7 +43,7 @@ function sanitizeContent(value) {
|
|
|
42
43
|
function RichTextContent({ content, emptyText = "\u6682\u65E0\u5185\u5BB9", className = "", ...props }) {
|
|
43
44
|
const html = useMemo(() => sanitizeContent(content), [content]);
|
|
44
45
|
if (!html.trim()) return /* @__PURE__ */ jsx("div", { className: `sia-rich-text-content sia-rich-text-content--empty ${className}`.trim(), children: emptyText });
|
|
45
|
-
return /* @__PURE__ */ jsx("article", { className: `sia-rich-text-content ${className}`.trim(), dangerouslySetInnerHTML: { __html: html }, ...props });
|
|
46
|
+
return /* @__PURE__ */ jsx("article", { className: `sia-rich-text-content ${className}`.trim(), dangerouslySetInnerHTML: { __html: html }, ...withTitleTooltip(props) });
|
|
46
47
|
}
|
|
47
48
|
function RichTextEditor({
|
|
48
49
|
value,
|
|
@@ -222,7 +223,7 @@ function RichTextEditor({
|
|
|
222
223
|
}
|
|
223
224
|
};
|
|
224
225
|
const floating = useFloatingPlaceholder({ mode: placeholderMode, placeholder, filled: editor ? !editor.isEmpty : Boolean(value ?? defaultValue) });
|
|
225
|
-
return /* @__PURE__ */ jsxs("div", { ...props, id, style: mergedStyle, className: `sia-rich-text-editor${floating.className}${disabled ? " is-disabled" : ""} sia-rich-text-editor--${toolbar} ${className}`.trim(), children: [
|
|
226
|
+
return /* @__PURE__ */ jsxs("div", { ...withTitleTooltip(props), id, style: mergedStyle, className: `sia-rich-text-editor${floating.className}${disabled ? " is-disabled" : ""} sia-rich-text-editor--${toolbar} ${className}`.trim(), children: [
|
|
226
227
|
floating.label,
|
|
227
228
|
/* @__PURE__ */ jsxs("div", { className: "sia-rich-text-editor__toolbar", "aria-label": "\u6587\u672C\u683C\u5F0F\u5DE5\u5177\u680F", children: [
|
|
228
229
|
/* @__PURE__ */ jsxs("div", { className: "sia-rich-text-editor__toolbar-main", children: [
|
|
@@ -1,15 +1,16 @@
|
|
|
1
1
|
import {
|
|
2
2
|
Select
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-6R7JY7IY.js";
|
|
4
4
|
import {
|
|
5
|
-
Icon
|
|
6
|
-
|
|
7
|
-
} from "./chunk-KLI65JVD.js";
|
|
5
|
+
Icon
|
|
6
|
+
} from "./chunk-LRPQ5FGE.js";
|
|
8
7
|
import {
|
|
8
|
+
PopupPortal,
|
|
9
9
|
useControlSize,
|
|
10
10
|
useControllableState,
|
|
11
|
-
useFloatingPlaceholder
|
|
12
|
-
|
|
11
|
+
useFloatingPlaceholder,
|
|
12
|
+
withTitleTooltip
|
|
13
|
+
} from "./chunk-NSSPGXNM.js";
|
|
13
14
|
|
|
14
15
|
// src/components/DatePicker.tsx
|
|
15
16
|
import { useEffect, useId, useMemo, useRef as useRef2, useState } from "react";
|
|
@@ -840,7 +841,7 @@ function SelectDateRange({
|
|
|
840
841
|
const size = useControlSize(sizeProp);
|
|
841
842
|
const initialValue = defaultValue ?? { select: options[0]?.value ?? "", range: ["", ""] };
|
|
842
843
|
const [currentValue, setCurrentValue] = useControllableState({ value: value === void 0 ? void 0 : value && typeof value === "object" ? value : { select: "", range: ["", ""] }, defaultValue: initialValue, onChange });
|
|
843
|
-
return /* @__PURE__ */ jsxs3("div", { className: `sia-select-date-range sia-select-date-range--${size} ${className}`.trim(), role: "group", "aria-label": `${selectAriaLabel}\u4E0E${rangeAriaLabel}`, ...props, style: { ...style, "--sia-select-date-range-select-width": typeof selectWidth === "number" ? `${selectWidth}px` : selectWidth }, children: [
|
|
844
|
+
return /* @__PURE__ */ jsxs3("div", { className: `sia-select-date-range sia-select-date-range--${size} ${className}`.trim(), role: "group", "aria-label": `${selectAriaLabel}\u4E0E${rangeAriaLabel}`, ...withTitleTooltip(props), style: { ...style, "--sia-select-date-range-select-width": typeof selectWidth === "number" ? `${selectWidth}px` : selectWidth }, children: [
|
|
844
845
|
/* @__PURE__ */ jsx3(
|
|
845
846
|
Select,
|
|
846
847
|
{
|
|
@@ -1,46 +1,46 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { ReactNode, HTMLAttributes, CSSProperties, MouseEvent, ReactElement, ImgHTMLAttributes, InputHTMLAttributes, MouseEventHandler, AnchorHTMLAttributes, ButtonHTMLAttributes } from 'react';
|
|
3
|
+
import { B as ButtonProps, f as Button } from './Select-O_yY51vc.js';
|
|
3
4
|
import { C as ControlSize, a as ControlStatus, I as InputPlaceholderMode } from './shared-Bx4B28Wh.js';
|
|
4
|
-
import './Select-BNSE67xn.js';
|
|
5
5
|
|
|
6
|
-
/**
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
/** small / medium / large 高度为 22 / 30 / 38px;默认继承 Form,组件自身 size 优先 */
|
|
18
|
-
size?: ButtonSize;
|
|
19
|
-
/**
|
|
20
|
-
* 显示加载状态并禁止重复点击
|
|
21
|
-
* @defaultValue false
|
|
22
|
-
*/
|
|
6
|
+
/** 单个工具栏操作及其下拉菜单。 */
|
|
7
|
+
interface ToolbarItem {
|
|
8
|
+
/** 操作唯一标识,点击后由 onAction 返回。 */
|
|
9
|
+
key: string;
|
|
10
|
+
/** 按钮与溢出菜单共用的文案。 */
|
|
11
|
+
label: ReactNode;
|
|
12
|
+
/** 按钮与菜单图标。 */
|
|
13
|
+
icon?: ReactNode;
|
|
14
|
+
/** 禁用该操作及其下级操作。 */
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
/** 主按钮的等待状态,等待期间不可再次触发。 */
|
|
23
17
|
loading?: boolean;
|
|
24
|
-
/**
|
|
25
|
-
* 宽度撑满父容器
|
|
26
|
-
* @defaultValue false
|
|
27
|
-
*/
|
|
28
|
-
block?: boolean;
|
|
29
|
-
/**
|
|
30
|
-
* 危险操作样式
|
|
31
|
-
* @defaultValue false
|
|
32
|
-
*/
|
|
18
|
+
/** 危险操作样式。 */
|
|
33
19
|
danger?: boolean;
|
|
34
|
-
/**
|
|
35
|
-
|
|
36
|
-
/**
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
20
|
+
/** 完全隐藏该操作,不占宽度,也不进入溢出菜单。 */
|
|
21
|
+
hidden?: boolean;
|
|
22
|
+
/** 下拉操作;split 为 true 时主按钮和下拉箭头可分别操作。 */
|
|
23
|
+
children?: readonly ToolbarItem[];
|
|
24
|
+
/** 使用独立的主操作按钮和下拉箭头。 */
|
|
25
|
+
split?: boolean;
|
|
26
|
+
}
|
|
27
|
+
/** 单行自适应工具栏的配置。 */
|
|
28
|
+
interface ToolbarProps {
|
|
29
|
+
/** 按展示顺序排列的操作配置。 */
|
|
30
|
+
items: readonly ToolbarItem[];
|
|
31
|
+
/** 业务处理回调;异步状态由调用方通过 loading/disabled 控制。 */
|
|
32
|
+
onAction?: (key: string) => void | Promise<void>;
|
|
33
|
+
/** 禁用全部操作。 */
|
|
34
|
+
disabled?: boolean;
|
|
35
|
+
/** 按钮尺寸,默认 small。 */
|
|
36
|
+
size?: ButtonProps["size"];
|
|
37
|
+
/** 按钮样式,默认 link。 */
|
|
38
|
+
variant?: ButtonProps["variant"];
|
|
39
|
+
/** 溢出入口的无障碍名称与提示,默认“更多操作”。 */
|
|
40
|
+
overflowLabel?: string;
|
|
41
41
|
}
|
|
42
|
-
/**
|
|
43
|
-
declare
|
|
42
|
+
/** 单行操作栏;宽度不足时按原顺序将尾部操作收纳到 hover 菜单。 */
|
|
43
|
+
declare function Toolbar({ items, onAction, disabled, size, variant, overflowLabel }: ToolbarProps): react.JSX.Element;
|
|
44
44
|
|
|
45
45
|
/** 卡片强调装饰的显示方式。 */
|
|
46
46
|
type CardAccent = "primary" | "success" | "warning" | "error";
|
|
@@ -298,7 +298,7 @@ declare const iconPaths: {
|
|
|
298
298
|
/** 可用的线框图标名称。 */
|
|
299
299
|
type IconName = keyof typeof iconPaths;
|
|
300
300
|
/** 可用线框图标名称集合。 */
|
|
301
|
-
declare const ICON_NAMES: readonly ("
|
|
301
|
+
declare const ICON_NAMES: readonly ("search" | "bold" | "link" | "copy" | "move" | "zoom-in" | "zoom-out" | "table" | "italic" | "underline" | "menu" | "send" | "close" | "pause" | "play" | "message" | "code" | "video" | "filter" | "image" | "stop" | "warning" | "notepad-file" | "notepad-folder" | "notepad-virtual-folder" | "step-backward" | "step-forward" | "fast-backward" | "fast-forward" | "corner-up-left" | "corner-up-right" | "swap-horizontal" | "swap-vertical" | "expand" | "shrink" | "fullscreen" | "fullscreen-exit" | "menu-fold" | "menu-unfold" | "login" | "logout" | "vertical-align-top" | "vertical-align-middle" | "vertical-align-bottom" | "square-plus" | "square-minus" | "square-check" | "square-close" | "tab-plus" | "folder-plus" | "pin" | "pin-off" | "help-circle" | "save" | "clipboard" | "clipboard-check" | "file-plus" | "file-check" | "file-warning" | "file-spreadsheet" | "align-left" | "align-center" | "align-right" | "align-justify" | "strikethrough" | "list-ordered" | "list-unordered" | "eraser" | "highlighter" | "columns" | "rows" | "bar-chart" | "line-chart" | "pie-chart" | "area-chart" | "activity" | "trending-up" | "trending-down" | "database" | "cloud" | "cloud-download" | "cloud-upload" | "server" | "desktop" | "laptop" | "mobile" | "tablet" | "printer" | "camera" | "microphone" | "volume-up" | "volume-off" | "speaker-wave" | "speaker-muted" | "wifi" | "power" | "key" | "shield" | "shield-check" | "bug" | "bulb" | "rocket" | "target" | "trophy" | "shopping-cart" | "shopping-bag" | "shop" | "wallet" | "bank" | "calculator" | "tag" | "tags" | "comments" | "share" | "paperclip" | "location" | "compass" | "car" | "truck" | "gift" | "coffee" | "experiment" | "tool" | "appstore" | "puzzle" | "partition" | "branches" | "scan" | "qr-code" | "barcode" | "user-plus" | "user-minus" | "smile" | "meh" | "frown" | "game-cultivator" | "game-swordsman" | "game-spirit-wolf" | "game-gem" | "game-ingot" | "game-sword" | "game-robe" | "game-pants" | "game-pendant" | "game-necklace" | "game-pill" | "game-potion" | "game-elixir-jar" | "game-flame" | "game-soul-elixir" | "game-herb" | "game-meditate" | "game-backpack" | "game-qi" | "plus" | "minus" | "check" | "info" | "question" | "circle-check" | "circle-close" | "circle-plus" | "circle-minus" | "chevron-left" | "chevron-right" | "chevron-up" | "chevron-down" | "double-left" | "double-right" | "arrow-left" | "arrow-right" | "arrow-up" | "arrow-down" | "more-horizontal" | "more-vertical" | "home" | "user" | "users" | "settings" | "edit" | "trash" | "scissors" | "undo" | "redo" | "download" | "upload" | "refresh" | "loader" | "calendar" | "clock" | "mail" | "phone" | "external-link" | "eye" | "eye-off" | "lock" | "unlock" | "bell" | "star" | "heart" | "file" | "folder" | "sort-ascending" | "sort-descending" | "book" | "component" | "token" | "sun" | "moon" | "github")[];
|
|
302
302
|
declare const filledIconPaths: {
|
|
303
303
|
info: react.JSX.Element;
|
|
304
304
|
question: react.JSX.Element;
|
|
@@ -334,7 +334,7 @@ type FilledIconName = keyof typeof filledIconPaths;
|
|
|
334
334
|
/** 图标采用线框还是填充样式。 */
|
|
335
335
|
type IconVariant = "outline" | "filled";
|
|
336
336
|
/** 可用填充图标名称集合。 */
|
|
337
|
-
declare const FILLED_ICON_NAMES: readonly ("warning" | "info" | "question" | "circle-check" | "circle-close" | "circle-plus" | "circle-minus" | "home" | "user" | "users" | "trash" | "calendar" | "clock" | "mail" | "lock" | "unlock" | "bell" | "star" | "heart" | "file" | "folder" | "
|
|
337
|
+
declare const FILLED_ICON_NAMES: readonly ("pause" | "play" | "filter" | "image" | "warning" | "info" | "question" | "circle-check" | "circle-close" | "circle-plus" | "circle-minus" | "home" | "user" | "users" | "trash" | "calendar" | "clock" | "mail" | "lock" | "unlock" | "bell" | "star" | "heart" | "file" | "folder" | "book" | "component" | "token")[];
|
|
338
338
|
/** 图标的属性配置。 */
|
|
339
339
|
interface IconProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"> {
|
|
340
340
|
/** 名称或字段标识。 */
|
|
@@ -1918,124 +1918,6 @@ declare const Upload: typeof UploadRoot & {
|
|
|
1918
1918
|
LIST_IGNORE: symbol;
|
|
1919
1919
|
};
|
|
1920
1920
|
|
|
1921
|
-
/** 弹层挂载节点或返回挂载节点的函数。 */
|
|
1922
|
-
type OverlayContainer = HTMLElement | (() => HTMLElement);
|
|
1923
|
-
|
|
1924
|
-
/** 模态框的类型标识。 */
|
|
1925
|
-
type ModalType = "default" | "info" | "success" | "warning" | "error" | "confirm";
|
|
1926
|
-
/** 确认操作的返回值;false 阻止关闭,Promise 可用于等待异步操作。 */
|
|
1927
|
-
type ModalActionResult = void | boolean | Promise<void | boolean>;
|
|
1928
|
-
/** 模态框的属性配置。 */
|
|
1929
|
-
interface ModalProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "onSubmit"> {
|
|
1930
|
-
/** 是否显示对话框 */
|
|
1931
|
-
open: boolean;
|
|
1932
|
-
/** 标题 */
|
|
1933
|
-
title?: ReactNode;
|
|
1934
|
-
/** 子内容;组件嵌套内容或当前节点的子项。 */
|
|
1935
|
-
children?: ReactNode;
|
|
1936
|
-
/** 自定义底部操作区,传 null 隐藏 */
|
|
1937
|
-
footer?: ReactNode | null;
|
|
1938
|
-
/** 默认底部操作区左侧的扩展内容。 */
|
|
1939
|
-
footerExtra?: ReactNode;
|
|
1940
|
-
/**
|
|
1941
|
-
* 类型标识,用于选择对应的表现形式。
|
|
1942
|
-
* @defaultValue "default"
|
|
1943
|
-
*/
|
|
1944
|
-
type?: ModalType;
|
|
1945
|
-
/**
|
|
1946
|
-
* 确定按钮文案。
|
|
1947
|
-
* @defaultValue "确定"
|
|
1948
|
-
*/
|
|
1949
|
-
okText?: ReactNode;
|
|
1950
|
-
/**
|
|
1951
|
-
* 取消按钮文案。
|
|
1952
|
-
* @defaultValue "取消"
|
|
1953
|
-
*/
|
|
1954
|
-
cancelText?: ReactNode;
|
|
1955
|
-
/**
|
|
1956
|
-
* 是否显示取消按钮。
|
|
1957
|
-
* @defaultValue type === "default" || type === "confirm"
|
|
1958
|
-
*/
|
|
1959
|
-
showCancel?: boolean;
|
|
1960
|
-
/**
|
|
1961
|
-
* 确定操作是否正在执行;为 true 时阻止重复提交和关闭。
|
|
1962
|
-
* @defaultValue false
|
|
1963
|
-
*/
|
|
1964
|
-
confirmLoading?: boolean;
|
|
1965
|
-
/** 确定按钮的 Button 属性。 */
|
|
1966
|
-
okButtonProps?: ButtonProps;
|
|
1967
|
-
/** 取消按钮的 Button 属性。 */
|
|
1968
|
-
cancelButtonProps?: ButtonProps;
|
|
1969
|
-
/**
|
|
1970
|
-
* 是否显示关闭入口。
|
|
1971
|
-
* @defaultValue true
|
|
1972
|
-
*/
|
|
1973
|
-
closable?: boolean;
|
|
1974
|
-
/**
|
|
1975
|
-
* 点击遮罩时是否允许关闭。
|
|
1976
|
-
* @defaultValue true
|
|
1977
|
-
*/
|
|
1978
|
-
maskClosable?: boolean;
|
|
1979
|
-
/**
|
|
1980
|
-
* 是否允许通过 Esc 等键盘操作关闭。
|
|
1981
|
-
* @defaultValue true
|
|
1982
|
-
*/
|
|
1983
|
-
keyboard?: boolean;
|
|
1984
|
-
/**
|
|
1985
|
-
* 弹框是否垂直居中。
|
|
1986
|
-
* @defaultValue false
|
|
1987
|
-
*/
|
|
1988
|
-
centered?: boolean;
|
|
1989
|
-
/**
|
|
1990
|
-
* 宽度;数值按像素处理,字符串可使用 CSS 尺寸。
|
|
1991
|
-
* @defaultValue 520
|
|
1992
|
-
*/
|
|
1993
|
-
width?: number | string;
|
|
1994
|
-
/**
|
|
1995
|
-
组件或浮层的堆叠层级。
|
|
1996
|
-
* @defaultValue 1000
|
|
1997
|
-
*/
|
|
1998
|
-
zIndex?: number;
|
|
1999
|
-
/** 弹层挂载目标;可提供元素或返回元素的函数,默认挂载到页面容器。 */
|
|
2000
|
-
getContainer?: OverlayContainer;
|
|
2001
|
-
/** 确认回调,支持 Promise 与返回 false 阻止关闭 */
|
|
2002
|
-
onOk?: () => ModalActionResult;
|
|
2003
|
-
/** 用户取消或通过关闭入口退出时调用。 */
|
|
2004
|
-
onCancel?: () => void;
|
|
2005
|
-
/** 打开状态变化回调 */
|
|
2006
|
-
onOpenChange?: (open: boolean) => void;
|
|
2007
|
-
/** 动画完成后触发,适用于聚焦内容和释放外部挂载点。 */
|
|
2008
|
-
afterOpenChange?: (open: boolean) => void;
|
|
2009
|
-
}
|
|
2010
|
-
/** ModalOpen的配置。 */
|
|
2011
|
-
interface ModalOpenConfig extends Omit<ModalProps, "open"> {
|
|
2012
|
-
}
|
|
2013
|
-
/** OverlayApi的操作句柄。 */
|
|
2014
|
-
interface OverlayApiHandle<T> {
|
|
2015
|
-
/** 关闭弹层并在退出动画后释放挂载点。程序化关闭不会模拟用户取消按钮点击。 */
|
|
2016
|
-
destroy: () => void;
|
|
2017
|
-
/** 合并更新已打开弹层的配置,未提供的属性保留原值。 */
|
|
2018
|
-
update: (next: Partial<T>) => void;
|
|
2019
|
-
}
|
|
2020
|
-
declare function openModal(config: ModalOpenConfig): OverlayApiHandle<ModalOpenConfig>;
|
|
2021
|
-
/** 模态框组件。 */
|
|
2022
|
-
declare const Modal: react.ForwardRefExoticComponent<ModalProps & react.RefAttributes<HTMLDivElement>> & {
|
|
2023
|
-
/** 直接打开实例,返回可用于更新或关闭的操作句柄。 */
|
|
2024
|
-
open: typeof openModal;
|
|
2025
|
-
/** 显示普通信息提示。 */
|
|
2026
|
-
info: (config: ModalOpenConfig) => OverlayApiHandle<ModalOpenConfig>;
|
|
2027
|
-
/** 显示成功提示。 */
|
|
2028
|
-
success: (config: ModalOpenConfig) => OverlayApiHandle<ModalOpenConfig>;
|
|
2029
|
-
/** 显示警告提示。 */
|
|
2030
|
-
warning: (config: ModalOpenConfig) => OverlayApiHandle<ModalOpenConfig>;
|
|
2031
|
-
/** 显示错误提示。 */
|
|
2032
|
-
error: (config: ModalOpenConfig) => OverlayApiHandle<ModalOpenConfig>;
|
|
2033
|
-
/** 打开确认弹框,支持异步确认;返回 false 可阻止关闭。 */
|
|
2034
|
-
confirm: (config: ModalOpenConfig) => OverlayApiHandle<ModalOpenConfig>;
|
|
2035
|
-
/** 关闭由此 API 打开的所有弹层。 */
|
|
2036
|
-
destroyAll(): void;
|
|
2037
|
-
};
|
|
2038
|
-
|
|
2039
1921
|
/** 全局消息的类型标识。 */
|
|
2040
1922
|
type MessageType = "info" | "success" | "warning" | "error" | "loading";
|
|
2041
1923
|
/** 全局消息的唯一标识,用于更新或关闭已有消息。 */
|
|
@@ -2285,4 +2167,4 @@ declare const FloatButton: react.ForwardRefExoticComponent<FloatButtonProps & re
|
|
|
2285
2167
|
BackTop: typeof FloatButtonBackTop;
|
|
2286
2168
|
};
|
|
2287
2169
|
|
|
2288
|
-
export { type
|
|
2170
|
+
export { type MenuTheme as $, type FloatButtonGroupProps as A, type BadgeProps as B, Calendar as C, Dropdown as D, type FloatButtonProps as E, FILLED_ICON_NAMES as F, type FloatButtonShape as G, type FloatingPlacement as H, type FloatingTrigger as I, ICON_NAMES as J, Icon as K, type IconName as L, type IconProps as M, type IconVariant as N, Image as O, ImagePreview as P, type ImagePreviewConfig as Q, type ImagePreviewProps as R, type ImageProps as S, type TagStatus as T, Input as U, type InputProps as V, Menu as W, type MenuClickInfo as X, type MenuItem as Y, type MenuMode as Z, type MenuProps as _, Badge as a, type UploadRequestOptions as a$, type MessageConfig as a0, type MessageHandle as a1, type MessageKey as a2, type MessageType as a3, type NotificationConfig as a4, type NotificationPlacement as a5, type NotificationType as a6, Popconfirm as a7, type PopconfirmProps as a8, Popover as a9, Timeline as aA, type TimelineItem as aB, type TimelineProps as aC, Toolbar as aD, type ToolbarItem as aE, type ToolbarProps as aF, Tooltip as aG, type TooltipProps as aH, Tour as aI, type TourProps as aJ, type TourStep as aK, Tree as aL, type TreeDropPosition as aM, type TreeKey as aN, type TreeNode as aO, type TreeProps as aP, Typography as aQ, type TypographyLinkProps as aR, type TypographyProps as aS, type TypographyTitleProps as aT, type TypographyType as aU, Upload as aV, type UploadChangeInfo as aW, type UploadDraggerProps as aX, type UploadFile as aY, type UploadFileStatus as aZ, type UploadProps as a_, type PopoverProps as aa, Progress as ab, type ProgressProps as ac, type ProgressStatus as ad, Rate as ae, type RateProps as af, Segmented as ag, type SegmentedOption as ah, type SegmentedProps as ai, type SegmentedValue as aj, Spin as ak, type SpinProps as al, type StepItem as am, type StepStatus as an, Steps as ao, type StepsProps as ap, type TabItem as aq, Tabs as ar, type TabsContextMenuClickInfo as as, type TabsOrientation as at, type TabsPosition as au, type TabsProps as av, type TabsType as aw, Tag as ax, type TagProps as ay, type TagVariant as az, type BadgeRibbonProps as b, Watermark as b0, type WatermarkFont as b1, type WatermarkProps as b2, message as b3, notification as b4, type BadgeStatus as c, Breadcrumb as d, type BreadcrumbItem as e, type BreadcrumbProps as f, type CalendarProps as g, Card as h, type CardAccent as i, type CardProps as j, Carousel as k, type CarouselProps as l, type CarouselRef as m, Collapse as n, type CollapseItem as o, type CollapseKey as p, type CollapseProps as q, type DropdownButtonProps as r, type DropdownMenuProps as s, type DropdownOpenSource as t, type DropdownPlacement as u, type DropdownProps as v, type DropdownTrigger as w, type FilledIconName as x, FloatButton as y, type FloatButtonBackTopProps as z };
|