@next-bricks/nav 1.26.2 → 1.26.4

package/docs/launchpad-config.react.md

@@ -0,0 +1,161 @@
+---
+tagName: nav.launchpad-config
+displayName: WrappedNavLaunchpadConfig
+description: 进行 Launchpad 配置。也可用于菜单自定义显示产品功能清单。
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedNavLaunchpadConfig
+
+> 进行 Launchpad 配置。也可用于菜单自定义显示产品功能清单。
+
+## 导入
+
+```tsx
+import { WrappedNavLaunchpadConfig } from "@easyops/wrapped-components";
+```
+
+## Props
+
+| 属性              | 类型                             | 必填 | 默认值               | 说明                                                                                                                                        |
+| ----------------- | -------------------------------- | ---- | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
+| menuGroups        | `ConfigMenuGroup[] \| undefined` | 否   | —                    | Launchpad 配置菜单分组数据                                                                                                                  |
+| actions           | `MenuAction[] \| undefined`      | 否   | —                    | 菜单操作按钮配置列表                                                                                                                        |
+| variant           | `ConfigVariant \| undefined`     | 否   | `"launchpad-config"` | 显示变体：launchpad-config（Launchpad 配置）、factory-launchpad-config（工厂配置）、menu-config（菜单配置）、blacklist-config（黑名单配置） |
+| urlTemplate       | `string \| undefined`            | 否   | —                    | 菜单项 APP 类型的链接模板，例如可配置为 `/app/{{ id }}`。注：仅用于 variant: "menu-config"                                                  |
+| customUrlTemplate | `string \| undefined`            | 否   | —                    | 菜单项自定义类型的链接模板，例如可配置为 `/custom?url={{ __pathname }}`。注：仅用于 variant: "menu-config"。外链菜单链接会设置为禁用        |
+| blacklist         | `string[] \| undefined`          | 否   | —                    | 屏蔽的 URL 列表，例如可配置为 `["/app/1", "/app/2"]`。注：仅用于 variant: "blacklist-config"                                                |
+
+## Events
+
+| 事件            | detail                                                                                   | 说明                   |
+| --------------- | ---------------------------------------------------------------------------------------- | ---------------------- |
+| onMenuItemClick | `ConfigMenuItemNormal` — 被点击的菜单项数据（app 或 custom 类型）                        | 点击菜单项时触发       |
+| onActionClick   | `MenuActionEventDetail` — { data: 操作关联的菜单项或分组, action: 被点击的操作按钮配置 } | 点击菜单操作按钮时触发 |
+
+## Examples
+
+### Launchpad Config
+
+展示 Launchpad 配置视图，列出可用的菜单分组及应用。
+
+```tsx
+<WrappedNavLaunchpadConfig
+  variant="launchpad-config"
+  menuGroups={[
+    {
+      id: "group1",
+      instanceId: "g1",
+      name: "运维工具",
+      items: [
+        {
+          id: "app1",
+          instanceId: "a1",
+          type: "app",
+          name: "监控中心",
+          url: "/next/monitor",
+        },
+        {
+          id: "app2",
+          instanceId: "a2",
+          type: "app",
+          name: "告警中心",
+          url: "/next/alert",
+        },
+      ],
+    },
+    {
+      id: "group2",
+      instanceId: "g2",
+      name: "资源管理",
+      items: [
+        {
+          id: "app3",
+          instanceId: "a3",
+          type: "app",
+          name: "服务器管理",
+          url: "/next/host",
+        },
+      ],
+    },
+  ]}
+  onMenuItemClick={(e) => console.log(e.detail)}
+/>
+```
+
+### Menu Config Variant
+
+以菜单配置模式展示，使用 urlTemplate 自定义菜单项链接。
+
+```tsx
+<WrappedNavLaunchpadConfig
+  variant="menu-config"
+  urlTemplate="/app/{{ id }}"
+  menuGroups={[
+    {
+      id: "group1",
+      instanceId: "g1",
+      name: "运维工具",
+      items: [
+        {
+          id: "app1",
+          instanceId: "a1",
+          type: "app",
+          name: "监控中心",
+          url: "/next/monitor",
+        },
+        {
+          id: "custom1",
+          instanceId: "c1",
+          type: "custom",
+          name: "外部链接",
+          url: "https://example.com",
+        },
+      ],
+    },
+  ]}
+  onMenuItemClick={(e) => console.log(e.detail)}
+/>
+```
+
+### Blacklist Config
+
+以黑名单配置模式展示，通过 blacklist 指定屏蔽的 URL 列表。
+
+```tsx
+<WrappedNavLaunchpadConfig
+  variant="blacklist-config"
+  blacklist={["/monitor", "/alert"]}
+  menuGroups={[
+    {
+      id: "group1",
+      instanceId: "g1",
+      name: "运维工具",
+      items: [
+        {
+          id: "app1",
+          instanceId: "a1",
+          type: "app",
+          name: "监控中心",
+          url: "/next/monitor",
+        },
+        {
+          id: "app2",
+          instanceId: "a2",
+          type: "app",
+          name: "告警中心",
+          url: "/next/alert",
+        },
+        {
+          id: "app3",
+          instanceId: "a3",
+          type: "app",
+          name: "服务器管理",
+          url: "/next/host",
+        },
+      ],
+    },
+  ]}
+/>
+```

package/docs/nav-logo.md

@@ -1,9 +1,21 @@
-导航栏图标
+---
+tagName: nav.nav-logo
+displayName: WrappedNavNavLogo
+description: 导航栏图标
+category: ""
+source: "@next-bricks/nav"
+---
+
+# nav.nav-logo
+
+> 导航栏图标
 
 ## Examples
 
 ### Basic
 
-```html preview
-<nav.nav-logo>Hello world</nav.nav-logo>
+展示导航栏图标的基本用法，自动读取品牌设置决定显示自定义 logo 图片或 EasyOps 默认图标，并根据品牌设置决定是否包裹链接。
+
+```yaml preview
+brick: nav.nav-logo
 ```

package/docs/nav-logo.react.md

@@ -0,0 +1,27 @@
+---
+tagName: nav.nav-logo
+displayName: WrappedNavNavLogo
+description: 导航栏图标
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedNavNavLogo
+
+> 导航栏图标
+
+## 导入
+
+```tsx
+import { WrappedNavNavLogo } from "@easyops/wrapped-components";
+```
+
+## Examples
+
+### Basic
+
+展示导航栏图标的基本用法，自动读取品牌设置决定显示自定义 logo 图片或 EasyOps 默认图标，并根据品牌设置决定是否包裹链接。
+
+```tsx
+<WrappedNavNavLogo />
+```

package/docs/poll-announce.md

@@ -1,9 +1,35 @@
-导航栏图标
+---
+tagName: nav.poll-announce
+displayName: WrappedNavPollAnnounce
+description: 轮询获取通知消息并展示，从 v2 构件 `nav-legacy.poll-announce` 迁移而来
+category: ""
+source: "@next-bricks/nav"
+---
+
+# nav.poll-announce
+
+> 轮询获取通知消息并展示，从 v2 构件 `nav-legacy.poll-announce` 迁移而来
+
+## Props
+
+| 属性            | 类型      | 必填 | 默认值 | 说明                                                                                                                                                      |
+| --------------- | --------- | ---- | ------ | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| pollEnabled     | `boolean` | 否   | -      | 是否启用轮询。启用时将不断轮询通知列表接口；未启用时通过 `realTimeMessage` 属性传入实时通知消息（注意：v2 构件该属性名为 `pollDisabled`，迁移时已重命名） |
+| realTimeMessage | `Message` | 否   | -      | 实时通知消息（通常通过 WebSocket 消息得到），仅在 `pollEnabled` 为 `false` 时生效                                                                         |
+
+## Events
+
+| 事件               | detail | 说明                                     |
+| ------------------ | ------ | ---------------------------------------- |
+| notification.close | `void` | 通知框关闭后，调用忽略通知接口完成后触发 |
+| notification.open  | `void` | 轮询得到新的通知时触发                   |
 
 ## Examples
 
 ### Basic
 
+通过 `realTimeMessage` 属性传入实时通知消息并展示通知弹窗。
+
 ```yaml preview minHeight="500px"
 brick: nav.poll-announce
 properties:
@@ -21,3 +47,22 @@ events:
     args:
       - notification.close
 ```
+
+### 启用轮询模式
+
+启用轮询时，构件将持续调用通知接口并在有新通知时自动弹出。
+
+```yaml preview
+brick: nav.poll-announce
+properties:
+  pollEnabled: true
+events:
+  notification.open:
+    action: console.log
+    args:
+      - notification.open
+  notification.close:
+    action: console.log
+    args:
+      - notification.close
+```

package/docs/poll-announce.react.md

@@ -0,0 +1,61 @@
+---
+tagName: nav.poll-announce
+displayName: WrappedNavPollAnnounce
+description: 轮询获取通知消息并展示，从 v2 构件 `nav-legacy.poll-announce` 迁移而来
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedNavPollAnnounce
+
+> 轮询获取通知消息并展示，从 v2 构件 `nav-legacy.poll-announce` 迁移而来
+
+## 导入
+
+```tsx
+import { WrappedNavPollAnnounce } from "@easyops/wrapped-components";
+```
+
+## Props
+
+| 属性            | 类型      | 必填 | 默认值 | 说明                                                                                                                                                      |
+| --------------- | --------- | ---- | ------ | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| pollEnabled     | `boolean` | 否   | -      | 是否启用轮询。启用时将不断轮询通知列表接口；未启用时通过 `realTimeMessage` 属性传入实时通知消息（注意：v2 构件该属性名为 `pollDisabled`，迁移时已重命名） |
+| realTimeMessage | `Message` | 否   | -      | 实时通知消息（通常通过 WebSocket 消息得到），仅在 `pollEnabled` 为 `false` 时生效                                                                         |
+
+## Events
+
+| 事件                | detail | 说明                                     |
+| ------------------- | ------ | ---------------------------------------- |
+| onNotificationClose | `void` | 通知框关闭后，调用忽略通知接口完成后触发 |
+| onNotificationOpen  | `void` | 轮询得到新的通知时触发                   |
+
+## Examples
+
+### Basic
+
+通过 `realTimeMessage` 属性传入实时通知消息并展示通知弹窗。
+
+```tsx
+<WrappedNavPollAnnounce
+  realTimeMessage={{
+    title: "Hello",
+    data: "World",
+    instanceId: "docs-basic",
+  }}
+  onNotificationOpen={(e) => console.log("notification.open")}
+  onNotificationClose={(e) => console.log("notification.close")}
+/>
+```
+
+### 启用轮询模式
+
+启用轮询时，构件将持续调用通知接口并在有新通知时自动弹出。
+
+```tsx
+<WrappedNavPollAnnounce
+  pollEnabled={true}
+  onNotificationOpen={(e) => console.log("notification.open")}
+  onNotificationClose={(e) => console.log("notification.close")}
+/>
+```

package/docs/query-search.md

@@ -1,9 +1,21 @@
-构件 `nav.query-search`
+---
+tagName: nav.query-search
+displayName: WrappedNavQuerySearch
+description: 综合搜索入口，支持全文检索、IP 搜索、工单搜索等多种查询模式，带搜索历史记录功能
+category: ""
+source: "@next-bricks/nav"
+---
+
+# nav.query-search
+
+> 综合搜索入口，支持全文检索、IP 搜索、工单搜索等多种查询模式，带搜索历史记录功能
 
 ## Examples
 
 ### Basic
 
+在导航栏右侧嵌入综合搜索入口，点击搜索图标展开输入框，支持切换查询类型和显示搜索历史。
+
 ```yaml preview
 brick: div
 properties:

package/docs/query-search.react.md

@@ -0,0 +1,34 @@
+---
+tagName: nav.query-search
+displayName: WrappedNavQuerySearch
+description: 综合搜索入口，支持全文检索、IP 搜索、工单搜索等多种查询模式，带搜索历史记录功能
+category: ""
+source: "@next-bricks/nav"
+---
+
+# WrappedNavQuerySearch
+
+> 综合搜索入口，支持全文检索、IP 搜索、工单搜索等多种查询模式，带搜索历史记录功能
+
+## 导入
+
+```tsx
+import { WrappedNavQuerySearch } from "@easyops/wrapped-components";
+```
+
+## Examples
+
+### Basic
+
+在导航栏右侧嵌入综合搜索入口，点击搜索图标展开输入框，支持切换查询类型和显示搜索历史。
+
+```tsx
+<div style={{ display: "flex", justifyContent: "space-between" }}>
+  <div style={{ background: "red", width: "100px" }} />
+  <div style={{ display: "flex" }}>
+    <WrappedNavQuerySearch />
+    <WrappedEoButton>通知</WrappedEoButton>
+    <WrappedEoButton>告警</WrappedEoButton>
+  </div>
+</div>
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next-bricks/nav",
-  "version": "1.26.2",
+  "version": "1.26.4",
   "homepage": "https://github.com/easyops-cn/next-advanced-bricks/tree/master/bricks/nav",
   "repository": {
     "type": "git",
@@ -45,5 +45,5 @@
     "@next-bricks/form": "*",
     "@next-bricks/icons": "*"
   },
-  "gitHead": "05d4356da9750c48907695311954ec115fce211d"
+  "gitHead": "5b81f1a9d385dac35b2502ead1ab93168309cd2f"
 }