@next-bricks/nav 1.26.1 → 1.26.3

package/dist-types/easyops-navbar-alerts/index.d.ts

@@ -6,7 +6,7 @@ import type { Link, LinkProps } from "@next-bricks/basic/link";
 export declare const WrappedIcon: import("@next-core/react-element").WrappedBrick<GeneralIcon, GeneralIconProps>;
 export declare const WrappedLink: import("@next-core/react-element").WrappedBrick<Link, LinkProps>;
 /**
- * 构件 `nav.easyops-navbar-alerts`
+ * 导航栏告警提示组件，用于显示 License 到期提醒和页面性能问题警告。
  * @insider
  */
 export declare class EasyopsNavbarAlerts extends ReactNextElement {

package/dist-types/launchpad-button-v2/index.d.ts

@@ -3,7 +3,7 @@ import { ReactNextElement } from "@next-core/react-element";
 import "@next-core/theme";
 import "./host-context.css";
 /**
- * 构件 `eo-launchpad-button-v2`
+ * Launchpad 启动台按钮（v2），点击后展开 Launchpad 面板，支持快捷键 Alt+L 开关、Esc 关闭。
  * @insider
  */
 export declare class EoLaunchpadButtonV2 extends ReactNextElement {

package/dist-types/launchpad-config/index.d.ts

@@ -12,10 +12,13 @@ import { MenuGroupProps } from "./MenuGroup";
  */
 export declare class LaunchpadConfig extends ReactNextElement implements LaunchpadConfigProps {
     #private;
+    /** Launchpad 配置菜单分组数据 */
     accessor menuGroups: ConfigMenuGroup[] | undefined;
+    /** 菜单操作按钮配置列表 */
     accessor actions: MenuAction[] | undefined;
     /**
      * @default "launchpad-config"
+     * @description 显示变体：launchpad-config（Launchpad 配置）、factory-launchpad-config（工厂配置）、menu-config（菜单配置）、blacklist-config（黑名单配置）
      */
     accessor variant: ConfigVariant | undefined;
     /**
@@ -44,6 +47,10 @@ export interface LaunchpadConfigProps extends Pick<MenuGroupProps, "actions" | "
     menuGroups?: ConfigMenuGroup[];
     blacklist?: string[];
 }
+export interface LaunchpadConfigEventsMapping {
+    onMenuItemClick: "menu-item.click";
+    onActionClick: "action.click";
+}
 export interface LaunchpadConfigComponentProps extends LaunchpadConfigProps, Pick<MenuGroupProps, "onMenuItemClick" | "onActionClick"> {
 }
 export declare function LaunchpadConfigComponent({ menuGroups, actions, variant, urlTemplate, customUrlTemplate, blacklist, onMenuItemClick, onActionClick, }: LaunchpadConfigComponentProps): React.JSX.Element;

package/dist-types/launchpad-quick-access/index.d.ts

@@ -7,7 +7,13 @@ import { Target } from "@next-bricks/basic/link";
  * @insider
  */
 export declare class EoLaunchpadQuickAccess extends ReactNextElement {
+    /**
+     * 是否为只读模式（隐藏收藏切换按钮）
+     */
     accessor readonly: boolean | undefined;
+    /**
+     * 菜单项链接打开的目标
+     */
     accessor target: Target | undefined;
     render(): React.JSX.Element;
 }

package/dist-types/launchpad-recent-visits/index.d.ts

@@ -7,6 +7,9 @@ import type { Target } from "@next-bricks/basic/link";
  * @insider
  */
 export declare class EoLaunchpadRecentVisits extends ReactNextElement {
+    /**
+     * 菜单项链接打开的目标（仅对应用类型的访问项生效，自定义链接类型始终在新标签打开）
+     */
     accessor target: Target | undefined;
     render(): React.JSX.Element;
 }

package/dist-types/nav-menu/index.d.ts

@@ -13,6 +13,9 @@ declare class NavMenu extends ReactNextElement {
      * 菜单项
      */
     accessor menu: SidebarMenu | undefined;
+    /**
+     * 主菜单标题文字的自定义样式
+     */
     accessor mainMenuTitleStyle: CSSProperties | undefined;
     /**
      * 是否显示 tooltip

package/dist-types/poll-announce/index.d.ts

@@ -10,6 +10,10 @@ export interface Message {
     data: string;
     instanceId: string;
 }
+export interface PollAnnounceEventsMapping {
+    onNotificationClose: "notification.close";
+    onNotificationOpen: "notification.open";
+}
 /**
  * 轮询获取通知消息并展示。
  *

package/dist-types/query-search/index.d.ts

@@ -4,7 +4,7 @@ import "@next-core/theme";
 import type { GeneralSearch, SearchProps, SearchEvents, SearchEventsMap } from "@next-bricks/form/search";
 export declare const WrappedSearch: import("@next-core/react-element").WrappedBrickWithEventsMap<GeneralSearch, SearchProps, SearchEvents, SearchEventsMap>;
 /**
- * 构件 `nav.query-search`
+ * 综合搜索入口，支持全文检索、IP 搜索、工单搜索等多种查询模式，带搜索历史记录功能
  */
 export declare class QuerySearch extends ReactNextElement {
     render(): React.JSX.Element;

package/dist-types/sidebar-sub-menu/index.d.ts

@@ -7,7 +7,7 @@ interface SidebarSubMenuProps {
     showTooltip?: boolean;
 }
 /**
- * 构件 `eo-sidebar-sub-menu`
+ * 侧边栏子菜单，支持简单菜单项、分组和子菜单的嵌套渲染
  * @category navigation
  */
 export declare class EoSidebarSubMenu extends ReactNextElement {

package/docs/easyops-navbar-alerts.md

@@ -0,0 +1,23 @@
+---
+tagName: nav.easyops-navbar-alerts
+displayName: WrappedNavEasyopsNavbarAlerts
+description: 导航栏告警提示组件，用于显示 License 到期提醒和页面性能问题警告。
+category: ""
+source: "@next-bricks/nav"
+---
+
+# nav.easyops-navbar-alerts
+
+> 导航栏告警提示组件，用于显示 License 到期提醒和页面性能问题警告。
+
+此构件为内部构件（@insider），主要在导航栏中使用，自动检测 License 剩余天数（不足 15 天时显示提示）和页面渲染性能问题，无需传入任何属性。
+
+## Examples
+
+### Basic
+
+在导航栏中嵌入告警提示组件，自动展示 License 到期和性能问题告警。
+
+```yaml preview
+brick: nav.easyops-navbar-alerts
+```

package/docs/easyops-navbar-alerts.react.md

@@ -0,0 +1,29 @@
+---
+tagName: nav.easyops-navbar-alerts
+displayName: WrappedNavEasyopsNavbarAlerts
+description: 导航栏告警提示组件，用于显示 License 到期提醒和页面性能问题警告。
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedNavEasyopsNavbarAlerts
+
+> 导航栏告警提示组件，用于显示 License 到期提醒和页面性能问题警告。
+
+## 导入
+
+```tsx
+import { WrappedNavEasyopsNavbarAlerts } from "@easyops/wrapped-components";
+```
+
+此构件为内部构件（@insider），主要在导航栏中使用，自动检测 License 剩余天数（不足 15 天时显示提示）和页面渲染性能问题，无需传入任何属性。
+
+## Examples
+
+### Basic
+
+在导航栏中嵌入告警提示组件，自动展示 License 到期和性能问题告警。
+
+```tsx
+<WrappedNavEasyopsNavbarAlerts />
+```

package/docs/eo-app-bar-wrapper.md

@@ -1,9 +1,37 @@
-构件 `eo-app-bar-wrapper`
+---
+tagName: eo-app-bar-wrapper
+displayName: WrappedEoAppBarWrapper
+description: 应用顶部容器
+category: ""
+source: "@next-bricks/nav"
+---
+
+# eo-app-bar-wrapper
+
+> 应用顶部容器
+
+## Props
+
+| 属性                    | 类型                               | 必填 | 默认值    | 说明                                                         |
+| ----------------------- | ---------------------------------- | ---- | --------- | ------------------------------------------------------------ |
+| isFixed                 | `boolean \| undefined`             | 否   | `true`    | 是否固定定位。已废弃，使用 `position` 属性代替               |
+| position                | `"static" \| "fixed" \| undefined` | 否   | `"fixed"` | 设置定位方式：静态定位或固定定位。设置时优先级高于 `isFixed` |
+| displayCenter           | `boolean \| undefined`             | 否   | `false`   | 居中显示                                                     |
+| extraAppBarContentStyle | `React.CSSProperties \| undefined` | 否   | —         | 自定义样式                                                   |
+
+## Slots
+
+| 名称  | 说明       |
+| ----- | ---------- |
+| left  | 左侧内容区 |
+| right | 右侧内容区 |
 
 ## Examples
 
 ### Basic
 
+展示基础的顶部容器，左右区域分别放置内容。
+
 ```yaml preview
 - brick: eo-app-bar-wrapper
   properties:
@@ -25,6 +53,8 @@
 
 ### DisplayCenter
 
+将内容区域居中对齐显示。
+
 ```yaml preview
 - brick: eo-app-bar-wrapper
   properties:
@@ -44,3 +74,29 @@
             textContent: Right Content
       type: bricks
 ```
+
+### Custom Style
+
+通过 extraAppBarContentStyle 自定义内容区域样式。
+
+```yaml preview
+- brick: eo-app-bar-wrapper
+  properties:
+    position: static
+    extraAppBarContentStyle:
+      background: "#f5f5f5"
+      padding: 8px 16px
+  slots:
+    left:
+      bricks:
+        - brick: div
+          properties:
+            textContent: Left Content
+      type: bricks
+    right:
+      bricks:
+        - brick: div
+          properties:
+            textContent: Right Content
+      type: bricks
+```

package/docs/eo-app-bar-wrapper.react.md

@@ -0,0 +1,71 @@
+---
+tagName: eo-app-bar-wrapper
+displayName: WrappedEoAppBarWrapper
+description: 应用顶部容器
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedEoAppBarWrapper
+
+> 应用顶部容器
+
+## 导入
+
+```tsx
+import { WrappedEoAppBarWrapper } from "@easyops/wrapped-components";
+```
+
+## Props
+
+| 属性                    | 类型                               | 必填 | 默认值    | 说明                                                         |
+| ----------------------- | ---------------------------------- | ---- | --------- | ------------------------------------------------------------ |
+| isFixed                 | `boolean \| undefined`             | 否   | `true`    | 是否固定定位。已废弃，使用 `position` 属性代替               |
+| position                | `"static" \| "fixed" \| undefined` | 否   | `"fixed"` | 设置定位方式：静态定位或固定定位。设置时优先级高于 `isFixed` |
+| displayCenter           | `boolean \| undefined`             | 否   | `false`   | 居中显示                                                     |
+| extraAppBarContentStyle | `React.CSSProperties \| undefined` | 否   | —         | 自定义样式                                                   |
+
+## Slots
+
+| 名称  | 说明       |
+| ----- | ---------- |
+| left  | 左侧内容区 |
+| right | 右侧内容区 |
+
+## Examples
+
+### Basic
+
+展示基础的顶部容器，左右区域分别放置内容。
+
+```tsx
+<WrappedEoAppBarWrapper position="static">
+  <div slot="left">Left Content</div>
+  <div slot="right">Right Content</div>
+</WrappedEoAppBarWrapper>
+```
+
+### DisplayCenter
+
+将内容区域居中对齐显示。
+
+```tsx
+<WrappedEoAppBarWrapper position="static" displayCenter={true}>
+  <div slot="left">Left Content</div>
+  <div slot="right">Right Content</div>
+</WrappedEoAppBarWrapper>
+```
+
+### Custom Style
+
+通过 extraAppBarContentStyle 自定义内容区域样式。
+
+```tsx
+<WrappedEoAppBarWrapper
+  position="static"
+  extraAppBarContentStyle={{ background: "#f5f5f5", padding: "8px 16px" }}
+>
+  <div slot="left">Left Content</div>
+  <div slot="right">Right Content</div>
+</WrappedEoAppBarWrapper>
+```

package/docs/eo-directory-tree-internal-node.md

@@ -1,9 +1,47 @@
-目录树节点
+---
+tagName: eo-directory-tree-internal-node
+displayName: WrappedEoDirectoryTreeInternalNode
+description: 目录树中间节点
+category: ""
+source: "@next-bricks/nav"
+---
+
+# eo-directory-tree-internal-node
+
+> 目录树中间节点
+
+## Props
+
+| 属性       | 类型                            | 必填 | 默认值 | 说明             |
+| ---------- | ------------------------------- | ---- | ------ | ---------------- |
+| depth      | `number`                        | 是   | `0`    | 深度             |
+| expanded   | `boolean \| undefined`          | 否   | —      | 是否展开         |
+| selectable | `boolean \| undefined`          | 否   | —      | 可选择           |
+| selected   | `boolean \| undefined`          | 否   | —      | 是否选中         |
+| icon       | `GeneralIconProps \| undefined` | 否   | —      | 节点图标         |
+| faded      | `boolean \| undefined`          | 否   | —      | 节点是否淡化显示 |
+
+## Events
+
+| 事件   | detail                                                    | 说明                |
+| ------ | --------------------------------------------------------- | ------------------- |
+| expand | `boolean` — 展开后的状态（true 表示展开，false 表示收起） | 节点展开/收起时触发 |
+| select | `void`                                                    | 节点被选中时触发    |
+
+## Slots
+
+| 名称     | 说明         |
+| -------- | ------------ |
+| label    | 节点标签内容 |
+| suffix   | 节点后缀内容 |
+| （默认） | 子节点内容   |
 
 ## Examples
 
 ### Basic
 
+展示包含标签和后缀内容的可展开目录树节点。
+
 ```yaml preview
 brick: eo-directory-tree-internal-node
 events:
@@ -49,6 +87,8 @@ children:
 
 ### Selectable
 
+展示节点可选中的目录树节点，支持独立点击展开和选中。
+
 ```yaml preview
 brick: eo-directory-tree-internal-node
 events:
@@ -96,3 +136,34 @@ children:
         properties:
           textContent: 第二层级-3
 ```
+
+### With Icon
+
+展示带有节点图标的目录树中间节点，以及 faded 淡化状态效果。
+
+```yaml preview
+brick: eo-directory-tree-internal-node
+properties:
+  style:
+    width: 200px
+  icon:
+    lib: antd
+    icon: folder
+    theme: outlined
+  expanded: true
+  selected: true
+  faded: false
+children:
+  - brick: span
+    slot: label
+    properties:
+      textContent: 文件夹节点
+  - brick: eo-directory-tree-leaf
+    properties:
+      depth: 1
+      faded: true
+    children:
+      - brick: span
+        properties:
+          textContent: 子文件1（淡化）
+```

package/docs/eo-directory-tree-internal-node.react.md

@@ -0,0 +1,116 @@
+---
+tagName: eo-directory-tree-internal-node
+displayName: WrappedEoDirectoryTreeInternalNode
+description: 目录树中间节点
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedEoDirectoryTreeInternalNode
+
+> 目录树中间节点
+
+## 导入
+
+```tsx
+import { WrappedEoDirectoryTreeInternalNode } from "@easyops/wrapped-components";
+```
+
+## Props
+
+| 属性       | 类型                            | 必填 | 默认值 | 说明             |
+| ---------- | ------------------------------- | ---- | ------ | ---------------- |
+| depth      | `number`                        | 是   | `0`    | 深度             |
+| expanded   | `boolean \| undefined`          | 否   | —      | 是否展开         |
+| selectable | `boolean \| undefined`          | 否   | —      | 可选择           |
+| selected   | `boolean \| undefined`          | 否   | —      | 是否选中         |
+| icon       | `GeneralIconProps \| undefined` | 否   | —      | 节点图标         |
+| faded      | `boolean \| undefined`          | 否   | —      | 节点是否淡化显示 |
+
+## Events
+
+| 事件     | detail                                                    | 说明                |
+| -------- | --------------------------------------------------------- | ------------------- |
+| onExpand | `boolean` — 展开后的状态（true 表示展开，false 表示收起） | 节点展开/收起时触发 |
+| onSelect | `void`                                                    | 节点被选中时触发    |
+
+## Slots
+
+| 名称     | 说明         |
+| -------- | ------------ |
+| label    | 节点标签内容 |
+| suffix   | 节点后缀内容 |
+| （默认） | 子节点内容   |
+
+## Examples
+
+### Basic
+
+展示包含标签和后缀内容的可展开目录树节点。
+
+```tsx
+<WrappedEoDirectoryTreeInternalNode
+  style={{ width: 200 }}
+  onExpand={(e) => console.log(e.detail)}
+>
+  <span slot="label">第一层级</span>
+  <WrappedEoTag slot="suffix" color="red">
+    suffixBrick
+  </WrappedEoTag>
+  <WrappedEoDirectoryTreeLeaf depth={1}>
+    <span>第二层级-1</span>
+  </WrappedEoDirectoryTreeLeaf>
+  <WrappedEoDirectoryTreeLeaf depth={1}>
+    <span>第二层级-2</span>
+  </WrappedEoDirectoryTreeLeaf>
+  <WrappedEoDirectoryTreeLeaf depth={1}>
+    <span>第二层级-3</span>
+  </WrappedEoDirectoryTreeLeaf>
+</WrappedEoDirectoryTreeInternalNode>
+```
+
+### Selectable
+
+展示节点可选中的目录树节点，支持独立点击展开和选中。
+
+```tsx
+<WrappedEoDirectoryTreeInternalNode
+  style={{ width: 200 }}
+  selectable={true}
+  onExpand={(e) => console.log(e.detail)}
+  onSelect={(e) => console.log(e.detail)}
+>
+  <span slot="label">第一层级</span>
+  <WrappedEoTag slot="suffix" color="red">
+    suffixBrick
+  </WrappedEoTag>
+  <WrappedEoDirectoryTreeLeaf depth={1}>
+    <span>第二层级-1</span>
+  </WrappedEoDirectoryTreeLeaf>
+  <WrappedEoDirectoryTreeLeaf depth={1}>
+    <span>第二层级-2</span>
+  </WrappedEoDirectoryTreeLeaf>
+  <WrappedEoDirectoryTreeLeaf depth={1}>
+    <span>第二层级-3</span>
+  </WrappedEoDirectoryTreeLeaf>
+</WrappedEoDirectoryTreeInternalNode>
+```
+
+### With Icon
+
+展示带有节点图标的目录树中间节点，以及 faded 淡化状态效果。
+
+```tsx
+<WrappedEoDirectoryTreeInternalNode
+  style={{ width: 200 }}
+  icon={{ lib: "antd", icon: "folder", theme: "outlined" }}
+  expanded={true}
+  selected={true}
+  faded={false}
+>
+  <span slot="label">文件夹节点</span>
+  <WrappedEoDirectoryTreeLeaf depth={1} faded={true}>
+    <span>子文件1（淡化）</span>
+  </WrappedEoDirectoryTreeLeaf>
+</WrappedEoDirectoryTreeInternalNode>
+```

package/docs/eo-directory-tree-leaf.md

@@ -1,9 +1,43 @@
-目录树叶子节点
+---
+tagName: eo-directory-tree-leaf
+displayName: WrappedEoDirectoryTreeLeaf
+description: 目录树叶子节点
+category: ""
+source: "@next-bricks/nav"
+---
+
+# eo-directory-tree-leaf
+
+> 目录树叶子节点
+
+## Props
+
+| 属性     | 类型                            | 必填 | 默认值 | 说明             |
+| -------- | ------------------------------- | ---- | ------ | ---------------- |
+| depth    | `number`                        | 是   | `0`    | 深度             |
+| selected | `boolean \| undefined`          | 否   | —      | 是否选中         |
+| icon     | `GeneralIconProps \| undefined` | 否   | —      | 节点图标         |
+| faded    | `boolean \| undefined`          | 否   | —      | 节点是否淡化显示 |
+
+## Events
+
+| 事件   | detail | 说明             |
+| ------ | ------ | ---------------- |
+| select | `void` | 节点被选中时触发 |
+
+## Slots
+
+| 名称     | 说明         |
+| -------- | ------------ |
+| （默认） | 节点标签内容 |
+| suffix   | 节点后缀内容 |
 
 ## Examples
 
 ### Basic
 
+展示基础叶子节点，包含标签和后缀内容，点击可触发选择事件。
+
 ```yaml preview
 brick: eo-directory-tree-leaf
 events:
@@ -22,3 +56,50 @@ children:
       textContent: suffixBrick
       color: red
 ```
+
+### With Icon
+
+展示带有节点图标的叶子节点。
+
+```yaml preview
+brick: eo-directory-tree-leaf
+events:
+  select:
+    - action: console.log
+      args:
+        - <% EVENT.detail %>
+properties:
+  style:
+    width: 200px
+  icon:
+    lib: antd
+    icon: file
+    theme: outlined
+  selected: true
+children:
+  - brick: span
+    properties:
+      textContent: 文件节点
+  - brick: eo-tag
+    slot: suffix
+    properties:
+      textContent: 已选中
+      color: green
+```
+
+### Faded State
+
+展示淡化显示的叶子节点，用于表示禁用或不可用状态。
+
+```yaml preview
+brick: eo-directory-tree-leaf
+properties:
+  style:
+    width: 200px
+  faded: true
+  depth: 0
+children:
+  - brick: span
+    properties:
+      textContent: 淡化节点
+```