@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.
@@ -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。 */
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  FloatingScrollbarProvider,
3
3
  Select
4
- } from "./chunk-ZY3YKRD4.js";
4
+ } from "./chunk-DJTV4X6L.js";
5
5
  import {
6
6
  Icon
7
7
  } from "./chunk-X5BFQUFX.js";
@@ -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__ */ jsx3("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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__ */ jsx3("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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,7 +1,7 @@
1
1
  import {
2
2
  Popover,
3
3
  Tooltip
4
- } from "./chunk-ZY3YKRD4.js";
4
+ } from "./chunk-DJTV4X6L.js";
5
5
  import {
6
6
  Dropdown,
7
7
  Icon,
@@ -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-Bv2AmXRD.cjs';
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-Cc1owuvN.js';
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.jsx)("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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.jsx)("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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-DV-4tf3K.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-Bv2AmXRD.cjs';
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-DBfzPqVR.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-Cc1owuvN.js';
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
@@ -10,10 +10,10 @@ import {
10
10
  Typography,
11
11
  Upload,
12
12
  message
13
- } from "./chunk-7MTL2KB5.js";
13
+ } from "./chunk-FGGBNWBT.js";
14
14
  import {
15
15
  Select
16
- } from "./chunk-ZY3YKRD4.js";
16
+ } from "./chunk-DJTV4X6L.js";
17
17
  import {
18
18
  Icon,
19
19
  Input,
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.jsx)("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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.jsx)("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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-DV-4tf3K.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-DV-4tf3K.cjs';
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-Bv2AmXRD.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-Bv2AmXRD.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-CRWxqHFp.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-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 属性。未提供时不显示入口。隐藏字段保留挂载和值;children 模式需提供稳定 React key。 */
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-DBfzPqVR.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-DBfzPqVR.js';
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-Cc1owuvN.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-Cc1owuvN.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-rtYL9egr.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-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 属性。未提供时不显示入口。隐藏字段保留挂载和值;children 模式需提供稳定 React key。 */
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-7MTL2KB5.js";
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-3JCIEB7I.js";
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-ZY3YKRD4.js";
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-Bv2AmXRD.cjs';
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-Cc1owuvN.js';
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.jsx)("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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.jsx)("span", { className: "sia-selection-panel__label", children: showValue || displayField === "label" ? option.label : String(option.value) }),
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-CRWxqHFp.cjs';
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-Bv2AmXRD.cjs';
4
+ import './Select-DQpfyK7I.cjs';
@@ -1,4 +1,4 @@
1
- export { S as SelectDateRange, i as SelectDateRangeProps, j as SelectDateRangeValue } from './select-date-range-rtYL9egr.js';
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-Cc1owuvN.js';
4
+ import './Select-DmT9pFRW.js';
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  SelectDateRange
3
- } from "./chunk-3JCIEB7I.js";
4
- import "./chunk-ZY3YKRD4.js";
3
+ } from "./chunk-4TTHPU2S.js";
4
+ import "./chunk-DJTV4X6L.js";
5
5
  import "./chunk-X5BFQUFX.js";
6
6
  import "./chunk-SJFT5OSX.js";
7
7
  import "./chunk-PUZWLIIJ.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sia.soul/sia-react-ui",
3
- "version": "0.1.92",
3
+ "version": "0.1.94",
4
4
  "description": "Sia Design components and tokens for React",
5
5
  "publishConfig": {
6
6
  "access": "public",