@sia.soul/sia-react-ui 0.1.20 → 0.1.22
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-4hGJt3RJ.d.cts +142 -0
- package/dist/Select-BNSE67xn.d.ts +142 -0
- package/dist/chart.d.cts +2498 -0
- package/dist/chart.d.ts +2498 -0
- package/dist/{chunk-4HB6GC24.js → chunk-3TRRBMXY.js} +37 -8
- package/dist/{chunk-3RWL67CK.js → chunk-7RNS52YG.js} +38 -5
- package/dist/{chunk-SUMXP2SF.js → chunk-KLI65JVD.js} +12 -4
- package/dist/{chunk-I3EF5SF2.js → chunk-RWGSZW32.js} +1 -1
- package/dist/{chunk-LO3BUBWU.js → chunk-VN6PIPP7.js} +2 -2
- package/dist/{core-CdoVqv0o.d.ts → core-C5OnrCi4.d.cts} +1207 -3
- package/dist/{core-CM79w-7A.d.cts → core-DeZknKwc.d.ts} +1207 -3
- package/dist/core.cjs +77 -13
- package/dist/core.css +29 -5
- package/dist/core.d.cts +3 -3
- package/dist/core.d.ts +3 -3
- package/dist/core.js +3 -3
- package/dist/index.cjs +167 -25
- package/dist/index.css +29 -5
- package/dist/index.d.cts +1697 -8
- package/dist/index.d.ts +1697 -8
- package/dist/index.js +89 -17
- package/dist/markdown-editor.d.cts +41 -1
- package/dist/markdown-editor.d.ts +41 -1
- package/dist/rich-text-editor.cjs +11 -3
- package/dist/rich-text-editor.d.cts +46 -1
- package/dist/rich-text-editor.d.ts +46 -1
- package/dist/rich-text-editor.js +2 -2
- package/dist/{select-date-range-4tEYkA5O.d.cts → select-date-range-CGRb3-W8.d.ts} +116 -2
- package/dist/{select-date-range-D-ynrB5k.d.ts → select-date-range-DDmYGDD4.d.cts} +116 -2
- package/dist/select-date-range.cjs +36 -7
- package/dist/select-date-range.d.cts +3 -3
- package/dist/select-date-range.d.ts +3 -3
- package/dist/select-date-range.js +3 -3
- package/dist/{shared-DAYZvZVu.d.cts → shared-Bx4B28Wh.d.cts} +3 -0
- package/dist/{shared-DAYZvZVu.d.ts → shared-Bx4B28Wh.d.ts} +3 -0
- package/package.json +1 -1
- package/dist/Select-Cz3hzQl_.d.ts +0 -57
- package/dist/Select-Da9CLN0X.d.cts +0 -57
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
Icon,
|
|
4
4
|
Input,
|
|
5
5
|
PopupPortal
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-KLI65JVD.js";
|
|
7
7
|
import {
|
|
8
8
|
Button
|
|
9
9
|
} from "./chunk-TZGUBGA4.js";
|
|
@@ -87,7 +87,10 @@ function CheckboxGroup({
|
|
|
87
87
|
children
|
|
88
88
|
] }) }) });
|
|
89
89
|
}
|
|
90
|
-
var Checkbox2 = Object.assign(CheckboxRoot, {
|
|
90
|
+
var Checkbox2 = Object.assign(CheckboxRoot, {
|
|
91
|
+
/** 组合多个子项并统一管理布局或选择状态。 */
|
|
92
|
+
Group: CheckboxGroup
|
|
93
|
+
});
|
|
91
94
|
|
|
92
95
|
// src/components/FloatingDisplay.tsx
|
|
93
96
|
import { cloneElement, useEffect as useEffect2, useId as useId2, useLayoutEffect, useMemo as useMemo2, useRef as useRef2, useState } from "react";
|
|
@@ -828,12 +831,19 @@ function preset(type, defaults = {}) {
|
|
|
828
831
|
});
|
|
829
832
|
}
|
|
830
833
|
var Modal2 = Object.assign(ModalRoot, {
|
|
834
|
+
/** 直接打开实例,返回可用于更新或关闭的操作句柄。 */
|
|
831
835
|
open: openModal,
|
|
836
|
+
/** 显示普通信息提示。 */
|
|
832
837
|
info: preset("info", { title: "\u63D0\u793A" }),
|
|
838
|
+
/** 显示成功提示。 */
|
|
833
839
|
success: preset("success", { title: "\u64CD\u4F5C\u6210\u529F" }),
|
|
840
|
+
/** 显示警告提示。 */
|
|
834
841
|
warning: preset("warning", { title: "\u8BF7\u6CE8\u610F" }),
|
|
842
|
+
/** 显示错误提示。 */
|
|
835
843
|
error: preset("error", { title: "\u64CD\u4F5C\u5931\u8D25" }),
|
|
844
|
+
/** 打开确认弹框,支持异步确认;返回 false 可阻止关闭。 */
|
|
836
845
|
confirm: preset("confirm", { title: "\u786E\u8BA4\u64CD\u4F5C" }),
|
|
846
|
+
/** 关闭由此 API 打开的所有弹层。 */
|
|
837
847
|
destroyAll() {
|
|
838
848
|
[...modalHandles].forEach((handle) => handle.destroy());
|
|
839
849
|
}
|
|
@@ -866,6 +876,8 @@ function SelectionPanel({
|
|
|
866
876
|
const search = searchValue ?? localSearch;
|
|
867
877
|
const [scrollTop, setScrollTop] = useState3(0);
|
|
868
878
|
const [active, setActive] = useState3();
|
|
879
|
+
const [keyboardActive, setKeyboardActive] = useState3(false);
|
|
880
|
+
const [deselectedHover, setDeselectedHover] = useState3();
|
|
869
881
|
const listRef = useRef5(null);
|
|
870
882
|
const id = useId4();
|
|
871
883
|
const selected = useMemo3(() => new Set(value), [value]);
|
|
@@ -910,9 +922,11 @@ function SelectionPanel({
|
|
|
910
922
|
if (listRef.current) listRef.current.scrollTop = 0;
|
|
911
923
|
setActive(void 0);
|
|
912
924
|
}, [search, selectedOnly, count]);
|
|
913
|
-
function toggle(option) {
|
|
925
|
+
function toggle(option, keyboard = false) {
|
|
914
926
|
if (disabled || loading || option.disabled || option.optionType === "divider") return;
|
|
915
927
|
setActive(option.value);
|
|
928
|
+
setKeyboardActive(keyboard);
|
|
929
|
+
setDeselectedHover(!keyboard && !multiple && allowDeselect && selected.has(option.value) ? option.value : void 0);
|
|
916
930
|
onChange(multiple ? selected.has(option.value) ? value.filter((item) => item !== option.value) : [...value, option.value] : allowDeselect && selected.has(option.value) ? [] : [option.value]);
|
|
917
931
|
}
|
|
918
932
|
function batch(operation) {
|
|
@@ -962,6 +976,10 @@ function SelectionPanel({
|
|
|
962
976
|
className: "sia-selection-panel__list",
|
|
963
977
|
style: { maxHeight },
|
|
964
978
|
onScroll: (event) => setScrollTop(event.currentTarget.scrollTop),
|
|
979
|
+
onPointerDown: () => setKeyboardActive(false),
|
|
980
|
+
onBlur: (event) => {
|
|
981
|
+
if (!event.currentTarget.contains(event.relatedTarget)) setKeyboardActive(false);
|
|
982
|
+
},
|
|
965
983
|
"aria-activedescendant": active !== void 0 ? `${id}-${typeof active}-${active}` : void 0,
|
|
966
984
|
onKeyDown: (event) => {
|
|
967
985
|
if (event.target instanceof HTMLInputElement) return;
|
|
@@ -969,6 +987,8 @@ function SelectionPanel({
|
|
|
969
987
|
const index = enabled.findIndex((option) => option.value === active);
|
|
970
988
|
if (["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) {
|
|
971
989
|
event.preventDefault();
|
|
990
|
+
setKeyboardActive(true);
|
|
991
|
+
setDeselectedHover(void 0);
|
|
972
992
|
const next = event.key === "Home" ? 0 : event.key === "End" ? enabled.length - 1 : Math.max(0, Math.min(enabled.length - 1, index + (event.key === "ArrowDown" ? 1 : -1)));
|
|
973
993
|
const option = enabled[next];
|
|
974
994
|
setActive(option.value);
|
|
@@ -979,7 +999,7 @@ function SelectionPanel({
|
|
|
979
999
|
}
|
|
980
1000
|
} else if ((event.key === "Enter" || event.key === " ") && index >= 0) {
|
|
981
1001
|
event.preventDefault();
|
|
982
|
-
toggle(enabled[index]);
|
|
1002
|
+
toggle(enabled[index], true);
|
|
983
1003
|
}
|
|
984
1004
|
},
|
|
985
1005
|
children: loading ? /* @__PURE__ */ jsx4("div", { role: "status", children: "\u52A0\u8F7D\u4E2D\u2026" }) : !rows.length ? /* @__PURE__ */ jsx4("div", { className: "sia-selection-panel__empty", children: "\u6682\u65E0\u5339\u914D\u9009\u9879" }) : /* @__PURE__ */ jsx4("div", { style: { height: totalHeight, position: "relative" }, children: renderedRows.map((row) => /* @__PURE__ */ jsx4(
|
|
@@ -995,7 +1015,11 @@ function SelectionPanel({
|
|
|
995
1015
|
tabIndex: -1,
|
|
996
1016
|
"aria-selected": selected.has(option.value),
|
|
997
1017
|
"aria-disabled": disabled || option.disabled || void 0,
|
|
998
|
-
className: `sia-selection-panel__option${active === option.value ? " is-active" : ""}`,
|
|
1018
|
+
className: `sia-selection-panel__option${keyboardActive && active === option.value ? " is-active" : ""}`,
|
|
1019
|
+
"data-deselected-hover": deselectedHover === option.value || void 0,
|
|
1020
|
+
onPointerLeave: () => {
|
|
1021
|
+
if (deselectedHover === option.value) setDeselectedHover(void 0);
|
|
1022
|
+
},
|
|
999
1023
|
onClick: (event) => {
|
|
1000
1024
|
if (!event.target.closest(".sia-checkbox")) toggle(option);
|
|
1001
1025
|
},
|
|
@@ -1450,7 +1474,8 @@ function defaultFilterOption(query, option) {
|
|
|
1450
1474
|
var Select = forwardRef3(function Select2({
|
|
1451
1475
|
options,
|
|
1452
1476
|
mode = "single",
|
|
1453
|
-
popupMode
|
|
1477
|
+
popupMode: popupModeProp,
|
|
1478
|
+
modalThreshold = 15,
|
|
1454
1479
|
modalConfig,
|
|
1455
1480
|
value,
|
|
1456
1481
|
defaultValue,
|
|
@@ -1459,7 +1484,7 @@ var Select = forwardRef3(function Select2({
|
|
|
1459
1484
|
placeholderMode,
|
|
1460
1485
|
size: sizeProp,
|
|
1461
1486
|
status = "default",
|
|
1462
|
-
allowClear =
|
|
1487
|
+
allowClear = true,
|
|
1463
1488
|
loading = false,
|
|
1464
1489
|
showSearch = false,
|
|
1465
1490
|
showValue = false,
|
|
@@ -1492,6 +1517,9 @@ var Select = forwardRef3(function Select2({
|
|
|
1492
1517
|
const searchRef = useRef7(null);
|
|
1493
1518
|
const listRef = useRef7(null);
|
|
1494
1519
|
const [open, setOpen] = useState5(false);
|
|
1520
|
+
const automaticMode = popupModeProp ?? (options.length > modalThreshold ? "modal" : "dropdown");
|
|
1521
|
+
const [openedMode, setOpenedMode] = useState5(automaticMode);
|
|
1522
|
+
const popupMode = open ? openedMode : automaticMode;
|
|
1495
1523
|
const [modalValues, setModalValues] = useState5([]);
|
|
1496
1524
|
const [selectedOnly, setSelectedOnly] = useState5(false);
|
|
1497
1525
|
const [query, setQuery] = useState5("");
|
|
@@ -1563,9 +1591,10 @@ var Select = forwardRef3(function Select2({
|
|
|
1563
1591
|
}
|
|
1564
1592
|
function openDropdown() {
|
|
1565
1593
|
if (disabled || loading) return;
|
|
1594
|
+
setOpenedMode(automaticMode);
|
|
1566
1595
|
const selectedIndex = filteredOptions.findIndex((option) => selectedValueSet.has(option.value) && !option.disabled);
|
|
1567
1596
|
setActiveIndex(selectedIndex >= 0 ? selectedIndex : firstEnabledIndex());
|
|
1568
|
-
if (
|
|
1597
|
+
if (automaticMode === "modal") {
|
|
1569
1598
|
setModalValues([...selectedValues]);
|
|
1570
1599
|
setSelectedOnly(false);
|
|
1571
1600
|
}
|
|
@@ -5,11 +5,11 @@ import {
|
|
|
5
5
|
Popover,
|
|
6
6
|
Tooltip,
|
|
7
7
|
useOverlayLifecycle
|
|
8
|
-
} from "./chunk-
|
|
8
|
+
} from "./chunk-3TRRBMXY.js";
|
|
9
9
|
import {
|
|
10
10
|
Dropdown,
|
|
11
11
|
Icon
|
|
12
|
-
} from "./chunk-
|
|
12
|
+
} from "./chunk-KLI65JVD.js";
|
|
13
13
|
import {
|
|
14
14
|
Button
|
|
15
15
|
} from "./chunk-TZGUBGA4.js";
|
|
@@ -521,11 +521,17 @@ function openNotification(config) {
|
|
|
521
521
|
return { key, close: () => closeNotification(key) };
|
|
522
522
|
}
|
|
523
523
|
var notification = {
|
|
524
|
+
/** 直接打开实例,返回可用于更新或关闭的操作句柄。 */
|
|
524
525
|
open: openNotification,
|
|
526
|
+
/** 显示普通信息提示。 */
|
|
525
527
|
info: (config) => openNotification({ ...config, type: "info" }),
|
|
528
|
+
/** 显示成功提示。 */
|
|
526
529
|
success: (config) => openNotification({ ...config, type: "success" }),
|
|
530
|
+
/** 显示警告提示。 */
|
|
527
531
|
warning: (config) => openNotification({ ...config, type: "warning" }),
|
|
532
|
+
/** 显示错误提示。 */
|
|
528
533
|
error: (config) => openNotification({ ...config, type: "error" }),
|
|
534
|
+
/** 关闭指定实例;未指定标识时关闭所有实例。 */
|
|
529
535
|
destroy: (key) => {
|
|
530
536
|
if (key !== void 0) closeNotification(key);
|
|
531
537
|
else {
|
|
@@ -961,7 +967,12 @@ function UploadDragger({ hint = "\u652F\u6301\u5355\u4E2A\u6216\u6279\u91CF\u4E0
|
|
|
961
967
|
/* @__PURE__ */ jsx6("span", { children: hint })
|
|
962
968
|
] }) });
|
|
963
969
|
}
|
|
964
|
-
var Upload = Object.assign(UploadRoot, {
|
|
970
|
+
var Upload = Object.assign(UploadRoot, {
|
|
971
|
+
/** 支持拖入文件上传的区域组件。 */
|
|
972
|
+
Dragger: UploadDragger,
|
|
973
|
+
/** beforeUpload 返回此标记时忽略该文件,不加入上传列表。 */
|
|
974
|
+
LIST_IGNORE
|
|
975
|
+
});
|
|
965
976
|
|
|
966
977
|
// src/components/Message.tsx
|
|
967
978
|
import { createRoot as createRoot2 } from "react-dom/client";
|
|
@@ -1041,12 +1052,19 @@ function shortcut(type) {
|
|
|
1041
1052
|
return (content, duration) => openMessage({ content, duration, type });
|
|
1042
1053
|
}
|
|
1043
1054
|
var message = {
|
|
1055
|
+
/** 直接打开实例,返回可用于更新或关闭的操作句柄。 */
|
|
1044
1056
|
open: openMessage,
|
|
1057
|
+
/** 显示普通信息提示。 */
|
|
1045
1058
|
info: shortcut("info"),
|
|
1059
|
+
/** 显示成功提示。 */
|
|
1046
1060
|
success: shortcut("success"),
|
|
1061
|
+
/** 显示警告提示。 */
|
|
1047
1062
|
warning: shortcut("warning"),
|
|
1063
|
+
/** 显示错误提示。 */
|
|
1048
1064
|
error: shortcut("error"),
|
|
1065
|
+
/** 显示持续加载提示。 */
|
|
1049
1066
|
loading: shortcut("loading"),
|
|
1067
|
+
/** 关闭指定实例;未指定标识时关闭所有实例。 */
|
|
1050
1068
|
destroy(key) {
|
|
1051
1069
|
if (key !== void 0) {
|
|
1052
1070
|
closeMessage(key);
|
|
@@ -1054,6 +1072,7 @@ var message = {
|
|
|
1054
1072
|
}
|
|
1055
1073
|
[...messageItems].forEach((item) => closeMessage(item.key));
|
|
1056
1074
|
},
|
|
1075
|
+
/** 配置消息默认持续时间和最大同时显示数量。 */
|
|
1057
1076
|
config(config) {
|
|
1058
1077
|
if (config.duration !== void 0) defaultDuration = config.duration;
|
|
1059
1078
|
if (config.maxCount !== void 0) maxCount = Math.max(1, config.maxCount);
|
|
@@ -1227,7 +1246,16 @@ function Link({ disabled, className = "", onClick, href, target, rel, ...props }
|
|
|
1227
1246
|
function TypographyRoot({ className = "", ...props }) {
|
|
1228
1247
|
return /* @__PURE__ */ jsx9("div", { ...props, className: `sia-typography ${className}`.trim() });
|
|
1229
1248
|
}
|
|
1230
|
-
var Typography = Object.assign(TypographyRoot, {
|
|
1249
|
+
var Typography = Object.assign(TypographyRoot, {
|
|
1250
|
+
/** 语义化标题,支持标题级别、复制和编辑。 */
|
|
1251
|
+
Title,
|
|
1252
|
+
/** 行内文本,支持强调、复制、编辑和省略。 */
|
|
1253
|
+
Text,
|
|
1254
|
+
/** 段落文本,支持复制、编辑和省略。 */
|
|
1255
|
+
Paragraph,
|
|
1256
|
+
/** 具有排版样式的链接。 */
|
|
1257
|
+
Link
|
|
1258
|
+
});
|
|
1231
1259
|
|
|
1232
1260
|
// src/components/FloatButton.tsx
|
|
1233
1261
|
import { createContext, forwardRef, useContext, useEffect as useEffect4, useId as useId3, useRef as useRef6, useState as useState6 } from "react";
|
|
@@ -1358,7 +1386,12 @@ function FloatButtonBackTop({ target, visibilityHeight = 400, behavior = "smooth
|
|
|
1358
1386
|
element?.scrollTo({ top: 0, behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : behavior });
|
|
1359
1387
|
} });
|
|
1360
1388
|
}
|
|
1361
|
-
var FloatButton2 = Object.assign(FloatButtonRoot, {
|
|
1389
|
+
var FloatButton2 = Object.assign(FloatButtonRoot, {
|
|
1390
|
+
/** 组合多个子项并统一管理布局或选择状态。 */
|
|
1391
|
+
Group: FloatButtonGroup,
|
|
1392
|
+
/** 滚动超过指定距离后显示的返回顶部按钮。 */
|
|
1393
|
+
BackTop: FloatButtonBackTop
|
|
1394
|
+
});
|
|
1362
1395
|
|
|
1363
1396
|
export {
|
|
1364
1397
|
Card,
|
|
@@ -1160,7 +1160,7 @@ function Segmented({ options, value, defaultValue, size: sizeProp, block = false
|
|
|
1160
1160
|
}
|
|
1161
1161
|
|
|
1162
1162
|
// src/components/Dropdown.tsx
|
|
1163
|
-
import { useEffect as useEffect2, useRef as useRef3, useState as useState3 } from "react";
|
|
1163
|
+
import { cloneElement, isValidElement, useEffect as useEffect2, useRef as useRef3, useState as useState3 } from "react";
|
|
1164
1164
|
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
1165
1165
|
var placementMap = {
|
|
1166
1166
|
bottomLeft: "bottom-start",
|
|
@@ -1176,6 +1176,7 @@ function DropdownRoot({
|
|
|
1176
1176
|
open,
|
|
1177
1177
|
defaultOpen = false,
|
|
1178
1178
|
disabled = false,
|
|
1179
|
+
showTriggerIcon = true,
|
|
1179
1180
|
arrow = false,
|
|
1180
1181
|
autoFocus = false,
|
|
1181
1182
|
openDelay = 80,
|
|
@@ -1336,6 +1337,10 @@ function DropdownRoot({
|
|
|
1336
1337
|
className: "sia-dropdown__menu"
|
|
1337
1338
|
}
|
|
1338
1339
|
);
|
|
1340
|
+
const triggerNode = showTriggerIcon && isValidElement(children) && children.type === Button && children.props.children !== void 0 && children.props.children !== null ? cloneElement(children, {}, /* @__PURE__ */ jsxs4("span", { className: "sia-dropdown__trigger-content", children: [
|
|
1341
|
+
children.props.children,
|
|
1342
|
+
/* @__PURE__ */ jsx5(Icon, { name: "chevron-down", size: 14, className: "sia-dropdown__trigger-icon" })
|
|
1343
|
+
] })) : children;
|
|
1339
1344
|
return /* @__PURE__ */ jsxs4(
|
|
1340
1345
|
"span",
|
|
1341
1346
|
{
|
|
@@ -1351,7 +1356,7 @@ function DropdownRoot({
|
|
|
1351
1356
|
onKeyDown: handleKeyDown,
|
|
1352
1357
|
...props,
|
|
1353
1358
|
children: [
|
|
1354
|
-
|
|
1359
|
+
triggerNode,
|
|
1355
1360
|
/* @__PURE__ */ jsx5(
|
|
1356
1361
|
"span",
|
|
1357
1362
|
{
|
|
@@ -1398,7 +1403,7 @@ function DropdownButton({
|
|
|
1398
1403
|
}) {
|
|
1399
1404
|
return /* @__PURE__ */ jsxs4("span", { className: `sia-dropdown-button ${className}`.trim(), children: [
|
|
1400
1405
|
/* @__PURE__ */ jsx5(Button, { ...buttonProps, disabled, onClick, children }),
|
|
1401
|
-
/* @__PURE__ */ jsx5(DropdownRoot, { ...dropdownProps, disabled, trigger, children: /* @__PURE__ */ jsx5(
|
|
1406
|
+
/* @__PURE__ */ jsx5(DropdownRoot, { ...dropdownProps, disabled, trigger, showTriggerIcon: false, children: /* @__PURE__ */ jsx5(
|
|
1402
1407
|
Button,
|
|
1403
1408
|
{
|
|
1404
1409
|
...buttonProps,
|
|
@@ -1410,7 +1415,10 @@ function DropdownButton({
|
|
|
1410
1415
|
) })
|
|
1411
1416
|
] });
|
|
1412
1417
|
}
|
|
1413
|
-
var Dropdown = Object.assign(DropdownRoot, {
|
|
1418
|
+
var Dropdown = Object.assign(DropdownRoot, {
|
|
1419
|
+
/** 组合主操作按钮与下拉菜单的按钮组件。 */
|
|
1420
|
+
Button: DropdownButton
|
|
1421
|
+
});
|
|
1414
1422
|
|
|
1415
1423
|
// src/components/Input.tsx
|
|
1416
1424
|
import { forwardRef as forwardRef3, useId as useId2, useRef as useRef4, useState as useState4 } from "react";
|