@sia.soul/sia-react-ui 0.1.47 → 0.1.48

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.
@@ -2,7 +2,7 @@ import {
2
2
  Dropdown,
3
3
  Icon,
4
4
  Input
5
- } from "./chunk-XCVAVCIO.js";
5
+ } from "./chunk-IUZ2RSI5.js";
6
6
  import {
7
7
  Button
8
8
  } from "./chunk-IKAMZNCK.js";
@@ -5,11 +5,11 @@ import {
5
5
  Popover,
6
6
  Tooltip,
7
7
  useOverlayLifecycle
8
- } from "./chunk-NYJSSPIX.js";
8
+ } from "./chunk-PJT676UK.js";
9
9
  import {
10
10
  Dropdown,
11
11
  Icon
12
- } from "./chunk-XCVAVCIO.js";
12
+ } from "./chunk-IUZ2RSI5.js";
13
13
  import {
14
14
  Button
15
15
  } from "./chunk-IKAMZNCK.js";
@@ -830,7 +830,7 @@ var Icon = forwardRef(function Icon2({ name, size = "1em", strokeWidth = 1.8, ro
830
830
  });
831
831
 
832
832
  // src/components/Navigation.tsx
833
- import { useEffect, useId, useMemo, useRef, useState } from "react";
833
+ import { useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
834
834
  import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
835
835
  import { createElement } from "react";
836
836
  function MenuPopup({
@@ -844,6 +844,16 @@ function MenuPopup({
844
844
  onMouseLeave
845
845
  }) {
846
846
  const [mounted, setMounted] = useState(open);
847
+ const [fontSize, setFontSize] = useState();
848
+ useLayoutEffect(() => {
849
+ const anchor = anchorRef.current;
850
+ if (!mounted || !anchor) return;
851
+ const syncFontSize = () => setFontSize(getComputedStyle(anchor).fontSize);
852
+ syncFontSize();
853
+ const observer = new ResizeObserver(syncFontSize);
854
+ observer.observe(anchor);
855
+ return () => observer.disconnect();
856
+ });
847
857
  useEffect(() => {
848
858
  if (open) {
849
859
  setMounted(true);
@@ -860,6 +870,7 @@ function MenuPopup({
860
870
  placement,
861
871
  offset: 4,
862
872
  className: `sia-menu__popup sia-menu--${theme}${open ? " is-open" : " is-closing"}`,
873
+ style: { fontSize },
863
874
  "data-sia-menu-owner": menuId,
864
875
  onMouseEnter,
865
876
  onMouseLeave,
@@ -1054,7 +1065,7 @@ function Segmented({ options, value, defaultValue, size: sizeProp, block = false
1054
1065
  }
1055
1066
 
1056
1067
  // src/components/Dropdown.tsx
1057
- import { cloneElement, isValidElement, useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
1068
+ import { cloneElement, isValidElement, useEffect as useEffect2, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState as useState2 } from "react";
1058
1069
  import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
1059
1070
  var placementMap = {
1060
1071
  bottomLeft: "bottom-start",
@@ -1098,6 +1109,17 @@ function DropdownRoot({
1098
1109
  const visible = open ?? internalOpen;
1099
1110
  const triggerSet = new Set(trigger);
1100
1111
  const pointAtCenter = typeof arrow === "object" && arrow.pointAtCenter;
1112
+ const [triggerFontSize, setTriggerFontSize] = useState2();
1113
+ useLayoutEffect2(() => {
1114
+ if (!visible || !rootRef.current) return;
1115
+ const root = rootRef.current;
1116
+ const target = root.querySelector("button, [role='button'], a") ?? (root.firstElementChild !== contextAnchorRef.current ? root.firstElementChild : null) ?? root;
1117
+ const syncFontSize = () => setTriggerFontSize(getComputedStyle(target).fontSize);
1118
+ syncFontSize();
1119
+ const observer = new ResizeObserver(syncFontSize);
1120
+ observer.observe(target);
1121
+ return () => observer.disconnect();
1122
+ });
1101
1123
  function clearTimer(ref) {
1102
1124
  if (ref.current === void 0) return;
1103
1125
  window.clearTimeout(ref.current);
@@ -1269,7 +1291,7 @@ function DropdownRoot({
1269
1291
  placement: contextPoint ? "bottom-start" : placementMap[placement],
1270
1292
  offset: contextPoint ? 2 : 6,
1271
1293
  className: `sia-dropdown__popup${visible ? " is-open" : " is-closing"}${arrow ? " sia-dropdown__popup--arrow" : ""}${pointAtCenter ? " sia-dropdown__popup--arrow-center" : ""} ${popupClassName}`.trim(),
1272
- style: popupStyle,
1294
+ style: { fontSize: triggerFontSize, ...popupStyle },
1273
1295
  onMouseEnter: () => {
1274
1296
  clearTimer(closeTimerRef);
1275
1297
  if (!disabled && triggerSet.has("hover")) clearTimer(openTimerRef);
@@ -2,7 +2,7 @@ import {
2
2
  Dropdown,
3
3
  Icon,
4
4
  Input
5
- } from "./chunk-XCVAVCIO.js";
5
+ } from "./chunk-IUZ2RSI5.js";
6
6
  import {
7
7
  Button
8
8
  } from "./chunk-IKAMZNCK.js";
@@ -1,10 +1,10 @@
1
1
  import {
2
2
  FloatingScrollbarProvider,
3
3
  Select
4
- } from "./chunk-NYJSSPIX.js";
4
+ } from "./chunk-PJT676UK.js";
5
5
  import {
6
6
  Icon
7
- } from "./chunk-XCVAVCIO.js";
7
+ } from "./chunk-IUZ2RSI5.js";
8
8
  import {
9
9
  PopupPortal,
10
10
  useControlSize,
@@ -787,7 +787,7 @@ interface DropdownMenuProps extends Pick<MenuProps, "multiple" | "selectable" |
787
787
  interface DropdownProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children" | "onOpenChange"> {
788
788
  /** 菜单项、选中状态与点击回调 */
789
789
  menu: DropdownMenuProps;
790
- /** 子内容;组件嵌套内容或当前节点的子项。 */
790
+ /** 触发内容;菜单默认跟随触发按钮的实际字号,无按钮时使用首个触发元素或外层容器的字号。 */
791
791
  children: ReactNode;
792
792
  /**
793
793
  * 触发显示的交互方式。
@@ -841,7 +841,7 @@ interface DropdownProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"
841
841
  * @defaultValue ""
842
842
  */
843
843
  popupClassName?: string;
844
- /** 弹出面板的内联样式。 */
844
+ /** 弹出面板的内联样式;fontSize 可覆盖默认跟随触发按钮的菜单字号。 */
845
845
  popupStyle?: CSSProperties;
846
846
  /** 自定义菜单浮层内容 */
847
847
  popupRender?: (menu: ReactNode) => ReactNode;
@@ -787,7 +787,7 @@ interface DropdownMenuProps extends Pick<MenuProps, "multiple" | "selectable" |
787
787
  interface DropdownProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children" | "onOpenChange"> {
788
788
  /** 菜单项、选中状态与点击回调 */
789
789
  menu: DropdownMenuProps;
790
- /** 子内容;组件嵌套内容或当前节点的子项。 */
790
+ /** 触发内容;菜单默认跟随触发按钮的实际字号,无按钮时使用首个触发元素或外层容器的字号。 */
791
791
  children: ReactNode;
792
792
  /**
793
793
  * 触发显示的交互方式。
@@ -841,7 +841,7 @@ interface DropdownProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"
841
841
  * @defaultValue ""
842
842
  */
843
843
  popupClassName?: string;
844
- /** 弹出面板的内联样式。 */
844
+ /** 弹出面板的内联样式;fontSize 可覆盖默认跟随触发按钮的菜单字号。 */
845
845
  popupStyle?: CSSProperties;
846
846
  /** 自定义菜单浮层内容 */
847
847
  popupRender?: (menu: ReactNode) => ReactNode;
package/dist/core.cjs CHANGED
@@ -1215,6 +1215,16 @@ function MenuPopup({
1215
1215
  onMouseLeave
1216
1216
  }) {
1217
1217
  const [mounted, setMounted] = (0, import_react5.useState)(open);
1218
+ const [fontSize, setFontSize] = (0, import_react5.useState)();
1219
+ (0, import_react5.useLayoutEffect)(() => {
1220
+ const anchor = anchorRef.current;
1221
+ if (!mounted || !anchor) return;
1222
+ const syncFontSize = () => setFontSize(getComputedStyle(anchor).fontSize);
1223
+ syncFontSize();
1224
+ const observer = new ResizeObserver(syncFontSize);
1225
+ observer.observe(anchor);
1226
+ return () => observer.disconnect();
1227
+ });
1218
1228
  (0, import_react5.useEffect)(() => {
1219
1229
  if (open) {
1220
1230
  setMounted(true);
@@ -1231,6 +1241,7 @@ function MenuPopup({
1231
1241
  placement,
1232
1242
  offset: 4,
1233
1243
  className: `sia-menu__popup sia-menu--${theme}${open ? " is-open" : " is-closing"}`,
1244
+ style: { fontSize },
1234
1245
  "data-sia-menu-owner": menuId,
1235
1246
  onMouseEnter,
1236
1247
  onMouseLeave,
@@ -1447,6 +1458,17 @@ function DropdownRoot({
1447
1458
  const visible = open ?? internalOpen;
1448
1459
  const triggerSet = new Set(trigger);
1449
1460
  const pointAtCenter = typeof arrow === "object" && arrow.pointAtCenter;
1461
+ const [triggerFontSize, setTriggerFontSize] = (0, import_react7.useState)();
1462
+ (0, import_react7.useLayoutEffect)(() => {
1463
+ if (!visible || !rootRef.current) return;
1464
+ const root = rootRef.current;
1465
+ const target = root.querySelector("button, [role='button'], a") ?? (root.firstElementChild !== contextAnchorRef.current ? root.firstElementChild : null) ?? root;
1466
+ const syncFontSize = () => setTriggerFontSize(getComputedStyle(target).fontSize);
1467
+ syncFontSize();
1468
+ const observer = new ResizeObserver(syncFontSize);
1469
+ observer.observe(target);
1470
+ return () => observer.disconnect();
1471
+ });
1450
1472
  function clearTimer(ref) {
1451
1473
  if (ref.current === void 0) return;
1452
1474
  window.clearTimeout(ref.current);
@@ -1618,7 +1640,7 @@ function DropdownRoot({
1618
1640
  placement: contextPoint ? "bottom-start" : placementMap[placement],
1619
1641
  offset: contextPoint ? 2 : 6,
1620
1642
  className: `sia-dropdown__popup${visible ? " is-open" : " is-closing"}${arrow ? " sia-dropdown__popup--arrow" : ""}${pointAtCenter ? " sia-dropdown__popup--arrow-center" : ""} ${popupClassName}`.trim(),
1621
- style: popupStyle,
1643
+ style: { fontSize: triggerFontSize, ...popupStyle },
1622
1644
  onMouseEnter: () => {
1623
1645
  clearTimer(closeTimerRef);
1624
1646
  if (!disabled && triggerSet.has("hover")) clearTimer(openTimerRef);
package/dist/core.css CHANGED
@@ -7934,6 +7934,10 @@ fieldset:disabled .sia-input-number__floating-placeholder {
7934
7934
  background: transparent;
7935
7935
  border: 0;
7936
7936
  }
7937
+ .sia-dropdown__menu .sia-menu__item,
7938
+ .sia-menu__popup .sia-menu__item {
7939
+ font-size: inherit;
7940
+ }
7937
7941
  .sia-dropdown__menu > .sia-menu__entry:first-child {
7938
7942
  margin-top: 0;
7939
7943
  }
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-CADzSGab.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-D2IjiQhj.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, 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-wsymjzoC.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-Bb0160em.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,17 +10,17 @@ import {
10
10
  Typography,
11
11
  Upload,
12
12
  message
13
- } from "./chunk-KXPNW4E6.js";
13
+ } from "./chunk-FJ3FP4YV.js";
14
14
  import "./chunk-SMCYEPBL.js";
15
15
  import {
16
16
  Modal,
17
17
  Select
18
- } from "./chunk-NYJSSPIX.js";
18
+ } from "./chunk-PJT676UK.js";
19
19
  import {
20
20
  Icon,
21
21
  Input,
22
22
  Segmented
23
- } from "./chunk-XCVAVCIO.js";
23
+ } from "./chunk-IUZ2RSI5.js";
24
24
  import {
25
25
  Button
26
26
  } from "./chunk-IKAMZNCK.js";
package/dist/index.cjs CHANGED
@@ -1363,6 +1363,16 @@ function MenuPopup({
1363
1363
  onMouseLeave
1364
1364
  }) {
1365
1365
  const [mounted, setMounted] = (0, import_react5.useState)(open);
1366
+ const [fontSize, setFontSize] = (0, import_react5.useState)();
1367
+ (0, import_react5.useLayoutEffect)(() => {
1368
+ const anchor = anchorRef.current;
1369
+ if (!mounted || !anchor) return;
1370
+ const syncFontSize = () => setFontSize(getComputedStyle(anchor).fontSize);
1371
+ syncFontSize();
1372
+ const observer = new ResizeObserver(syncFontSize);
1373
+ observer.observe(anchor);
1374
+ return () => observer.disconnect();
1375
+ });
1366
1376
  (0, import_react5.useEffect)(() => {
1367
1377
  if (open) {
1368
1378
  setMounted(true);
@@ -1379,6 +1389,7 @@ function MenuPopup({
1379
1389
  placement,
1380
1390
  offset: 4,
1381
1391
  className: `sia-menu__popup sia-menu--${theme}${open ? " is-open" : " is-closing"}`,
1392
+ style: { fontSize },
1382
1393
  "data-sia-menu-owner": menuId,
1383
1394
  onMouseEnter,
1384
1395
  onMouseLeave,
@@ -1616,6 +1627,17 @@ function DropdownRoot({
1616
1627
  const visible = open ?? internalOpen;
1617
1628
  const triggerSet = new Set(trigger);
1618
1629
  const pointAtCenter = typeof arrow === "object" && arrow.pointAtCenter;
1630
+ const [triggerFontSize, setTriggerFontSize] = (0, import_react7.useState)();
1631
+ (0, import_react7.useLayoutEffect)(() => {
1632
+ if (!visible || !rootRef.current) return;
1633
+ const root = rootRef.current;
1634
+ const target = root.querySelector("button, [role='button'], a") ?? (root.firstElementChild !== contextAnchorRef.current ? root.firstElementChild : null) ?? root;
1635
+ const syncFontSize = () => setTriggerFontSize(getComputedStyle(target).fontSize);
1636
+ syncFontSize();
1637
+ const observer = new ResizeObserver(syncFontSize);
1638
+ observer.observe(target);
1639
+ return () => observer.disconnect();
1640
+ });
1619
1641
  function clearTimer(ref) {
1620
1642
  if (ref.current === void 0) return;
1621
1643
  window.clearTimeout(ref.current);
@@ -1787,7 +1809,7 @@ function DropdownRoot({
1787
1809
  placement: contextPoint ? "bottom-start" : placementMap[placement],
1788
1810
  offset: contextPoint ? 2 : 6,
1789
1811
  className: `sia-dropdown__popup${visible ? " is-open" : " is-closing"}${arrow ? " sia-dropdown__popup--arrow" : ""}${pointAtCenter ? " sia-dropdown__popup--arrow-center" : ""} ${popupClassName}`.trim(),
1790
- style: popupStyle,
1812
+ style: { fontSize: triggerFontSize, ...popupStyle },
1791
1813
  onMouseEnter: () => {
1792
1814
  clearTimer(closeTimerRef);
1793
1815
  if (!disabled && triggerSet.has("hover")) clearTimer(openTimerRef);
@@ -12095,7 +12117,11 @@ function TableCanvasLayer({ viewport, rows, columns, widths, rowHeight, headerHe
12095
12117
  const schedule = () => {
12096
12118
  if (!frame) frame = requestAnimationFrame(draw);
12097
12119
  };
12098
- scroller.addEventListener("scroll", schedule, { passive: true });
12120
+ const onScroll = () => {
12121
+ cancelAnimationFrame(frame);
12122
+ draw();
12123
+ };
12124
+ scroller.addEventListener("scroll", onScroll, { passive: true, capture: true });
12099
12125
  const resize = new ResizeObserver(schedule);
12100
12126
  resize.observe(scroller);
12101
12127
  const content = new MutationObserver(schedule);
@@ -12109,7 +12135,7 @@ function TableCanvasLayer({ viewport, rows, columns, widths, rowHeight, headerHe
12109
12135
  resize.disconnect();
12110
12136
  content.disconnect();
12111
12137
  theme.disconnect();
12112
- scroller.removeEventListener("scroll", schedule);
12138
+ scroller.removeEventListener("scroll", onScroll, true);
12113
12139
  window.removeEventListener("resize", schedule);
12114
12140
  };
12115
12141
  }, [viewport, rows, columns, widths, rowHeight, headerHeight]);
package/dist/index.css CHANGED
@@ -7934,6 +7934,10 @@ fieldset:disabled .sia-input-number__floating-placeholder {
7934
7934
  background: transparent;
7935
7935
  border: 0;
7936
7936
  }
7937
+ .sia-dropdown__menu .sia-menu__item,
7938
+ .sia-menu__popup .sia-menu__item {
7939
+ font-size: inherit;
7940
+ }
7937
7941
  .sia-dropdown__menu > .sia-menu__entry:first-child {
7938
7942
  margin-top: 0;
7939
7943
  }
package/dist/index.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { T as TagStatus, B as BadgeProps } from './core-CADzSGab.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-CADzSGab.cjs';
1
+ import { T as TagStatus, B as BadgeProps } from './core-D2IjiQhj.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-D2IjiQhj.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';
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { T as TagStatus, B as BadgeProps } from './core-wsymjzoC.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-wsymjzoC.js';
1
+ import { T as TagStatus, B as BadgeProps } from './core-Bb0160em.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-Bb0160em.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';
package/dist/index.js CHANGED
@@ -80,7 +80,7 @@ import {
80
80
  Watermark,
81
81
  message,
82
82
  notification
83
- } from "./chunk-KXPNW4E6.js";
83
+ } from "./chunk-FJ3FP4YV.js";
84
84
  import {
85
85
  TextArea
86
86
  } from "./chunk-SMCYEPBL.js";
@@ -90,12 +90,12 @@ import {
90
90
  import {
91
91
  RichTextContent,
92
92
  RichTextEditor
93
- } from "./chunk-ZDC7PMZN.js";
93
+ } from "./chunk-DTZUBD2O.js";
94
94
  import {
95
95
  DatePicker,
96
96
  SelectDateRange,
97
97
  TimePanel
98
- } from "./chunk-E4RMSZOC.js";
98
+ } from "./chunk-ZX2YNHQJ.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-NYJSSPIX.js";
113
+ } from "./chunk-PJT676UK.js";
114
114
  import {
115
115
  Dropdown,
116
116
  FILLED_ICON_NAMES,
@@ -120,7 +120,7 @@ import {
120
120
  Menu,
121
121
  Segmented,
122
122
  Steps
123
- } from "./chunk-XCVAVCIO.js";
123
+ } from "./chunk-IUZ2RSI5.js";
124
124
  import {
125
125
  Button
126
126
  } from "./chunk-IKAMZNCK.js";
@@ -4867,7 +4867,11 @@ function TableCanvasLayer({ viewport, rows, columns, widths, rowHeight, headerHe
4867
4867
  const schedule = () => {
4868
4868
  if (!frame) frame = requestAnimationFrame(draw);
4869
4869
  };
4870
- scroller.addEventListener("scroll", schedule, { passive: true });
4870
+ const onScroll = () => {
4871
+ cancelAnimationFrame(frame);
4872
+ draw();
4873
+ };
4874
+ scroller.addEventListener("scroll", onScroll, { passive: true, capture: true });
4871
4875
  const resize = new ResizeObserver(schedule);
4872
4876
  resize.observe(scroller);
4873
4877
  const content = new MutationObserver(schedule);
@@ -4881,7 +4885,7 @@ function TableCanvasLayer({ viewport, rows, columns, widths, rowHeight, headerHe
4881
4885
  resize.disconnect();
4882
4886
  content.disconnect();
4883
4887
  theme.disconnect();
4884
- scroller.removeEventListener("scroll", schedule);
4888
+ scroller.removeEventListener("scroll", onScroll, true);
4885
4889
  window.removeEventListener("resize", schedule);
4886
4890
  };
4887
4891
  }, [viewport, rows, columns, widths, rowHeight, headerHeight]);
@@ -1233,6 +1233,16 @@ function MenuPopup({
1233
1233
  onMouseLeave
1234
1234
  }) {
1235
1235
  const [mounted, setMounted] = (0, import_react5.useState)(open);
1236
+ const [fontSize, setFontSize] = (0, import_react5.useState)();
1237
+ (0, import_react5.useLayoutEffect)(() => {
1238
+ const anchor = anchorRef.current;
1239
+ if (!mounted || !anchor) return;
1240
+ const syncFontSize = () => setFontSize(getComputedStyle(anchor).fontSize);
1241
+ syncFontSize();
1242
+ const observer = new ResizeObserver(syncFontSize);
1243
+ observer.observe(anchor);
1244
+ return () => observer.disconnect();
1245
+ });
1236
1246
  (0, import_react5.useEffect)(() => {
1237
1247
  if (open) {
1238
1248
  setMounted(true);
@@ -1249,6 +1259,7 @@ function MenuPopup({
1249
1259
  placement,
1250
1260
  offset: 4,
1251
1261
  className: `sia-menu__popup sia-menu--${theme}${open ? " is-open" : " is-closing"}`,
1262
+ style: { fontSize },
1252
1263
  "data-sia-menu-owner": menuId,
1253
1264
  onMouseEnter,
1254
1265
  onMouseLeave,
@@ -1450,6 +1461,17 @@ function DropdownRoot({
1450
1461
  const visible = open ?? internalOpen;
1451
1462
  const triggerSet = new Set(trigger);
1452
1463
  const pointAtCenter = typeof arrow === "object" && arrow.pointAtCenter;
1464
+ const [triggerFontSize, setTriggerFontSize] = (0, import_react7.useState)();
1465
+ (0, import_react7.useLayoutEffect)(() => {
1466
+ if (!visible || !rootRef.current) return;
1467
+ const root = rootRef.current;
1468
+ const target = root.querySelector("button, [role='button'], a") ?? (root.firstElementChild !== contextAnchorRef.current ? root.firstElementChild : null) ?? root;
1469
+ const syncFontSize = () => setTriggerFontSize(getComputedStyle(target).fontSize);
1470
+ syncFontSize();
1471
+ const observer = new ResizeObserver(syncFontSize);
1472
+ observer.observe(target);
1473
+ return () => observer.disconnect();
1474
+ });
1453
1475
  function clearTimer(ref) {
1454
1476
  if (ref.current === void 0) return;
1455
1477
  window.clearTimeout(ref.current);
@@ -1621,7 +1643,7 @@ function DropdownRoot({
1621
1643
  placement: contextPoint ? "bottom-start" : placementMap[placement],
1622
1644
  offset: contextPoint ? 2 : 6,
1623
1645
  className: `sia-dropdown__popup${visible ? " is-open" : " is-closing"}${arrow ? " sia-dropdown__popup--arrow" : ""}${pointAtCenter ? " sia-dropdown__popup--arrow-center" : ""} ${popupClassName}`.trim(),
1624
- style: popupStyle,
1646
+ style: { fontSize: triggerFontSize, ...popupStyle },
1625
1647
  onMouseEnter: () => {
1626
1648
  clearTimer(closeTimerRef);
1627
1649
  if (!disabled && triggerSet.has("hover")) clearTimer(openTimerRef);
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  RichTextContent,
3
3
  RichTextEditor
4
- } from "./chunk-ZDC7PMZN.js";
5
- import "./chunk-XCVAVCIO.js";
4
+ } from "./chunk-DTZUBD2O.js";
5
+ import "./chunk-IUZ2RSI5.js";
6
6
  import "./chunk-IKAMZNCK.js";
7
7
  import "./chunk-H7IAG72O.js";
8
8
  export {
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  SelectDateRange
3
- } from "./chunk-E4RMSZOC.js";
4
- import "./chunk-NYJSSPIX.js";
5
- import "./chunk-XCVAVCIO.js";
3
+ } from "./chunk-ZX2YNHQJ.js";
4
+ import "./chunk-PJT676UK.js";
5
+ import "./chunk-IUZ2RSI5.js";
6
6
  import "./chunk-IKAMZNCK.js";
7
7
  import "./chunk-H7IAG72O.js";
8
8
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sia.soul/sia-react-ui",
3
- "version": "0.1.47",
3
+ "version": "0.1.48",
4
4
  "description": "Sia Design components and tokens for React",
5
5
  "publishConfig": {
6
6
  "access": "public",