@koi-design/uxd-ui 12.1.36-beta.0

package/lib/components/InfoView/Cell.d.ts

@@ -0,0 +1,75 @@
+import type { PropType } from 'vue';
+import type { InfoViewCell, InfoViewCellTag } from './InfoView.type';
+declare const _default: import("vue").DefineComponent<{
+    tag: {
+        type: PropType<InfoViewCellTag>;
+        default: string;
+        validator: (v: string) => boolean;
+    };
+    prefixCls: {
+        type: StringConstructor;
+        default: string;
+    };
+    cell: {
+        type: PropType<InfoViewCell>;
+        required: true;
+    };
+    data: {
+        type: ObjectConstructor;
+        required: true;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    span: {
+        type: NumberConstructor;
+        default: number;
+    };
+    colon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {
+    renderLabel: () => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[];
+    renderContent: () => any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    tag: {
+        type: PropType<InfoViewCellTag>;
+        default: string;
+        validator: (v: string) => boolean;
+    };
+    prefixCls: {
+        type: StringConstructor;
+        default: string;
+    };
+    cell: {
+        type: PropType<InfoViewCell>;
+        required: true;
+    };
+    data: {
+        type: ObjectConstructor;
+        required: true;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    span: {
+        type: NumberConstructor;
+        default: number;
+    };
+    colon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    type: string;
+    span: number;
+    tag: InfoViewCellTag;
+    prefixCls: string;
+    colon: boolean;
+}, {}>;
+export default _default;

package/lib/components/InfoView/Cell.js

@@ -0,0 +1,125 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var lodashUnified = require('lodash-unified');
+
+var Cell = vue.defineComponent({
+  name: "InfoViewCell",
+  props: {
+    tag: {
+      type: String,
+      default: "td",
+      validator: (v) => ["td", "th"].includes(v)
+    },
+    prefixCls: {
+      type: String,
+      default: ""
+    },
+    cell: {
+      type: Object,
+      required: true
+    },
+    data: {
+      type: Object,
+      required: true
+    },
+    type: {
+      type: String,
+      default: ""
+    },
+    span: {
+      type: Number,
+      default: 1
+    },
+    colon: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props) {
+    const renderLabel = () => {
+      const {
+        cell
+      } = props;
+      if (cell.labelRender) {
+        const {
+          labelRender,
+          render,
+          ...setting
+        } = cell;
+        return cell.labelRender({
+          setting
+        });
+      }
+      return cell.label;
+    };
+    const renderContent = () => {
+      const {
+        cell
+      } = props;
+      if (cell.render) {
+        const {
+          labelRender,
+          render,
+          ...setting
+        } = cell;
+        return cell.render({
+          data: props.data,
+          setting
+        });
+      }
+      if (cell.prop) {
+        return lodashUnified.get(props.data, cell.prop);
+      }
+      return "";
+    };
+    return {
+      renderLabel,
+      renderContent
+    };
+  },
+  render() {
+    const {
+      type,
+      tag,
+      span,
+      prefixCls,
+      colon,
+      renderLabel,
+      renderContent,
+      cell
+    } = this;
+    if (type === "item") {
+      return vue.createVNode(tag, {
+        "class": `${prefixCls}-item ${cell.className || ""}`,
+        "style": cell.style,
+        "colSpan": span
+      }, {
+        default: () => [vue.createVNode("span", {
+          "class": {
+            [`${prefixCls}-item-label`]: true,
+            [`${prefixCls}-item-label-colon`]: colon
+          }
+        }, [renderLabel()]), vue.createVNode("span", {
+          "class": `${prefixCls}-item-content`
+        }, [renderContent()])]
+      });
+    }
+    return vue.createVNode(tag, {
+      "class": {
+        [`${prefixCls}-item-${type}`]: true,
+        [`${prefixCls}-item-label-colon`]: type === "label" && colon,
+        [`${cell.className}`]: cell.className
+      },
+      "style": cell.style,
+      "colSpan": span
+    }, {
+      default: () => [type === "label" ? renderLabel() : renderContent()]
+    });
+  }
+});
+
+exports["default"] = Cell;
+//# sourceMappingURL=Cell.js.map

package/lib/components/InfoView/Cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.js","sources":["../../../../src/components/InfoView/Cell.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\nimport type { PropType } from 'vue';\nimport { get } from 'lodash-unified';\nimport type { InfoViewCell, InfoViewCellTag } from './InfoView.type';\n\nexport default defineComponent({\n  name: 'InfoViewCell',\n  props: {\n    tag: {\n      type: String as PropType<InfoViewCellTag>,\n      default: 'td',\n      validator: (v: string) => ['td', 'th'].includes(v)\n    },\n    prefixCls: {\n      type: String,\n      default: ''\n    },\n    cell: {\n      type: Object as PropType<InfoViewCell>,\n      required: true\n    },\n    data: {\n      type: Object,\n      required: true\n    },\n    type: {\n      type: String,\n      default: ''\n    },\n    span: {\n      type: Number,\n      default: 1\n    },\n    colon: {\n      type: Boolean,\n      default: false\n    }\n  },\n  setup(props) {\n    const renderLabel = () => {\n      const { cell } = props;\n      if (cell.labelRender) {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        const { labelRender, render, ...setting } = cell;\n        return cell.labelRender({ setting });\n      }\n      return cell.label;\n    };\n\n    const renderContent = () => {\n      const { cell } = props;\n      if (cell.render) {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        const { labelRender, render, ...setting } = cell;\n        return cell.render({ data: props.data, setting });\n      }\n      if (cell.prop) {\n        return get(props.data, cell.prop);\n      }\n      return '';\n    };\n\n    return {\n      renderLabel,\n      renderContent\n    };\n  },\n  render() {\n    const { type, tag, span, prefixCls, colon, renderLabel, renderContent, cell } = this;\n    if (type === 'item') {\n      return (\n        <tag class={`${prefixCls}-item ${cell.className || ''}`} style={cell.style} colSpan={span}>\n          <span\n            class={{\n              [`${prefixCls}-item-label`]: true,\n              [`${prefixCls}-item-label-colon`]: colon\n            }}\n          >\n            {renderLabel()}\n          </span>\n          <span class={`${prefixCls}-item-content`}>{renderContent()}</span>\n        </tag>\n      );\n    }\n    return (\n      <tag\n        class={{\n          [`${prefixCls}-item-${type}`]: true,\n          [`${prefixCls}-item-label-colon`]: type === 'label' && colon,\n          [`${cell.className}`]: cell.className\n        }}\n        style={cell.style}\n        colSpan={span}\n      >\n        {type === 'label' ? renderLabel() : renderContent()}\n      </tag>\n    );\n  }\n});\n"],"names":["defineComponent","name","props","tag","type","String","default","validator","v","includes","prefixCls","cell","Object","required","data","span","Number","colon","Boolean","setup","renderLabel","labelRender","render","setting","label","renderContent","prop","get","_createVNode","className","style"],"mappings":";;;;;;;AAKA,WAAeA,oBAAgB;AAAA,EAC7BC,MAAM;AAAA,EACNC,OAAO;AAAA,IACLC,KAAK;AAAA,MACHC,MAAMC;AAAAA,MACNC,SAAS;AAAA,MACTC,WAAYC,OAAc,CAAC,MAAM,IAAI,EAAEC,SAASD,CAAC;AAAA;AACnD,IACAE,WAAW;AAAA,MACTN,MAAMC;AAAAA,MACNC,SAAS;AAAA;AACX,IACAK,MAAM;AAAA,MACJP,MAAMQ;AAAAA,MACNC,UAAU;AAAA;AACZ,IACAC,MAAM;AAAA,MACJV,MAAMQ;AAAAA,MACNC,UAAU;AAAA;AACZ,IACAT,MAAM;AAAA,MACJA,MAAMC;AAAAA,MACNC,SAAS;AAAA;AACX,IACAS,MAAM;AAAA,MACJX,MAAMY;AAAAA,MACNV,SAAS;AAAA;AACX,IACAW,OAAO;AAAA,MACLb,MAAMc;AAAAA,MACNZ,SAAS;AAAA;AACX;AACF,EACAa,MAAMjB,OAAO;AACX,UAAMkB,cAAcA,MAAM;AACxB,YAAM;AAAA,QAAET;AAAAA,UAAST;AACjB,UAAIS,KAAKU,aAAa;AAEpB,cAAM;AAAA,UAAEA;AAAAA,UAAaC;AAAAA,aAAWC;AAAAA,YAAYZ;AAC5C,eAAOA,KAAKU,YAAY;AAAA,UAAEE;AAAAA,SAAS;AAAA;AAErC,aAAOZ,KAAKa;AAAAA;AAGd,UAAMC,gBAAgBA,MAAM;AAC1B,YAAM;AAAA,QAAEd;AAAAA,UAAST;AACjB,UAAIS,KAAKW,QAAQ;AAEf,cAAM;AAAA,UAAED;AAAAA,UAAaC;AAAAA,aAAWC;AAAAA,YAAYZ;AAC5C,eAAOA,KAAKW,OAAO;AAAA,UAAER,MAAMZ,MAAMY;AAAAA,UAAMS;AAAAA,SAAS;AAAA;AAElD,UAAIZ,KAAKe,MAAM;AACb,eAAOC,kBAAIzB,MAAMY,MAAMH,KAAKe,IAAI;AAAA;AAElC,aAAO;AAAA;AAGT,WAAO;AAAA,MACLN;AAAAA,MACAK;AAAAA;AACF;AACF,EACAH,SAAS;AACP,UAAM;AAAA,MAAElB;AAAAA,MAAMD;AAAAA,MAAKY;AAAAA,MAAML;AAAAA,MAAWO;AAAAA,MAAOG;AAAAA,MAAaK;AAAAA,MAAed;AAAAA,QAAS;AAChF,QAAIP,SAAS,QAAQ;AACnB,aAAAwB,gBAAAzB;QAAA,SACe,GAAEO,kBAAkBC,KAAKkB,aAAa;AAAA,QAAI,SAASlB,KAAKmB;AAAAA,QAAK,WAAWf;AAAAA;QAAIT,SAAAA,OAAAsB;UAAA,SAE9E;AAAA,YACL,CAAE,GAAElB,yBAAyB;AAAA,YAC7B,CAAE,GAAEA,+BAA+BO;AAAAA;AACrC,YAECG,aAAa,IAAAQ;UAAA,SAEF,GAAElB;AAAAA,YAA2Be,eAAe;;;AAIhE,WAAAG,gBAAAzB;MAAA,SAEW;AAAA,QACL,CAAE,GAAEO,kBAAkBN,SAAS;AAAA,QAC/B,CAAE,GAAEM,+BAA+BN,SAAS,WAAWa;AAAAA,QACvD,CAAE,GAAEN,KAAKkB,cAAclB,KAAKkB;AAAAA;AAC9B,MAAC,SACMlB,KAAKmB;AAAAA,MAAK,WACRf;AAAAA;MAAIT,SAAAA,OAEZF,SAAS,UAAUgB,gBAAgBK,eAAe;AAAA;;AAI3D,CAAC;;;;"}

package/lib/components/InfoView/InfoView.js

@@ -0,0 +1,121 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var useGlobalConfig = require('../base/hooks/useGlobalConfig.js');
+var useColumn = require('./hooks/useColumn.js');
+var responsiveObserve = require('../../utils/responsiveObserve.js');
+var Row = require('./Row.js');
+var InfoView_type = require('./InfoView.type.js');
+var pluginVue_exportHelper = require('../../_virtual/plugin-vue_export-helper.js');
+
+const _sfc_main = vue.defineComponent({
+  name: "UInfoView",
+  components: {
+    Row: Row["default"]
+  },
+  props: InfoView_type.infoViewProps,
+  setup(props, { slots }) {
+    const { prefixCls } = useGlobalConfig["default"]("info-view");
+    const { getRows, getCols } = useColumn["default"](props, slots);
+    let token;
+    const screens = vue.ref({});
+    const rows = vue.ref([]);
+    const cols = vue.ref([]);
+    const fixLabelWidth = vue.computed(() => {
+      return !props.inline && !props.vertical && props.labelWidth;
+    });
+    vue.onMounted(() => {
+      token = responsiveObserve["default"].subscribe((scn) => {
+        if (typeof props.column !== "object") {
+          return;
+        }
+        screens.value = scn;
+      });
+    });
+    vue.onBeforeUnmount(() => {
+      responsiveObserve["default"].unsubscribe(token);
+    });
+    vue.watch(
+      () => [screens.value, props.setting, props.column],
+      () => {
+        rows.value = getRows(screens.value);
+        if (fixLabelWidth.value) {
+          cols.value = getCols(screens.value);
+        }
+      },
+      { immediate: true }
+    );
+    return {
+      prefixCls,
+      fixLabelWidth,
+      cols,
+      rows
+    };
+  }
+});
+const _hoisted_1 = { key: 0 };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Row = vue.resolveComponent("Row");
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass({
+      [`${_ctx.prefixCls}`]: true,
+      [`${_ctx.prefixCls}-${_ctx.size}`]: true,
+      [`${_ctx.prefixCls}-inline`]: _ctx.inline,
+      [`${_ctx.prefixCls}-border`]: _ctx.border && !_ctx.inline,
+      [`${_ctx.prefixCls}-label-right`]: !_ctx.inline && _ctx.labelAlign === "right",
+      [`${_ctx.prefixCls}-label-fix`]: _ctx.fixLabelWidth
+    })
+  }, [
+    _ctx.title || _ctx.$slots.title || _ctx.$slots.extra ? (vue.openBlock(), vue.createElementBlock("div", {
+      key: 0,
+      class: vue.normalizeClass(`${_ctx.prefixCls}-header`)
+    }, [
+      vue.createElementVNode("div", {
+        class: vue.normalizeClass(`${_ctx.prefixCls}-title`)
+      }, [
+        vue.renderSlot(_ctx.$slots, "title", {}, () => [
+          vue.createTextVNode(vue.toDisplayString(_ctx.title), 1)
+        ])
+      ], 2),
+      vue.createElementVNode("div", {
+        class: vue.normalizeClass(`${_ctx.prefixCls}-extra`)
+      }, [
+        vue.renderSlot(_ctx.$slots, "extra")
+      ], 2)
+    ], 2)) : vue.createCommentVNode("v-if", true),
+    vue.createElementVNode("div", {
+      class: vue.normalizeClass(`${_ctx.prefixCls}-content`)
+    }, [
+      vue.createElementVNode("table", null, [
+        _ctx.fixLabelWidth ? (vue.openBlock(), vue.createElementBlock("colgroup", _hoisted_1, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.cols, (col, i) => {
+            return vue.openBlock(), vue.createElementBlock("col", {
+              key: i,
+              style: vue.normalizeStyle(col.style)
+            }, null, 4);
+          }), 128))
+        ])) : vue.createCommentVNode("v-if", true),
+        vue.createElementVNode("tbody", null, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.rows, (row, index) => {
+            return vue.openBlock(), vue.createBlock(_component_Row, {
+              key: index,
+              cells: row,
+              data: _ctx.data,
+              "prefix-cls": _ctx.prefixCls,
+              colon: _ctx.colon,
+              inline: _ctx.inline,
+              border: _ctx.border,
+              vertical: _ctx.vertical
+            }, null, 8, ["cells", "data", "prefix-cls", "colon", "inline", "border", "vertical"]);
+          }), 128))
+        ])
+      ])
+    ], 2)
+  ], 2);
+}
+var InfoView = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "E:\\br-fe\\uxd-ui\\src\\components\\InfoView\\InfoView.vue"]]);
+
+exports["default"] = InfoView;
+//# sourceMappingURL=InfoView.js.map

package/lib/components/InfoView/InfoView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoView.js","sources":["../../../../src/components/InfoView/InfoView.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"{\n      [`${prefixCls}`]: true,\n      [`${prefixCls}-${size}`]: true,\n      [`${prefixCls}-inline`]: inline,\n      [`${prefixCls}-border`]: border && !inline,\n      [`${prefixCls}-label-right`]: !inline && labelAlign === 'right',\n      [`${prefixCls}-label-fix`]: fixLabelWidth\n    }\"\n  >\n    <div v-if=\"title || $slots.title || $slots.extra\" :class=\"`${prefixCls}-header`\">\n      <div :class=\"`${prefixCls}-title`\">\n        <slot name=\"title\">\n          {{ title }}\n        </slot>\n      </div>\n      <div :class=\"`${prefixCls}-extra`\">\n        <slot name=\"extra\" />\n      </div>\n    </div>\n    <div :class=\"`${prefixCls}-content`\">\n      <table>\n        <colgroup v-if=\"fixLabelWidth\">\n          <col v-for=\"(col, i) in cols\" :key=\"i\" :style=\"col.style\" />\n        </colgroup>\n        <tbody>\n          <Row\n            v-for=\"(row, index) in rows\"\n            :key=\"index\"\n            :cells=\"row\"\n            :data=\"data\"\n            :prefix-cls=\"prefixCls\"\n            :colon=\"colon\"\n            :inline=\"inline\"\n            :border=\"border\"\n            :vertical=\"vertical\"\n          />\n        </tbody>\n      </table>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, onBeforeUnmount, onMounted, ref, watch } from 'vue';\nimport useGlobalConfig from '../base/hooks/useGlobalConfig';\nimport useColumn from './hooks/useColumn';\nimport ResponsiveObserve from '../../utils/responsiveObserve';\nimport type { ScreensMatch } from '../../utils/responsiveObserve';\nimport Row from './Row';\nimport { infoViewProps, type InfoViewCell, type InfoViewCol } from './InfoView.type';\n\nexport default defineComponent({\n  name: 'UInfoView',\n  components: {\n    Row\n  },\n  props: infoViewProps,\n  setup(props, { slots }) {\n    const { prefixCls } = useGlobalConfig('info-view');\n    const { getRows, getCols } = useColumn(props, slots);\n\n    let token: number;\n    const screens = ref<ScreensMatch>({} as ScreensMatch);\n    const rows = ref<InfoViewCell[][]>([]);\n    const cols = ref<InfoViewCol[]>([]);\n\n    const fixLabelWidth = computed(() => {\n      return !props.inline && !props.vertical && props.labelWidth;\n    });\n\n    onMounted(() => {\n      token = ResponsiveObserve.subscribe((scn) => {\n        if (typeof props.column !== 'object') {\n          return;\n        }\n        screens.value = scn;\n      });\n    });\n\n    onBeforeUnmount(() => {\n      ResponsiveObserve.unsubscribe(token);\n    });\n\n    watch(\n      () => [screens.value, props.setting, props.column],\n      () => {\n        rows.value = getRows(screens.value);\n        if (fixLabelWidth.value) {\n          cols.value = getCols(screens.value);\n        }\n      },\n      { immediate: true }\n    );\n\n    return {\n      prefixCls,\n      fixLabelWidth,\n      cols,\n      rows\n    };\n  }\n});\n</script>\n"],"names":["defineComponent","Row","infoViewProps","useGlobalConfig","useColumn","ref","computed","ResponsiveObserve","_createElementBlock","_normalizeClass","_createElementVNode","_renderSlot","_Fragment","_normalizeStyle","_createBlock"],"mappings":";;;;;;;;;;;;AAqDA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,SACVC;AAAA;AACF,EACA,OAAOC;AAAA,EACP,MAAM,OAAO,EAAE,SAAS;UAChB,EAAE,cAAcC,2BAAgB,WAAW;UAC3C,EAAE,SAAS,YAAYC,qBAAU,OAAO,KAAK;QAE/C;UACE,UAAUC,QAAkB,EAAkB;UAC9C,OAAOA,QAAsB,EAAE;UAC/B,OAAOA,QAAmB,EAAE;UAE5B,gBAAgBC,aAAS,MAAM;aAC5B,CAAC,MAAM,UAAU,CAAC,MAAM,YAAY,MAAM;AAAA,KAClD;kBAES,MAAM;cACNC,6BAAkB,UAAU,CAAC,QAAQ;YACvC,OAAO,MAAM,WAAW,UAAU;;;gBAG9B,QAAQ;AAAA,OACjB;AAAA,KACF;wBAEe,MAAM;mCACF,YAAY,KAAK;AAAA,KACpC;;MAGC,MAAM,CAAC,QAAQ,OAAO,MAAM,SAAS,MAAM,MAAM;AAAA,MACjD,MAAM;aACC,QAAQ,QAAQ,QAAQ,KAAK;YAC9B,cAAc,OAAO;eAClB,QAAQ,QAAQ,QAAQ,KAAK;AAAA;AACpC;AACF,MACA,EAAE,WAAW;AAAK;WAGb;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AACF;AAEJ,CAAC;;;;0BAtGCC,uBAwCM;IAvCH,OAAKC;UAAc,mBAAS;AAAA,UAAqB,kBAAa,cAAI;AAAA,UAAqB,0BAAqB;UAAkB,0BAAqB,eAAM,CAAK;UAAkB,+BAAS,CAAkB,eAAU,oBAAU;AAAA,UAAwB,6BAAwB;;;IASrQ,cAAS,YAAO,SAAS,YAAO,0BAA3CD,uBASM;;MAT6C,OAAKC,sBAAK,uBAAS;AAAA;MACpEC,uBAIM;QAJA,OAAKD,sBAAK,sBAAS;AAAA;QACvBE,eAEO,0BAFP,MAEO;AAAA,kDADF,UAAK;;;MAGZD,uBAEM;QAFA,OAAKD,sBAAK,sBAAS;AAAA;QACvBE,eAAqB;;;IAGzBD,uBAmBM;MAnBA,OAAKD,sBAAK,wBAAS;AAAA;MACvBC,uBAiBQ;QAhBU,uCAAhBF,uBAEW;gCADTA,uBAA4DI,mCAApC,WAAI,CAAf,KAAK,MAAC;oCAAnBJ,uBAA4D;cAA7B,KAAK;AAAA,cAAI,OAAKK,mBAAE,IAAI,KAAK;AAAA;;;QAE1DH,uBAYQ;gCAXNF,uBAUEI,mCATuB,WAAI,CAAnB,KAAK,UAAK;oCADpBE,gBAUE;cARC,KAAK;AAAA,cACL,OAAO;AAAA,cACP,MAAM;cACN,cAAY;cACZ,OAAO;cACP,QAAQ;cACR,QAAQ;cACR,UAAU;;;;;;;;;;;;"}

package/lib/components/InfoView/InfoView.type.d.ts

@@ -0,0 +1,73 @@
+import type { ExtractPropTypes, PropType, Slot } from 'vue';
+import type { ResponsiveKeys } from '../../utils/responsiveObserve';
+import type InfoView from './InfoView.vue';
+export declare type ResponsiveColumns = Record<ResponsiveKeys, number>;
+export declare const DEFAULT_COLUMN_MAP: ResponsiveColumns;
+export interface InfoViewSettingItem {
+    key?: string;
+    prop: string;
+    label: string;
+    span?: number;
+    slot?: string;
+    labelSlot?: string;
+    className?: string;
+    style?: Record<string, string>;
+}
+export interface InfoViewCell extends InfoViewSettingItem {
+    render?: Slot;
+    labelRender?: Slot;
+}
+export interface InfoViewCol {
+    style?: Record<string, string>;
+}
+export declare const infoViewSize: readonly ["default", "middle", "small"];
+export declare type InfoViewSize = (typeof infoViewSize)[number];
+export declare const infoViewProps: {
+    data: {
+        type: ObjectConstructor;
+        default: () => void;
+    };
+    setting: {
+        type: PropType<InfoViewSettingItem[]>;
+        default: () => InfoViewSettingItem[];
+    };
+    inline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    border: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    colon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    column: {
+        type: PropType<number | ResponsiveColumns>;
+        default: () => ResponsiveColumns;
+    };
+    size: {
+        type: PropType<"small" | "default" | "middle">;
+        default: string;
+        validator: (val: "small" | "default" | "middle") => boolean;
+    };
+    title: {
+        type: StringConstructor;
+    };
+    labelWidth: {
+        type: NumberConstructor;
+    };
+    labelAlign: {
+        type: PropType<string>;
+        default: string;
+        validator: (val: string) => boolean;
+    };
+};
+export declare type InfoViewProps = ExtractPropTypes<typeof infoViewProps>;
+export declare type InfoViewCellTag = 'td' | 'th';
+export declare type InfoViewInstanceType = InstanceType<typeof InfoView>;

package/lib/components/InfoView/InfoView.type.js

@@ -0,0 +1,68 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var globalType = require('../../utils/globalType.js');
+var propsValidators = require('../../utils/propsValidators.js');
+
+const DEFAULT_COLUMN_MAP = {
+  xxl: 3,
+  xl: 3,
+  lg: 3,
+  md: 3,
+  sm: 2,
+  xs: 1
+};
+const infoViewSize = ["default", "middle", "small"];
+const infoViewProps = {
+  data: {
+    type: Object,
+    default: () => {
+    }
+  },
+  setting: {
+    type: Array,
+    default: () => []
+  },
+  inline: {
+    type: Boolean,
+    default: false
+  },
+  border: {
+    type: Boolean,
+    default: false
+  },
+  colon: {
+    type: Boolean,
+    default: false
+  },
+  vertical: {
+    type: Boolean,
+    default: false
+  },
+  column: {
+    type: [Number, Object],
+    default: () => DEFAULT_COLUMN_MAP
+  },
+  size: {
+    type: String,
+    default: "default",
+    validator: propsValidators.oneOf(infoViewSize)
+  },
+  title: {
+    type: String
+  },
+  labelWidth: {
+    type: Number
+  },
+  labelAlign: {
+    type: String,
+    default: "left",
+    validator: propsValidators.oneOf(globalType.labelAlign)
+  }
+};
+
+exports.DEFAULT_COLUMN_MAP = DEFAULT_COLUMN_MAP;
+exports.infoViewProps = infoViewProps;
+exports.infoViewSize = infoViewSize;
+//# sourceMappingURL=InfoView.type.js.map

package/lib/components/InfoView/InfoView.type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoView.type.js","sources":["../../../../src/components/InfoView/InfoView.type.ts"],"sourcesContent":["import type { ExtractPropTypes, PropType, Slot } from 'vue';\nimport { labelAlign, type LabelAlign } from '../../utils/globalType';\nimport { oneOf } from '../../utils/propsValidators';\nimport type { ResponsiveKeys } from '../../utils/responsiveObserve';\nimport type InfoView from './InfoView.vue';\n\nexport type ResponsiveColumns = Record<ResponsiveKeys, number>;\n\nexport const DEFAULT_COLUMN_MAP = {\n  xxl: 3,\n  xl: 3,\n  lg: 3,\n  md: 3,\n  sm: 2,\n  xs: 1\n} as ResponsiveColumns;\n\nexport interface InfoViewSettingItem {\n  key?: string;\n  prop: string;\n  label: string;\n  span?: number;\n  slot?: string;\n  labelSlot?: string;\n  className?: string;\n  style?: Record<string, string>;\n}\n\nexport interface InfoViewCell extends InfoViewSettingItem {\n  render?: Slot;\n  labelRender?: Slot;\n}\n\nexport interface InfoViewCol {\n  style?: Record<string, string>;\n}\n\nexport const infoViewSize = ['default', 'middle', 'small'] as const;\nexport type InfoViewSize = (typeof infoViewSize)[number];\n\nexport const infoViewProps = {\n  data: {\n    type: Object,\n    default: () => {}\n  },\n  setting: {\n    type: Array as PropType<InfoViewSettingItem[]>,\n    default: () => [] as InfoViewSettingItem[]\n  },\n  inline: {\n    type: Boolean,\n    default: false\n  },\n  border: {\n    type: Boolean,\n    default: false\n  },\n  colon: {\n    type: Boolean,\n    default: false\n  },\n  vertical: {\n    type: Boolean,\n    default: false\n  },\n  column: {\n    type: [Number, Object] as PropType<number | ResponsiveColumns>,\n    default: () => DEFAULT_COLUMN_MAP\n  },\n  size: {\n    type: String as PropType<InfoViewSize>,\n    default: 'default',\n    validator: oneOf(infoViewSize)\n  },\n  title: {\n    type: String\n  },\n  labelWidth: {\n    type: Number\n  },\n  labelAlign: {\n    type: String as PropType<LabelAlign>,\n    default: 'left',\n    validator: oneOf(labelAlign)\n  }\n};\n\nexport type InfoViewProps = ExtractPropTypes<typeof infoViewProps>;\n\nexport type InfoViewCellTag = 'td' | 'th';\n\nexport type InfoViewInstanceType = InstanceType<typeof InfoView>;\n"],"names":["oneOf","labelAlign"],"mappings":";;;;;;;MAQa,qBAAqB;AAAA,EAChC,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;MAsBa,eAAe,CAAC,WAAW,UAAU,OAAO;MAG5C,gBAAgB;AAAA,EAC3B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS,MAAM;AAAA;AAAC;AAClB,EACA,SAAS;AAAA,IACP,MAAM;AAAA,IACN,SAAS,MAAM;AAAC;AAClB,EACA,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AACX,EACA,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AACX,EACA,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA;AACX,EACA,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AACX,EACA,QAAQ;AAAA,IACN,MAAM,CAAC,QAAQ,MAAM;AAAA,IACrB,SAAS,MAAM;AAAA;AACjB,EACA,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAWA,sBAAM,YAAY;AAAA;AAC/B,EACA,OAAO;AAAA,IACL,MAAM;AAAA;AACR,EACA,YAAY;AAAA,IACV,MAAM;AAAA;AACR,EACA,YAAY;AAAA,IACV,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAWA,sBAAMC,qBAAU;AAAA;AAE/B;;;;;;"}

package/lib/components/InfoView/InfoView.vue.d.ts

@@ -0,0 +1,134 @@
+import { type InfoViewCell, type InfoViewCol } from './InfoView.type';
+declare const _default: import("vue").DefineComponent<{
+    data: {
+        type: ObjectConstructor;
+        default: () => void;
+    };
+    setting: {
+        type: import("vue").PropType<import("./InfoView.type").InfoViewSettingItem[]>;
+        default: () => import("./InfoView.type").InfoViewSettingItem[];
+    };
+    inline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    border: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    colon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    column: {
+        type: import("vue").PropType<number | import("./InfoView.type").ResponsiveColumns>;
+        default: () => import("./InfoView.type").ResponsiveColumns;
+    };
+    size: {
+        type: import("vue").PropType<"small" | "default" | "middle">;
+        default: string;
+        validator: (val: "small" | "default" | "middle") => boolean;
+    };
+    title: {
+        type: StringConstructor;
+    };
+    labelWidth: {
+        type: NumberConstructor;
+    };
+    labelAlign: {
+        type: import("vue").PropType<string>;
+        default: string;
+        validator: (val: string) => boolean;
+    };
+}, {
+    prefixCls: import("vue").ComputedRef<string>;
+    fixLabelWidth: import("vue").ComputedRef<number>;
+    cols: import("vue").Ref<{
+        style?: Record<string, string>;
+    }[], InfoViewCol[] | {
+        style?: Record<string, string>;
+    }[]>;
+    rows: import("vue").Ref<{
+        render?: import("vue").Slot<any>;
+        labelRender?: import("vue").Slot<any>;
+        key?: string;
+        prop: string;
+        label: string;
+        span?: number;
+        slot?: string;
+        labelSlot?: string;
+        className?: string;
+        style?: Record<string, string>;
+    }[][], InfoViewCell[][] | {
+        render?: import("vue").Slot<any>;
+        labelRender?: import("vue").Slot<any>;
+        key?: string;
+        prop: string;
+        label: string;
+        span?: number;
+        slot?: string;
+        labelSlot?: string;
+        className?: string;
+        style?: Record<string, string>;
+    }[][]>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    data: {
+        type: ObjectConstructor;
+        default: () => void;
+    };
+    setting: {
+        type: import("vue").PropType<import("./InfoView.type").InfoViewSettingItem[]>;
+        default: () => import("./InfoView.type").InfoViewSettingItem[];
+    };
+    inline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    border: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    colon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    column: {
+        type: import("vue").PropType<number | import("./InfoView.type").ResponsiveColumns>;
+        default: () => import("./InfoView.type").ResponsiveColumns;
+    };
+    size: {
+        type: import("vue").PropType<"small" | "default" | "middle">;
+        default: string;
+        validator: (val: "small" | "default" | "middle") => boolean;
+    };
+    title: {
+        type: StringConstructor;
+    };
+    labelWidth: {
+        type: NumberConstructor;
+    };
+    labelAlign: {
+        type: import("vue").PropType<string>;
+        default: string;
+        validator: (val: string) => boolean;
+    };
+}>>, {
+    size: "small" | "default" | "middle";
+    data: Record<string, any>;
+    column: number | import("./InfoView.type").ResponsiveColumns;
+    inline: boolean;
+    vertical: boolean;
+    border: boolean;
+    labelAlign: string;
+    colon: boolean;
+    setting: import("./InfoView.type").InfoViewSettingItem[];
+}, {}>;
+export default _default;