@sia.soul/sia-react-ui 0.1.30 → 0.1.32

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.
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  FloatingScrollbarProvider,
3
3
  Select
4
- } from "./chunk-DQYNL6VZ.js";
4
+ } from "./chunk-AHBC5UXJ.js";
5
5
  import {
6
6
  Icon
7
7
  } from "./chunk-YF2I6SDB.js";
@@ -60,6 +60,9 @@ var CheckboxRoot = forwardRef(function Checkbox({ value, size: sizeProp, indeter
60
60
  });
61
61
  function CheckboxGroup({
62
62
  size: sizeProp,
63
+ columns,
64
+ direction = "horizontal",
65
+ gap,
63
66
  value,
64
67
  defaultValue = [],
65
68
  options,
@@ -70,6 +73,11 @@ function CheckboxGroup({
70
73
  onChange
71
74
  }) {
72
75
  const size = useControlSize(sizeProp);
76
+ const gridColumns = columns !== void 0 && Number.isInteger(columns) && columns > 0 ? columns : void 0;
77
+ const layoutStyle = {
78
+ gridTemplateColumns: gridColumns ? `repeat(${gridColumns}, minmax(0, 1fr))` : void 0,
79
+ gap: gap === void 0 ? void 0 : typeof gap === "number" ? Math.max(0, gap) : `${Math.max(0, gap[0])}px ${Math.max(0, gap[1])}px`
80
+ };
73
81
  const [values, setValues] = useControllableState({ value, defaultValue, onChange });
74
82
  const context = useMemo(() => ({
75
83
  values,
@@ -80,7 +88,7 @@ function CheckboxGroup({
80
88
  setValues(next);
81
89
  }
82
90
  }), [disabled, name, setValues, values]);
83
- return /* @__PURE__ */ jsx(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ jsxs("div", { className: `sia-checkbox-group ${className}`.trim(), role: "group", children: [
91
+ return /* @__PURE__ */ jsx(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ jsxs("div", { className: `sia-checkbox-group${gridColumns ? " sia-checkbox-group--grid" : direction === "vertical" ? " sia-checkbox-group--vertical" : ""} ${className}`.trim(), style: layoutStyle, role: "group", children: [
84
92
  options?.map((option) => {
85
93
  const normalized = typeof option === "object" ? option : { label: String(option), value: option };
86
94
  return /* @__PURE__ */ jsx(CheckboxRoot, { value: normalized.value, disabled: normalized.disabled, children: normalized.label }, normalized.value);
@@ -5,7 +5,7 @@ import {
5
5
  Popover,
6
6
  Tooltip,
7
7
  useOverlayLifecycle
8
- } from "./chunk-DQYNL6VZ.js";
8
+ } from "./chunk-AHBC5UXJ.js";
9
9
  import {
10
10
  Dropdown,
11
11
  Icon
@@ -141,6 +141,7 @@ function Card({
141
141
  // src/components/Tag.tsx
142
142
  import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
143
143
  function Tag({
144
+ size: sizeProp,
144
145
  color,
145
146
  status = "default",
146
147
  compact = false,
@@ -155,11 +156,12 @@ function Tag({
155
156
  style,
156
157
  ...props
157
158
  }) {
159
+ const size = useControlSize(sizeProp ?? (compact ? "small" : void 0));
158
160
  const customColor = color?.trim() ? variant === "outlined" ? { borderColor: color, color, backgroundColor: "transparent" } : variant === "filled" ? { backgroundColor: color, color: "#fff", borderColor: "transparent" } : { color, backgroundColor: `color-mix(in srgb, ${color} 10%, transparent)`, borderColor: `color-mix(in srgb, ${color} 35%, transparent)` } : void 0;
159
161
  return /* @__PURE__ */ jsxs3(
160
162
  "span",
161
163
  {
162
- className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant}${compact ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
164
+ className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant} sia-tag--${size}${compact && size === "small" ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
163
165
  "aria-disabled": disabled || void 0,
164
166
  style: customColor ? { ...customColor, ...style } : style,
165
167
  ...withTitleTooltip(props),
@@ -177,7 +179,7 @@ function Tag({
177
179
  event.stopPropagation();
178
180
  onClose?.(event);
179
181
  },
180
- children: /* @__PURE__ */ jsx3(Icon, { name: "close", size: 12 })
182
+ children: /* @__PURE__ */ jsx3(Icon, { name: "close", size: size === "large" ? 14 : 12 })
181
183
  }
182
184
  ) : null
183
185
  ]
@@ -379,8 +379,15 @@ declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttribu
379
379
  type TagStatus = "default" | "success" | "processing" | "warning" | "error";
380
380
  /** 标签的视觉样式:soft 为柔和浅底,outlined 为透明底描边,filled 为实色背景。 */
381
381
  type TagVariant = "soft" | "outlined" | "filled";
382
+ /** 标签尺寸等级:small、medium、large,分别对应最小高度 20、24、32 像素。 */
383
+ type TagSize = ControlSize;
382
384
  /** 标签的属性配置。 */
383
385
  interface TagProps extends HTMLAttributes<HTMLSpanElement> {
386
+ /**
387
+ * 标签尺寸,small / medium / large 的最小高度为 20 / 24 / 32 像素,字号为 12 / 12 / 14 像素。显式 size 优先于 compact;未设置时 compact=true 使用 small,否则继承 Form 的尺寸,无 Form 时为 medium。
388
+ * @defaultValue "medium"(未指定且无 Form 上下文、未开启 compact 时)
389
+ */
390
+ size?: TagSize;
384
391
  /** 自定义 CSS 颜色,支持十六进制、rgb、颜色名称及 CSS 变量;覆盖 status 的颜色,由 variant 决定浅底、描边或实色效果。未提供非空颜色时沿用状态配色,style 中对应属性优先级最高。 */
385
392
  color?: string;
386
393
  /**
@@ -389,7 +396,7 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
389
396
  */
390
397
  status?: TagStatus;
391
398
  /**
392
- * 紧凑尺寸
399
+ * 兼容旧版的紧凑尺寸,未显式设置 size 时等同于 size="small",优先于 Form 继承尺寸;新代码建议直接使用 size。
393
400
  * @defaultValue false
394
401
  */
395
402
  compact?: boolean;
@@ -419,7 +426,7 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
419
426
  onClose?: (event: MouseEvent<HTMLButtonElement>) => void;
420
427
  }
421
428
  /** 标记状态或筛选条件的标签,支持语义配色、自定义边框色或背景色及关闭操作。 */
422
- declare function Tag({ color, status, compact, variant, icon, closable, closeOnHover, disabled, onClose, className, children, style, ...props }: TagProps): react.JSX.Element;
429
+ declare function Tag({ size: sizeProp, color, status, compact, variant, icon, closable, closeOnHover, disabled, onClose, className, children, style, ...props }: TagProps): react.JSX.Element;
423
430
 
424
431
  /** 菜单的模式类型。 */
425
432
  type MenuMode = "vertical" | "horizontal" | "inline";
@@ -706,7 +713,7 @@ interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
706
713
  * @defaultValue false
707
714
  */
708
715
  centered?: boolean;
709
- /** 标签栏左侧标题,科技大屏型会附带装饰线 */
716
+ /** 标签栏左侧标题,科技大屏型会附带装饰线;折线科技型横向布局按标题内容及装饰留白确定宽度,窄屏时标题独占一行。 */
710
717
  tabBarTitle?: ReactNode;
711
718
  /** 标签栏右侧额外操作 */
712
719
  tabBarExtraContent?: ReactNode;
@@ -1990,7 +1997,7 @@ interface MessageConfig {
1990
1997
  key?: MessageKey;
1991
1998
  /** 类型标识,用于选择对应的表现形式。 */
1992
1999
  type?: MessageType;
1993
- /** 消息正文,支持文本或 React 节点。 */
2000
+ /** 消息正文,默认字号为 14px;支持文本或 React 节点,自定义节点可自行设置字号。 */
1994
2001
  content: ReactNode;
1995
2002
  /** 自动关闭延迟,单位为秒;0 表示不自动关闭。 */
1996
2003
  duration?: number;
@@ -2229,4 +2236,4 @@ declare const FloatButton: react.ForwardRefExoticComponent<FloatButtonProps & re
2229
2236
  BackTop: typeof FloatButtonBackTop;
2230
2237
  };
2231
2238
 
2232
- export { type MenuTheme as $, type FloatButtonGroupProps as A, type BadgeProps as B, Calendar as C, Dropdown as D, type FloatButtonProps as E, FILLED_ICON_NAMES as F, type FloatButtonShape as G, type FloatingPlacement as H, type FloatingTrigger as I, ICON_NAMES as J, Icon as K, type IconName as L, type IconProps as M, type IconVariant as N, Image as O, ImagePreview as P, type ImagePreviewConfig as Q, type ImagePreviewProps as R, type ImageProps as S, type TagStatus as T, Input as U, type InputProps as V, Menu as W, type MenuClickInfo as X, type MenuItem as Y, type MenuMode as Z, type MenuProps as _, Badge as a, type UploadItemActions as a$, type MessageConfig as a0, type MessageHandle as a1, type MessageKey as a2, type MessageType as a3, type NotificationConfig as a4, type NotificationPlacement as a5, type NotificationType as a6, Popconfirm as a7, type PopconfirmProps as a8, Popover as a9, Timeline as aA, type TimelineItem as aB, type TimelineProps as aC, Toolbar as aD, type ToolbarItem as aE, type ToolbarProps as aF, Tooltip as aG, type TooltipProps as aH, Tour as aI, type TourProps as aJ, type TourStep as aK, Tree as aL, type TreeDropPosition as aM, type TreeKey as aN, type TreeNode as aO, type TreeProps as aP, Typography as aQ, type TypographyLinkProps as aR, type TypographyProps as aS, type TypographyTitleProps as aT, type TypographyType as aU, Upload as aV, type UploadChangeInfo as aW, type UploadDraggerProps as aX, type UploadFile as aY, type UploadFileStatus as aZ, type UploadHttpRequest as a_, type PopoverProps as aa, Progress as ab, type ProgressProps as ac, type ProgressStatus as ad, Rate as ae, type RateProps as af, Segmented as ag, type SegmentedOption as ah, type SegmentedProps as ai, type SegmentedValue as aj, Spin as ak, type SpinProps as al, type StepItem as am, type StepStatus as an, Steps as ao, type StepsProps as ap, type TabItem as aq, Tabs as ar, type TabsContextMenuClickInfo as as, type TabsOrientation as at, type TabsPosition as au, type TabsProps as av, type TabsType as aw, Tag as ax, type TagProps as ay, type TagVariant as az, type BadgeRibbonProps as b, type UploadProps as b0, type UploadRef as b1, type UploadRejectInfo as b2, type UploadRequestHandle as b3, type UploadRequestOptions as b4, Watermark as b5, type WatermarkFont as b6, type WatermarkProps as b7, message as b8, notification as b9, type BadgeStatus as c, Breadcrumb as d, type BreadcrumbItem as e, type BreadcrumbProps as f, type CalendarProps as g, Card as h, type CardAccent as i, type CardProps as j, Carousel as k, type CarouselProps as l, type CarouselRef as m, Collapse as n, type CollapseItem as o, type CollapseKey as p, type CollapseProps as q, type DropdownButtonProps as r, type DropdownMenuProps as s, type DropdownOpenSource as t, type DropdownPlacement as u, type DropdownProps as v, type DropdownTrigger as w, type FilledIconName as x, FloatButton as y, type FloatButtonBackTopProps as z };
2239
+ export { type MenuTheme as $, type FloatButtonGroupProps as A, type BadgeProps as B, Calendar as C, Dropdown as D, type FloatButtonProps as E, FILLED_ICON_NAMES as F, type FloatButtonShape as G, type FloatingPlacement as H, type FloatingTrigger as I, ICON_NAMES as J, Icon as K, type IconName as L, type IconProps as M, type IconVariant as N, Image as O, ImagePreview as P, type ImagePreviewConfig as Q, type ImagePreviewProps as R, type ImageProps as S, type TagStatus as T, Input as U, type InputProps as V, Menu as W, type MenuClickInfo as X, type MenuItem as Y, type MenuMode as Z, type MenuProps as _, Badge as a, type UploadHttpRequest as a$, type MessageConfig as a0, type MessageHandle as a1, type MessageKey as a2, type MessageType as a3, type NotificationConfig as a4, type NotificationPlacement as a5, type NotificationType as a6, Popconfirm as a7, type PopconfirmProps as a8, Popover as a9, type TagVariant as aA, Timeline as aB, type TimelineItem as aC, type TimelineProps as aD, Toolbar as aE, type ToolbarItem as aF, type ToolbarProps as aG, Tooltip as aH, type TooltipProps as aI, Tour as aJ, type TourProps as aK, type TourStep as aL, Tree as aM, type TreeDropPosition as aN, type TreeKey as aO, type TreeNode as aP, type TreeProps as aQ, Typography as aR, type TypographyLinkProps as aS, type TypographyProps as aT, type TypographyTitleProps as aU, type TypographyType as aV, Upload as aW, type UploadChangeInfo as aX, type UploadDraggerProps as aY, type UploadFile as aZ, type UploadFileStatus as a_, type PopoverProps as aa, Progress as ab, type ProgressProps as ac, type ProgressStatus as ad, Rate as ae, type RateProps as af, Segmented as ag, type SegmentedOption as ah, type SegmentedProps as ai, type SegmentedValue as aj, Spin as ak, type SpinProps as al, type StepItem as am, type StepStatus as an, Steps as ao, type StepsProps as ap, type TabItem as aq, Tabs as ar, type TabsContextMenuClickInfo as as, type TabsOrientation as at, type TabsPosition as au, type TabsProps as av, type TabsType as aw, Tag as ax, type TagProps as ay, type TagSize as az, type BadgeRibbonProps as b, type UploadItemActions as b0, type UploadProps as b1, type UploadRef as b2, type UploadRejectInfo as b3, type UploadRequestHandle as b4, type UploadRequestOptions as b5, Watermark as b6, type WatermarkFont as b7, type WatermarkProps as b8, message as b9, notification as ba, type BadgeStatus as c, Breadcrumb as d, type BreadcrumbItem as e, type BreadcrumbProps as f, type CalendarProps as g, Card as h, type CardAccent as i, type CardProps as j, Carousel as k, type CarouselProps as l, type CarouselRef as m, Collapse as n, type CollapseItem as o, type CollapseKey as p, type CollapseProps as q, type DropdownButtonProps as r, type DropdownMenuProps as s, type DropdownOpenSource as t, type DropdownPlacement as u, type DropdownProps as v, type DropdownTrigger as w, type FilledIconName as x, FloatButton as y, type FloatButtonBackTopProps as z };
@@ -379,8 +379,15 @@ declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttribu
379
379
  type TagStatus = "default" | "success" | "processing" | "warning" | "error";
380
380
  /** 标签的视觉样式:soft 为柔和浅底,outlined 为透明底描边,filled 为实色背景。 */
381
381
  type TagVariant = "soft" | "outlined" | "filled";
382
+ /** 标签尺寸等级:small、medium、large,分别对应最小高度 20、24、32 像素。 */
383
+ type TagSize = ControlSize;
382
384
  /** 标签的属性配置。 */
383
385
  interface TagProps extends HTMLAttributes<HTMLSpanElement> {
386
+ /**
387
+ * 标签尺寸,small / medium / large 的最小高度为 20 / 24 / 32 像素,字号为 12 / 12 / 14 像素。显式 size 优先于 compact;未设置时 compact=true 使用 small,否则继承 Form 的尺寸,无 Form 时为 medium。
388
+ * @defaultValue "medium"(未指定且无 Form 上下文、未开启 compact 时)
389
+ */
390
+ size?: TagSize;
384
391
  /** 自定义 CSS 颜色,支持十六进制、rgb、颜色名称及 CSS 变量;覆盖 status 的颜色,由 variant 决定浅底、描边或实色效果。未提供非空颜色时沿用状态配色,style 中对应属性优先级最高。 */
385
392
  color?: string;
386
393
  /**
@@ -389,7 +396,7 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
389
396
  */
390
397
  status?: TagStatus;
391
398
  /**
392
- * 紧凑尺寸
399
+ * 兼容旧版的紧凑尺寸,未显式设置 size 时等同于 size="small",优先于 Form 继承尺寸;新代码建议直接使用 size。
393
400
  * @defaultValue false
394
401
  */
395
402
  compact?: boolean;
@@ -419,7 +426,7 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
419
426
  onClose?: (event: MouseEvent<HTMLButtonElement>) => void;
420
427
  }
421
428
  /** 标记状态或筛选条件的标签,支持语义配色、自定义边框色或背景色及关闭操作。 */
422
- declare function Tag({ color, status, compact, variant, icon, closable, closeOnHover, disabled, onClose, className, children, style, ...props }: TagProps): react.JSX.Element;
429
+ declare function Tag({ size: sizeProp, color, status, compact, variant, icon, closable, closeOnHover, disabled, onClose, className, children, style, ...props }: TagProps): react.JSX.Element;
423
430
 
424
431
  /** 菜单的模式类型。 */
425
432
  type MenuMode = "vertical" | "horizontal" | "inline";
@@ -706,7 +713,7 @@ interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
706
713
  * @defaultValue false
707
714
  */
708
715
  centered?: boolean;
709
- /** 标签栏左侧标题,科技大屏型会附带装饰线 */
716
+ /** 标签栏左侧标题,科技大屏型会附带装饰线;折线科技型横向布局按标题内容及装饰留白确定宽度,窄屏时标题独占一行。 */
710
717
  tabBarTitle?: ReactNode;
711
718
  /** 标签栏右侧额外操作 */
712
719
  tabBarExtraContent?: ReactNode;
@@ -1990,7 +1997,7 @@ interface MessageConfig {
1990
1997
  key?: MessageKey;
1991
1998
  /** 类型标识,用于选择对应的表现形式。 */
1992
1999
  type?: MessageType;
1993
- /** 消息正文,支持文本或 React 节点。 */
2000
+ /** 消息正文,默认字号为 14px;支持文本或 React 节点,自定义节点可自行设置字号。 */
1994
2001
  content: ReactNode;
1995
2002
  /** 自动关闭延迟,单位为秒;0 表示不自动关闭。 */
1996
2003
  duration?: number;
@@ -2229,4 +2236,4 @@ declare const FloatButton: react.ForwardRefExoticComponent<FloatButtonProps & re
2229
2236
  BackTop: typeof FloatButtonBackTop;
2230
2237
  };
2231
2238
 
2232
- export { type MenuTheme as $, type FloatButtonGroupProps as A, type BadgeProps as B, Calendar as C, Dropdown as D, type FloatButtonProps as E, FILLED_ICON_NAMES as F, type FloatButtonShape as G, type FloatingPlacement as H, type FloatingTrigger as I, ICON_NAMES as J, Icon as K, type IconName as L, type IconProps as M, type IconVariant as N, Image as O, ImagePreview as P, type ImagePreviewConfig as Q, type ImagePreviewProps as R, type ImageProps as S, type TagStatus as T, Input as U, type InputProps as V, Menu as W, type MenuClickInfo as X, type MenuItem as Y, type MenuMode as Z, type MenuProps as _, Badge as a, type UploadItemActions as a$, type MessageConfig as a0, type MessageHandle as a1, type MessageKey as a2, type MessageType as a3, type NotificationConfig as a4, type NotificationPlacement as a5, type NotificationType as a6, Popconfirm as a7, type PopconfirmProps as a8, Popover as a9, Timeline as aA, type TimelineItem as aB, type TimelineProps as aC, Toolbar as aD, type ToolbarItem as aE, type ToolbarProps as aF, Tooltip as aG, type TooltipProps as aH, Tour as aI, type TourProps as aJ, type TourStep as aK, Tree as aL, type TreeDropPosition as aM, type TreeKey as aN, type TreeNode as aO, type TreeProps as aP, Typography as aQ, type TypographyLinkProps as aR, type TypographyProps as aS, type TypographyTitleProps as aT, type TypographyType as aU, Upload as aV, type UploadChangeInfo as aW, type UploadDraggerProps as aX, type UploadFile as aY, type UploadFileStatus as aZ, type UploadHttpRequest as a_, type PopoverProps as aa, Progress as ab, type ProgressProps as ac, type ProgressStatus as ad, Rate as ae, type RateProps as af, Segmented as ag, type SegmentedOption as ah, type SegmentedProps as ai, type SegmentedValue as aj, Spin as ak, type SpinProps as al, type StepItem as am, type StepStatus as an, Steps as ao, type StepsProps as ap, type TabItem as aq, Tabs as ar, type TabsContextMenuClickInfo as as, type TabsOrientation as at, type TabsPosition as au, type TabsProps as av, type TabsType as aw, Tag as ax, type TagProps as ay, type TagVariant as az, type BadgeRibbonProps as b, type UploadProps as b0, type UploadRef as b1, type UploadRejectInfo as b2, type UploadRequestHandle as b3, type UploadRequestOptions as b4, Watermark as b5, type WatermarkFont as b6, type WatermarkProps as b7, message as b8, notification as b9, type BadgeStatus as c, Breadcrumb as d, type BreadcrumbItem as e, type BreadcrumbProps as f, type CalendarProps as g, Card as h, type CardAccent as i, type CardProps as j, Carousel as k, type CarouselProps as l, type CarouselRef as m, Collapse as n, type CollapseItem as o, type CollapseKey as p, type CollapseProps as q, type DropdownButtonProps as r, type DropdownMenuProps as s, type DropdownOpenSource as t, type DropdownPlacement as u, type DropdownProps as v, type DropdownTrigger as w, type FilledIconName as x, FloatButton as y, type FloatButtonBackTopProps as z };
2239
+ export { type MenuTheme as $, type FloatButtonGroupProps as A, type BadgeProps as B, Calendar as C, Dropdown as D, type FloatButtonProps as E, FILLED_ICON_NAMES as F, type FloatButtonShape as G, type FloatingPlacement as H, type FloatingTrigger as I, ICON_NAMES as J, Icon as K, type IconName as L, type IconProps as M, type IconVariant as N, Image as O, ImagePreview as P, type ImagePreviewConfig as Q, type ImagePreviewProps as R, type ImageProps as S, type TagStatus as T, Input as U, type InputProps as V, Menu as W, type MenuClickInfo as X, type MenuItem as Y, type MenuMode as Z, type MenuProps as _, Badge as a, type UploadHttpRequest as a$, type MessageConfig as a0, type MessageHandle as a1, type MessageKey as a2, type MessageType as a3, type NotificationConfig as a4, type NotificationPlacement as a5, type NotificationType as a6, Popconfirm as a7, type PopconfirmProps as a8, Popover as a9, type TagVariant as aA, Timeline as aB, type TimelineItem as aC, type TimelineProps as aD, Toolbar as aE, type ToolbarItem as aF, type ToolbarProps as aG, Tooltip as aH, type TooltipProps as aI, Tour as aJ, type TourProps as aK, type TourStep as aL, Tree as aM, type TreeDropPosition as aN, type TreeKey as aO, type TreeNode as aP, type TreeProps as aQ, Typography as aR, type TypographyLinkProps as aS, type TypographyProps as aT, type TypographyTitleProps as aU, type TypographyType as aV, Upload as aW, type UploadChangeInfo as aX, type UploadDraggerProps as aY, type UploadFile as aZ, type UploadFileStatus as a_, type PopoverProps as aa, Progress as ab, type ProgressProps as ac, type ProgressStatus as ad, Rate as ae, type RateProps as af, Segmented as ag, type SegmentedOption as ah, type SegmentedProps as ai, type SegmentedValue as aj, Spin as ak, type SpinProps as al, type StepItem as am, type StepStatus as an, Steps as ao, type StepsProps as ap, type TabItem as aq, Tabs as ar, type TabsContextMenuClickInfo as as, type TabsOrientation as at, type TabsPosition as au, type TabsProps as av, type TabsType as aw, Tag as ax, type TagProps as ay, type TagSize as az, type BadgeRibbonProps as b, type UploadItemActions as b0, type UploadProps as b1, type UploadRef as b2, type UploadRejectInfo as b3, type UploadRequestHandle as b4, type UploadRequestOptions as b5, Watermark as b6, type WatermarkFont as b7, type WatermarkProps as b8, message as b9, notification as ba, type BadgeStatus as c, Breadcrumb as d, type BreadcrumbItem as e, type BreadcrumbProps as f, type CalendarProps as g, Card as h, type CardAccent as i, type CardProps as j, Carousel as k, type CarouselProps as l, type CarouselRef as m, Collapse as n, type CollapseItem as o, type CollapseKey as p, type CollapseProps as q, type DropdownButtonProps as r, type DropdownMenuProps as s, type DropdownOpenSource as t, type DropdownPlacement as u, type DropdownProps as v, type DropdownTrigger as w, type FilledIconName as x, FloatButton as y, type FloatButtonBackTopProps as z };
package/dist/core.cjs CHANGED
@@ -1761,6 +1761,7 @@ function Card({
1761
1761
  // src/components/Tag.tsx
1762
1762
  var import_jsx_runtime10 = require("react/jsx-runtime");
1763
1763
  function Tag({
1764
+ size: sizeProp,
1764
1765
  color,
1765
1766
  status = "default",
1766
1767
  compact = false,
@@ -1775,11 +1776,12 @@ function Tag({
1775
1776
  style,
1776
1777
  ...props
1777
1778
  }) {
1779
+ const size = useControlSize(sizeProp ?? (compact ? "small" : void 0));
1778
1780
  const customColor = color?.trim() ? variant === "outlined" ? { borderColor: color, color, backgroundColor: "transparent" } : variant === "filled" ? { backgroundColor: color, color: "#fff", borderColor: "transparent" } : { color, backgroundColor: `color-mix(in srgb, ${color} 10%, transparent)`, borderColor: `color-mix(in srgb, ${color} 35%, transparent)` } : void 0;
1779
1781
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
1780
1782
  "span",
1781
1783
  {
1782
- className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant}${compact ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
1784
+ className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant} sia-tag--${size}${compact && size === "small" ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
1783
1785
  "aria-disabled": disabled || void 0,
1784
1786
  style: customColor ? { ...customColor, ...style } : style,
1785
1787
  ...withTitleTooltip(props),
@@ -1797,7 +1799,7 @@ function Tag({
1797
1799
  event.stopPropagation();
1798
1800
  onClose?.(event);
1799
1801
  },
1800
- children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Icon, { name: "close", size: 12 })
1802
+ children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Icon, { name: "close", size: size === "large" ? 14 : 12 })
1801
1803
  }
1802
1804
  ) : null
1803
1805
  ]
@@ -2069,6 +2071,9 @@ var CheckboxRoot = (0, import_react11.forwardRef)(function Checkbox({ value, siz
2069
2071
  });
2070
2072
  function CheckboxGroup({
2071
2073
  size: sizeProp,
2074
+ columns,
2075
+ direction = "horizontal",
2076
+ gap,
2072
2077
  value,
2073
2078
  defaultValue = [],
2074
2079
  options,
@@ -2079,6 +2084,11 @@ function CheckboxGroup({
2079
2084
  onChange
2080
2085
  }) {
2081
2086
  const size = useControlSize(sizeProp);
2087
+ const gridColumns = columns !== void 0 && Number.isInteger(columns) && columns > 0 ? columns : void 0;
2088
+ const layoutStyle = {
2089
+ gridTemplateColumns: gridColumns ? `repeat(${gridColumns}, minmax(0, 1fr))` : void 0,
2090
+ gap: gap === void 0 ? void 0 : typeof gap === "number" ? Math.max(0, gap) : `${Math.max(0, gap[0])}px ${Math.max(0, gap[1])}px`
2091
+ };
2082
2092
  const [values, setValues] = useControllableState({ value, defaultValue, onChange });
2083
2093
  const context = (0, import_react11.useMemo)(() => ({
2084
2094
  values,
@@ -2089,7 +2099,7 @@ function CheckboxGroup({
2089
2099
  setValues(next);
2090
2100
  }
2091
2101
  }), [disabled, name, setValues, values]);
2092
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: `sia-checkbox-group ${className}`.trim(), role: "group", children: [
2102
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: `sia-checkbox-group${gridColumns ? " sia-checkbox-group--grid" : direction === "vertical" ? " sia-checkbox-group--vertical" : ""} ${className}`.trim(), style: layoutStyle, role: "group", children: [
2093
2103
  options?.map((option) => {
2094
2104
  const normalized = typeof option === "object" ? option : { label: String(option), value: option };
2095
2105
  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CheckboxRoot, { value: normalized.value, disabled: normalized.disabled, children: normalized.label }, normalized.value);
package/dist/core.css CHANGED
@@ -148,8 +148,8 @@ fieldset:disabled .sia-input-number__floating-placeholder {
148
148
  font-size: 12px;
149
149
  }
150
150
  :is(.sia-picker, .sia-time-range).sia-picker--medium {
151
- --sia-control-font-size: 14px;
152
- font-size: 14px;
151
+ --sia-control-font-size: 13px;
152
+ font-size: var(--sia-control-font-size);
153
153
  }
154
154
  :is(.sia-picker, .sia-time-range).sia-picker--large {
155
155
  --sia-control-font-size: 16px;
@@ -162,14 +162,14 @@ fieldset:disabled .sia-input-number__floating-placeholder {
162
162
  --sia-control-font-size: 12px;
163
163
  }
164
164
  :is(.sia-select--medium, .sia-tree-select--medium, .sia-cascader--medium) {
165
- --sia-control-font-size: 14px;
165
+ --sia-control-font-size: 13px;
166
166
  }
167
167
  :is(.sia-select--large, .sia-tree-select--large, .sia-cascader--large) {
168
168
  --sia-control-font-size: 16px;
169
169
  }
170
170
  .sia-tree-select .sia-tree-select__trigger,
171
171
  .sia-cascader .sia-cascader__trigger {
172
- font-size: var(--sia-control-font-size, 14px);
172
+ font-size: var(--sia-control-font-size, 13px);
173
173
  }
174
174
  .sia-segmented.sia-segmented--medium button {
175
175
  font-size: 14px;
@@ -188,7 +188,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
188
188
  .sia-radio--medium {
189
189
  --sia-choice-size: 16px;
190
190
  --sia-choice-dot: 8px;
191
- font-size: 14px;
191
+ font-size: 13px;
192
192
  }
193
193
  .sia-checkbox.sia-checkbox--large,
194
194
  .sia-radio.sia-radio--large {
@@ -238,7 +238,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
238
238
  --sia-switch-width: 44px;
239
239
  --sia-switch-height: 22px;
240
240
  --sia-switch-segmented-height: var(--sia-control-height-medium);
241
- font-size: 14px;
241
+ font-size: 13px;
242
242
  }
243
243
  .sia-switch-wrap.sia-switch-wrap--large {
244
244
  --sia-switch-width: 52px;
@@ -263,6 +263,15 @@ fieldset:disabled .sia-input-number__floating-placeholder {
263
263
  .sia-input-select .sia-input-control--small .sia-button {
264
264
  height: 18px;
265
265
  }
266
+ .sia-textarea-control--small {
267
+ --sia-control-font-size: 12px;
268
+ }
269
+ .sia-textarea-control--medium {
270
+ --sia-control-font-size: 14px;
271
+ }
272
+ .sia-textarea-control--large {
273
+ --sia-control-font-size: 16px;
274
+ }
266
275
  .sia-textarea-control--small .sia-textarea {
267
276
  padding: 4px 7px 22px;
268
277
  font-size: 12px;
@@ -389,7 +398,8 @@ fieldset:disabled .sia-input-number__floating-placeholder {
389
398
  --sia-control-height: var(--sia-control-height-medium);
390
399
  --sia-spacing: 16px;
391
400
  --sia-font-size: 16px;
392
- --sia-font-size-small: 14px;
401
+ --sia-font-size-small: 13px;
402
+ --sia-control-font-size: 13px;
393
403
  --sia-font-size-large: 18px;
394
404
  --sia-shadow-popup: 0 4px 12px rgb(0 0 0 / 22%);
395
405
  --sia-scroll-overflow: auto;
@@ -1002,7 +1012,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
1002
1012
  resize: vertical;
1003
1013
  color: inherit;
1004
1014
  font:
1005
- 400 var(--sia-font-size-small)/1.6 system-ui,
1015
+ 400 14px/1.6 system-ui,
1006
1016
  -apple-system,
1007
1017
  "Segoe UI",
1008
1018
  "Microsoft YaHei",
@@ -2393,7 +2403,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
2393
2403
  padding-inline: 16px;
2394
2404
  }
2395
2405
  .sia-message {
2396
- font-size: calc(var(--sia-font-size, 16px) - 1px);
2406
+ font-size: 14px;
2397
2407
  display: flex;
2398
2408
  align-items: center;
2399
2409
  gap: 9px;
@@ -2583,10 +2593,20 @@ fieldset:disabled .sia-input-number__floating-placeholder {
2583
2593
  border: 1px solid var(--sia-color-border);
2584
2594
  border-radius: 5px;
2585
2595
  }
2596
+ .sia-tag--small,
2586
2597
  .sia-tag--compact {
2587
2598
  min-height: 20px;
2588
2599
  padding-inline: 6px;
2589
2600
  }
2601
+ .sia-tag--medium {
2602
+ min-height: 24px;
2603
+ padding-inline: 8px;
2604
+ }
2605
+ .sia-tag--large {
2606
+ min-height: 32px;
2607
+ padding-inline: 10px;
2608
+ font-size: 14px;
2609
+ }
2590
2610
  .sia-tag--success {
2591
2611
  color: #389e0d;
2592
2612
  background: #f6ffed;
@@ -3205,7 +3225,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
3205
3225
  }
3206
3226
  .sia-tabs--tech-line .sia-tabs__title {
3207
3227
  position: relative;
3208
- flex: 1 1 auto;
3228
+ flex: 0 0 auto;
3209
3229
  min-width: 0;
3210
3230
  align-items: flex-start;
3211
3231
  padding: 3px 34px 0 0;
@@ -5554,6 +5574,23 @@ fieldset:disabled .sia-input-number__floating-placeholder {
5554
5574
  flex-wrap: wrap;
5555
5575
  gap: 12px 18px;
5556
5576
  }
5577
+ .sia-checkbox-group--vertical {
5578
+ flex-direction: column;
5579
+ align-items: flex-start;
5580
+ flex-wrap: nowrap;
5581
+ }
5582
+ .sia-checkbox-group--grid {
5583
+ display: grid;
5584
+ width: 100%;
5585
+ align-items: start;
5586
+ }
5587
+ .sia-checkbox-group--grid > .sia-checkbox {
5588
+ min-width: 0;
5589
+ }
5590
+ .sia-checkbox-group--grid > .sia-checkbox > .sia-checkbox__label {
5591
+ min-width: 0;
5592
+ overflow-wrap: anywhere;
5593
+ }
5557
5594
  .sia-radio__control {
5558
5595
  display: grid;
5559
5596
  place-items: center;
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, T as TagStatus, az as TagVariant, aD as Toolbar, aE as ToolbarItem, aF as ToolbarProps, aQ as Typography, aR as TypographyLinkProps, aS as TypographyProps, aT as TypographyTitleProps, aU as TypographyType, aV as Upload, aW as UploadChangeInfo, aX as UploadDraggerProps, aY as UploadFile, aZ as UploadFileStatus, b0 as UploadProps, b4 as UploadRequestOptions, b8 as message } from './core-B687rqFa.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-DMDpT7P8.cjs';
2
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-YJbT-MF1.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, T as TagStatus, az as TagVariant, aD as Toolbar, aE as ToolbarItem, aF as ToolbarProps, aQ as Typography, aR as TypographyLinkProps, aS as TypographyProps, aT as TypographyTitleProps, aU as TypographyType, aV as Upload, aW as UploadChangeInfo, aX as UploadDraggerProps, aY as UploadFile, aZ as UploadFileStatus, b0 as UploadProps, b4 as UploadRequestOptions, b8 as message } from './core-BwuvPHYM.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-DziuxwXr.js';
2
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-CCrPqULn.js';
3
3
  import 'react';
4
4
  import './shared-Bx4B28Wh.js';
package/dist/core.js CHANGED
@@ -10,12 +10,12 @@ import {
10
10
  Typography,
11
11
  Upload,
12
12
  message
13
- } from "./chunk-KT7DIBXX.js";
13
+ } from "./chunk-NDJSNM54.js";
14
14
  import "./chunk-YQDHCORW.js";
15
15
  import {
16
16
  Modal,
17
17
  Select
18
- } from "./chunk-DQYNL6VZ.js";
18
+ } from "./chunk-AHBC5UXJ.js";
19
19
  import {
20
20
  Icon,
21
21
  Input,
package/dist/index.cjs CHANGED
@@ -2396,6 +2396,9 @@ var CheckboxRoot = (0, import_react13.forwardRef)(function Checkbox({ value, siz
2396
2396
  });
2397
2397
  function CheckboxGroup({
2398
2398
  size: sizeProp,
2399
+ columns,
2400
+ direction = "horizontal",
2401
+ gap,
2399
2402
  value,
2400
2403
  defaultValue = [],
2401
2404
  options,
@@ -2406,6 +2409,11 @@ function CheckboxGroup({
2406
2409
  onChange
2407
2410
  }) {
2408
2411
  const size = useControlSize(sizeProp);
2412
+ const gridColumns = columns !== void 0 && Number.isInteger(columns) && columns > 0 ? columns : void 0;
2413
+ const layoutStyle = {
2414
+ gridTemplateColumns: gridColumns ? `repeat(${gridColumns}, minmax(0, 1fr))` : void 0,
2415
+ gap: gap === void 0 ? void 0 : typeof gap === "number" ? Math.max(0, gap) : `${Math.max(0, gap[0])}px ${Math.max(0, gap[1])}px`
2416
+ };
2409
2417
  const [values, setValues] = useControllableState({ value, defaultValue, onChange });
2410
2418
  const context = (0, import_react13.useMemo)(() => ({
2411
2419
  values,
@@ -2416,7 +2424,7 @@ function CheckboxGroup({
2416
2424
  setValues(next);
2417
2425
  }
2418
2426
  }), [disabled, name, setValues, values]);
2419
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: `sia-checkbox-group ${className}`.trim(), role: "group", children: [
2427
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: `sia-checkbox-group${gridColumns ? " sia-checkbox-group--grid" : direction === "vertical" ? " sia-checkbox-group--vertical" : ""} ${className}`.trim(), style: layoutStyle, role: "group", children: [
2420
2428
  options?.map((option) => {
2421
2429
  const normalized = typeof option === "object" ? option : { label: String(option), value: option };
2422
2430
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CheckboxRoot, { value: normalized.value, disabled: normalized.disabled, children: normalized.label }, normalized.value);
@@ -10764,6 +10772,7 @@ var message = {
10764
10772
  // src/components/Tag.tsx
10765
10773
  var import_jsx_runtime46 = require("react/jsx-runtime");
10766
10774
  function Tag({
10775
+ size: sizeProp,
10767
10776
  color,
10768
10777
  status = "default",
10769
10778
  compact = false,
@@ -10778,11 +10787,12 @@ function Tag({
10778
10787
  style,
10779
10788
  ...props
10780
10789
  }) {
10790
+ const size = useControlSize(sizeProp ?? (compact ? "small" : void 0));
10781
10791
  const customColor = color?.trim() ? variant === "outlined" ? { borderColor: color, color, backgroundColor: "transparent" } : variant === "filled" ? { backgroundColor: color, color: "#fff", borderColor: "transparent" } : { color, backgroundColor: `color-mix(in srgb, ${color} 10%, transparent)`, borderColor: `color-mix(in srgb, ${color} 35%, transparent)` } : void 0;
10782
10792
  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
10783
10793
  "span",
10784
10794
  {
10785
- className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant}${compact ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
10795
+ className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant} sia-tag--${size}${compact && size === "small" ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
10786
10796
  "aria-disabled": disabled || void 0,
10787
10797
  style: customColor ? { ...customColor, ...style } : style,
10788
10798
  ...withTitleTooltip(props),
@@ -10800,7 +10810,7 @@ function Tag({
10800
10810
  event.stopPropagation();
10801
10811
  onClose?.(event);
10802
10812
  },
10803
- children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Icon, { name: "close", size: 12 })
10813
+ children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Icon, { name: "close", size: size === "large" ? 14 : 12 })
10804
10814
  }
10805
10815
  ) : null
10806
10816
  ]
@@ -12540,7 +12550,7 @@ function createSortPlugin(options = {}) {
12540
12550
  event.stopPropagation();
12541
12551
  cycle(field, context);
12542
12552
  },
12543
- children: order ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Icon, { name: order === "ascend" ? "arrow-up" : "arrow-down", size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
12553
+ children: order ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Icon, { name: order === "ascend" ? "chevron-up" : "chevron-down", size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
12544
12554
  /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Icon, { name: "chevron-up", size: 11 }),
12545
12555
  /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Icon, { name: "chevron-down", size: 11 })
12546
12556
  ] })
@@ -14796,8 +14806,8 @@ var SIA_THEME = {
14796
14806
  spacing: 16,
14797
14807
  /** 默认字号,单位为像素。 */
14798
14808
  fontSize: 16,
14799
- /** 小号文字尺寸,单位为像素。 */
14800
- fontSizeSmall: 14,
14809
+ /** 默认小号文字尺寸为 13 像素,对应 --sia-font-size-small;业务可通过 CSS 变量覆盖。 */
14810
+ fontSizeSmall: 13,
14801
14811
  /** 大号文字尺寸,单位为像素。 */
14802
14812
  fontSizeLarge: 18
14803
14813
  };
package/dist/index.css CHANGED
@@ -148,8 +148,8 @@ fieldset:disabled .sia-input-number__floating-placeholder {
148
148
  font-size: 12px;
149
149
  }
150
150
  :is(.sia-picker, .sia-time-range).sia-picker--medium {
151
- --sia-control-font-size: 14px;
152
- font-size: 14px;
151
+ --sia-control-font-size: 13px;
152
+ font-size: var(--sia-control-font-size);
153
153
  }
154
154
  :is(.sia-picker, .sia-time-range).sia-picker--large {
155
155
  --sia-control-font-size: 16px;
@@ -162,14 +162,14 @@ fieldset:disabled .sia-input-number__floating-placeholder {
162
162
  --sia-control-font-size: 12px;
163
163
  }
164
164
  :is(.sia-select--medium, .sia-tree-select--medium, .sia-cascader--medium) {
165
- --sia-control-font-size: 14px;
165
+ --sia-control-font-size: 13px;
166
166
  }
167
167
  :is(.sia-select--large, .sia-tree-select--large, .sia-cascader--large) {
168
168
  --sia-control-font-size: 16px;
169
169
  }
170
170
  .sia-tree-select .sia-tree-select__trigger,
171
171
  .sia-cascader .sia-cascader__trigger {
172
- font-size: var(--sia-control-font-size, 14px);
172
+ font-size: var(--sia-control-font-size, 13px);
173
173
  }
174
174
  .sia-segmented.sia-segmented--medium button {
175
175
  font-size: 14px;
@@ -188,7 +188,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
188
188
  .sia-radio--medium {
189
189
  --sia-choice-size: 16px;
190
190
  --sia-choice-dot: 8px;
191
- font-size: 14px;
191
+ font-size: 13px;
192
192
  }
193
193
  .sia-checkbox.sia-checkbox--large,
194
194
  .sia-radio.sia-radio--large {
@@ -238,7 +238,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
238
238
  --sia-switch-width: 44px;
239
239
  --sia-switch-height: 22px;
240
240
  --sia-switch-segmented-height: var(--sia-control-height-medium);
241
- font-size: 14px;
241
+ font-size: 13px;
242
242
  }
243
243
  .sia-switch-wrap.sia-switch-wrap--large {
244
244
  --sia-switch-width: 52px;
@@ -263,6 +263,15 @@ fieldset:disabled .sia-input-number__floating-placeholder {
263
263
  .sia-input-select .sia-input-control--small .sia-button {
264
264
  height: 18px;
265
265
  }
266
+ .sia-textarea-control--small {
267
+ --sia-control-font-size: 12px;
268
+ }
269
+ .sia-textarea-control--medium {
270
+ --sia-control-font-size: 14px;
271
+ }
272
+ .sia-textarea-control--large {
273
+ --sia-control-font-size: 16px;
274
+ }
266
275
  .sia-textarea-control--small .sia-textarea {
267
276
  padding: 4px 7px 22px;
268
277
  font-size: 12px;
@@ -389,7 +398,8 @@ fieldset:disabled .sia-input-number__floating-placeholder {
389
398
  --sia-control-height: var(--sia-control-height-medium);
390
399
  --sia-spacing: 16px;
391
400
  --sia-font-size: 16px;
392
- --sia-font-size-small: 14px;
401
+ --sia-font-size-small: 13px;
402
+ --sia-control-font-size: 13px;
393
403
  --sia-font-size-large: 18px;
394
404
  --sia-shadow-popup: 0 4px 12px rgb(0 0 0 / 22%);
395
405
  --sia-scroll-overflow: auto;
@@ -1002,7 +1012,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
1002
1012
  resize: vertical;
1003
1013
  color: inherit;
1004
1014
  font:
1005
- 400 var(--sia-font-size-small)/1.6 system-ui,
1015
+ 400 14px/1.6 system-ui,
1006
1016
  -apple-system,
1007
1017
  "Segoe UI",
1008
1018
  "Microsoft YaHei",
@@ -2393,7 +2403,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
2393
2403
  padding-inline: 16px;
2394
2404
  }
2395
2405
  .sia-message {
2396
- font-size: calc(var(--sia-font-size, 16px) - 1px);
2406
+ font-size: 14px;
2397
2407
  display: flex;
2398
2408
  align-items: center;
2399
2409
  gap: 9px;
@@ -2583,10 +2593,20 @@ fieldset:disabled .sia-input-number__floating-placeholder {
2583
2593
  border: 1px solid var(--sia-color-border);
2584
2594
  border-radius: 5px;
2585
2595
  }
2596
+ .sia-tag--small,
2586
2597
  .sia-tag--compact {
2587
2598
  min-height: 20px;
2588
2599
  padding-inline: 6px;
2589
2600
  }
2601
+ .sia-tag--medium {
2602
+ min-height: 24px;
2603
+ padding-inline: 8px;
2604
+ }
2605
+ .sia-tag--large {
2606
+ min-height: 32px;
2607
+ padding-inline: 10px;
2608
+ font-size: 14px;
2609
+ }
2590
2610
  .sia-tag--success {
2591
2611
  color: #389e0d;
2592
2612
  background: #f6ffed;
@@ -3205,7 +3225,7 @@ fieldset:disabled .sia-input-number__floating-placeholder {
3205
3225
  }
3206
3226
  .sia-tabs--tech-line .sia-tabs__title {
3207
3227
  position: relative;
3208
- flex: 1 1 auto;
3228
+ flex: 0 0 auto;
3209
3229
  min-width: 0;
3210
3230
  align-items: flex-start;
3211
3231
  padding: 3px 34px 0 0;
@@ -5554,6 +5574,23 @@ fieldset:disabled .sia-input-number__floating-placeholder {
5554
5574
  flex-wrap: wrap;
5555
5575
  gap: 12px 18px;
5556
5576
  }
5577
+ .sia-checkbox-group--vertical {
5578
+ flex-direction: column;
5579
+ align-items: flex-start;
5580
+ flex-wrap: nowrap;
5581
+ }
5582
+ .sia-checkbox-group--grid {
5583
+ display: grid;
5584
+ width: 100%;
5585
+ align-items: start;
5586
+ }
5587
+ .sia-checkbox-group--grid > .sia-checkbox {
5588
+ min-width: 0;
5589
+ }
5590
+ .sia-checkbox-group--grid > .sia-checkbox > .sia-checkbox__label {
5591
+ min-width: 0;
5592
+ overflow-wrap: anywhere;
5593
+ }
5557
5594
  .sia-radio__control {
5558
5595
  display: grid;
5559
5596
  place-items: center;
package/dist/index.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { T as TagStatus, B as BadgeProps } from './core-B687rqFa.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 TagVariant, aA as Timeline, aB as TimelineItem, aC as TimelineProps, aD as Toolbar, aE as ToolbarItem, aF as ToolbarProps, aG as Tooltip, aH as TooltipProps, aI as Tour, aJ as TourProps, aK as TourStep, aL as Tree, aM as TreeDropPosition, aN as TreeKey, aO as TreeNode, aP as TreeProps, aQ as Typography, aR as TypographyLinkProps, aS as TypographyProps, aT as TypographyTitleProps, aU as TypographyType, aV as Upload, aW as UploadChangeInfo, aX as UploadDraggerProps, aY as UploadFile, aZ as UploadFileStatus, a_ as UploadHttpRequest, a$ as UploadItemActions, b0 as UploadProps, b1 as UploadRef, b2 as UploadRejectInfo, b3 as UploadRequestHandle, b4 as UploadRequestOptions, b5 as Watermark, b6 as WatermarkFont, b7 as WatermarkProps, b8 as message, b9 as notification } from './core-B687rqFa.cjs';
1
+ import { T as TagStatus, B as BadgeProps } from './core-DMDpT7P8.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-DMDpT7P8.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';
@@ -652,7 +652,7 @@ declare const Drawer: react.ForwardRefExoticComponent<DrawerProps & react.RefAtt
652
652
  type SwitchVariant = "standard" | "segmented";
653
653
  /** 开关的属性配置。 */
654
654
  interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
655
- /** 标准开关高度为 16 / 22 / 28px,分段开关为 22 / 30 / 38px;默认继承 Form */
655
+ /** small / medium / large 标准开关高度为 16 / 22 / 28px,分段开关为 22 / 30 / 38px,文字字号为 12 / 13 / 16px;默认继承 Form,无上下文时为 medium(13px)。 */
656
656
  size?: ControlSize;
657
657
  /** 开关右侧的可见标签 */
658
658
  label?: ReactNode;
@@ -863,7 +863,7 @@ declare const Form: typeof FormRoot & {
863
863
  type CheckboxValue = string | number;
864
864
  /** 复选框的属性配置。 */
865
865
  interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size" | "value" | "onChange"> {
866
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
866
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
867
867
  size?: ControlSize;
868
868
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
869
869
  value?: CheckboxValue;
@@ -888,7 +888,13 @@ interface CheckboxOption {
888
888
  }
889
889
  /** CheckboxGroup的属性配置。 */
890
890
  interface CheckboxGroupProps {
891
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
891
+ /** 等宽网格的列数,按选项顺序从左到右逐行排列并占满容器宽度;仅正整数生效,未设置或无效时使用 direction 排列。设置有效列数后优先于 direction;同样适用于直接传入的 Checkbox 子项。 */
892
+ columns?: number;
893
+ /** 非网格模式的排列方向:horizontal 横向排列并自动换行,vertical 纵向单列排列;有效 columns 优先。默认 horizontal。 */
894
+ direction?: "horizontal" | "vertical";
895
+ /** 选项间距,单位 px;数字表示统一间距,二元组为 [行间距, 列间距],支持 0,负数按 0 处理。默认 [12, 18],适用于横向、纵向和网格布局。 */
896
+ gap?: number | readonly [number, number];
897
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
892
898
  size?: ControlSize;
893
899
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
894
900
  value?: readonly CheckboxValue[];
@@ -913,7 +919,7 @@ interface CheckboxGroupProps {
913
919
  /** 值发生变化时调用;参数为新值及类型声明中列出的关联信息。 */
914
920
  onChange?: (values: readonly CheckboxValue[]) => void;
915
921
  }
916
- declare function CheckboxGroup({ size: sizeProp, value, defaultValue, options, disabled, name, className, children, onChange, }: CheckboxGroupProps): react.JSX.Element;
922
+ declare function CheckboxGroup({ size: sizeProp, columns, direction, gap, value, defaultValue, options, disabled, name, className, children, onChange, }: CheckboxGroupProps): react.JSX.Element;
917
923
  /** 复选框组件。 */
918
924
  declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>> & {
919
925
  /** 组合多个子项并统一管理布局或选择状态。 */
@@ -924,7 +930,7 @@ declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.Re
924
930
  type RadioValue = string | number;
925
931
  /** 单选框的属性配置。 */
926
932
  interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size" | "value" | "onChange"> {
927
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
933
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
928
934
  size?: ControlSize;
929
935
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
930
936
  value: RadioValue;
@@ -944,7 +950,7 @@ interface RadioOption {
944
950
  }
945
951
  /** RadioGroup的属性配置。 */
946
952
  interface RadioGroupProps {
947
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
953
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
948
954
  size?: ControlSize;
949
955
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
950
956
  value?: RadioValue;
@@ -1365,7 +1371,7 @@ declare function buildFlatTree<T extends Record<string, any>>(items: readonly T[
1365
1371
 
1366
1372
  /** 多行输入的属性配置。 */
1367
1373
  interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
1368
- /** 调整字号和内边距;保留 rows 和内容决定的多行高度。默认继承 Form */
1374
+ /** 调整字号和内边距;small / medium / large 字号为 12 / 14 / 16 像素,保留 rows 和内容决定的多行高度。默认继承 Form,无上下文时为 medium(14px)。 */
1369
1375
  size?: ControlSize;
1370
1376
  /** 字段标签 */
1371
1377
  label?: ReactNode;
@@ -2451,7 +2457,7 @@ interface TableSortApi {
2451
2457
  /** 清空当前值或内容。 */
2452
2458
  clear: () => void;
2453
2459
  }
2454
- /** 创建表格列排序插件。将返回值加入 Table 的 plugins 后生效;点击列头按钮依次切换升序、降序和未排序,当前方向以高亮单箭头显示,悬停提示当前状态及下一步操作。 */
2460
+ /** 创建表格列排序插件。将返回值加入 Table 的 plugins 后生效;点击列头按钮依次切换升序、降序和未排序,升序使用高亮 chevron-up,降序使用高亮 chevron-down,悬停提示当前状态及下一步操作。 */
2455
2461
  declare function createSortPlugin<T extends Record<string, unknown>>(options?: TableSortPluginOptions): TablePlugin<T, SortState, TableSortApi>;
2456
2462
  /** 列标识到筛选条件的映射。 */
2457
2463
  type TableFilterValues = Readonly<Record<string, string>>;
@@ -2835,8 +2841,8 @@ declare const SIA_THEME: {
2835
2841
  readonly spacing: 16;
2836
2842
  /** 默认字号,单位为像素。 */
2837
2843
  readonly fontSize: 16;
2838
- /** 小号文字尺寸,单位为像素。 */
2839
- readonly fontSizeSmall: 14;
2844
+ /** 默认小号文字尺寸为 13 像素,对应 --sia-font-size-small;业务可通过 CSS 变量覆盖。 */
2845
+ readonly fontSizeSmall: 13;
2840
2846
  /** 大号文字尺寸,单位为像素。 */
2841
2847
  readonly fontSizeLarge: 18;
2842
2848
  };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { T as TagStatus, B as BadgeProps } from './core-BwuvPHYM.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 TagVariant, aA as Timeline, aB as TimelineItem, aC as TimelineProps, aD as Toolbar, aE as ToolbarItem, aF as ToolbarProps, aG as Tooltip, aH as TooltipProps, aI as Tour, aJ as TourProps, aK as TourStep, aL as Tree, aM as TreeDropPosition, aN as TreeKey, aO as TreeNode, aP as TreeProps, aQ as Typography, aR as TypographyLinkProps, aS as TypographyProps, aT as TypographyTitleProps, aU as TypographyType, aV as Upload, aW as UploadChangeInfo, aX as UploadDraggerProps, aY as UploadFile, aZ as UploadFileStatus, a_ as UploadHttpRequest, a$ as UploadItemActions, b0 as UploadProps, b1 as UploadRef, b2 as UploadRejectInfo, b3 as UploadRequestHandle, b4 as UploadRequestOptions, b5 as Watermark, b6 as WatermarkFont, b7 as WatermarkProps, b8 as message, b9 as notification } from './core-BwuvPHYM.js';
1
+ import { T as TagStatus, B as BadgeProps } from './core-DziuxwXr.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-DziuxwXr.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';
@@ -652,7 +652,7 @@ declare const Drawer: react.ForwardRefExoticComponent<DrawerProps & react.RefAtt
652
652
  type SwitchVariant = "standard" | "segmented";
653
653
  /** 开关的属性配置。 */
654
654
  interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
655
- /** 标准开关高度为 16 / 22 / 28px,分段开关为 22 / 30 / 38px;默认继承 Form */
655
+ /** small / medium / large 标准开关高度为 16 / 22 / 28px,分段开关为 22 / 30 / 38px,文字字号为 12 / 13 / 16px;默认继承 Form,无上下文时为 medium(13px)。 */
656
656
  size?: ControlSize;
657
657
  /** 开关右侧的可见标签 */
658
658
  label?: ReactNode;
@@ -863,7 +863,7 @@ declare const Form: typeof FormRoot & {
863
863
  type CheckboxValue = string | number;
864
864
  /** 复选框的属性配置。 */
865
865
  interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size" | "value" | "onChange"> {
866
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
866
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
867
867
  size?: ControlSize;
868
868
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
869
869
  value?: CheckboxValue;
@@ -888,7 +888,13 @@ interface CheckboxOption {
888
888
  }
889
889
  /** CheckboxGroup的属性配置。 */
890
890
  interface CheckboxGroupProps {
891
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
891
+ /** 等宽网格的列数,按选项顺序从左到右逐行排列并占满容器宽度;仅正整数生效,未设置或无效时使用 direction 排列。设置有效列数后优先于 direction;同样适用于直接传入的 Checkbox 子项。 */
892
+ columns?: number;
893
+ /** 非网格模式的排列方向:horizontal 横向排列并自动换行,vertical 纵向单列排列;有效 columns 优先。默认 horizontal。 */
894
+ direction?: "horizontal" | "vertical";
895
+ /** 选项间距,单位 px;数字表示统一间距,二元组为 [行间距, 列间距],支持 0,负数按 0 处理。默认 [12, 18],适用于横向、纵向和网格布局。 */
896
+ gap?: number | readonly [number, number];
897
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
892
898
  size?: ControlSize;
893
899
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
894
900
  value?: readonly CheckboxValue[];
@@ -913,7 +919,7 @@ interface CheckboxGroupProps {
913
919
  /** 值发生变化时调用;参数为新值及类型声明中列出的关联信息。 */
914
920
  onChange?: (values: readonly CheckboxValue[]) => void;
915
921
  }
916
- declare function CheckboxGroup({ size: sizeProp, value, defaultValue, options, disabled, name, className, children, onChange, }: CheckboxGroupProps): react.JSX.Element;
922
+ declare function CheckboxGroup({ size: sizeProp, columns, direction, gap, value, defaultValue, options, disabled, name, className, children, onChange, }: CheckboxGroupProps): react.JSX.Element;
917
923
  /** 复选框组件。 */
918
924
  declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>> & {
919
925
  /** 组合多个子项并统一管理布局或选择状态。 */
@@ -924,7 +930,7 @@ declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.Re
924
930
  type RadioValue = string | number;
925
931
  /** 单选框的属性配置。 */
926
932
  interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size" | "value" | "onChange"> {
927
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
933
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
928
934
  size?: ControlSize;
929
935
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
930
936
  value: RadioValue;
@@ -944,7 +950,7 @@ interface RadioOption {
944
950
  }
945
951
  /** RadioGroup的属性配置。 */
946
952
  interface RadioGroupProps {
947
- /** 组件尺寸;用于调整控件高度、字号和间距。 */
953
+ /** small / medium / large 文字字号为 12 / 13 / 16 像素,同时调整图形和间距;默认继承所在组或 Form,无上下文时为 medium(13px),组件显式 size 优先。 */
948
954
  size?: ControlSize;
949
955
  /** 当前值;作为受控属性时,需要在变更回调中同步更新。 */
950
956
  value?: RadioValue;
@@ -1365,7 +1371,7 @@ declare function buildFlatTree<T extends Record<string, any>>(items: readonly T[
1365
1371
 
1366
1372
  /** 多行输入的属性配置。 */
1367
1373
  interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
1368
- /** 调整字号和内边距;保留 rows 和内容决定的多行高度。默认继承 Form */
1374
+ /** 调整字号和内边距;small / medium / large 字号为 12 / 14 / 16 像素,保留 rows 和内容决定的多行高度。默认继承 Form,无上下文时为 medium(14px)。 */
1369
1375
  size?: ControlSize;
1370
1376
  /** 字段标签 */
1371
1377
  label?: ReactNode;
@@ -2451,7 +2457,7 @@ interface TableSortApi {
2451
2457
  /** 清空当前值或内容。 */
2452
2458
  clear: () => void;
2453
2459
  }
2454
- /** 创建表格列排序插件。将返回值加入 Table 的 plugins 后生效;点击列头按钮依次切换升序、降序和未排序,当前方向以高亮单箭头显示,悬停提示当前状态及下一步操作。 */
2460
+ /** 创建表格列排序插件。将返回值加入 Table 的 plugins 后生效;点击列头按钮依次切换升序、降序和未排序,升序使用高亮 chevron-up,降序使用高亮 chevron-down,悬停提示当前状态及下一步操作。 */
2455
2461
  declare function createSortPlugin<T extends Record<string, unknown>>(options?: TableSortPluginOptions): TablePlugin<T, SortState, TableSortApi>;
2456
2462
  /** 列标识到筛选条件的映射。 */
2457
2463
  type TableFilterValues = Readonly<Record<string, string>>;
@@ -2835,8 +2841,8 @@ declare const SIA_THEME: {
2835
2841
  readonly spacing: 16;
2836
2842
  /** 默认字号,单位为像素。 */
2837
2843
  readonly fontSize: 16;
2838
- /** 小号文字尺寸,单位为像素。 */
2839
- readonly fontSizeSmall: 14;
2844
+ /** 默认小号文字尺寸为 13 像素,对应 --sia-font-size-small;业务可通过 CSS 变量覆盖。 */
2845
+ readonly fontSizeSmall: 13;
2840
2846
  /** 大号文字尺寸,单位为像素。 */
2841
2847
  readonly fontSizeLarge: 18;
2842
2848
  };
package/dist/index.js CHANGED
@@ -80,7 +80,7 @@ import {
80
80
  Watermark,
81
81
  message,
82
82
  notification
83
- } from "./chunk-KT7DIBXX.js";
83
+ } from "./chunk-NDJSNM54.js";
84
84
  import {
85
85
  TextArea
86
86
  } from "./chunk-YQDHCORW.js";
@@ -95,7 +95,7 @@ import {
95
95
  DatePicker,
96
96
  SelectDateRange,
97
97
  TimePanel
98
- } from "./chunk-T2EKKSCH.js";
98
+ } from "./chunk-33C5ZEQ6.js";
99
99
  import {
100
100
  Checkbox,
101
101
  FloatingScrollbarProvider,
@@ -110,7 +110,7 @@ import {
110
110
  Tree,
111
111
  useOverlayLifecycle,
112
112
  useScrollbarProximity
113
- } from "./chunk-DQYNL6VZ.js";
113
+ } from "./chunk-AHBC5UXJ.js";
114
114
  import {
115
115
  Dropdown,
116
116
  FILLED_ICON_NAMES,
@@ -5729,7 +5729,7 @@ function createSortPlugin(options = {}) {
5729
5729
  event.stopPropagation();
5730
5730
  cycle(field, context);
5731
5731
  },
5732
- children: order ? /* @__PURE__ */ jsx21(Icon, { name: order === "ascend" ? "arrow-up" : "arrow-down", size: 18 }) : /* @__PURE__ */ jsxs20(Fragment7, { children: [
5732
+ children: order ? /* @__PURE__ */ jsx21(Icon, { name: order === "ascend" ? "chevron-up" : "chevron-down", size: 18 }) : /* @__PURE__ */ jsxs20(Fragment7, { children: [
5733
5733
  /* @__PURE__ */ jsx21(Icon, { name: "chevron-up", size: 11 }),
5734
5734
  /* @__PURE__ */ jsx21(Icon, { name: "chevron-down", size: 11 })
5735
5735
  ] })
@@ -7985,8 +7985,8 @@ var SIA_THEME = {
7985
7985
  spacing: 16,
7986
7986
  /** 默认字号,单位为像素。 */
7987
7987
  fontSize: 16,
7988
- /** 小号文字尺寸,单位为像素。 */
7989
- fontSizeSmall: 14,
7988
+ /** 默认小号文字尺寸为 13 像素,对应 --sia-font-size-small;业务可通过 CSS 变量覆盖。 */
7989
+ fontSizeSmall: 13,
7990
7990
  /** 大号文字尺寸,单位为像素。 */
7991
7991
  fontSizeLarge: 18
7992
7992
  };
@@ -2815,6 +2815,9 @@ var CheckboxRoot = (0, import_react12.forwardRef)(function Checkbox({ value, siz
2815
2815
  });
2816
2816
  function CheckboxGroup({
2817
2817
  size: sizeProp,
2818
+ columns,
2819
+ direction = "horizontal",
2820
+ gap,
2818
2821
  value,
2819
2822
  defaultValue = [],
2820
2823
  options,
@@ -2825,6 +2828,11 @@ function CheckboxGroup({
2825
2828
  onChange
2826
2829
  }) {
2827
2830
  const size = useControlSize(sizeProp);
2831
+ const gridColumns = columns !== void 0 && Number.isInteger(columns) && columns > 0 ? columns : void 0;
2832
+ const layoutStyle = {
2833
+ gridTemplateColumns: gridColumns ? `repeat(${gridColumns}, minmax(0, 1fr))` : void 0,
2834
+ gap: gap === void 0 ? void 0 : typeof gap === "number" ? Math.max(0, gap) : `${Math.max(0, gap[0])}px ${Math.max(0, gap[1])}px`
2835
+ };
2828
2836
  const [values, setValues] = useControllableState({ value, defaultValue, onChange });
2829
2837
  const context = (0, import_react12.useMemo)(() => ({
2830
2838
  values,
@@ -2835,7 +2843,7 @@ function CheckboxGroup({
2835
2843
  setValues(next);
2836
2844
  }
2837
2845
  }), [disabled, name, setValues, values]);
2838
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: `sia-checkbox-group ${className}`.trim(), role: "group", children: [
2846
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ControlSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: `sia-checkbox-group${gridColumns ? " sia-checkbox-group--grid" : direction === "vertical" ? " sia-checkbox-group--vertical" : ""} ${className}`.trim(), style: layoutStyle, role: "group", children: [
2839
2847
  options?.map((option) => {
2840
2848
  const normalized = typeof option === "object" ? option : { label: String(option), value: option };
2841
2849
  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CheckboxRoot, { value: normalized.value, disabled: normalized.disabled, children: normalized.label }, normalized.value);
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  SelectDateRange
3
- } from "./chunk-T2EKKSCH.js";
4
- import "./chunk-DQYNL6VZ.js";
3
+ } from "./chunk-33C5ZEQ6.js";
4
+ import "./chunk-AHBC5UXJ.js";
5
5
  import "./chunk-YF2I6SDB.js";
6
6
  import "./chunk-IYNS423D.js";
7
7
  import "./chunk-RAO3JHDL.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sia.soul/sia-react-ui",
3
- "version": "0.1.30",
3
+ "version": "0.1.32",
4
4
  "description": "Sia Design components and tokens for React",
5
5
  "publishConfig": {
6
6
  "access": "public",