npm - @hsu-react/ui - Versions diffs - 0.0.25 → 2.0.0 - Mend

@hsu-react/ui 0.0.25 → 2.0.0

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.

Files changed (709) hide show

package/lib/layout/NavTabBar/index.module.scss ADDED Viewed

@@ -0,0 +1,179 @@
+// 注意：这是 CSS Module，文件里的每个类名都会被哈希。antd 的类名必须写在 :global() 里，
+// 否则 `.ant-tabs-nav` 会被编译成一串哈希，永远匹配不到 antd 渲染出的 DOM —— 规则不会报错，
+// 只是静悄悄地全部失效。本库其余组件的样式都遵循这个写法。
+.NavTabBar {
+  padding: 6px 8px 0px;
+  // Modern look: keep the white strip; the active tab is a light teal pill
+  background: var(--vita-surface);
+  border-bottom: 1px solid var(--vita-border);
+  // 把根类重复一次（编译成 `.x.x`），只为提一档权重。antd 的卡片样式是
+  // `:where(...).ant-tabs-card.ant-tabs-small.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab`，
+  // `:where()` 不计权重，正好和这里的四个类打平 —— 打平时后注入的赢，而 antd 的
+  // CSS-in-JS 是运行时插进 <head> 的，永远在后面，圆角这类就会被它盖回卡片样式。
+  &.NavTabBar {
+    :global(.ant-tabs-nav) {
+      height: 36px;
+      margin-bottom: 0px;
+      &::before {
+        border-bottom: none;
+      }
+      // Card-style tabs do not need the bottom ink bar
+      :global(.ant-tabs-ink-bar) {
+        display: none;
+      }
+      :global(.ant-tabs-nav-list) {
+        :global(.ant-tabs-tab) {
+          position: relative;
+          padding: 0px;
+          margin: 0px;
+          border: none;
+          border-radius: 8px;
+          background: transparent;
+          transition: background 0.2s;
+          & + :global(.ant-tabs-tab) {
+            margin-left: 4px;
+          }
+          :global(.ant-tabs-tab-btn) {
+            color: var(--vita-muted-foreground);
+            > .tabLabel {
+              display: inline-flex;
+              align-items: center;
+              justify-content: center;
+              column-gap: 5px;
+              width: 100%;
+              height: 100%;
+              padding: 6px 16px;
+            }
+            > .tabLabel.legacyClosableTabLabel {
+              padding-right: 36px;
+            }
+          }
+          &:hover {
+            background: var(--vita-border-weak);
+          }
+          &:global(.ant-tabs-tab-active) {
+            background: var(--vita-muted);
+            :global(.ant-tabs-tab-btn) {
+              color: var(--vita-primary);
+              font-weight: 500;
+            }
+          }
+          :global(.ant-tabs-tab-remove) {
+            position: absolute;
+            right: 16px;
+            top: 50%;
+            transform: translateY(-50%);
+          }
+          &:has(:global(.ant-tabs-tab-remove)) {
+            :global(.ant-tabs-tab-btn) {
+              > .tabLabel {
+                padding-right: 36px;
+              }
+            }
+          }
+        }
+      }
+    }
+    // extra 区域自身没有高度，撑满后才能和页签对齐；右边那条竖线把刷新按钮和页签分开
+    :global(.ant-tabs-extra-content) {
+      display: flex;
+      align-items: center;
+      align-self: stretch;
+      margin-right: 8px;
+      padding-right: 8px;
+      border-right: 1px solid var(--vita-border-weak);
+    }
+    // 「刷新当前页」按钮
+    .reload {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: 28px;
+      height: 28px;
+      padding: 0px;
+      color: var(--vita-muted-foreground);
+      &:hover {
+        color: var(--vita-primary);
+      }
+    }
+    :global(.ant-tabs-nav-operations) {
+      > button {
+        cursor: pointer;
+      }
+    }
+  }
+}
+.popover {
+  // antd v6 里承载内边距的是 .ant-popover-container，v5 的 .ant-popover-inner 已经没有了 ——
+  // 照着 v5 写不会报错，只是这条规则永远不生效，右键菜单会白白多出一圈 12px 内边距
+  :global(.ant-popover-container) {
+    padding: 0px;
+  }
+  .part {
+    display: flex;
+    flex-direction: column;
+    padding: 6px 0px;
+    border-bottom: 1px solid var(--vita-border-weak);
+    :global(.ant-btn) {
+      justify-content: flex-start;
+      border-radius: 0px;
+    }
+  }
+}
+.dragOverlay {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  opacity: 0.9;
+  height: 34px;
+  padding: 6px 16px;
+  background: var(--vita-surface);
+  border-radius: 6px 6px 0 0;
+  border: 1px solid var(--vita-border);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  .tabLabel {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    column-gap: 5px;
+  }
+}

package/lib/layout/Theme/ThemeStore.d.ts ADDED Viewed

@@ -0,0 +1,18 @@
+export type Layout = "left" | "top" | "mixed";
+export type Theme = "light" | "dark";
+export type HeaderTheme = "light" | "dark" | "theme";
+export type Appearance = "light" | "dark" | "system";
+declare class ThemeStore {
+    get appearance(): Appearance;
+    private _appearance;
+    private _systemDark;
+    get isDark(): boolean;
+    get layout(): Layout;
+    get headerTheme(): HeaderTheme;
+    get theme(): Theme;
+    constructor();
+    private _setSystemDark;
+    setAppearance: (appearance: Appearance) => void;
+}
+declare const _default: ThemeStore;
+export default _default;

package/lib/layout/Theme/ThemeStore.js ADDED Viewed

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _storage = require("../_utils/storage");
+var _mobx = require("mobx");
+// Three appearance modes (light / dark / follow system)
+class ThemeStore {
+  // Appearance mode selected by the user
+  get appearance() {
+    return this._appearance;
+  }
+  _appearance = "system";
+  // Whether the system is currently dark (takes effect when appearance=system)
+  _systemDark = false;
+  // Resolved actual dark-mode state
+  get isDark() {
+    if (this._appearance === "system") return this._systemDark;
+    return this._appearance === "dark";
+  }
+  // Fixed left layout; switching is no longer offered
+  get layout() {
+    return "left";
+  }
+  // Nav light/dark follows the appearance
+  get headerTheme() {
+    return this.isDark ? "dark" : "light";
+  }
+  // Content theme follows the appearance
+  get theme() {
+    return this.isDark ? "dark" : "light";
+  }
+  constructor() {
+    (0, _mobx.makeAutoObservable)(this);
+    const cached = (0, _storage.readStorage)(_storage.STORAGE_KEY.APPEARANCE);
+    if (cached === "light" || cached === "dark" || cached === "system") {
+      this._appearance = cached;
+    }
+    // Listen for system color-scheme changes, following in real time when appearance=system
+    if (typeof window !== "undefined" && window.matchMedia) {
+      const mq = window.matchMedia("(prefers-color-scheme: dark)");
+      this._systemDark = mq.matches;
+      mq.addEventListener("change", e => this._setSystemDark(e.matches));
+    }
+  }
+  _setSystemDark = v => {
+    this._systemDark = v;
+  };
+  setAppearance = appearance => {
+    this._appearance = appearance;
+    (0, _storage.writeStorage)(_storage.STORAGE_KEY.APPEARANCE, appearance);
+  };
+}
+var _default = exports.default = new ThemeStore();

package/lib/layout/Theme/index.d.ts ADDED Viewed

@@ -0,0 +1,30 @@
+import React from "react";
+export interface ThemeProps {
+    children?: React.ReactNode;
+    /** 深色导航渐变的两端色，不传用内置值 */
+    navDarkColors?: {
+        top: string;
+        bottom: string;
+    };
+}
+/**
+ * 外观控制器 + 布局专属配色。
+ *
+ * 这里刻意**不**做全局主题 —— 色板、圆角、字号、控件高度、明暗算法、focus ring 都由本库的
+ * `ConfigProvider` 从设计令牌统一产出。这个组件只负责两件它独有的事：
+ *
+ * 1. **写 `html[data-theme]`**。令牌的 CSS 变量与 `useIsDark` 都监听这个属性，但**没有人写它** ——
+ *    这是外观三态（light / dark / 跟随系统）落地的地方，也是这个组件存在的主要理由。
+ * 2. **侧栏与导航的配色**。菜单选中态的胶囊、深色导航的渐变，这些是布局特有的，
+ *    通用令牌覆盖不到，用一层就近的 antd ConfigProvider 叠加（antd 的嵌套规则：内层胜）。
+ *
+ * 移植时去掉的（本库已有，留着会重复甚至打架）：
+ * - 自己包一层 antd ConfigProvider 做全局主题、切 darkAlgorithm  -> ConfigProvider
+ * - hexToRgba                                                   -> styles/tokens 的 withAlpha
+ * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
+ * - matchMedia 监听系统深色                                       -> useIsDark
+ * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
+ * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ */
+declare const Theme: React.FC<ThemeProps>;
+export default Theme;

package/lib/layout/Theme/index.js ADDED Viewed

@@ -0,0 +1,100 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _antd = require("antd");
+var _mobxReactLite = require("mobx-react-lite");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _indexModule = _interopRequireDefault(require("./index.module.scss"));
+var _ThemeStore = _interopRequireDefault(require("./ThemeStore"));
+var _tokens = require("../../styles/tokens");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * 外观控制器 + 布局专属配色。
+ *
+ * 这里刻意**不**做全局主题 —— 色板、圆角、字号、控件高度、明暗算法、focus ring 都由本库的
+ * `ConfigProvider` 从设计令牌统一产出。这个组件只负责两件它独有的事：
+ *
+ * 1. **写 `html[data-theme]`**。令牌的 CSS 变量与 `useIsDark` 都监听这个属性，但**没有人写它** ——
+ *    这是外观三态（light / dark / 跟随系统）落地的地方，也是这个组件存在的主要理由。
+ * 2. **侧栏与导航的配色**。菜单选中态的胶囊、深色导航的渐变，这些是布局特有的，
+ *    通用令牌覆盖不到，用一层就近的 antd ConfigProvider 叠加（antd 的嵌套规则：内层胜）。
+ *
+ * 移植时去掉的（本库已有，留着会重复甚至打架）：
+ * - 自己包一层 antd ConfigProvider 做全局主题、切 darkAlgorithm  -> ConfigProvider
+ * - hexToRgba                                                   -> styles/tokens 的 withAlpha
+ * - 自存一份主题色（原来固定是青色）                                -> antd useToken 里当前生效的 colorPrimary
+ * - matchMedia 监听系统深色                                       -> useIsDark
+ * - borderRadius / colorBorder / Table / Card / Button / Input 等成套 token 覆盖 -> toAntdTheme
+ * - 在包裹元素上内联重定义 --cf-*：那会盖掉 tokens.scss 生成的值，属于主动帮倒忙
+ */
+const Theme = (0, _mobxReactLite.observer)(props => {
+  const {
+    children,
+    navDarkColors
+  } = props;
+  const {
+    isDark
+  } = _ThemeStore.default;
+  const t = isDark ? _tokens.darkTokens : _tokens.lightTokens;
+  // 主色取**当前生效**的那个，而不是自己再存一份 —— 消费方在 ConfigProvider 上换了
+  // primaryColor，导航的选中态要跟着换，否则菜单会是一个和全站无关的颜色。
+  const {
+    token
+  } = _antd.theme.useToken();
+  const primaryColor = token.colorPrimary;
+  // 写 data-theme：CSS 变量与 useIsDark 都看它。
+  (0, _react.useEffect)(() => {
+    document.documentElement.dataset.theme = isDark ? "dark" : "light";
+  }, [isDark]);
+  const themeConfig = (0, _react.useMemo)(() => ({
+    components: {
+      Layout: {
+        headerBg: t.surface,
+        siderBg: t.surface
+      },
+      Menu: {
+        // 背景透明，好让导航的渐变透出来；选中态是一颗圆角胶囊
+        darkItemBg: "transparent",
+        darkSubMenuItemBg: "transparent",
+        darkPopupBg: t.surface,
+        darkItemColor: "rgba(255, 255, 255, 0.82)",
+        darkItemHoverColor: "#ffffff",
+        darkItemHoverBg: "rgba(255, 255, 255, 0.14)",
+        darkItemSelectedBg: (0, _tokens.withAlpha)(primaryColor, 0.16),
+        darkItemSelectedColor: primaryColor,
+        itemSelectedBg: (0, _tokens.withAlpha)(primaryColor, 0.12),
+        itemSelectedColor: primaryColor,
+        itemActiveBg: (0, _tokens.withAlpha)(primaryColor, 0.12),
+        itemHoverBg: isDark ? "rgba(255, 255, 255, 0.06)" : "rgba(0, 0, 0, 0.04)",
+        itemColor: t.foreground,
+        itemBorderRadius: 6,
+        itemMarginInline: 8,
+        itemMarginBlock: 2,
+        itemHeight: 38,
+        horizontalItemHoverBg: "#0000000a"
+      }
+    }
+  }), [isDark, primaryColor, t]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.ConfigProvider, {
+    theme: themeConfig,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames.default)(_indexModule.default.theme, isDark ? "dark" : "light"),
+      style: {
+        "--nav-dark-top": navDarkColors?.top ?? "#1f1f1f",
+        "--nav-dark-bottom": navDarkColors?.bottom ?? "#141414"
+      },
+      children: children
+    })
+  });
+});
+Theme.displayName = "Theme";
+var _default = exports.default = Theme;

package/lib/layout/Theme/index.module.scss ADDED Viewed

@@ -0,0 +1,6 @@
+.theme {
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+}

package/lib/layout/_hooks/useDropTab.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const NavTabBarContent: import("react").Context<{
+    dropKey?: string | undefined;
+    setDropKey?: ((key: string) => void) | undefined;
+}>;
+export default function useDropTab(): (key: string) => void;

package/lib/layout/_hooks/useDropTab.js ADDED Viewed

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NavTabBarContent = void 0;
+exports.default = useDropTab;
+var _react = require("react");
+const NavTabBarContent = exports.NavTabBarContent = /*#__PURE__*/(0, _react.createContext)({});
+function useDropTab() {
+  const {
+    setDropKey
+  } = (0, _react.useContext)(NavTabBarContent);
+  const drop = (0, _react.useCallback)(key => {
+    setDropKey?.(key);
+    setTimeout(() => {
+      setDropKey?.("");
+    }, 0);
+  }, [setDropKey]);
+  return drop;
+}

package/lib/layout/_hooks/useReload.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const ReloadContent: import("react").Context<{
+    id?: string | undefined;
+    setId?: ((id: string) => void) | undefined;
+}>;
+export default function useReload(): (id: string) => void;

package/lib/layout/_hooks/useReload.js ADDED Viewed

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ReloadContent = void 0;
+exports.default = useReload;
+var _react = require("react");
+const ReloadContent = exports.ReloadContent = /*#__PURE__*/(0, _react.createContext)({});
+function useReload() {
+  const {
+    setId: setReLoadId
+  } = (0, _react.useContext)(ReloadContent);
+  const onReload = (0, _react.useCallback)(id => {
+    setReLoadId?.(id);
+  }, [setReLoadId]);
+  return onReload;
+}

package/lib/layout/_hooks/useSetTabTitle.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const NavTabBarTitleContent: import("react").Context<{
+    tabTitles?: Record<string, import("react").ReactNode> | undefined;
+    setTabTitle?: ((key: string, title: React.ReactNode) => void) | undefined;
+}>;
+export default function useSetTabTitle(): (key: string, title: React.ReactNode) => void;

package/lib/layout/_hooks/useSetTabTitle.js ADDED Viewed

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NavTabBarTitleContent = void 0;
+exports.default = useSetTabTitle;
+var _react = require("react");
+const NavTabBarTitleContent = exports.NavTabBarTitleContent = /*#__PURE__*/(0, _react.createContext)({});
+function useSetTabTitle() {
+  const {
+    setTabTitle: _setTabTitle
+  } = (0, _react.useContext)(NavTabBarTitleContent);
+  const setTabTitle = (0, _react.useCallback)((key, title) => {
+    _setTabTitle?.(key, title);
+  }, [_setTabTitle]);
+  return setTabTitle;
+}

package/lib/layout/_utils/storage.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+export declare const readStorage: (key: string) => string | undefined;
+export declare const writeStorage: (key: string, value: string) => void;
+export declare const STORAGE_KEY: {
+    readonly APPEARANCE: "appearance";
+    readonly LANG: "lang";
+};

package/lib/layout/_utils/storage.js ADDED Viewed

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.writeStorage = exports.readStorage = exports.STORAGE_KEY = void 0;
+/**
+ * 布局层用到的一点点本地持久化：外观模式与语言，各是一个字符串。
+ *
+ * 消费方原本用的是一个 web-storage-cache 封装 + 一张全局 CACHE_KEY 表。那张表属于应用，
+ * 不该跟着组件进库；而这里的需求只有「读一个字符串 / 写一个字符串」，直接用 localStorage
+ * 就够了，也不必为此多一个运行时依赖。
+ *
+ * key 统一加 `hsu-ui:` 前缀，避免和消费方自己的存储撞名。
+ */
+const PREFIX = "hsu-ui:";
+const readStorage = key => {
+  if (typeof window === "undefined") return undefined;
+  try {
+    return window.localStorage.getItem(PREFIX + key) ?? undefined;
+  } catch {
+    // 隐私模式 / 禁用存储时 localStorage 会抛异常，静默降级为「没有缓存」
+    return undefined;
+  }
+};
+exports.readStorage = readStorage;
+const writeStorage = (key, value) => {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(PREFIX + key, value);
+  } catch {
+    // 同上：写不进去不该让界面崩掉
+  }
+};
+exports.writeStorage = writeStorage;
+const STORAGE_KEY = exports.STORAGE_KEY = {
+  APPEARANCE: "appearance",
+  LANG: "lang"
+};

package/lib/layout/index.d.ts ADDED Viewed

@@ -0,0 +1,43 @@
+/**
+ * 中后台布局组件。
+ *
+ * 这几个组件是路由驱动的：菜单、面包屑、页签都从一份 `RouteType[]` 里读展示信息，并用
+ * react-router 的 `useLocation` / `useNavigate` 决定当前位置与跳转。因此 **`react-router`
+ * 与 `react-intl` 是可选 peerDependency** —— 只用 Button、Table 这些的项目完全不受影响，
+ * 用到 `Layout.*` 的项目才需要装。
+ *
+ * 与本库其余部分的分工：主题、色板、圆角这些由 `ConfigProvider` 统一提供，`Layout.Theme`
+ * 只负责外观三态（light / dark / 跟随系统）与侧栏导航的专属配色。
+ */
+import Breadcrumb from "./Breadcrumb";
+import Header from "./Header";
+import I18n from "./I18n";
+import Menu from "./Menu";
+import NavTabBar from "./NavTabBar";
+import Theme from "./Theme";
+import I18nStore from "./I18n/I18nStore";
+import ThemeStore from "./Theme/ThemeStore";
+export type { RouteType, MetaType } from "./types";
+export type { ThemeProps } from "./Theme";
+export { default as useSetTabTitle, NavTabBarTitleContent } from "./_hooks/useSetTabTitle";
+export { default as useReload, ReloadContent } from "./_hooks/useReload";
+export { default as useDropTab, NavTabBarContent } from "./_hooks/useDropTab";
+/**
+ * 显式标注这个命名空间的类型，而不是让 TS 去推断。
+ *
+ * 推断会把两类东西泄进 d.ts：mobx store 的私有字段（TS4094），以及各组件的 Props 类型 ——
+ * 那些没有被导出，消费方那边无法解析（TS4023）。react-intl 的内部依赖同理（TS2742）。
+ * 这些都只在开了 declaration 的发包构建里才会暴露，本地跑 dev 看不出来。
+ */
+interface LayoutNamespace {
+    Header: typeof Header;
+    Menu: typeof Menu;
+    Breadcrumb: typeof Breadcrumb;
+    NavTabBar: typeof NavTabBar;
+    Theme: typeof Theme;
+    I18n: typeof I18n;
+    ThemeStore: typeof ThemeStore;
+    I18nStore: typeof I18nStore;
+}
+declare const Layout: LayoutNamespace;
+export default Layout;

package/lib/layout/index.js ADDED Viewed

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "NavTabBarContent", {
+  enumerable: true,
+  get: function () {
+    return _useDropTab.NavTabBarContent;
+  }
+});
+Object.defineProperty(exports, "NavTabBarTitleContent", {
+  enumerable: true,
+  get: function () {
+    return _useSetTabTitle.NavTabBarTitleContent;
+  }
+});
+Object.defineProperty(exports, "ReloadContent", {
+  enumerable: true,
+  get: function () {
+    return _useReload.ReloadContent;
+  }
+});
+exports.default = void 0;
+Object.defineProperty(exports, "useDropTab", {
+  enumerable: true,
+  get: function () {
+    return _useDropTab.default;
+  }
+});
+Object.defineProperty(exports, "useReload", {
+  enumerable: true,
+  get: function () {
+    return _useReload.default;
+  }
+});
+Object.defineProperty(exports, "useSetTabTitle", {
+  enumerable: true,
+  get: function () {
+    return _useSetTabTitle.default;
+  }
+});
+var _Breadcrumb = _interopRequireDefault(require("./Breadcrumb"));
+var _Header = _interopRequireDefault(require("./Header"));
+var _I18n = _interopRequireDefault(require("./I18n"));
+var _Menu = _interopRequireDefault(require("./Menu"));
+var _NavTabBar = _interopRequireDefault(require("./NavTabBar"));
+var _Theme = _interopRequireDefault(require("./Theme"));
+var _I18nStore = _interopRequireDefault(require("./I18n/I18nStore"));
+var _ThemeStore = _interopRequireDefault(require("./Theme/ThemeStore"));
+var _useSetTabTitle = _interopRequireWildcard(require("./_hooks/useSetTabTitle"));
+var _useReload = _interopRequireWildcard(require("./_hooks/useReload"));
+var _useDropTab = _interopRequireWildcard(require("./_hooks/useDropTab"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * 中后台布局组件。
+ *
+ * 这几个组件是路由驱动的：菜单、面包屑、页签都从一份 `RouteType[]` 里读展示信息，并用
+ * react-router 的 `useLocation` / `useNavigate` 决定当前位置与跳转。因此 **`react-router`
+ * 与 `react-intl` 是可选 peerDependency** —— 只用 Button、Table 这些的项目完全不受影响，
+ * 用到 `Layout.*` 的项目才需要装。
+ *
+ * 与本库其余部分的分工：主题、色板、圆角这些由 `ConfigProvider` 统一提供，`Layout.Theme`
+ * 只负责外观三态（light / dark / 跟随系统）与侧栏导航的专属配色。
+ */
+/**
+ * 显式标注这个命名空间的类型，而不是让 TS 去推断。
+ *
+ * 推断会把两类东西泄进 d.ts：mobx store 的私有字段（TS4094），以及各组件的 Props 类型 ——
+ * 那些没有被导出，消费方那边无法解析（TS4023）。react-intl 的内部依赖同理（TS2742）。
+ * 这些都只在开了 declaration 的发包构建里才会暴露，本地跑 dev 看不出来。
+ */
+const Layout = {
+  /** 顶栏：标题、面包屑、语言与外观切换、账号菜单 */
+  Header: _Header.default,
+  /** 侧边 / 顶部菜单 */
+  Menu: _Menu.default,
+  /** 面包屑 */
+  Breadcrumb: _Breadcrumb.default,
+  /** 多页签栏（可拖拽排序、右键菜单） */
+  NavTabBar: _NavTabBar.default,
+  /** 外观三态与布局配色 */
+  Theme: _Theme.default,
+  /** react-intl provider + antd locale */
+  I18n: _I18n.default,
+  /** 外观状态（mobx），供应用侧读写 appearance */
+  ThemeStore: _ThemeStore.default,
+  /** 语言状态（mobx），供应用侧读写 locale */
+  I18nStore: _I18nStore.default
+};
+var _default = exports.default = Layout;