@sia.soul/sia-react-ui 0.1.92 → 0.1.94
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-Bv2AmXRD.d.cts → Select-DQpfyK7I.d.cts} +5 -0
- package/dist/{Select-Cc1owuvN.d.ts → Select-DmT9pFRW.d.ts} +5 -0
- package/dist/{chunk-3JCIEB7I.js → chunk-4TTHPU2S.js} +1 -1
- package/dist/{chunk-ZY3YKRD4.js → chunk-DJTV4X6L.js} +50 -6
- package/dist/{chunk-7MTL2KB5.js → chunk-FGGBNWBT.js} +1 -1
- package/dist/{core-DV-4tf3K.d.cts → core-CkK9RRi0.d.cts} +1 -1
- package/dist/{core-DBfzPqVR.d.ts → core-uAx1caJB.d.ts} +1 -1
- package/dist/core.cjs +50 -6
- package/dist/core.d.cts +2 -2
- package/dist/core.d.ts +2 -2
- package/dist/core.js +2 -2
- package/dist/index.cjs +77 -8
- package/dist/index.d.cts +22 -8
- package/dist/index.d.ts +22 -8
- package/dist/index.js +30 -5
- package/dist/{select-date-range-CRWxqHFp.d.cts → select-date-range-BT71tp7y.d.cts} +1 -1
- package/dist/{select-date-range-rtYL9egr.d.ts → select-date-range-CFGzoyLs.d.ts} +1 -1
- package/dist/select-date-range.cjs +50 -6
- package/dist/select-date-range.d.cts +2 -2
- package/dist/select-date-range.d.ts +2 -2
- package/dist/select-date-range.js +2 -2
- package/package.json +1 -1
|
@@ -177,6 +177,8 @@ type SelectOption = {
|
|
|
177
177
|
disabled?: boolean;
|
|
178
178
|
/** 弹框模式中的分组标题。 */
|
|
179
179
|
group?: string;
|
|
180
|
+
/** 弹框模式中显示在选项名称旁的帮助说明,不参与搜索或回填。 */
|
|
181
|
+
description?: ReactNode;
|
|
180
182
|
};
|
|
181
183
|
/** 选择器的属性配置。 */
|
|
182
184
|
interface SelectProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "defaultValue" | "onChange" | "value"> {
|
|
@@ -196,6 +198,9 @@ interface SelectProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "def
|
|
|
196
198
|
modalThreshold?: number;
|
|
197
199
|
/** 弹框标题、布局及顶部/底部扩展内容。 */
|
|
198
200
|
modalConfig?: {
|
|
201
|
+
/** 多选弹框显示分组复选框,仅切换当前搜索及已选视图中该组的可用项。
|
|
202
|
+
* @defaultValue false */
|
|
203
|
+
groupCheckable?: boolean;
|
|
199
204
|
/** 弹框标题,未设置时使用 Select 的 placeholder。 */
|
|
200
205
|
title?: ReactNode;
|
|
201
206
|
/** 弹框宽度,默认 900px。 */
|
|
@@ -177,6 +177,8 @@ type SelectOption = {
|
|
|
177
177
|
disabled?: boolean;
|
|
178
178
|
/** 弹框模式中的分组标题。 */
|
|
179
179
|
group?: string;
|
|
180
|
+
/** 弹框模式中显示在选项名称旁的帮助说明,不参与搜索或回填。 */
|
|
181
|
+
description?: ReactNode;
|
|
180
182
|
};
|
|
181
183
|
/** 选择器的属性配置。 */
|
|
182
184
|
interface SelectProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "defaultValue" | "onChange" | "value"> {
|
|
@@ -196,6 +198,9 @@ interface SelectProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "def
|
|
|
196
198
|
modalThreshold?: number;
|
|
197
199
|
/** 弹框标题、布局及顶部/底部扩展内容。 */
|
|
198
200
|
modalConfig?: {
|
|
201
|
+
/** 多选弹框显示分组复选框,仅切换当前搜索及已选视图中该组的可用项。
|
|
202
|
+
* @defaultValue false */
|
|
203
|
+
groupCheckable?: boolean;
|
|
199
204
|
/** 弹框标题,未设置时使用 Select 的 placeholder。 */
|
|
200
205
|
title?: ReactNode;
|
|
201
206
|
/** 弹框宽度,默认 900px。 */
|
|
@@ -1170,7 +1170,8 @@ function SelectionPanel({
|
|
|
1170
1170
|
displayField = "label",
|
|
1171
1171
|
columns = 1,
|
|
1172
1172
|
maxHeight = 250,
|
|
1173
|
-
autoFocusSearch = false
|
|
1173
|
+
autoFocusSearch = false,
|
|
1174
|
+
groupCheckable = false
|
|
1174
1175
|
}) {
|
|
1175
1176
|
const [localSearch, setLocalSearch] = useState2("");
|
|
1176
1177
|
const search = searchValue ?? localSearch;
|
|
@@ -1202,7 +1203,7 @@ function SelectionPanel({
|
|
|
1202
1203
|
let top = 0;
|
|
1203
1204
|
for (const [group, items] of groups) {
|
|
1204
1205
|
if (group) {
|
|
1205
|
-
rows2.push({ key: `group-${rows2.length}`, title: group, top, height: 30 });
|
|
1206
|
+
rows2.push({ key: `group-${rows2.length}`, title: group, items, top, height: 30 });
|
|
1206
1207
|
top += 30;
|
|
1207
1208
|
}
|
|
1208
1209
|
for (let index = 0; index < items.length; index += count) {
|
|
@@ -1240,6 +1241,42 @@ function SelectionPanel({
|
|
|
1240
1241
|
const add = enabled.filter((option) => operation === "all" || !selected.has(option.value)).map((option) => option.value);
|
|
1241
1242
|
onChange([...retained, ...add]);
|
|
1242
1243
|
}
|
|
1244
|
+
function groupHeading(title, items) {
|
|
1245
|
+
if (!multiple || !groupCheckable) return title;
|
|
1246
|
+
const editable = items.filter((option) => !option.disabled && option.optionType !== "divider");
|
|
1247
|
+
const all = editable.length > 0 && editable.every((option) => selected.has(option.value));
|
|
1248
|
+
return /* @__PURE__ */ jsx3(
|
|
1249
|
+
Checkbox2,
|
|
1250
|
+
{
|
|
1251
|
+
checked: all,
|
|
1252
|
+
indeterminate: !all && editable.some((option) => selected.has(option.value)),
|
|
1253
|
+
disabled: disabled || loading || !editable.length,
|
|
1254
|
+
onChange: (checked) => {
|
|
1255
|
+
const next = new Set(value);
|
|
1256
|
+
editable.forEach((option) => checked ? next.add(option.value) : next.delete(option.value));
|
|
1257
|
+
onChange([...next]);
|
|
1258
|
+
},
|
|
1259
|
+
children: title
|
|
1260
|
+
}
|
|
1261
|
+
);
|
|
1262
|
+
}
|
|
1263
|
+
function help(option) {
|
|
1264
|
+
return option.description != null && option.description !== false ? /* @__PURE__ */ jsx3(Tooltip, { title: option.description, children: /* @__PURE__ */ jsx3(
|
|
1265
|
+
"span",
|
|
1266
|
+
{
|
|
1267
|
+
role: "img",
|
|
1268
|
+
"aria-label": "\u9009\u9879\u8BF4\u660E",
|
|
1269
|
+
tabIndex: 0,
|
|
1270
|
+
onClick: (event) => {
|
|
1271
|
+
event.preventDefault();
|
|
1272
|
+
event.stopPropagation();
|
|
1273
|
+
},
|
|
1274
|
+
onKeyDown: (event) => event.stopPropagation(),
|
|
1275
|
+
style: { display: "inline-flex", marginInlineStart: 4 },
|
|
1276
|
+
children: /* @__PURE__ */ jsx3(Icon, { name: "help-circle", size: 14 })
|
|
1277
|
+
}
|
|
1278
|
+
) }) : null;
|
|
1279
|
+
}
|
|
1243
1280
|
return /* @__PURE__ */ jsxs3("div", { className: "sia-selection-panel", children: [
|
|
1244
1281
|
/* @__PURE__ */ jsx3(FloatingScrollbarProvider, { targetRef: listRef }),
|
|
1245
1282
|
showSearch && /* @__PURE__ */ jsx3(
|
|
@@ -1293,7 +1330,7 @@ function SelectionPanel({
|
|
|
1293
1330
|
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)));
|
|
1294
1331
|
const option = enabled[next];
|
|
1295
1332
|
setActive(option.value);
|
|
1296
|
-
const row = rows.find((row2) => row2.items?.includes(option));
|
|
1333
|
+
const row = rows.find((row2) => row2.title === void 0 && row2.items?.includes(option));
|
|
1297
1334
|
if (row && listRef.current) {
|
|
1298
1335
|
listRef.current.scrollTop = Math.max(0, row.top - maxHeight / 2);
|
|
1299
1336
|
setScrollTop(listRef.current.scrollTop);
|
|
@@ -1308,7 +1345,7 @@ function SelectionPanel({
|
|
|
1308
1345
|
{
|
|
1309
1346
|
className: row.title !== void 0 ? "sia-selection-panel__group" : "sia-selection-panel__row",
|
|
1310
1347
|
style: { position: "absolute", top: row.top, height: row.height, width: "100%", gridTemplateColumns: `repeat(${count}, minmax(0, 1fr))` },
|
|
1311
|
-
children: row.title ?? row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ jsx3("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ jsx3(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ jsx3(
|
|
1348
|
+
children: row.title !== void 0 ? groupHeading(row.title, row.items ?? []) : row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ jsx3("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ jsx3(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ jsx3(
|
|
1312
1349
|
"div",
|
|
1313
1350
|
{
|
|
1314
1351
|
role: "option",
|
|
@@ -1325,10 +1362,16 @@ function SelectionPanel({
|
|
|
1325
1362
|
if (!event.target.closest(".sia-checkbox")) toggle(option);
|
|
1326
1363
|
},
|
|
1327
1364
|
children: multiple ? /* @__PURE__ */ jsx3(Checkbox2, { checked: selected.has(option.value), disabled: disabled || loading || option.disabled, tabIndex: -1, onChange: () => toggle(option), children: /* @__PURE__ */ jsxs3("span", { className: "sia-selection-panel__text", children: [
|
|
1328
|
-
/* @__PURE__ */
|
|
1365
|
+
/* @__PURE__ */ jsxs3("span", { className: "sia-selection-panel__label", children: [
|
|
1366
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
1367
|
+
help(option)
|
|
1368
|
+
] }),
|
|
1329
1369
|
showValue && /* @__PURE__ */ jsx3("small", { children: String(option.value) })
|
|
1330
1370
|
] }) }) : /* @__PURE__ */ jsxs3("span", { className: "sia-selection-panel__text", children: [
|
|
1331
|
-
/* @__PURE__ */
|
|
1371
|
+
/* @__PURE__ */ jsxs3("span", { className: "sia-selection-panel__label", children: [
|
|
1372
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
1373
|
+
help(option)
|
|
1374
|
+
] }),
|
|
1332
1375
|
showValue && /* @__PURE__ */ jsx3("small", { children: String(option.value) })
|
|
1333
1376
|
] })
|
|
1334
1377
|
}
|
|
@@ -1852,6 +1895,7 @@ var Select = forwardRef2(function Select2({
|
|
|
1852
1895
|
value: modalValues,
|
|
1853
1896
|
onChange: setModalValues,
|
|
1854
1897
|
multiple,
|
|
1898
|
+
groupCheckable: modalConfig?.groupCheckable,
|
|
1855
1899
|
allowDeselect: allowClear,
|
|
1856
1900
|
selectedOnly,
|
|
1857
1901
|
showValue,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ReactNode, HTMLAttributes, CSSProperties, MouseEvent, ReactElement, ImgHTMLAttributes, InputHTMLAttributes, MouseEventHandler, AnchorHTMLAttributes, ButtonHTMLAttributes } from 'react';
|
|
3
|
-
import { B as ButtonProps, f as Button } from './Select-
|
|
3
|
+
import { B as ButtonProps, f as Button } from './Select-DQpfyK7I.cjs';
|
|
4
4
|
import { C as ControlSize, a as ControlStatus, I as InputPlaceholderMode } from './shared-Bx4B28Wh.cjs';
|
|
5
5
|
|
|
6
6
|
/** 单个工具栏操作及其下拉菜单。 */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ReactNode, HTMLAttributes, CSSProperties, MouseEvent, ReactElement, ImgHTMLAttributes, InputHTMLAttributes, MouseEventHandler, AnchorHTMLAttributes, ButtonHTMLAttributes } from 'react';
|
|
3
|
-
import { B as ButtonProps, f as Button } from './Select-
|
|
3
|
+
import { B as ButtonProps, f as Button } from './Select-DmT9pFRW.js';
|
|
4
4
|
import { C as ControlSize, a as ControlStatus, I as InputPlaceholderMode } from './shared-Bx4B28Wh.js';
|
|
5
5
|
|
|
6
6
|
/** 单个工具栏操作及其下拉菜单。 */
|
package/dist/core.cjs
CHANGED
|
@@ -3990,7 +3990,8 @@ function SelectionPanel({
|
|
|
3990
3990
|
displayField = "label",
|
|
3991
3991
|
columns = 1,
|
|
3992
3992
|
maxHeight = 250,
|
|
3993
|
-
autoFocusSearch = false
|
|
3993
|
+
autoFocusSearch = false,
|
|
3994
|
+
groupCheckable = false
|
|
3994
3995
|
}) {
|
|
3995
3996
|
const [localSearch, setLocalSearch] = (0, import_react23.useState)("");
|
|
3996
3997
|
const search = searchValue ?? localSearch;
|
|
@@ -4022,7 +4023,7 @@ function SelectionPanel({
|
|
|
4022
4023
|
let top = 0;
|
|
4023
4024
|
for (const [group, items] of groups) {
|
|
4024
4025
|
if (group) {
|
|
4025
|
-
rows2.push({ key: `group-${rows2.length}`, title: group, top, height: 30 });
|
|
4026
|
+
rows2.push({ key: `group-${rows2.length}`, title: group, items, top, height: 30 });
|
|
4026
4027
|
top += 30;
|
|
4027
4028
|
}
|
|
4028
4029
|
for (let index = 0; index < items.length; index += count) {
|
|
@@ -4060,6 +4061,42 @@ function SelectionPanel({
|
|
|
4060
4061
|
const add = enabled.filter((option) => operation === "all" || !selected.has(option.value)).map((option) => option.value);
|
|
4061
4062
|
onChange([...retained, ...add]);
|
|
4062
4063
|
}
|
|
4064
|
+
function groupHeading(title, items) {
|
|
4065
|
+
if (!multiple || !groupCheckable) return title;
|
|
4066
|
+
const editable = items.filter((option) => !option.disabled && option.optionType !== "divider");
|
|
4067
|
+
const all = editable.length > 0 && editable.every((option) => selected.has(option.value));
|
|
4068
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
4069
|
+
Checkbox2,
|
|
4070
|
+
{
|
|
4071
|
+
checked: all,
|
|
4072
|
+
indeterminate: !all && editable.some((option) => selected.has(option.value)),
|
|
4073
|
+
disabled: disabled || loading || !editable.length,
|
|
4074
|
+
onChange: (checked) => {
|
|
4075
|
+
const next = new Set(value);
|
|
4076
|
+
editable.forEach((option) => checked ? next.add(option.value) : next.delete(option.value));
|
|
4077
|
+
onChange([...next]);
|
|
4078
|
+
},
|
|
4079
|
+
children: title
|
|
4080
|
+
}
|
|
4081
|
+
);
|
|
4082
|
+
}
|
|
4083
|
+
function help(option) {
|
|
4084
|
+
return option.description != null && option.description !== false ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Tooltip, { title: option.description, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
4085
|
+
"span",
|
|
4086
|
+
{
|
|
4087
|
+
role: "img",
|
|
4088
|
+
"aria-label": "\u9009\u9879\u8BF4\u660E",
|
|
4089
|
+
tabIndex: 0,
|
|
4090
|
+
onClick: (event) => {
|
|
4091
|
+
event.preventDefault();
|
|
4092
|
+
event.stopPropagation();
|
|
4093
|
+
},
|
|
4094
|
+
onKeyDown: (event) => event.stopPropagation(),
|
|
4095
|
+
style: { display: "inline-flex", marginInlineStart: 4 },
|
|
4096
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon, { name: "help-circle", size: 14 })
|
|
4097
|
+
}
|
|
4098
|
+
) }) : null;
|
|
4099
|
+
}
|
|
4063
4100
|
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "sia-selection-panel", children: [
|
|
4064
4101
|
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(FloatingScrollbarProvider, { targetRef: listRef }),
|
|
4065
4102
|
showSearch && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
@@ -4113,7 +4150,7 @@ function SelectionPanel({
|
|
|
4113
4150
|
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)));
|
|
4114
4151
|
const option = enabled[next];
|
|
4115
4152
|
setActive(option.value);
|
|
4116
|
-
const row = rows.find((row2) => row2.items?.includes(option));
|
|
4153
|
+
const row = rows.find((row2) => row2.title === void 0 && row2.items?.includes(option));
|
|
4117
4154
|
if (row && listRef.current) {
|
|
4118
4155
|
listRef.current.scrollTop = Math.max(0, row.top - maxHeight / 2);
|
|
4119
4156
|
setScrollTop(listRef.current.scrollTop);
|
|
@@ -4128,7 +4165,7 @@ function SelectionPanel({
|
|
|
4128
4165
|
{
|
|
4129
4166
|
className: row.title !== void 0 ? "sia-selection-panel__group" : "sia-selection-panel__row",
|
|
4130
4167
|
style: { position: "absolute", top: row.top, height: row.height, width: "100%", gridTemplateColumns: `repeat(${count}, minmax(0, 1fr))` },
|
|
4131
|
-
children: row.title ?? row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
4168
|
+
children: row.title !== void 0 ? groupHeading(row.title, row.items ?? []) : row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
4132
4169
|
"div",
|
|
4133
4170
|
{
|
|
4134
4171
|
role: "option",
|
|
@@ -4145,10 +4182,16 @@ function SelectionPanel({
|
|
|
4145
4182
|
if (!event.target.closest(".sia-checkbox")) toggle(option);
|
|
4146
4183
|
},
|
|
4147
4184
|
children: multiple ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Checkbox2, { checked: selected.has(option.value), disabled: disabled || loading || option.disabled, tabIndex: -1, onChange: () => toggle(option), children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "sia-selection-panel__text", children: [
|
|
4148
|
-
/* @__PURE__ */ (0, import_jsx_runtime21.
|
|
4185
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "sia-selection-panel__label", children: [
|
|
4186
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
4187
|
+
help(option)
|
|
4188
|
+
] }),
|
|
4149
4189
|
showValue && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("small", { children: String(option.value) })
|
|
4150
4190
|
] }) }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "sia-selection-panel__text", children: [
|
|
4151
|
-
/* @__PURE__ */ (0, import_jsx_runtime21.
|
|
4191
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "sia-selection-panel__label", children: [
|
|
4192
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
4193
|
+
help(option)
|
|
4194
|
+
] }),
|
|
4152
4195
|
showValue && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("small", { children: String(option.value) })
|
|
4153
4196
|
] })
|
|
4154
4197
|
}
|
|
@@ -4669,6 +4712,7 @@ var Select = (0, import_react25.forwardRef)(function Select2({
|
|
|
4669
4712
|
value: modalValues,
|
|
4670
4713
|
onChange: setModalValues,
|
|
4671
4714
|
multiple,
|
|
4715
|
+
groupCheckable: modalConfig?.groupCheckable,
|
|
4672
4716
|
allowDeselect: allowClear,
|
|
4673
4717
|
selectedOnly,
|
|
4674
4718
|
showValue,
|
package/dist/core.d.cts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, h as Card, i as CardAccent, j as CardProps, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, K as Icon, L as IconName, M as IconProps, N as IconVariant, U as Input, V as InputProps, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, aq as TabItem, ar as Tabs, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, T as TagStatus, aA as TagVariant, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, b1 as UploadProps, b5 as UploadRequestOptions, b9 as message } from './core-
|
|
2
|
-
export { f as Button, B as ButtonProps, e as ButtonSize, g as ButtonVariant, h as Modal, d as ModalActionResult, M as ModalOpenConfig, i as ModalProps, j as ModalType, a as OverlayApiHandle, k as Select, S as SelectOption, c as SelectProps, m as SelectValue } from './Select-
|
|
1
|
+
export { d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, h as Card, i as CardAccent, j as CardProps, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, K as Icon, L as IconName, M as IconProps, N as IconVariant, U as Input, V as InputProps, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, aq as TabItem, ar as Tabs, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, T as TagStatus, aA as TagVariant, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, b1 as UploadProps, b5 as UploadRequestOptions, b9 as message } from './core-CkK9RRi0.cjs';
|
|
2
|
+
export { f as Button, B as ButtonProps, e as ButtonSize, g as ButtonVariant, h as Modal, d as ModalActionResult, M as ModalOpenConfig, i as ModalProps, j as ModalType, a as OverlayApiHandle, k as Select, S as SelectOption, c as SelectProps, m as SelectValue } from './Select-DQpfyK7I.cjs';
|
|
3
3
|
import 'react';
|
|
4
4
|
import './shared-Bx4B28Wh.cjs';
|
package/dist/core.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, h as Card, i as CardAccent, j as CardProps, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, K as Icon, L as IconName, M as IconProps, N as IconVariant, U as Input, V as InputProps, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, aq as TabItem, ar as Tabs, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, T as TagStatus, aA as TagVariant, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, b1 as UploadProps, b5 as UploadRequestOptions, b9 as message } from './core-
|
|
2
|
-
export { f as Button, B as ButtonProps, e as ButtonSize, g as ButtonVariant, h as Modal, d as ModalActionResult, M as ModalOpenConfig, i as ModalProps, j as ModalType, a as OverlayApiHandle, k as Select, S as SelectOption, c as SelectProps, m as SelectValue } from './Select-
|
|
1
|
+
export { d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, h as Card, i as CardAccent, j as CardProps, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, K as Icon, L as IconName, M as IconProps, N as IconVariant, U as Input, V as InputProps, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, aq as TabItem, ar as Tabs, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, T as TagStatus, aA as TagVariant, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, b1 as UploadProps, b5 as UploadRequestOptions, b9 as message } from './core-uAx1caJB.js';
|
|
2
|
+
export { f as Button, B as ButtonProps, e as ButtonSize, g as ButtonVariant, h as Modal, d as ModalActionResult, M as ModalOpenConfig, i as ModalProps, j as ModalType, a as OverlayApiHandle, k as Select, S as SelectOption, c as SelectProps, m as SelectValue } from './Select-DmT9pFRW.js';
|
|
3
3
|
import 'react';
|
|
4
4
|
import './shared-Bx4B28Wh.js';
|
package/dist/core.js
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -3987,7 +3987,8 @@ function SelectionPanel({
|
|
|
3987
3987
|
displayField = "label",
|
|
3988
3988
|
columns = 1,
|
|
3989
3989
|
maxHeight = 250,
|
|
3990
|
-
autoFocusSearch = false
|
|
3990
|
+
autoFocusSearch = false,
|
|
3991
|
+
groupCheckable = false
|
|
3991
3992
|
}) {
|
|
3992
3993
|
const [localSearch, setLocalSearch] = (0, import_react19.useState)("");
|
|
3993
3994
|
const search = searchValue ?? localSearch;
|
|
@@ -4019,7 +4020,7 @@ function SelectionPanel({
|
|
|
4019
4020
|
let top = 0;
|
|
4020
4021
|
for (const [group, items] of groups) {
|
|
4021
4022
|
if (group) {
|
|
4022
|
-
rows2.push({ key: `group-${rows2.length}`, title: group, top, height: 30 });
|
|
4023
|
+
rows2.push({ key: `group-${rows2.length}`, title: group, items, top, height: 30 });
|
|
4023
4024
|
top += 30;
|
|
4024
4025
|
}
|
|
4025
4026
|
for (let index = 0; index < items.length; index += count) {
|
|
@@ -4057,6 +4058,42 @@ function SelectionPanel({
|
|
|
4057
4058
|
const add = enabled.filter((option) => operation === "all" || !selected.has(option.value)).map((option) => option.value);
|
|
4058
4059
|
onChange([...retained, ...add]);
|
|
4059
4060
|
}
|
|
4061
|
+
function groupHeading(title, items) {
|
|
4062
|
+
if (!multiple || !groupCheckable) return title;
|
|
4063
|
+
const editable = items.filter((option) => !option.disabled && option.optionType !== "divider");
|
|
4064
|
+
const all = editable.length > 0 && editable.every((option) => selected.has(option.value));
|
|
4065
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
4066
|
+
Checkbox2,
|
|
4067
|
+
{
|
|
4068
|
+
checked: all,
|
|
4069
|
+
indeterminate: !all && editable.some((option) => selected.has(option.value)),
|
|
4070
|
+
disabled: disabled || loading || !editable.length,
|
|
4071
|
+
onChange: (checked) => {
|
|
4072
|
+
const next = new Set(value);
|
|
4073
|
+
editable.forEach((option) => checked ? next.add(option.value) : next.delete(option.value));
|
|
4074
|
+
onChange([...next]);
|
|
4075
|
+
},
|
|
4076
|
+
children: title
|
|
4077
|
+
}
|
|
4078
|
+
);
|
|
4079
|
+
}
|
|
4080
|
+
function help(option) {
|
|
4081
|
+
return option.description != null && option.description !== false ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Tooltip, { title: option.description, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
4082
|
+
"span",
|
|
4083
|
+
{
|
|
4084
|
+
role: "img",
|
|
4085
|
+
"aria-label": "\u9009\u9879\u8BF4\u660E",
|
|
4086
|
+
tabIndex: 0,
|
|
4087
|
+
onClick: (event) => {
|
|
4088
|
+
event.preventDefault();
|
|
4089
|
+
event.stopPropagation();
|
|
4090
|
+
},
|
|
4091
|
+
onKeyDown: (event) => event.stopPropagation(),
|
|
4092
|
+
style: { display: "inline-flex", marginInlineStart: 4 },
|
|
4093
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Icon, { name: "help-circle", size: 14 })
|
|
4094
|
+
}
|
|
4095
|
+
) }) : null;
|
|
4096
|
+
}
|
|
4060
4097
|
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "sia-selection-panel", children: [
|
|
4061
4098
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(FloatingScrollbarProvider, { targetRef: listRef }),
|
|
4062
4099
|
showSearch && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
@@ -4110,7 +4147,7 @@ function SelectionPanel({
|
|
|
4110
4147
|
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)));
|
|
4111
4148
|
const option = enabled[next];
|
|
4112
4149
|
setActive(option.value);
|
|
4113
|
-
const row = rows.find((row2) => row2.items?.includes(option));
|
|
4150
|
+
const row = rows.find((row2) => row2.title === void 0 && row2.items?.includes(option));
|
|
4114
4151
|
if (row && listRef.current) {
|
|
4115
4152
|
listRef.current.scrollTop = Math.max(0, row.top - maxHeight / 2);
|
|
4116
4153
|
setScrollTop(listRef.current.scrollTop);
|
|
@@ -4125,7 +4162,7 @@ function SelectionPanel({
|
|
|
4125
4162
|
{
|
|
4126
4163
|
className: row.title !== void 0 ? "sia-selection-panel__group" : "sia-selection-panel__row",
|
|
4127
4164
|
style: { position: "absolute", top: row.top, height: row.height, width: "100%", gridTemplateColumns: `repeat(${count}, minmax(0, 1fr))` },
|
|
4128
|
-
children: row.title ?? row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
4165
|
+
children: row.title !== void 0 ? groupHeading(row.title, row.items ?? []) : row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
4129
4166
|
"div",
|
|
4130
4167
|
{
|
|
4131
4168
|
role: "option",
|
|
@@ -4142,10 +4179,16 @@ function SelectionPanel({
|
|
|
4142
4179
|
if (!event.target.closest(".sia-checkbox")) toggle(option);
|
|
4143
4180
|
},
|
|
4144
4181
|
children: multiple ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Checkbox2, { checked: selected.has(option.value), disabled: disabled || loading || option.disabled, tabIndex: -1, onChange: () => toggle(option), children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "sia-selection-panel__text", children: [
|
|
4145
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.
|
|
4182
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "sia-selection-panel__label", children: [
|
|
4183
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
4184
|
+
help(option)
|
|
4185
|
+
] }),
|
|
4146
4186
|
showValue && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("small", { children: String(option.value) })
|
|
4147
4187
|
] }) }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "sia-selection-panel__text", children: [
|
|
4148
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.
|
|
4188
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "sia-selection-panel__label", children: [
|
|
4189
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
4190
|
+
help(option)
|
|
4191
|
+
] }),
|
|
4149
4192
|
showValue && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("small", { children: String(option.value) })
|
|
4150
4193
|
] })
|
|
4151
4194
|
}
|
|
@@ -4666,6 +4709,7 @@ var Select = (0, import_react21.forwardRef)(function Select2({
|
|
|
4666
4709
|
value: modalValues,
|
|
4667
4710
|
onChange: setModalValues,
|
|
4668
4711
|
multiple,
|
|
4712
|
+
groupCheckable: modalConfig?.groupCheckable,
|
|
4669
4713
|
allowDeselect: allowClear,
|
|
4670
4714
|
selectedOnly,
|
|
4671
4715
|
showValue,
|
|
@@ -11826,6 +11870,7 @@ function SelectModalBody({ config, values, disabled, onChange }) {
|
|
|
11826
11870
|
value: values,
|
|
11827
11871
|
onChange,
|
|
11828
11872
|
multiple,
|
|
11873
|
+
groupCheckable: config.groupCheckable,
|
|
11829
11874
|
disabled,
|
|
11830
11875
|
selectedOnly,
|
|
11831
11876
|
showValue: config.showValue,
|
|
@@ -11851,7 +11896,7 @@ function openSelectModal(config) {
|
|
|
11851
11896
|
} });
|
|
11852
11897
|
}
|
|
11853
11898
|
function modalConfig() {
|
|
11854
|
-
const { options, value, mode, showValue, columns, maxHeight, headerExtra, extraValues, searchPlaceholder, filterOption, onSearch, onConfirm, ...modal } = current;
|
|
11899
|
+
const { options, value, mode, groupCheckable, showValue, columns, maxHeight, headerExtra, extraValues, searchPlaceholder, filterOption, onSearch, onConfirm, ...modal } = current;
|
|
11855
11900
|
return {
|
|
11856
11901
|
...modal,
|
|
11857
11902
|
title: current.title ?? "\u8BF7\u9009\u62E9",
|
|
@@ -24440,6 +24485,13 @@ function mergeQueryFields(saved, active) {
|
|
|
24440
24485
|
const current = new Set(active.map((item) => item.key));
|
|
24441
24486
|
return [...active, ...saved.filter((item) => !current.has(item.key))];
|
|
24442
24487
|
}
|
|
24488
|
+
function countQueryFieldRows(centers) {
|
|
24489
|
+
const rows = [];
|
|
24490
|
+
for (const top of centers) {
|
|
24491
|
+
if (!rows.some((value) => Math.abs(value - top) <= 0.5)) rows.push(top);
|
|
24492
|
+
}
|
|
24493
|
+
return rows.length;
|
|
24494
|
+
}
|
|
24443
24495
|
|
|
24444
24496
|
// src/components/QueryFormSettings.tsx
|
|
24445
24497
|
var import_jsx_runtime92 = require("react/jsx-runtime");
|
|
@@ -24607,6 +24659,7 @@ var import_jsx_runtime93 = require("react/jsx-runtime");
|
|
|
24607
24659
|
function QueryForm({
|
|
24608
24660
|
fields,
|
|
24609
24661
|
settings,
|
|
24662
|
+
showSettings,
|
|
24610
24663
|
children,
|
|
24611
24664
|
form: providedForm,
|
|
24612
24665
|
onSearch,
|
|
@@ -24681,6 +24734,7 @@ function QueryForm({
|
|
|
24681
24734
|
const actionsRef = (0, import_react97.useRef)(null);
|
|
24682
24735
|
const toggleRef = (0, import_react97.useRef)(null);
|
|
24683
24736
|
const [fittingCount, setFittingCount] = (0, import_react97.useState)(limit);
|
|
24737
|
+
const [settingsRows, setSettingsRows] = (0, import_react97.useState)(0);
|
|
24684
24738
|
(0, import_react97.useLayoutEffect)(() => {
|
|
24685
24739
|
const row = rowRef.current;
|
|
24686
24740
|
const actions = actionsRef.current;
|
|
@@ -24688,6 +24742,21 @@ function QueryForm({
|
|
|
24688
24742
|
function measure() {
|
|
24689
24743
|
if (!row || !actions) return;
|
|
24690
24744
|
const gap = parseFloat(getComputedStyle(row).columnGap) || 0;
|
|
24745
|
+
const sourceFields = Array.from(row.querySelectorAll(":scope > .sia-query-form__field"));
|
|
24746
|
+
const sourceHidden = sourceFields.map((field) => field.hidden);
|
|
24747
|
+
const sourceCollapsed = row.classList.contains("is-collapsed");
|
|
24748
|
+
row.classList.remove("is-collapsed");
|
|
24749
|
+
sourceFields.forEach((field) => {
|
|
24750
|
+
field.hidden = false;
|
|
24751
|
+
});
|
|
24752
|
+
if (row.clientWidth > 0) setSettingsRows(countQueryFieldRows(sourceFields.map((field) => {
|
|
24753
|
+
const rect = field.getBoundingClientRect();
|
|
24754
|
+
return rect.top + rect.height / 2;
|
|
24755
|
+
})));
|
|
24756
|
+
sourceFields.forEach((field, index) => {
|
|
24757
|
+
field.hidden = sourceHidden[index];
|
|
24758
|
+
});
|
|
24759
|
+
row.classList.toggle("is-collapsed", sourceCollapsed);
|
|
24691
24760
|
const allFields = Array.from(
|
|
24692
24761
|
row.querySelectorAll(":scope > .sia-query-form__field:not([data-settings-hidden])")
|
|
24693
24762
|
);
|
|
@@ -24914,7 +24983,7 @@ function QueryForm({
|
|
|
24914
24983
|
children: saveText
|
|
24915
24984
|
}
|
|
24916
24985
|
) : null,
|
|
24917
|
-
cloudSettings.control
|
|
24986
|
+
showSettings ?? settingsRows > 2 ? cloudSettings.control : null
|
|
24918
24987
|
] }),
|
|
24919
24988
|
collapsible && entries.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("span", { ref: toggleRef, hidden: !needsCollapse, children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
24920
24989
|
Button,
|
package/dist/index.d.cts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { T as TagStatus, B as BadgeProps } from './core-
|
|
2
|
-
export { a as Badge, b as BadgeRibbonProps, c as BadgeStatus, d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, C as Calendar, g as CalendarProps, h as Card, i as CardAccent, j as CardProps, k as Carousel, l as CarouselProps, m as CarouselRef, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, D as Dropdown, r as DropdownButtonProps, s as DropdownMenuProps, t as DropdownOpenSource, u as DropdownPlacement, v as DropdownProps, w as DropdownTrigger, F as FILLED_ICON_NAMES, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, H as FloatingPlacement, I as FloatingTrigger, J as ICON_NAMES, K as Icon, L as IconName, M as IconProps, N as IconVariant, O as Image, P as ImagePreview, Q as ImagePreviewConfig, R as ImagePreviewProps, S as ImageProps, U as Input, V as InputProps, W as Menu, X as MenuClickInfo, Y as MenuItem, Z as MenuMode, _ as MenuProps, $ as MenuTheme, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, a4 as NotificationConfig, a5 as NotificationPlacement, a6 as NotificationType, a7 as Popconfirm, a8 as PopconfirmProps, a9 as Popover, aa as PopoverProps, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ae as Rate, af as RateProps, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, ak as Spin, al as SpinProps, am as StepItem, an as StepStatus, ao as Steps, ap as StepsProps, aq as TabItem, ar as Tabs, as as TabsContextMenuClickInfo, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, aA as TagVariant, aB as Timeline, aC as TimelineItem, aD as TimelineProps, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aH as Tooltip, aI as TooltipProps, aJ as Tour, aK as TourProps, aL as TourStep, aM as Tree, aN as TreeDropPosition, aO as TreeKey, aP as TreeNode, aQ as TreeProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, a$ as UploadHttpRequest, b0 as UploadItemActions, b1 as UploadProps, b2 as UploadRef, b3 as UploadRejectInfo, b4 as UploadRequestHandle, b5 as UploadRequestOptions, b6 as Watermark, b7 as WatermarkFont, b8 as WatermarkProps, b9 as message, ba as notification } from './core-
|
|
1
|
+
import { T as TagStatus, B as BadgeProps } from './core-CkK9RRi0.cjs';
|
|
2
|
+
export { a as Badge, b as BadgeRibbonProps, c as BadgeStatus, d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, C as Calendar, g as CalendarProps, h as Card, i as CardAccent, j as CardProps, k as Carousel, l as CarouselProps, m as CarouselRef, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, D as Dropdown, r as DropdownButtonProps, s as DropdownMenuProps, t as DropdownOpenSource, u as DropdownPlacement, v as DropdownProps, w as DropdownTrigger, F as FILLED_ICON_NAMES, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, H as FloatingPlacement, I as FloatingTrigger, J as ICON_NAMES, K as Icon, L as IconName, M as IconProps, N as IconVariant, O as Image, P as ImagePreview, Q as ImagePreviewConfig, R as ImagePreviewProps, S as ImageProps, U as Input, V as InputProps, W as Menu, X as MenuClickInfo, Y as MenuItem, Z as MenuMode, _ as MenuProps, $ as MenuTheme, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, a4 as NotificationConfig, a5 as NotificationPlacement, a6 as NotificationType, a7 as Popconfirm, a8 as PopconfirmProps, a9 as Popover, aa as PopoverProps, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ae as Rate, af as RateProps, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, ak as Spin, al as SpinProps, am as StepItem, an as StepStatus, ao as Steps, ap as StepsProps, aq as TabItem, ar as Tabs, as as TabsContextMenuClickInfo, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, aA as TagVariant, aB as Timeline, aC as TimelineItem, aD as TimelineProps, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aH as Tooltip, aI as TooltipProps, aJ as Tour, aK as TourProps, aL as TourStep, aM as Tree, aN as TreeDropPosition, aO as TreeKey, aP as TreeNode, aQ as TreeProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, a$ as UploadHttpRequest, b0 as UploadItemActions, b1 as UploadProps, b2 as UploadRef, b3 as UploadRejectInfo, b4 as UploadRequestHandle, b5 as UploadRequestOptions, b6 as Watermark, b7 as WatermarkFont, b8 as WatermarkProps, b9 as message, ba as notification } from './core-CkK9RRi0.cjs';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { HTMLAttributes, ReactNode, CSSProperties, ElementType, FormHTMLAttributes, InputHTMLAttributes, ChangeEvent, TextareaHTMLAttributes, MouseEvent, Key, PointerEvent, Ref, ReactElement, ButtonHTMLAttributes, RefObject } from 'react';
|
|
5
5
|
import { C as ControlSize, I as InputPlaceholderMode, a as ControlStatus } from './shared-Bx4B28Wh.cjs';
|
|
6
|
-
import { O as OverlayContainer, a as OverlayApiHandle, M as ModalOpenConfig, S as SelectOption, b as SelectChangeValue, c as SelectProps, d as ModalActionResult, B as ButtonProps, e as ButtonSize } from './Select-
|
|
7
|
-
export { f as Button, g as ButtonVariant, h as Modal, i as ModalProps, j as ModalType, k as Select, l as SelectMode, m as SelectValue } from './Select-
|
|
8
|
-
export { D as DatePicker, a as DatePickerDisabledInfo, b as DatePickerPreset, c as DatePickerProps, d as DatePickerShowTime, e as DatePickerType, f as DatePickerValue, g as DateRangePickerPreset, h as DateRangePickerProps, S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-
|
|
6
|
+
import { O as OverlayContainer, a as OverlayApiHandle, M as ModalOpenConfig, S as SelectOption, b as SelectChangeValue, c as SelectProps, d as ModalActionResult, B as ButtonProps, e as ButtonSize } from './Select-DQpfyK7I.cjs';
|
|
7
|
+
export { f as Button, g as ButtonVariant, h as Modal, i as ModalProps, j as ModalType, k as Select, l as SelectMode, m as SelectValue } from './Select-DQpfyK7I.cjs';
|
|
8
|
+
export { D as DatePicker, a as DatePickerDisabledInfo, b as DatePickerPreset, c as DatePickerProps, d as DatePickerShowTime, e as DatePickerType, f as DatePickerValue, g as DateRangePickerPreset, h as DateRangePickerProps, S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-BT71tp7y.cjs';
|
|
9
9
|
export { RichTextContent, RichTextContentFormat, RichTextContentProps, RichTextEditor, RichTextEditorProps, RichTextImagePasteHandler, RichTextToolbar } from './rich-text-editor.cjs';
|
|
10
10
|
export { MarkdownEditor, MarkdownEditorMode, MarkdownEditorProps } from './markdown-editor.cjs';
|
|
11
11
|
import * as Monaco from 'monaco-editor';
|
|
@@ -1683,6 +1683,9 @@ interface SelectModalConfig extends Omit<ModalOpenConfig, "children" | "footer"
|
|
|
1683
1683
|
/** 单选或多选模式;single 确认时返回单值,multiple 返回数组。
|
|
1684
1684
|
* @defaultValue "single" */
|
|
1685
1685
|
mode?: SelectProps["mode"];
|
|
1686
|
+
/** 多选时显示分组复选框,仅切换当前搜索及已选视图中该组的可用项。
|
|
1687
|
+
* @defaultValue false */
|
|
1688
|
+
groupCheckable?: boolean;
|
|
1686
1689
|
/** 在选项名称下方另起一行显示 value;关闭此项仍可按 value 搜索。
|
|
1687
1690
|
* @defaultValue false */
|
|
1688
1691
|
showValue?: boolean;
|
|
@@ -2943,6 +2946,8 @@ interface SelectionOption {
|
|
|
2943
2946
|
disabledTip?: ReactNode;
|
|
2944
2947
|
/** 选项所属分组名称。 */
|
|
2945
2948
|
group?: string;
|
|
2949
|
+
/** 选项名称旁帮助图标的悬停说明,不参与搜索及值回填。 */
|
|
2950
|
+
description?: ReactNode;
|
|
2946
2951
|
/** 普通或按钮形态 */
|
|
2947
2952
|
optionType?: "divider";
|
|
2948
2953
|
}
|
|
@@ -2959,6 +2964,9 @@ interface SelectionPanelProps {
|
|
|
2959
2964
|
* @defaultValue false
|
|
2960
2965
|
*/
|
|
2961
2966
|
multiple?: boolean;
|
|
2967
|
+
/** 多选时在分组标题前显示复选框,仅切换当前搜索及已选视图中该组的可用选项;保留组外、隐藏及禁用的已选值。
|
|
2968
|
+
* @defaultValue false */
|
|
2969
|
+
groupCheckable?: boolean;
|
|
2962
2970
|
/** 单选时允许再次点击已选项以清空选择。 */
|
|
2963
2971
|
allowDeselect?: boolean;
|
|
2964
2972
|
/**
|
|
@@ -3022,7 +3030,7 @@ interface SelectionPanelProps {
|
|
|
3022
3030
|
autoFocusSearch?: boolean;
|
|
3023
3031
|
}
|
|
3024
3032
|
/** 可嵌入下拉或弹窗的分组选择面板,长列表按行虚拟化。 */
|
|
3025
|
-
declare function SelectionPanel({ options, value, onChange, multiple, allowDeselect, disabled, loading, showSearch, showActions, includeUnknownValues, searchValue, onSearch, selectedOnly, showValue, displayField, columns, maxHeight, autoFocusSearch }: SelectionPanelProps): react.JSX.Element;
|
|
3033
|
+
declare function SelectionPanel({ options, value, onChange, multiple, allowDeselect, disabled, loading, showSearch, showActions, includeUnknownValues, searchValue, onSearch, selectedOnly, showValue, displayField, columns, maxHeight, autoFocusSearch, groupCheckable }: SelectionPanelProps): react.JSX.Element;
|
|
3026
3034
|
|
|
3027
3035
|
/** 输入选择组合控件的属性配置。 */
|
|
3028
3036
|
interface InputSelectProps {
|
|
@@ -3152,8 +3160,14 @@ interface QueryFormSearchInfo {
|
|
|
3152
3160
|
interface QueryFormProps<T extends FormValues = FormValues> extends Omit<FormProps, "onFinish" | "children" | "onError"> {
|
|
3153
3161
|
/** 查询字段配置,每项包含稳定 key、可选宽度以及 Form.Item 属性;提供后优先于 children。 */
|
|
3154
3162
|
fields?: readonly QueryFormField[];
|
|
3155
|
-
/** 云设置入口,在查询操作按钮组末尾显示竖向三点图标;复用表格 adapter 和 scope,读写共用快照的 queryForm
|
|
3163
|
+
/** 云设置入口,在查询操作按钮组末尾显示竖向三点图标;复用表格 adapter 和 scope,读写共用快照的 queryForm 属性。未提供时不显示入口;入口显隐由 showSettings 控制。隐藏字段保留挂载和值;children 模式需提供稳定 React key。 */
|
|
3156
3164
|
settings?: QueryFormSettingsConfig;
|
|
3165
|
+
/**
|
|
3166
|
+
* 是否显示查询设置入口,需同时提供 settings。true 始终显示,false 始终隐藏;未指定时,全部条件在当前宽度下展开超过两行才显示。
|
|
3167
|
+
* 行数不包含操作按钮和快捷查询;按未隐藏条件前的完整字段测量,收起或保存字段显隐后仍可恢复设置。
|
|
3168
|
+
* @defaultValue undefined
|
|
3169
|
+
*/
|
|
3170
|
+
showSettings?: boolean;
|
|
3157
3171
|
/** 也可直接放入 Form.Item 或 Space.Compact,每个直接子项视为一个查询字段。 */
|
|
3158
3172
|
children?: ReactNode;
|
|
3159
3173
|
/** 表单校验通过后执行查询。values 是完整条件;info.source 区分 submit(查询)、reset(重置)、quick(顶部预设)和 saved(已保存条件)。返回 Promise 时自动显示加载状态并阻止重复提交。 */
|
|
@@ -3242,7 +3256,7 @@ interface QueryFormProps<T extends FormValues = FormValues> extends Omit<FormPro
|
|
|
3242
3256
|
actionsExtra?: ReactNode;
|
|
3243
3257
|
}
|
|
3244
3258
|
/** 可复用的业务查询表单;快捷查询的存储和结果数据由业务方管理。 */
|
|
3245
|
-
declare function QueryForm<T extends FormValues = FormValues>({ fields, settings, children, form: providedForm, onSearch, loading, fieldWidth, collapsible, collapsed: controlledCollapsed, defaultCollapsed, collapsedCount, onCollapsedChange, quickQueries, quickQuerySize, savedQueries, shortcutsLoading, onSaveQuery, onRemoveQuery, onError, searchText, resetText, saveText, resetSearch, actionsExtra, disabled, className, placeholderMode, onValuesChange, onFinishFailed, ...formProps }: QueryFormProps<T>): react.JSX.Element;
|
|
3259
|
+
declare function QueryForm<T extends FormValues = FormValues>({ fields, settings, showSettings, children, form: providedForm, onSearch, loading, fieldWidth, collapsible, collapsed: controlledCollapsed, defaultCollapsed, collapsedCount, onCollapsedChange, quickQueries, quickQuerySize, savedQueries, shortcutsLoading, onSaveQuery, onRemoveQuery, onError, searchText, resetText, saveText, resetSearch, actionsExtra, disabled, className, placeholderMode, onValuesChange, onFinishFailed, ...formProps }: QueryFormProps<T>): react.JSX.Element;
|
|
3246
3260
|
|
|
3247
3261
|
/** 数字区间,依次为下限和上限;null 表示该端未填写,0 是有效数值。 */
|
|
3248
3262
|
type NumberRangeValue = [number | null, number | null];
|
package/dist/index.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { T as TagStatus, B as BadgeProps } from './core-
|
|
2
|
-
export { a as Badge, b as BadgeRibbonProps, c as BadgeStatus, d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, C as Calendar, g as CalendarProps, h as Card, i as CardAccent, j as CardProps, k as Carousel, l as CarouselProps, m as CarouselRef, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, D as Dropdown, r as DropdownButtonProps, s as DropdownMenuProps, t as DropdownOpenSource, u as DropdownPlacement, v as DropdownProps, w as DropdownTrigger, F as FILLED_ICON_NAMES, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, H as FloatingPlacement, I as FloatingTrigger, J as ICON_NAMES, K as Icon, L as IconName, M as IconProps, N as IconVariant, O as Image, P as ImagePreview, Q as ImagePreviewConfig, R as ImagePreviewProps, S as ImageProps, U as Input, V as InputProps, W as Menu, X as MenuClickInfo, Y as MenuItem, Z as MenuMode, _ as MenuProps, $ as MenuTheme, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, a4 as NotificationConfig, a5 as NotificationPlacement, a6 as NotificationType, a7 as Popconfirm, a8 as PopconfirmProps, a9 as Popover, aa as PopoverProps, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ae as Rate, af as RateProps, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, ak as Spin, al as SpinProps, am as StepItem, an as StepStatus, ao as Steps, ap as StepsProps, aq as TabItem, ar as Tabs, as as TabsContextMenuClickInfo, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, aA as TagVariant, aB as Timeline, aC as TimelineItem, aD as TimelineProps, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aH as Tooltip, aI as TooltipProps, aJ as Tour, aK as TourProps, aL as TourStep, aM as Tree, aN as TreeDropPosition, aO as TreeKey, aP as TreeNode, aQ as TreeProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, a$ as UploadHttpRequest, b0 as UploadItemActions, b1 as UploadProps, b2 as UploadRef, b3 as UploadRejectInfo, b4 as UploadRequestHandle, b5 as UploadRequestOptions, b6 as Watermark, b7 as WatermarkFont, b8 as WatermarkProps, b9 as message, ba as notification } from './core-
|
|
1
|
+
import { T as TagStatus, B as BadgeProps } from './core-uAx1caJB.js';
|
|
2
|
+
export { a as Badge, b as BadgeRibbonProps, c as BadgeStatus, d as Breadcrumb, e as BreadcrumbItem, f as BreadcrumbProps, C as Calendar, g as CalendarProps, h as Card, i as CardAccent, j as CardProps, k as Carousel, l as CarouselProps, m as CarouselRef, n as Collapse, o as CollapseItem, p as CollapseKey, q as CollapseProps, D as Dropdown, r as DropdownButtonProps, s as DropdownMenuProps, t as DropdownOpenSource, u as DropdownPlacement, v as DropdownProps, w as DropdownTrigger, F as FILLED_ICON_NAMES, x as FilledIconName, y as FloatButton, z as FloatButtonBackTopProps, A as FloatButtonGroupProps, E as FloatButtonProps, G as FloatButtonShape, H as FloatingPlacement, I as FloatingTrigger, J as ICON_NAMES, K as Icon, L as IconName, M as IconProps, N as IconVariant, O as Image, P as ImagePreview, Q as ImagePreviewConfig, R as ImagePreviewProps, S as ImageProps, U as Input, V as InputProps, W as Menu, X as MenuClickInfo, Y as MenuItem, Z as MenuMode, _ as MenuProps, $ as MenuTheme, a0 as MessageConfig, a1 as MessageHandle, a2 as MessageKey, a3 as MessageType, a4 as NotificationConfig, a5 as NotificationPlacement, a6 as NotificationType, a7 as Popconfirm, a8 as PopconfirmProps, a9 as Popover, aa as PopoverProps, ab as Progress, ac as ProgressProps, ad as ProgressStatus, ae as Rate, af as RateProps, ag as Segmented, ah as SegmentedOption, ai as SegmentedProps, aj as SegmentedValue, ak as Spin, al as SpinProps, am as StepItem, an as StepStatus, ao as Steps, ap as StepsProps, aq as TabItem, ar as Tabs, as as TabsContextMenuClickInfo, at as TabsOrientation, au as TabsPosition, av as TabsProps, aw as TabsType, ax as Tag, ay as TagProps, az as TagSize, aA as TagVariant, aB as Timeline, aC as TimelineItem, aD as TimelineProps, aE as Toolbar, aF as ToolbarItem, aG as ToolbarProps, aH as Tooltip, aI as TooltipProps, aJ as Tour, aK as TourProps, aL as TourStep, aM as Tree, aN as TreeDropPosition, aO as TreeKey, aP as TreeNode, aQ as TreeProps, aR as Typography, aS as TypographyLinkProps, aT as TypographyProps, aU as TypographyTitleProps, aV as TypographyType, aW as Upload, aX as UploadChangeInfo, aY as UploadDraggerProps, aZ as UploadFile, a_ as UploadFileStatus, a$ as UploadHttpRequest, b0 as UploadItemActions, b1 as UploadProps, b2 as UploadRef, b3 as UploadRejectInfo, b4 as UploadRequestHandle, b5 as UploadRequestOptions, b6 as Watermark, b7 as WatermarkFont, b8 as WatermarkProps, b9 as message, ba as notification } from './core-uAx1caJB.js';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { HTMLAttributes, ReactNode, CSSProperties, ElementType, FormHTMLAttributes, InputHTMLAttributes, ChangeEvent, TextareaHTMLAttributes, MouseEvent, Key, PointerEvent, Ref, ReactElement, ButtonHTMLAttributes, RefObject } from 'react';
|
|
5
5
|
import { C as ControlSize, I as InputPlaceholderMode, a as ControlStatus } from './shared-Bx4B28Wh.js';
|
|
6
|
-
import { O as OverlayContainer, a as OverlayApiHandle, M as ModalOpenConfig, S as SelectOption, b as SelectChangeValue, c as SelectProps, d as ModalActionResult, B as ButtonProps, e as ButtonSize } from './Select-
|
|
7
|
-
export { f as Button, g as ButtonVariant, h as Modal, i as ModalProps, j as ModalType, k as Select, l as SelectMode, m as SelectValue } from './Select-
|
|
8
|
-
export { D as DatePicker, a as DatePickerDisabledInfo, b as DatePickerPreset, c as DatePickerProps, d as DatePickerShowTime, e as DatePickerType, f as DatePickerValue, g as DateRangePickerPreset, h as DateRangePickerProps, S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-
|
|
6
|
+
import { O as OverlayContainer, a as OverlayApiHandle, M as ModalOpenConfig, S as SelectOption, b as SelectChangeValue, c as SelectProps, d as ModalActionResult, B as ButtonProps, e as ButtonSize } from './Select-DmT9pFRW.js';
|
|
7
|
+
export { f as Button, g as ButtonVariant, h as Modal, i as ModalProps, j as ModalType, k as Select, l as SelectMode, m as SelectValue } from './Select-DmT9pFRW.js';
|
|
8
|
+
export { D as DatePicker, a as DatePickerDisabledInfo, b as DatePickerPreset, c as DatePickerProps, d as DatePickerShowTime, e as DatePickerType, f as DatePickerValue, g as DateRangePickerPreset, h as DateRangePickerProps, S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-CFGzoyLs.js';
|
|
9
9
|
export { RichTextContent, RichTextContentFormat, RichTextContentProps, RichTextEditor, RichTextEditorProps, RichTextImagePasteHandler, RichTextToolbar } from './rich-text-editor.js';
|
|
10
10
|
export { MarkdownEditor, MarkdownEditorMode, MarkdownEditorProps } from './markdown-editor.js';
|
|
11
11
|
import * as Monaco from 'monaco-editor';
|
|
@@ -1683,6 +1683,9 @@ interface SelectModalConfig extends Omit<ModalOpenConfig, "children" | "footer"
|
|
|
1683
1683
|
/** 单选或多选模式;single 确认时返回单值,multiple 返回数组。
|
|
1684
1684
|
* @defaultValue "single" */
|
|
1685
1685
|
mode?: SelectProps["mode"];
|
|
1686
|
+
/** 多选时显示分组复选框,仅切换当前搜索及已选视图中该组的可用项。
|
|
1687
|
+
* @defaultValue false */
|
|
1688
|
+
groupCheckable?: boolean;
|
|
1686
1689
|
/** 在选项名称下方另起一行显示 value;关闭此项仍可按 value 搜索。
|
|
1687
1690
|
* @defaultValue false */
|
|
1688
1691
|
showValue?: boolean;
|
|
@@ -2943,6 +2946,8 @@ interface SelectionOption {
|
|
|
2943
2946
|
disabledTip?: ReactNode;
|
|
2944
2947
|
/** 选项所属分组名称。 */
|
|
2945
2948
|
group?: string;
|
|
2949
|
+
/** 选项名称旁帮助图标的悬停说明,不参与搜索及值回填。 */
|
|
2950
|
+
description?: ReactNode;
|
|
2946
2951
|
/** 普通或按钮形态 */
|
|
2947
2952
|
optionType?: "divider";
|
|
2948
2953
|
}
|
|
@@ -2959,6 +2964,9 @@ interface SelectionPanelProps {
|
|
|
2959
2964
|
* @defaultValue false
|
|
2960
2965
|
*/
|
|
2961
2966
|
multiple?: boolean;
|
|
2967
|
+
/** 多选时在分组标题前显示复选框,仅切换当前搜索及已选视图中该组的可用选项;保留组外、隐藏及禁用的已选值。
|
|
2968
|
+
* @defaultValue false */
|
|
2969
|
+
groupCheckable?: boolean;
|
|
2962
2970
|
/** 单选时允许再次点击已选项以清空选择。 */
|
|
2963
2971
|
allowDeselect?: boolean;
|
|
2964
2972
|
/**
|
|
@@ -3022,7 +3030,7 @@ interface SelectionPanelProps {
|
|
|
3022
3030
|
autoFocusSearch?: boolean;
|
|
3023
3031
|
}
|
|
3024
3032
|
/** 可嵌入下拉或弹窗的分组选择面板,长列表按行虚拟化。 */
|
|
3025
|
-
declare function SelectionPanel({ options, value, onChange, multiple, allowDeselect, disabled, loading, showSearch, showActions, includeUnknownValues, searchValue, onSearch, selectedOnly, showValue, displayField, columns, maxHeight, autoFocusSearch }: SelectionPanelProps): react.JSX.Element;
|
|
3033
|
+
declare function SelectionPanel({ options, value, onChange, multiple, allowDeselect, disabled, loading, showSearch, showActions, includeUnknownValues, searchValue, onSearch, selectedOnly, showValue, displayField, columns, maxHeight, autoFocusSearch, groupCheckable }: SelectionPanelProps): react.JSX.Element;
|
|
3026
3034
|
|
|
3027
3035
|
/** 输入选择组合控件的属性配置。 */
|
|
3028
3036
|
interface InputSelectProps {
|
|
@@ -3152,8 +3160,14 @@ interface QueryFormSearchInfo {
|
|
|
3152
3160
|
interface QueryFormProps<T extends FormValues = FormValues> extends Omit<FormProps, "onFinish" | "children" | "onError"> {
|
|
3153
3161
|
/** 查询字段配置,每项包含稳定 key、可选宽度以及 Form.Item 属性;提供后优先于 children。 */
|
|
3154
3162
|
fields?: readonly QueryFormField[];
|
|
3155
|
-
/** 云设置入口,在查询操作按钮组末尾显示竖向三点图标;复用表格 adapter 和 scope,读写共用快照的 queryForm
|
|
3163
|
+
/** 云设置入口,在查询操作按钮组末尾显示竖向三点图标;复用表格 adapter 和 scope,读写共用快照的 queryForm 属性。未提供时不显示入口;入口显隐由 showSettings 控制。隐藏字段保留挂载和值;children 模式需提供稳定 React key。 */
|
|
3156
3164
|
settings?: QueryFormSettingsConfig;
|
|
3165
|
+
/**
|
|
3166
|
+
* 是否显示查询设置入口,需同时提供 settings。true 始终显示,false 始终隐藏;未指定时,全部条件在当前宽度下展开超过两行才显示。
|
|
3167
|
+
* 行数不包含操作按钮和快捷查询;按未隐藏条件前的完整字段测量,收起或保存字段显隐后仍可恢复设置。
|
|
3168
|
+
* @defaultValue undefined
|
|
3169
|
+
*/
|
|
3170
|
+
showSettings?: boolean;
|
|
3157
3171
|
/** 也可直接放入 Form.Item 或 Space.Compact,每个直接子项视为一个查询字段。 */
|
|
3158
3172
|
children?: ReactNode;
|
|
3159
3173
|
/** 表单校验通过后执行查询。values 是完整条件;info.source 区分 submit(查询)、reset(重置)、quick(顶部预设)和 saved(已保存条件)。返回 Promise 时自动显示加载状态并阻止重复提交。 */
|
|
@@ -3242,7 +3256,7 @@ interface QueryFormProps<T extends FormValues = FormValues> extends Omit<FormPro
|
|
|
3242
3256
|
actionsExtra?: ReactNode;
|
|
3243
3257
|
}
|
|
3244
3258
|
/** 可复用的业务查询表单;快捷查询的存储和结果数据由业务方管理。 */
|
|
3245
|
-
declare function QueryForm<T extends FormValues = FormValues>({ fields, settings, children, form: providedForm, onSearch, loading, fieldWidth, collapsible, collapsed: controlledCollapsed, defaultCollapsed, collapsedCount, onCollapsedChange, quickQueries, quickQuerySize, savedQueries, shortcutsLoading, onSaveQuery, onRemoveQuery, onError, searchText, resetText, saveText, resetSearch, actionsExtra, disabled, className, placeholderMode, onValuesChange, onFinishFailed, ...formProps }: QueryFormProps<T>): react.JSX.Element;
|
|
3259
|
+
declare function QueryForm<T extends FormValues = FormValues>({ fields, settings, showSettings, children, form: providedForm, onSearch, loading, fieldWidth, collapsible, collapsed: controlledCollapsed, defaultCollapsed, collapsedCount, onCollapsedChange, quickQueries, quickQuerySize, savedQueries, shortcutsLoading, onSaveQuery, onRemoveQuery, onError, searchText, resetText, saveText, resetSearch, actionsExtra, disabled, className, placeholderMode, onValuesChange, onFinishFailed, ...formProps }: QueryFormProps<T>): react.JSX.Element;
|
|
3246
3260
|
|
|
3247
3261
|
/** 数字区间,依次为下限和上限;null 表示该端未填写,0 是有效数值。 */
|
|
3248
3262
|
type NumberRangeValue = [number | null, number | null];
|
package/dist/index.js
CHANGED
|
@@ -80,7 +80,7 @@ import {
|
|
|
80
80
|
Watermark,
|
|
81
81
|
message,
|
|
82
82
|
notification
|
|
83
|
-
} from "./chunk-
|
|
83
|
+
} from "./chunk-FGGBNWBT.js";
|
|
84
84
|
import {
|
|
85
85
|
MarkdownEditor
|
|
86
86
|
} from "./chunk-TUXNOSCT.js";
|
|
@@ -92,7 +92,7 @@ import {
|
|
|
92
92
|
DatePicker,
|
|
93
93
|
SelectDateRange,
|
|
94
94
|
TimePanel
|
|
95
|
-
} from "./chunk-
|
|
95
|
+
} from "./chunk-4TTHPU2S.js";
|
|
96
96
|
import {
|
|
97
97
|
Checkbox,
|
|
98
98
|
FloatingScrollbarProvider,
|
|
@@ -104,7 +104,7 @@ import {
|
|
|
104
104
|
Tooltip,
|
|
105
105
|
Tree,
|
|
106
106
|
useScrollbarProximity
|
|
107
|
-
} from "./chunk-
|
|
107
|
+
} from "./chunk-DJTV4X6L.js";
|
|
108
108
|
import {
|
|
109
109
|
Dropdown,
|
|
110
110
|
FILLED_ICON_NAMES,
|
|
@@ -4378,6 +4378,7 @@ function SelectModalBody({ config, values, disabled, onChange }) {
|
|
|
4378
4378
|
value: values,
|
|
4379
4379
|
onChange,
|
|
4380
4380
|
multiple,
|
|
4381
|
+
groupCheckable: config.groupCheckable,
|
|
4381
4382
|
disabled,
|
|
4382
4383
|
selectedOnly,
|
|
4383
4384
|
showValue: config.showValue,
|
|
@@ -4403,7 +4404,7 @@ function openSelectModal(config) {
|
|
|
4403
4404
|
} });
|
|
4404
4405
|
}
|
|
4405
4406
|
function modalConfig() {
|
|
4406
|
-
const { options, value, mode, showValue, columns, maxHeight, headerExtra, extraValues, searchPlaceholder, filterOption, onSearch, onConfirm, ...modal } = current;
|
|
4407
|
+
const { options, value, mode, groupCheckable, showValue, columns, maxHeight, headerExtra, extraValues, searchPlaceholder, filterOption, onSearch, onConfirm, ...modal } = current;
|
|
4407
4408
|
return {
|
|
4408
4409
|
...modal,
|
|
4409
4410
|
title: current.title ?? "\u8BF7\u9009\u62E9",
|
|
@@ -9092,6 +9093,13 @@ function mergeQueryFields(saved, active) {
|
|
|
9092
9093
|
const current = new Set(active.map((item) => item.key));
|
|
9093
9094
|
return [...active, ...saved.filter((item) => !current.has(item.key))];
|
|
9094
9095
|
}
|
|
9096
|
+
function countQueryFieldRows(centers) {
|
|
9097
|
+
const rows = [];
|
|
9098
|
+
for (const top of centers) {
|
|
9099
|
+
if (!rows.some((value) => Math.abs(value - top) <= 0.5)) rows.push(top);
|
|
9100
|
+
}
|
|
9101
|
+
return rows.length;
|
|
9102
|
+
}
|
|
9095
9103
|
|
|
9096
9104
|
// src/components/QueryFormSettings.tsx
|
|
9097
9105
|
import { Fragment as Fragment9, jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
@@ -9259,6 +9267,7 @@ import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
|
9259
9267
|
function QueryForm({
|
|
9260
9268
|
fields,
|
|
9261
9269
|
settings,
|
|
9270
|
+
showSettings,
|
|
9262
9271
|
children,
|
|
9263
9272
|
form: providedForm,
|
|
9264
9273
|
onSearch,
|
|
@@ -9333,6 +9342,7 @@ function QueryForm({
|
|
|
9333
9342
|
const actionsRef = useRef20(null);
|
|
9334
9343
|
const toggleRef = useRef20(null);
|
|
9335
9344
|
const [fittingCount, setFittingCount] = useState23(limit);
|
|
9345
|
+
const [settingsRows, setSettingsRows] = useState23(0);
|
|
9336
9346
|
useLayoutEffect6(() => {
|
|
9337
9347
|
const row = rowRef.current;
|
|
9338
9348
|
const actions = actionsRef.current;
|
|
@@ -9340,6 +9350,21 @@ function QueryForm({
|
|
|
9340
9350
|
function measure() {
|
|
9341
9351
|
if (!row || !actions) return;
|
|
9342
9352
|
const gap = parseFloat(getComputedStyle(row).columnGap) || 0;
|
|
9353
|
+
const sourceFields = Array.from(row.querySelectorAll(":scope > .sia-query-form__field"));
|
|
9354
|
+
const sourceHidden = sourceFields.map((field) => field.hidden);
|
|
9355
|
+
const sourceCollapsed = row.classList.contains("is-collapsed");
|
|
9356
|
+
row.classList.remove("is-collapsed");
|
|
9357
|
+
sourceFields.forEach((field) => {
|
|
9358
|
+
field.hidden = false;
|
|
9359
|
+
});
|
|
9360
|
+
if (row.clientWidth > 0) setSettingsRows(countQueryFieldRows(sourceFields.map((field) => {
|
|
9361
|
+
const rect = field.getBoundingClientRect();
|
|
9362
|
+
return rect.top + rect.height / 2;
|
|
9363
|
+
})));
|
|
9364
|
+
sourceFields.forEach((field, index) => {
|
|
9365
|
+
field.hidden = sourceHidden[index];
|
|
9366
|
+
});
|
|
9367
|
+
row.classList.toggle("is-collapsed", sourceCollapsed);
|
|
9343
9368
|
const allFields = Array.from(
|
|
9344
9369
|
row.querySelectorAll(":scope > .sia-query-form__field:not([data-settings-hidden])")
|
|
9345
9370
|
);
|
|
@@ -9566,7 +9591,7 @@ function QueryForm({
|
|
|
9566
9591
|
children: saveText
|
|
9567
9592
|
}
|
|
9568
9593
|
) : null,
|
|
9569
|
-
cloudSettings.control
|
|
9594
|
+
showSettings ?? settingsRows > 2 ? cloudSettings.control : null
|
|
9570
9595
|
] }),
|
|
9571
9596
|
collapsible && entries.length > 0 ? /* @__PURE__ */ jsx27("span", { ref: toggleRef, hidden: !needsCollapse, children: /* @__PURE__ */ jsx27(
|
|
9572
9597
|
Button,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { InputHTMLAttributes, ReactNode, HTMLAttributes, CSSProperties } from 'react';
|
|
3
3
|
import { I as InputPlaceholderMode, C as ControlSize, a as ControlStatus } from './shared-Bx4B28Wh.cjs';
|
|
4
|
-
import { S as SelectOption, m as SelectValue } from './Select-
|
|
4
|
+
import { S as SelectOption, m as SelectValue } from './Select-DQpfyK7I.cjs';
|
|
5
5
|
|
|
6
6
|
/** 日期选择附带的时间选择配置。 */
|
|
7
7
|
type DatePickerShowTime = boolean | {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { InputHTMLAttributes, ReactNode, HTMLAttributes, CSSProperties } from 'react';
|
|
3
3
|
import { I as InputPlaceholderMode, C as ControlSize, a as ControlStatus } from './shared-Bx4B28Wh.js';
|
|
4
|
-
import { S as SelectOption, m as SelectValue } from './Select-
|
|
4
|
+
import { S as SelectOption, m as SelectValue } from './Select-DmT9pFRW.js';
|
|
5
5
|
|
|
6
6
|
/** 日期选择附带的时间选择配置。 */
|
|
7
7
|
type DatePickerShowTime = boolean | {
|
|
@@ -3623,7 +3623,8 @@ function SelectionPanel({
|
|
|
3623
3623
|
displayField = "label",
|
|
3624
3624
|
columns = 1,
|
|
3625
3625
|
maxHeight = 250,
|
|
3626
|
-
autoFocusSearch = false
|
|
3626
|
+
autoFocusSearch = false,
|
|
3627
|
+
groupCheckable = false
|
|
3627
3628
|
}) {
|
|
3628
3629
|
const [localSearch, setLocalSearch] = (0, import_react16.useState)("");
|
|
3629
3630
|
const search = searchValue ?? localSearch;
|
|
@@ -3655,7 +3656,7 @@ function SelectionPanel({
|
|
|
3655
3656
|
let top = 0;
|
|
3656
3657
|
for (const [group, items] of groups) {
|
|
3657
3658
|
if (group) {
|
|
3658
|
-
rows2.push({ key: `group-${rows2.length}`, title: group, top, height: 30 });
|
|
3659
|
+
rows2.push({ key: `group-${rows2.length}`, title: group, items, top, height: 30 });
|
|
3659
3660
|
top += 30;
|
|
3660
3661
|
}
|
|
3661
3662
|
for (let index = 0; index < items.length; index += count) {
|
|
@@ -3693,6 +3694,42 @@ function SelectionPanel({
|
|
|
3693
3694
|
const add = enabled.filter((option) => operation === "all" || !selected.has(option.value)).map((option) => option.value);
|
|
3694
3695
|
onChange([...retained, ...add]);
|
|
3695
3696
|
}
|
|
3697
|
+
function groupHeading(title, items) {
|
|
3698
|
+
if (!multiple || !groupCheckable) return title;
|
|
3699
|
+
const editable = items.filter((option) => !option.disabled && option.optionType !== "divider");
|
|
3700
|
+
const all = editable.length > 0 && editable.every((option) => selected.has(option.value));
|
|
3701
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
3702
|
+
Checkbox2,
|
|
3703
|
+
{
|
|
3704
|
+
checked: all,
|
|
3705
|
+
indeterminate: !all && editable.some((option) => selected.has(option.value)),
|
|
3706
|
+
disabled: disabled || loading || !editable.length,
|
|
3707
|
+
onChange: (checked) => {
|
|
3708
|
+
const next = new Set(value);
|
|
3709
|
+
editable.forEach((option) => checked ? next.add(option.value) : next.delete(option.value));
|
|
3710
|
+
onChange([...next]);
|
|
3711
|
+
},
|
|
3712
|
+
children: title
|
|
3713
|
+
}
|
|
3714
|
+
);
|
|
3715
|
+
}
|
|
3716
|
+
function help(option) {
|
|
3717
|
+
return option.description != null && option.description !== false ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Tooltip, { title: option.description, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
3718
|
+
"span",
|
|
3719
|
+
{
|
|
3720
|
+
role: "img",
|
|
3721
|
+
"aria-label": "\u9009\u9879\u8BF4\u660E",
|
|
3722
|
+
tabIndex: 0,
|
|
3723
|
+
onClick: (event) => {
|
|
3724
|
+
event.preventDefault();
|
|
3725
|
+
event.stopPropagation();
|
|
3726
|
+
},
|
|
3727
|
+
onKeyDown: (event) => event.stopPropagation(),
|
|
3728
|
+
style: { display: "inline-flex", marginInlineStart: 4 },
|
|
3729
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "help-circle", size: 14 })
|
|
3730
|
+
}
|
|
3731
|
+
) }) : null;
|
|
3732
|
+
}
|
|
3696
3733
|
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sia-selection-panel", children: [
|
|
3697
3734
|
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FloatingScrollbarProvider, { targetRef: listRef }),
|
|
3698
3735
|
showSearch && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
@@ -3746,7 +3783,7 @@ function SelectionPanel({
|
|
|
3746
3783
|
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)));
|
|
3747
3784
|
const option = enabled[next];
|
|
3748
3785
|
setActive(option.value);
|
|
3749
|
-
const row = rows.find((row2) => row2.items?.includes(option));
|
|
3786
|
+
const row = rows.find((row2) => row2.title === void 0 && row2.items?.includes(option));
|
|
3750
3787
|
if (row && listRef.current) {
|
|
3751
3788
|
listRef.current.scrollTop = Math.max(0, row.top - maxHeight / 2);
|
|
3752
3789
|
setScrollTop(listRef.current.scrollTop);
|
|
@@ -3761,7 +3798,7 @@ function SelectionPanel({
|
|
|
3761
3798
|
{
|
|
3762
3799
|
className: row.title !== void 0 ? "sia-selection-panel__group" : "sia-selection-panel__row",
|
|
3763
3800
|
style: { position: "absolute", top: row.top, height: row.height, width: "100%", gridTemplateColumns: `repeat(${count}, minmax(0, 1fr))` },
|
|
3764
|
-
children: row.title ?? row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
3801
|
+
children: row.title !== void 0 ? groupHeading(row.title, row.items ?? []) : row.items?.map((option, index) => option.optionType === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { role: "separator", className: "sia-selection-panel__divider" }, `divider-${index}`) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Tooltip, { title: option.disabled ? option.disabledTip : void 0, placement: "right", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
3765
3802
|
"div",
|
|
3766
3803
|
{
|
|
3767
3804
|
role: "option",
|
|
@@ -3778,10 +3815,16 @@ function SelectionPanel({
|
|
|
3778
3815
|
if (!event.target.closest(".sia-checkbox")) toggle(option);
|
|
3779
3816
|
},
|
|
3780
3817
|
children: multiple ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Checkbox2, { checked: selected.has(option.value), disabled: disabled || loading || option.disabled, tabIndex: -1, onChange: () => toggle(option), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { className: "sia-selection-panel__text", children: [
|
|
3781
|
-
/* @__PURE__ */ (0, import_jsx_runtime15.
|
|
3818
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { className: "sia-selection-panel__label", children: [
|
|
3819
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
3820
|
+
help(option)
|
|
3821
|
+
] }),
|
|
3782
3822
|
showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("small", { children: String(option.value) })
|
|
3783
3823
|
] }) }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { className: "sia-selection-panel__text", children: [
|
|
3784
|
-
/* @__PURE__ */ (0, import_jsx_runtime15.
|
|
3824
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { className: "sia-selection-panel__label", children: [
|
|
3825
|
+
showValue || displayField === "label" ? option.label : String(option.value),
|
|
3826
|
+
help(option)
|
|
3827
|
+
] }),
|
|
3785
3828
|
showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("small", { children: String(option.value) })
|
|
3786
3829
|
] })
|
|
3787
3830
|
}
|
|
@@ -4302,6 +4345,7 @@ var Select = (0, import_react18.forwardRef)(function Select2({
|
|
|
4302
4345
|
value: modalValues,
|
|
4303
4346
|
onChange: setModalValues,
|
|
4304
4347
|
multiple,
|
|
4348
|
+
groupCheckable: modalConfig?.groupCheckable,
|
|
4305
4349
|
allowDeselect: allowClear,
|
|
4306
4350
|
selectedOnly,
|
|
4307
4351
|
showValue,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-
|
|
1
|
+
export { S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-BT71tp7y.cjs';
|
|
2
2
|
import 'react';
|
|
3
3
|
import './shared-Bx4B28Wh.cjs';
|
|
4
|
-
import './Select-
|
|
4
|
+
import './Select-DQpfyK7I.cjs';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-
|
|
1
|
+
export { S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-CFGzoyLs.js';
|
|
2
2
|
import 'react';
|
|
3
3
|
import './shared-Bx4B28Wh.js';
|
|
4
|
-
import './Select-
|
|
4
|
+
import './Select-DmT9pFRW.js';
|