@wisdomgarden/torque 0.2.1 → 0.2.3

package/dist/index.js

@@ -7,208 +7,219 @@ import { useCssVariableValues as n } from "./common/use-css-variable-values.js";
 import { comboboxTransitionProps as s } from "./common/util.js";
 export * from "@wisdomgarden/torque-icons";
 import { formatTemplate as c } from "./locale/types.js";
-import { zhHans as k } from "./locale/zh-Hans.js";
-import { en as d } from "./locale/en.js";
+import { zhHans as d } from "./locale/zh-Hans.js";
+import { en as P } from "./locale/en.js";
 import { zhHant as g } from "./locale/zh-Hant.js";
 import { ar as D } from "./locale/ar.js";
 import { ko as F } from "./locale/ko.js";
-import { UiContext as h, uiContextDefaultValue as L } from "./provider/ui-context.js";
-import { DefaultUiLink as w } from "./provider/ui-link.js";
-import { UiProvider as R } from "./provider/ui-provider.js";
-import { useCheckDevice as U, useDeviceType as V, useLocale as W, useUiContext as y, useUiLink as G } from "./provider/hooks.js";
-import { Button as z } from "./components/button/button.js";
-import { IconButton as j } from "./components/icon-button/icon-button.js";
-import { LinkButton as E } from "./components/link-button/link-button.js";
-import { LinkIconButton as K } from "./components/link-icon-button/link-icon-button.js";
-import { Tooltip as Q } from "./components/tooltip/index.js";
-import { Popover as Y } from "./components/popover/index.js";
-import { Drawer as _ } from "./components/drawer/drawer.js";
+import { UiContext as L, uiContextDefaultValue as v } from "./provider/ui-context.js";
+import { DefaultUiLink as R } from "./provider/ui-link.js";
+import { UiProvider as M } from "./provider/ui-provider.js";
+import { useCheckDevice as y, useDeviceType as H, useLocale as A, useUiContext as N, useUiLink as U } from "./provider/hooks.js";
+import { Button as W } from "./components/button/button.js";
+import { IconButton as z } from "./components/icon-button/icon-button.js";
+import { LinkButton as _ } from "./components/link-button/link-button.js";
+import { LinkIconButton as j } from "./components/link-icon-button/link-icon-button.js";
+import { Tooltip as J } from "./components/tooltip/index.js";
+import { Popover as Q } from "./components/popover/index.js";
+import { Drawer as Z } from "./components/drawer/drawer.js";
 import { drawers as oo } from "./components/drawer/drawer-events.js";
 import { DrawerManager as eo } from "./components/drawer/drawes.js";
 import { BottomDrawer as po } from "./components/bottom-drawer/bottom-drawer.js";
 import { Modal as xo } from "./components/modal/modal.js";
-import { Menu as ao } from "./components/menu/menu.js";
-import { messages as no } from "./components/message/messages.js";
-import { notifications as so } from "./components/notifications/notifications.js";
-import { Notification as To } from "./components/notifications/notification.js";
-import { Alert as bo, AlertSkeleton as ko } from "./components/alert/alert.js";
-import { StickyBox as Co } from "./components/sticky-box.js";
-import { Tag as So } from "./components/tag/tag.js";
-import { ClosableTag as Io } from "./components/tag/closable-tag.js";
-import { IconTag as Bo } from "./components/tag/icon-tag.js";
-import { LinkTag as Lo } from "./components/tag/link-tag.js";
-import { Tabs as wo } from "./components/tab/tabs.js";
-import { TabsTab as Ro } from "./components/tab/subs/tabs-tab.js";
-import { TabsPanel as Uo } from "./components/tab/subs/tabs-panel.js";
-import { TabsList as Wo } from "./components/tab/subs/tabs-list.js";
-import { TabsLinkTab as Go } from "./components/tab/subs/tabs-link-tab.js";
-import { Table as zo, TableSkeleton as Ao } from "./components/table/table.js";
-import { TableHeaderTitle as qo } from "./components/_inner/table/table-header-title.js";
-import { TableHeadSort as Jo } from "./components/_inner/table/head/table-head-sort.js";
-import { TableHeadFilterSingleSelect as Oo } from "./components/_inner/table/head/table-head-filter-single-select.js";
-import { TableHeadFilterMultiSelect as Xo } from "./components/_inner/table/head/table-head-filter-multi-select.js";
-import { TableHeadFilterSearch as Zo } from "./components/_inner/table/head/table-head-filter-search.js";
-import { Pagination as $o, getPaginationRange as or } from "./components/table-pagination/pagination.js";
-import { TablePagination as er } from "./components/table-pagination/table-pagination.js";
-import { TreeContextProvider as pr, useTreeContext as mr } from "./components/tree/tree-context.js";
-import { TreeNode as fr } from "./components/tree/tree-node.js";
-import { TreeNodeList as ir } from "./components/tree/tree-node-list.js";
-import { TreeContent as lr } from "./components/tree/tree-content.js";
-import { Tree as ur } from "./components/tree/tree.js";
-import { useTree as cr } from "./components/tree/hooks/use-tree.js";
-import { TreeSelect as kr } from "./components/tree-select/tree-select.js";
-import { VirtualizedTreeSelect as dr } from "./components/virtualized-tree-select/virtualized-tree-select.js";
-import { DatePicker as gr } from "./components/date-picker/date-picker.js";
-import { DateRangePicker as Dr } from "./components/date-picker/date-range-picker.js";
-import { TimePicker as Fr } from "./components/date-picker/time-picker.js";
-import { TimeRangePicker as hr } from "./components/date-picker/time-range-picker.js";
-import { DateTimePicker as vr } from "./components/date-picker/date-time-picker.js";
-import { DateTimeRangePicker as Hr } from "./components/date-picker/date-time-range-picker.js";
-import { Filter as Mr } from "./components/filter/filter.js";
-import { IconFilter as Vr } from "./components/filter/icon-filter.js";
-import { MultiFilter as yr } from "./components/filter/multi-filter.js";
-import { DataFilter as Nr } from "./components/data-filter/data-filter.js";
-import { FilterConditionTags as Ar } from "./components/data-filter/filter-condition-tags/filter-condition-tags.js";
-import { BaseInput as qr } from "./components/base-input/base-input.js";
-import { BaseInputWrapper as Jr } from "./components/base-input/subs/base-input-wrapper.js";
-import { BaseInputTarget as Or } from "./components/base-input/subs/base-input-target.js";
-import { getFormProps as Xr } from "./components/base-input/util.js";
-import { FormItemWrapper as Zr } from "./components/form-wrapper/form-item-wrapper.js";
-import { FormItemWrapperDefaultsProvider as $r, useFormItemWrapperDefaults as oe } from "./components/form-wrapper/form-item-wrapper-defaults-context.js";
-import { TextInput as ee } from "./components/text-input/text-input.js";
-import { TextArea as pe } from "./components/text-area/text-area.js";
-import { NumberInput as xe } from "./components/number-input/number-input.js";
-import { PasswordInput as ae } from "./components/password-input/password-input.js";
-import { Checkbox as ne } from "./components/checkbox/checkbox.js";
-import { CheckboxContext as se, CheckboxGroup as ue } from "./components/checkbox/checkbox-group.js";
-import { Radio as ce } from "./components/radio/index.js";
-import { Switch as ke } from "./components/switch/switch.js";
-import { SwitchGroup as de } from "./components/switch/switch-group.js";
-import { Select as ge } from "./components/select/select.js";
-import { MultiSelect as De } from "./components/multi-select/multi-select.js";
-import { Combobox as Fe } from "./components/combobox/combobox.js";
-import { useComboboxContext as he } from "./components/combobox/combobox-context.js";
-import { useCombobox as ve } from "./components/combobox/hooks/use-combobox.js";
-import { Box as He } from "./components/box/box.js";
-import { Text as Me } from "./components/text/text.js";
-import { Flex as Ve } from "./components/flex/flex.js";
-import { Group as ye } from "./components/group/group.js";
-import { Stack as Ne } from "./components/stack/stack.js";
-import { Paper as Ae } from "./components/paper/paper.js";
-import { UnstyledButton as qe } from "./components/unstyled-button/unstyled-button.js";
-import { PopoverDropdown as Je } from "./components/popover/popover-dropdown.js";
-import { PopoverTarget as Oe } from "./components/popover/popover-target.js";
-import { RadioGroup as Xe, useRadioContext as Ye } from "./components/radio/radio-group.js";
+import { ModalDeprecated as ao } from "./components/modal-deprecated/modal-deprecated.js";
+import { useOverlayLayer as no } from "./components/overlay-layer/use-overlay-layer.js";
+import { OverlayTierScope as so } from "./components/overlay-layer/overlay-tier-scope.js";
+import { OVERLAY_BASE as To, OVERLAY_TOP_MIN as co } from "./components/overlay-layer/constants.js";
+import { Menu as ko } from "./components/menu/menu.js";
+import { messages as Co } from "./components/message/messages.js";
+import { notifications as So } from "./components/notifications/notifications.js";
+import { Notification as Io } from "./components/notifications/notification.js";
+import { NotificationsContainer as Bo } from "./components/notifications/notifications-container.js";
+import { Alert as vo, AlertSkeleton as ho } from "./components/alert/alert.js";
+import { StickyBox as wo } from "./components/sticky-box.js";
+import { Tag as Vo } from "./components/tag/tag.js";
+import { ClosableTag as Ho } from "./components/tag/closable-tag.js";
+import { IconTag as No } from "./components/tag/icon-tag.js";
+import { LinkTag as Oo } from "./components/tag/link-tag.js";
+import { Tabs as Go } from "./components/tab/tabs.js";
+import { TabsTab as Eo } from "./components/tab/subs/tabs-tab.js";
+import { TabsPanel as Yo } from "./components/tab/subs/tabs-panel.js";
+import { TabsList as qo } from "./components/tab/subs/tabs-list.js";
+import { TabsLinkTab as Ko } from "./components/tab/subs/tabs-link-tab.js";
+import { Table as Xo, TableSkeleton as Zo } from "./components/table/table.js";
+import { TableHeaderTitle as or } from "./components/_inner/table/table-header-title.js";
+import { TableHeadSort as er } from "./components/_inner/table/head/table-head-sort.js";
+import { TableHeadFilterSingleSelect as pr } from "./components/_inner/table/head/table-head-filter-single-select.js";
+import { TableHeadFilterMultiSelect as xr } from "./components/_inner/table/head/table-head-filter-multi-select.js";
+import { TableHeadFilterSearch as ar } from "./components/_inner/table/head/table-head-filter-search.js";
+import { Pagination as nr, getPaginationRange as lr } from "./components/table-pagination/pagination.js";
+import { TablePagination as ur } from "./components/table-pagination/table-pagination.js";
+import { TreeContextProvider as cr, useTreeContext as br } from "./components/tree/tree-context.js";
+import { TreeNode as kr } from "./components/tree/tree-node.js";
+import { TreeNodeList as Cr } from "./components/tree/tree-node-list.js";
+import { TreeContent as Sr } from "./components/tree/tree-content.js";
+import { Tree as Ir } from "./components/tree/tree.js";
+import { useTree as Br } from "./components/tree/hooks/use-tree.js";
+import { TreeSelect as vr } from "./components/tree-select/tree-select.js";
+import { VirtualizedTreeSelect as Rr } from "./components/virtualized-tree-select/virtualized-tree-select.js";
+import { DatePicker as Mr } from "./components/date-picker/date-picker.js";
+import { DateRangePicker as yr } from "./components/date-picker/date-range-picker.js";
+import { TimePicker as Ar } from "./components/date-picker/time-picker.js";
+import { TimeRangePicker as Ur } from "./components/date-picker/time-range-picker.js";
+import { DateTimePicker as Wr } from "./components/date-picker/date-time-picker.js";
+import { DateTimeRangePicker as zr } from "./components/date-picker/date-time-range-picker.js";
+import { Filter as _r } from "./components/filter/filter.js";
+import { IconFilter as jr } from "./components/filter/icon-filter.js";
+import { MultiFilter as Jr } from "./components/filter/multi-filter.js";
+import { DataFilter as Qr } from "./components/data-filter/data-filter.js";
+import { FilterConditionTags as Zr } from "./components/data-filter/filter-condition-tags/filter-condition-tags.js";
+import { BaseInput as oe } from "./components/base-input/base-input.js";
+import { BaseInputWrapper as ee } from "./components/base-input/subs/base-input-wrapper.js";
+import { BaseInputTarget as pe } from "./components/base-input/subs/base-input-target.js";
+import { getFormProps as xe } from "./components/base-input/util.js";
+import { FormItemWrapper as ae } from "./components/form-wrapper/form-item-wrapper.js";
+import { FormItemWrapperDefaultsProvider as ne, useFormItemWrapperDefaults as le } from "./components/form-wrapper/form-item-wrapper-defaults-context.js";
+import { TextInput as ue } from "./components/text-input/text-input.js";
+import { TextArea as ce } from "./components/text-area/text-area.js";
+import { NumberInput as de } from "./components/number-input/number-input.js";
+import { PasswordInput as Pe } from "./components/password-input/password-input.js";
+import { Checkbox as ge } from "./components/checkbox/checkbox.js";
+import { CheckboxContext as De, CheckboxGroup as Ie } from "./components/checkbox/checkbox-group.js";
+import { Radio as Be } from "./components/radio/index.js";
+import { Switch as ve } from "./components/switch/switch.js";
+import { SwitchGroup as Re } from "./components/switch/switch-group.js";
+import { Select as Me } from "./components/select/select.js";
+import { MultiSelect as ye } from "./components/multi-select/multi-select.js";
+import { Combobox as Ae } from "./components/combobox/combobox.js";
+import { useComboboxContext as Ue } from "./components/combobox/combobox-context.js";
+import { useCombobox as We } from "./components/combobox/hooks/use-combobox.js";
+import { Box as ze } from "./components/box/box.js";
+import { Text as _e } from "./components/text/text.js";
+import { Flex as je } from "./components/flex/flex.js";
+import { Group as Je } from "./components/group/group.js";
+import { Stack as Qe } from "./components/stack/stack.js";
+import { Paper as Ze } from "./components/paper/paper.js";
+import { UnstyledButton as ot } from "./components/unstyled-button/unstyled-button.js";
+import { PopoverDropdown as et } from "./components/popover/popover-dropdown.js";
+import { PopoverTarget as pt } from "./components/popover/popover-target.js";
+import { RadioGroup as xt, useRadioContext as ft } from "./components/radio/radio-group.js";
 export {
-  bo as Alert,
-  ko as AlertSkeleton,
-  qr as BaseInput,
-  Or as BaseInputTarget,
-  Jr as BaseInputWrapper,
+  vo as Alert,
+  ho as AlertSkeleton,
+  oe as BaseInput,
+  pe as BaseInputTarget,
+  ee as BaseInputWrapper,
   po as BottomDrawer,
-  He as Box,
-  z as Button,
-  ne as Checkbox,
-  se as CheckboxContext,
-  ue as CheckboxGroup,
-  Io as ClosableTag,
-  Fe as Combobox,
-  Nr as DataFilter,
-  gr as DatePicker,
-  Dr as DateRangePicker,
-  vr as DateTimePicker,
-  Hr as DateTimeRangePicker,
-  w as DefaultUiLink,
-  _ as Drawer,
+  ze as Box,
+  W as Button,
+  ge as Checkbox,
+  De as CheckboxContext,
+  Ie as CheckboxGroup,
+  Ho as ClosableTag,
+  Ae as Combobox,
+  Qr as DataFilter,
+  Mr as DatePicker,
+  yr as DateRangePicker,
+  Wr as DateTimePicker,
+  zr as DateTimeRangePicker,
+  R as DefaultUiLink,
+  Z as Drawer,
   eo as DrawerManager,
-  Mr as Filter,
-  Ar as FilterConditionTags,
-  Ve as Flex,
-  Zr as FormItemWrapper,
-  $r as FormItemWrapperDefaultsProvider,
-  ye as Group,
-  j as IconButton,
-  Vr as IconFilter,
-  Bo as IconTag,
-  E as LinkButton,
-  K as LinkIconButton,
-  Lo as LinkTag,
-  ao as Menu,
+  _r as Filter,
+  Zr as FilterConditionTags,
+  je as Flex,
+  ae as FormItemWrapper,
+  ne as FormItemWrapperDefaultsProvider,
+  Je as Group,
+  z as IconButton,
+  jr as IconFilter,
+  No as IconTag,
+  _ as LinkButton,
+  j as LinkIconButton,
+  Oo as LinkTag,
+  ko as Menu,
   xo as Modal,
-  yr as MultiFilter,
-  De as MultiSelect,
-  To as Notification,
-  xe as NumberInput,
-  $o as Pagination,
-  Ae as Paper,
-  ae as PasswordInput,
-  Y as Popover,
-  Je as PopoverDropdown,
-  Oe as PopoverTarget,
-  ce as Radio,
-  Xe as RadioGroup,
-  ge as Select,
-  Ne as Stack,
-  Co as StickyBox,
-  ke as Switch,
-  de as SwitchGroup,
-  zo as Table,
-  Xo as TableHeadFilterMultiSelect,
-  Zo as TableHeadFilterSearch,
-  Oo as TableHeadFilterSingleSelect,
-  Jo as TableHeadSort,
-  qo as TableHeaderTitle,
-  er as TablePagination,
-  Ao as TableSkeleton,
-  wo as Tabs,
-  Go as TabsLinkTab,
-  Wo as TabsList,
-  Uo as TabsPanel,
-  Ro as TabsTab,
-  So as Tag,
-  Me as Text,
-  pe as TextArea,
-  ee as TextInput,
-  Fr as TimePicker,
-  hr as TimeRangePicker,
-  Q as Tooltip,
-  ur as Tree,
-  lr as TreeContent,
-  pr as TreeContextProvider,
-  fr as TreeNode,
-  ir as TreeNodeList,
-  kr as TreeSelect,
-  h as UiContext,
-  R as UiProvider,
-  qe as UnstyledButton,
-  dr as VirtualizedTreeSelect,
+  ao as ModalDeprecated,
+  Jr as MultiFilter,
+  ye as MultiSelect,
+  Io as Notification,
+  Bo as NotificationsContainer,
+  de as NumberInput,
+  To as OVERLAY_BASE,
+  co as OVERLAY_TOP_MIN,
+  so as OverlayTierScope,
+  nr as Pagination,
+  Ze as Paper,
+  Pe as PasswordInput,
+  Q as Popover,
+  et as PopoverDropdown,
+  pt as PopoverTarget,
+  Be as Radio,
+  xt as RadioGroup,
+  Me as Select,
+  Qe as Stack,
+  wo as StickyBox,
+  ve as Switch,
+  Re as SwitchGroup,
+  Xo as Table,
+  xr as TableHeadFilterMultiSelect,
+  ar as TableHeadFilterSearch,
+  pr as TableHeadFilterSingleSelect,
+  er as TableHeadSort,
+  or as TableHeaderTitle,
+  ur as TablePagination,
+  Zo as TableSkeleton,
+  Go as Tabs,
+  Ko as TabsLinkTab,
+  qo as TabsList,
+  Yo as TabsPanel,
+  Eo as TabsTab,
+  Vo as Tag,
+  _e as Text,
+  ce as TextArea,
+  ue as TextInput,
+  Ar as TimePicker,
+  Ur as TimeRangePicker,
+  J as Tooltip,
+  Ir as Tree,
+  Sr as TreeContent,
+  cr as TreeContextProvider,
+  kr as TreeNode,
+  Cr as TreeNodeList,
+  vr as TreeSelect,
+  L as UiContext,
+  M as UiProvider,
+  ot as UnstyledButton,
+  Rr as VirtualizedTreeSelect,
   D as ar,
   s as comboboxTransitionProps,
   oo as drawers,
-  d as en,
+  P as en,
   c as formatTemplate,
-  Xr as getFormProps,
-  or as getPaginationRange,
+  xe as getFormProps,
+  lr as getPaginationRange,
   F as ko,
-  no as messages,
-  so as notifications,
-  L as uiContextDefaultValue,
-  U as useCheckDevice,
-  ve as useCombobox,
-  he as useComboboxContext,
+  Co as messages,
+  So as notifications,
+  v as uiContextDefaultValue,
+  y as useCheckDevice,
+  We as useCombobox,
+  Ue as useComboboxContext,
   a as useCssVariableValue,
   n as useCssVariableValues,
-  V as useDeviceType,
-  oe as useFormItemWrapperDefaults,
+  H as useDeviceType,
+  le as useFormItemWrapperDefaults,
   x as useFormWrapperProps,
   e as useImeSafeInput,
-  W as useLocale,
-  Ye as useRadioContext,
+  A as useLocale,
+  no as useOverlayLayer,
+  ft as useRadioContext,
   p as useStickyBox,
-  cr as useTree,
-  mr as useTreeContext,
-  y as useUiContext,
-  G as useUiLink,
-  k as zhHans,
+  Br as useTree,
+  br as useTreeContext,
+  N as useUiContext,
+  U as useUiLink,
+  d as zhHans,
   g as zhHant
 };

package/dist/provider/hooks.js

@@ -1,26 +1,27 @@
 "use client";
 import { useContext as n } from "react";
-import { UiContext as r } from "./ui-context.js";
-const c = () => typeof process < "u" && process.env.NODE_ENV !== "production", t = () => n(r), d = () => t().locale, u = () => {
+import { isDev as r } from "../common/is-dev.js";
+import { UiContext as a } from "./ui-context.js";
+const t = () => n(a), u = () => t().locale, p = () => {
   const { deviceType: e } = t();
   return { deviceType: e };
-}, p = () => {
+}, v = () => {
   const { deviceType: e } = t();
   return {
     isMobile: e === "mobile",
     isTablet: e === "tablet",
     isDesktop: e === "desktop"
   };
-}, o = /* @__PURE__ */ new Set(), v = (e) => {
-  const { linkComponent: s, hasProvider: i } = t();
-  return c() && !i && !o.has(e) && (o.add(e), console.warn(
+}, o = /* @__PURE__ */ new Set(), f = (e) => {
+  const { linkComponent: i, hasProvider: s } = t();
+  return r() && !s && !o.has(e) && (o.add(e), console.warn(
     `[@wisdomgarden/torque] <${e}> rendered outside <UiProvider>, falling back to a plain <a>. On a host with a router this silently turns client-side navigation into a full page load.`
-  )), s;
+  )), i;
 };
 export {
-  p as useCheckDevice,
-  u as useDeviceType,
-  d as useLocale,
+  v as useCheckDevice,
+  p as useDeviceType,
+  u as useLocale,
   t as useUiContext,
-  v as useUiLink
+  f as useUiLink
 };

package/dist/provider/ui-context.d.ts

@@ -5,6 +5,16 @@ export interface UiContextValue {
     locale: UiLocale;
     deviceType: DeviceType;
     linkComponent: UiLinkComponent;
+    /**
+     * 浮层的默认挂载点。`null` 表示挂到 `document.body`（默认行为）。
+     *
+     * 由 `UiProvider` 的 `portalRoot` 传入，宿主可以直接给一个自己的挂载点元素。
+     * 给 Shadow DOM 场景用：传 shadow root 或它内部的容器元素，浮层就不会跑到外层
+     * document 上，从而拿到 shadow 内注入的样式与 CSS 变量。
+     *
+     * 只在 render 期读取，所以必须是「值」而不是 ref —— 组件库不负责解析它。
+     */
+    portalRoot: ShadowRoot | HTMLElement | null;
     /**
      * False only in the value `createContext` falls back to, so a component can
      * tell "no provider above me" from "a provider that chose the defaults".

package/dist/provider/ui-context.js

@@ -1,14 +1,15 @@
 "use client";
 import { createContext as e } from "react";
-import { en as t } from "../locale/en.js";
-import { DefaultUiLink as o } from "./ui-link.js";
-const i = {
-  locale: t,
+import { en as o } from "../locale/en.js";
+import { DefaultUiLink as t } from "./ui-link.js";
+const n = {
+  locale: o,
   deviceType: "desktop",
-  linkComponent: o,
+  linkComponent: t,
+  portalRoot: null,
   hasProvider: !1
-}, a = e(i);
+}, a = e(n);
 export {
   a as UiContext,
-  i as uiContextDefaultValue
+  n as uiContextDefaultValue
 };

package/dist/provider/ui-provider.d.ts

@@ -14,6 +14,28 @@ export interface UiProviderProps {
      * `'use client'` boundary — a Server Component cannot serialize it.
      */
     readonly linkComponent?: UiLinkComponent;
+    /**
+     * 浮层的默认挂载点，不传则挂到 `document.body`。
+     *
+     * 组件库所有浮层（Modal、Popover、Tooltip 等）的 `Portal` 都会挂到这里，
+     * 宿主可以直接传入自己的挂载点元素。
+     *
+     * **给 Shadow DOM 场景用。** 默认挂到 `document.body` 会落在 shadow root 之外 ——
+     * 那里拿不到 shadow 内注入的样式与 CSS 变量，浮层会完全没有样式。
+     * 把 shadow root，或 shadow root 内部的一个容器元素传进来，浮层就留在 shadow 里。
+     *
+     * 传 `ShadowRoot` 本身时，浮层会成为它的直接子节点，所以样式与 CSS 变量必须定义在
+     * shadow root 层级（`adoptedStyleSheets` 或 shadow root 下的 `<style>`）；
+     * 变量定义在内层包裹元素上时，改传那个包裹元素。
+     *
+     * 必须是「值」而不是 ref：浮层在 render 期就要知道挂到哪里，读 ref 属于不纯操作，
+     * 而且 ref 首帧一定是空的，会把浮层的挂载拆成两段渲染。宿主本来就是
+     * `attachShadow()` 的调用者，直接传它的返回值即可。
+     *
+     * 这个值不要在浮层打开之后再变 —— 挂载点变了 React 会卸载重建整棵浮层子树，
+     * 子组件状态会丢、入场动画会重放。
+     */
+    readonly portalRoot?: ShadowRoot | HTMLElement | null;
     readonly children: ReactNode;
 }
-export declare const UiProvider: ({ locale, deviceType, linkComponent, children, }: UiProviderProps) => import("react").JSX.Element;
+export declare const UiProvider: ({ locale, deviceType, linkComponent, portalRoot, children, }: UiProviderProps) => import("react").JSX.Element;

package/dist/provider/ui-provider.js

@@ -1,21 +1,28 @@
 "use client";
-import { jsx as m } from "react/jsx-runtime";
-import { useMemo as s } from "react";
+import { jsx as s } from "react/jsx-runtime";
+import { useMemo as u } from "react";
 import { en as f } from "../locale/en.js";
-import { UiContext as u } from "./ui-context.js";
+import { UiContext as n } from "./ui-context.js";
 import { DefaultUiLink as p } from "./ui-link.js";
-const U = ({
+const a = ({
   locale: r = f,
   deviceType: o = "desktop",
   linkComponent: t = p,
-  children: i
+  portalRoot: i = null,
+  children: e
 }) => {
-  const e = s(
-    () => ({ locale: r, deviceType: o, linkComponent: t, hasProvider: !0 }),
-    [r, o, t]
+  const m = u(
+    () => ({
+      locale: r,
+      deviceType: o,
+      linkComponent: t,
+      portalRoot: i,
+      hasProvider: !0
+    }),
+    [r, o, t, i]
   );
-  return /* @__PURE__ */ m(u.Provider, { value: e, children: i });
+  return /* @__PURE__ */ s(n.Provider, { value: m, children: e });
 };
 export {
-  U as UiProvider
+  a as UiProvider
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wisdomgarden/torque",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Torque Design — Wisdom Garden's base UI component library for React.",
   "type": "module",
   "license": "SEE LICENSE IN LICENSE",
@@ -153,7 +153,7 @@
     "@mantine/hooks": "^8.3.6",
     "@mantine/notifications": "^8.3.6",
     "@tanstack/react-virtual": "^3.13.18",
-    "@wisdomgarden/torque-icons": "^0.1.3",
+    "@wisdomgarden/torque-icons": "^0.1.4",
     "@wisdomgarden/torque-styles": "^0.1.2",
     "ahooks": "^3.9.0",
     "dayjs": "^1.11.13",
@@ -176,7 +176,7 @@
     "@tanstack/react-virtual": "^3.13.18",
     "@types/react": "^19.2.18",
     "@types/react-dom": "^19.2.4",
-    "@wisdomgarden/torque-icons": "0.1.3",
+    "@wisdomgarden/torque-icons": "0.1.4",
     "@wisdomgarden/torque-styles": "0.1.2",
     "ahooks": "^3.9.0",
     "dayjs": "^1.11.13",

package/dist/components/popover/popover-stack.d.ts

@@ -1,10 +0,0 @@
-/**
- * 登记已打开的 Popover，并返回只清理本次登记的注销函数。
- * depth 表示逻辑嵌套层级，order 用于区分同层浮层的打开先后。
- */
-export declare function registerOpenPopover(id: string, depth: number): () => void;
-/**
- * 判断 Popover 是否位于当前逻辑栈顶：嵌套更深者优先，同一深度下后打开者优先。
- * Escape 关闭前使用该结果，避免一次按键同时关闭多层浮层。
- */
-export declare function isTopmostOpenPopover(id: string): boolean;

package/dist/components/popover/popover-stack.js

@@ -1,24 +0,0 @@
-"use client";
-const r = /* @__PURE__ */ new Map();
-let p = 0;
-function s(e, t) {
-  const o = {
-    depth: t,
-    order: p++
-  };
-  return r.set(e, o), () => {
-    r.get(e) === o && r.delete(e);
-  };
-}
-function f(e) {
-  const t = r.get(e);
-  if (!t) return !1;
-  for (const [o, n] of r)
-    if (o !== e && (n.depth > t.depth || n.depth === t.depth && n.order > t.order))
-      return !1;
-  return !0;
-}
-export {
-  f as isTopmostOpenPopover,
-  s as registerOpenPopover
-};