@next-bricks/data-view 1.12.11 → 1.12.13

package/dist-types/app-wall/card-item/index.d.ts

@@ -8,6 +8,7 @@ export interface AppWallCardItemProps {
 /**
  * 应用墙子构件----卡片项
  * @author nlicroshan
+ * @category big-screen-layout
  */
 declare class AppWallCardItem extends ReactNextElement implements AppWallCardItemProps {
     /**

package/dist-types/app-wall/relation-line/index.d.ts

@@ -6,13 +6,11 @@ export interface AppWallRelationLineProps {
 /**
  * 应用墙子构件----关联连线
  * @author nlicroshan
+ * @category big-screen-layout
  */
 declare class AppWallRelationLine extends ReactNextElement implements AppWallRelationLineProps {
     /**
-     * @kind "blue" | "purple"
-     * @required false
-     * @default "blue"
-     * @description 光线颜色
+     * 光线颜色
      */
     accessor lightColor: "blue" | "purple";
     render(): React.JSX.Element;

package/dist-types/app-wall/system-card/index.d.ts

@@ -16,52 +16,28 @@ export interface SystemCardProps {
 /**
  * 应用墙系统卡片
  * @author astrid
+ * @category big-screen-layout
  */
 declare class SystemCard extends ReactNextElement implements SystemCardProps {
     #private;
     /**
-     * @kind StatusType
-     * @required true
-     * @default normal
-     * @description 卡片状态
-     * @enums
-     * @group basic
+     * 卡片状态
      */
     accessor status: StatusType;
     /**
-     * @kind string
-     * @required -
-     * @default -
-     * @description 卡片标题
-     * @enums
-     * @group basic
+     * 卡片标题
      */
     accessor cardTitle: string | undefined;
     /**
-     * @kind DescriptionItem[]
-     * @required false
-     * @default -
-     * @description 卡片信息数据
-     * @enums
-     * @group basic
+     * 卡片信息数据
      */
     accessor itemList: DescriptionItem[];
     /**
-     * @kind string
-     * @required -
-     * @default -
-     * @description 按钮名称
-     * @enums
-     * @group basic
+     * 按钮名称
      */
     accessor buttonName: string | undefined;
     /**
-     * @kind React.CSSProperties
-     * @required -
-     * @default -
-     * @description 外层容器样式
-     * @enums
-     * @group basic
+     * 外层容器样式
      */
     accessor containerStyle: React.CSSProperties;
     handleClick: () => void;

package/dist-types/basic-index-group/index.d.ts

@@ -12,6 +12,7 @@ export interface ItemProps {
 /**
  * 基础指标组构件
  * @author annzhang
+ * @category big-screen-content
  */
 declare class BasicIndexGroup extends ReactNextElement {
     /**

package/dist-types/battery-chart/index.d.ts

@@ -18,41 +18,28 @@ interface BatteryChartChartProps {
  * 大屏电池
  * @author astrid
  * @category big-screen-content
+ * @slot - 电池右侧内容插槽，可放置标题和数据信息
+ * @slot left - 电池左侧阈值线附近内容插槽
  */
 declare class BatteryChart extends ReactNextElement implements BatteryChartChartProps {
     /**
-     * @kind number
-     * @default -
-     * @required false
-     * @description 值, 默认范围在[0-100], 但是范围还可通过 thresholdColors 来改变，将取第一个和最后一个值作为范围
+     * 值，默认范围在 [0-100]，范围还可通过 thresholdColors 来改变，将取第一个和最后一个配置项的值作为区间
      */
     accessor value: number;
     /**
-     * @kind  number
-     * @default  38
-     * @required false
-     * @description 电池的宽度
+     * 电池的宽度
      */
     accessor batteryWidth: number;
     /**
-     * @kind  number
-     * @default  58
-     * @required false
-     * @description 电池的高度
+     * 电池的高度
      */
     accessor batteryHeight: number;
     /**
-     * @kind  ThresholdColor[]
-     * @default  -
-     * @required false
-     * @description 阈值范围以及颜色的配置；
+     * 阈值范围以及颜色的配置
      */
     accessor thresholdColors: ThresholdColor[];
     /**
-     * @kind  number
-     * @default  50
-     * @required false
-     * @description 阈值刻度线
+     * 阈值刻度线
      */
     accessor thresholdValue: number;
     render(): React.ReactNode;

package/dist-types/brick-notification/index.d.ts

@@ -1,15 +1,15 @@
 import React from "react";
 import { ReactNextElement } from "@next-core/react-element";
 import type { GeneralIconProps } from "@next-bricks/icons/general-icon";
+interface BrickNotificationProps {
+    message: string;
+    icon?: GeneralIconProps | undefined;
+}
 /**
  * 大屏提示构件
  * @author astrid
  * @category big-screen-content
  */
-interface BrickNotificationProps {
-    message: string;
-    icon?: GeneralIconProps | undefined;
-}
 declare class BrickNotification extends ReactNextElement implements BrickNotificationProps {
     /**
      * 提示内容

package/dist-types/bubbles-indicator/index.d.ts

@@ -22,6 +22,7 @@ export interface CornerDataItem extends DataItem {
 }
 /**
  * 气泡样式的数据展示构件。
+ * @category big-screen-content
  */
 export declare class BubblesIndicator extends ReactNextElement implements BubblesIndicatorProps {
     /** 指标数据列表（显示在环上）

package/dist-types/cabinet/cabinet-app-layer/index.d.ts

@@ -7,20 +7,15 @@ export interface CabinetAppLayerProps {
 /**
  * cabinet子构件----应用层
  * @author nlicroshan
+ * @category big-screen-content
  */
 declare class CabinetAppLayer extends ReactNextElement implements CabinetAppLayerProps {
     /**
-     * @kind string
-     * @required true
-     * @default
-     * @description 标题
+     * 标题
      */
     accessor appTitle: string;
     /**
-     * @kind "active" | "faded"
-     * @required false
-     * @default
-     * @description 当前状态
+     * 当前状态
      */
     accessor status: "active" | "faded";
     render(): React.JSX.Element;

package/dist-types/cabinet/index.d.ts

@@ -34,24 +34,15 @@ export interface CabinetGraphProps {
 declare class CabinetGraph extends ReactNextElement implements CabinetGraphProps {
     #private;
     /**
-     * @kind AppData
-     * @required true
-     * @default
-     * @description 数据源
+     * 数据源
      */
     accessor dataSource: AppData;
     /**
-     * @kind string |string[]
-     * @required false
-     * @default
-     * @description 选中项， 支持数组
+     * 选中项，支持数组
      */
     accessor activeKey: string | string[];
     /**
-     * @kind boolean
-     * @required false
-     * @default true
-     * @description 取消按钮是否需要展示
+     * 取消按钮是否需要展示
      */
     accessor hiddenCloseBtn: boolean;
     render(): React.JSX.Element;

package/dist-types/china-map/index.d.ts

@@ -15,7 +15,7 @@ export interface DataItem {
     text: string;
 }
 /**
- * 构件 `data-view.china-map`
+ * 中国地图展示构件，支持全国地图和省级地图，可在地图上标注文字标签
  */
 export declare class ChinaMap extends ReactNextElement implements ChinaMapProps {
     /**

package/dist-types/globe-with-gear-indicator/index.d.ts

@@ -18,6 +18,8 @@ export interface CornerDataItem extends DataItem {
 }
 /**
  * 地球加轮盘的数据展示构件。
+ * @author astrid
+ * @category big-screen-content
  */
 export declare class GlobeWithGearIndicator extends ReactNextElement implements GlobeWithGearIndicatorProps {
     /** 指标数据列表（显示在环上）

package/dist-types/globe-with-halo-indicator/index.d.ts

@@ -17,6 +17,8 @@ export interface CornerDataItem extends DataItem {
 }
 /**
  * 地球加光环的数据展示构件。
+ * @author astrid
+ * @category big-screen-content
  */
 export declare class GlobeWithHaloIndicator extends ReactNextElement implements GlobeWithHaloIndicatorProps {
     /**

package/dist-types/globe-with-orbit-indicator/index.d.ts

@@ -18,6 +18,8 @@ export interface CornerDataItem extends DataItem {
 }
 /**
  * 地球加轨道的数据展示构件。
+ * @author astrid
+ * @category big-screen-content
  */
 export declare class GlobeWithOrbitIndicator extends ReactNextElement implements GlobeWithOrbitIndicatorProps {
     /**

package/dist-types/lights-component-title/index.d.ts

@@ -5,7 +5,7 @@ interface LightsComponentTitleProps {
     theme: "light" | "dark";
 }
 /**
- * 构件 `data-view.lights-component-title`
+ * 大屏灯光风格组件标题
  * @author astrid
  * @category big-screen-content
  */
@@ -16,9 +16,9 @@ export declare class LightsComponentTitle extends ReactNextElement implements Li
      */
     accessor componentTitle: string;
     /**
-     * @default
-     * @required
-     * @description
+     * 主题风格，`light` 为浅色光标图标，`dark` 为深色光标图标
+     * @default "light"
+     * @required false
      */
     accessor theme: "light" | "dark";
     render(): React.JSX.Element;

package/dist-types/modern-style-treemap/index.d.ts

@@ -1,6 +1,6 @@
 import React, { CSSProperties } from "react";
 import { ReactNextElement } from "@next-core/react-element";
-import type { UseBrickConf } from "@next-core/types";
+import type { UseBrickConfOrRenderFunction } from "@next-core/react-runtime";
 declare enum TailTypes {
     treemapBinary = "treemapBinary",
     treemapDice = "treemapDice",
@@ -18,11 +18,11 @@ interface ModernStyleTreemapProps {
     data: TreemapData;
     tail?: TailTypes;
     leafUseBrick?: {
-        useBrick: UseBrickConf;
+        useBrick: UseBrickConfOrRenderFunction;
     };
     leafContainerStyle?: CSSProperties;
     tooltipUseBrick?: {
-        useBrick: UseBrickConf;
+        useBrick: UseBrickConfOrRenderFunction;
     };
     tooltipStyle?: CSSProperties;
     handleClick?: (value: TreemapData) => void;
@@ -49,13 +49,13 @@ declare class ModernStyleTreemap extends ReactNextElement implements ModernStyle
      */
     accessor tail: TailTypes;
     /**
-     * @kind { useBrick: UseBrickConf }
+     * @kind { useBrick: UseBrickConfOrRenderFunction }
      * @required false
      * @default -
      * @description 叶子节点useBrick
      */
     accessor leafUseBrick: {
-        useBrick: UseBrickConf;
+        useBrick: UseBrickConfOrRenderFunction;
     };
     /**
      * @kind CSSProperties
@@ -65,13 +65,13 @@ declare class ModernStyleTreemap extends ReactNextElement implements ModernStyle
      */
     accessor leafContainerStyle: CSSProperties;
     /**
-     * @kind { useBrick: UseBrickConf }
+     * @kind { useBrick: UseBrickConfOrRenderFunction }
      * @required false
      * @default -
      * @description tooltip useBrick
      */
     accessor tooltipUseBrick: {
-        useBrick: UseBrickConf;
+        useBrick: UseBrickConfOrRenderFunction;
     };
     /**
      * @kind CSSProperties

package/dist-types/progress-bar-list/index.d.ts

@@ -2,13 +2,15 @@ import React, { CSSProperties } from "react";
 import { ReactNextElement } from "@next-core/react-element";
 import "@next-core/theme";
 /**
- * 构件 `data-view.progress-bar-list`
+ * 大屏进度条列表
+ * @author nlicroshan
+ * @category big-screen-content
  */
 export declare class ProgressBarList extends ReactNextElement {
     /**
-     * @default
-     * @required
-     * @description 数据
+     * @default []
+     * @required false
+     * @description 数据列表，每项包含标题、数值及可选的进度条颜色配置
      */
     accessor dataSource: Data[];
     render(): React.JSX.Element;

package/dist-types/tabs-page-title/index.d.ts

@@ -14,7 +14,7 @@ interface TabsPageTitleProps {
 /**
  * 带有tabs的标题构件
  * @author astrid
- * @slot - 标题
+ * @slot - 默认插槽，用于放置标题内容
  * @slot start - 顶部左边插槽
  * @slot end - 顶部右边插槽
  * @slot [key] - 标签对应的key的插槽

package/dist-types/tech-mesh-base-view/index.d.ts

@@ -4,7 +4,8 @@ import "@next-core/theme";
 /**
  * 大屏框架构件-网格纹
  * @author jiezhou
- * @slot - 页面内容
+ * @slot titleBar - 标题栏插槽
+ * @slot content - 页面内容插槽
  * @category big-screen-layout
  */
 export declare class TechMeshBaseView extends ReactNextElement {

package/docs/app-wall-card-item.md

@@ -1,9 +1,29 @@
-应用墙小卡片
+---
+tagName: data-view.app-wall-card-item
+displayName: WrappedDataViewAppWallCardItem
+description: 应用墙子构件----卡片项
+category: big-screen-layout
+source: "@next-bricks/data-view"
+---
+
+# data-view.app-wall-card-item
+
+> 应用墙子构件----卡片项
+
+## Props
+
+| 属性        | 类型                    | 必填 | 默认值     | 说明 |
+| ----------- | ----------------------- | ---- | ---------- | ---- |
+| status      | `"normal" \| "warning"` | 否   | `"normal"` | 状态 |
+| cardTitle   | `string`                | 是   | -          | 标题 |
+| description | `string`                | 是   | -          | 描述 |
 
 ## Examples
 
 ### Basic
 
+展示应用墙卡片项的基本用法。
+
 ```yaml preview
 - brick: data-view.app-wall-card-item
   properties:
@@ -16,6 +36,8 @@
 
 ### Status
 
+展示不同状态下的应用墙卡片项。
+
 ```yaml preview
 - brick: data-view.app-wall-card-item
   properties:

package/docs/app-wall-card-item.react.md

@@ -0,0 +1,52 @@
+---
+tagName: data-view.app-wall-card-item
+displayName: WrappedDataViewAppWallCardItem
+description: 应用墙子构件----卡片项
+category: big-screen-layout
+source: "@next-bricks/data-view"
+---
+
+# WrappedDataViewAppWallCardItem
+
+> 应用墙子构件----卡片项
+
+## 导入
+
+```tsx
+import { WrappedDataViewAppWallCardItem } from "@easyops/wrapped-components";
+```
+
+## Props
+
+| 属性        | 类型                    | 必填 | 默认值     | 说明 |
+| ----------- | ----------------------- | ---- | ---------- | ---- |
+| status      | `"normal" \| "warning"` | 否   | `"normal"` | 状态 |
+| cardTitle   | `string`                | 是   | -          | 标题 |
+| description | `string`                | 是   | -          | 描述 |
+
+## Examples
+
+### Basic
+
+展示应用墙卡片项的基本用法。
+
+```tsx
+<WrappedDataViewAppWallCardItem
+  style={{ width: "100px", height: "120px" }}
+  cardTitle="pos"
+  description="店铺货管通"
+/>
+```
+
+### Status
+
+展示不同状态下的应用墙卡片项。
+
+```tsx
+<WrappedDataViewAppWallCardItem
+  style={{ width: "100px", height: "120px" }}
+  status="warning"
+  cardTitle="pos"
+  description="店铺货管通"
+/>
+```

package/docs/app-wall-relation-line.md

@@ -1,9 +1,27 @@
-应用墙流光线条
+---
+tagName: data-view.app-wall-relation-line
+displayName: WrappedDataViewAppWallRelationLine
+description: 应用墙子构件----关联连线
+category: big-screen-layout
+source: "@next-bricks/data-view"
+---
+
+# data-view.app-wall-relation-line
+
+> 应用墙子构件----关联连线
+
+## Props
+
+| 属性       | 类型                 | 必填 | 默认值   | 说明     |
+| ---------- | -------------------- | ---- | -------- | -------- |
+| lightColor | `"blue" \| "purple"` | 否   | `"blue"` | 光线颜色 |
 
 ## Examples
 
 ### Basic
 
+展示应用墙关联连线的基本用法及颜色效果。
+
 ```yaml preview
 - brick: data-view.app-wall-relation-line
   properties:

package/docs/app-wall-relation-line.react.md

@@ -0,0 +1,36 @@
+---
+tagName: data-view.app-wall-relation-line
+displayName: WrappedDataViewAppWallRelationLine
+description: 应用墙子构件----关联连线
+category: big-screen-layout
+source: "@next-bricks/data-view"
+---
+
+# WrappedDataViewAppWallRelationLine
+
+> 应用墙子构件----关联连线
+
+## 导入
+
+```tsx
+import { WrappedDataViewAppWallRelationLine } from "@easyops/wrapped-components";
+```
+
+## Props
+
+| 属性       | 类型                 | 必填 | 默认值   | 说明     |
+| ---------- | -------------------- | ---- | -------- | -------- |
+| lightColor | `"blue" \| "purple"` | 否   | `"blue"` | 光线颜色 |
+
+## Examples
+
+### Basic
+
+展示应用墙关联连线的基本用法及颜色效果。
+
+```tsx
+<WrappedDataViewAppWallRelationLine
+  style={{ height: "200px" }}
+  lightColor="purple"
+/>
+```

package/docs/app-wall-system-card.md

@@ -1,9 +1,37 @@
-系统卡片
+---
+tagName: data-view.app-wall-system-card
+displayName: WrappedDataViewAppWallSystemCard
+description: 应用墙系统卡片
+category: big-screen-layout
+source: "@next-bricks/data-view"
+---
+
+# data-view.app-wall-system-card
+
+> 应用墙系统卡片
+
+## Props
+
+| 属性           | 类型                  | 必填 | 默认值     | 说明         |
+| -------------- | --------------------- | ---- | ---------- | ------------ |
+| status         | `StatusType`          | 否   | `"normal"` | 卡片状态     |
+| cardTitle      | `string`              | 否   | -          | 卡片标题     |
+| itemList       | `DescriptionItem[]`   | 否   | -          | 卡片信息数据 |
+| buttonName     | `string`              | 否   | -          | 按钮名称     |
+| containerStyle | `React.CSSProperties` | 否   | -          | 外层容器样式 |
+
+## Events
+
+| 事件         | detail | 说明         |
+| ------------ | ------ | ------------ |
+| button-click | `void` | 按钮点击事件 |
 
 ## Examples
 
 ### Basic
 
+展示应用墙系统卡片的基本用法，包含标题、信息列表和按钮。
+
 ```yaml preview
 - brick: data-view.app-wall-system-card
   properties:
@@ -27,15 +55,20 @@
         value: 1、使用场景概述：财务应收和应付结算
     buttonName: 应用墙大屏
     style:
-      background: rgba(40, 46, 58, 100%)
+      background: "rgba(40, 46, 58, 100%)"
       box-shadow: "0 0 12px 2px rgba(80, 255, 255, 0.45), inset 0 0 22px 0 #20242A"
       border: "2px solid #50FFFF"
       overflow: hidden
       height: 400px
+  events:
+    button-click:
+      action: console.log
 ```
 
 ### Status
 
+展示 warning 状态下的系统卡片样式。
+
 ```yaml preview
 - brick: data-view.app-wall-system-card
   properties: