@hi-ui/schema-fields 4.0.0-experimental.6 → 4.0.0-experimental.8

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @hi-ui/schema-fields
 
+## 4.0.0-experimental.7
+
+### Patch Changes
+
+- 346113bd3: 处理 ProTag 产物丢失问题
+
 ## 4.0.0-experimental.6
 
 ### Patch Changes

package/lib/fields/semantic/tag/index.d.ts

@@ -1,60 +1,8 @@
 import React from 'react';
 import { type TagProps } from '@hi-ui/tag';
 import { ProField, type ProFieldRenderCtx } from '../../../base';
+import type { ColorPreset, BuiltinColorEnum, SCMColorEnumPreset } from './preset';
 import './index.scss';
-type ColorPreset = {
-    back: TagProps['background'];
-    fore: TagProps['color'];
-};
-export declare const colorPreset: {
-    blue: {
-        back: string;
-        fore: string;
-    };
-    yellow: {
-        back: string;
-        fore: string;
-    };
-    green: {
-        back: string;
-        fore: string;
-    };
-    red: {
-        back: string;
-        fore: string;
-    };
-    orange: {
-        back: string;
-        fore: string;
-    };
-    purple: {
-        back: string;
-        fore: string;
-    };
-    /** 蓝绿色 */ cyan: {
-        back: string;
-        fore: string;
-    };
-    /** 天蓝色 */ skyblue: {
-        back: string;
-        fore: string;
-    };
-    /** 深紫色 */ darkPurple: {
-        back: string;
-        fore: string;
-    };
-    /** 蓝灰色 */ blueGray: {
-        back: string;
-        fore: string;
-    };
-    /** 中灰色 */ midGray: {
-        back: string;
-        fore: string;
-    };
-};
-type BuiltinColorEnum = Required<TagProps>['type'];
-type SCMColorEnumPreset = keyof typeof colorPreset;
-export declare const ColorEnumPreset: SCMColorEnumPreset[];
 export type ProTagProps = TagProps & {
     /** 是否显示边框 */
     bordered?: boolean;
@@ -75,4 +23,3 @@ export declare class ProTag extends ProField {
     getColor(preset: ValueOf<ProTagProps['colorPreset']>): ColorPreset | undefined;
     getText(data: string, textMap: ProTagProps['textMap']): {};
 }
-export {};

package/lib/fields/semantic/tag/index.js

@@ -7,65 +7,94 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import '@babel/runtime/helpers/esm/inheritsLoose';
-import 'react';
-import '@hi-ui/classname';
-import 'lodash-es';
-import '@hi-ui/tag';
-import '@hi-ui/input';
-import '@hi-ui/ellipsis-tooltip';
-import '@hi-ui/schema-core';
-import '@hi-ui/schema-utils';
-import 'tslib';
+import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';
+import React from 'react';
+import { cx } from '@hi-ui/classname';
+import { omit, isNil } from 'lodash-es';
+import { Tag } from '@hi-ui/tag';
+import { ProField } from '../../../base.js';
+import { ReadonlyWrapper } from '../../../components/span/index.js';
+import { colorPreset } from './preset.js';
 import './index.scss.js';
-
-// IPD的标签颜色规范，先记录在这里吧
-// https://www.figma.com/design/R7gUHJaKDPSAaWojTrNUe2/%E7%A0%94%E4%BA%A7%E4%BE%9B%E4%B8%9A%E5%8A%A1%E8%AE%BE%E8%AE%A1%E8%A7%84%E8%8C%83-IPD?node-id=2042-50477&node-type=frame&t=uCEcQbmB9uwVVUIQ-0
-var colorPreset = {
-  blue: {
-    back: '#EDF7FE',
-    fore: '#0744AD'
-  },
-  yellow: {
-    back: '#FEFCE9',
-    fore: '#875100'
-  },
-  green: {
-    back: '#EEFEF2',
-    fore: '#007D3E'
-  },
-  red: {
-    back: '#FEF1EE',
-    fore: '#B32D36'
-  },
-  orange: {
-    back: '#FEF5EE',
-    fore: '#B23E1B'
-  },
-  purple: {
-    back: '#F5EEFE',
-    fore: '#533DAD'
-  },
-  /** 蓝绿色 */cyan: {
-    back: '#ECFEFC',
-    fore: '#0C737A'
-  },
-  /** 天蓝色 */skyblue: {
-    back: '#ECFCFE',
-    fore: '#006BB3'
-  },
-  /** 深紫色 */darkPurple: {
-    back: '#EEF2FE',
-    fore: '#363AB3'
-  },
-  /** 蓝灰色 */blueGray: {
-    back: '#EEF7FE',
-    fore: '#3C5485'
-  },
-  /** 中灰色 */midGray: {
-    back: '#F2F4F7',
-    fore: '#1F2733'
+function isInvalidTagData(data) {
+  if (isNil(data)) return true;
+  if (data === '') return true;
+  return false;
+}
+var ProTag = /*#__PURE__*/function (_ProField) {
+  _inheritsLoose(ProTag, _ProField);
+  function ProTag() {
+    return _ProField.apply(this, arguments) || this;
   }
-};
-var ColorEnumPreset = Object.keys(colorPreset);
-export { ColorEnumPreset, colorPreset };
+  var _proto = ProTag.prototype;
+  _proto.render = function render(data, ctx) {
+    if (isInvalidTagData(data)) return this.dftDom;
+    // 统一转换为数组处理
+    var dataList = (Array.isArray(data) ? data : [data]).filter(function (el) {
+      return !isInvalidTagData(el);
+    });
+    if (dataList.length === 0) return this.dftDom;
+    return this.renderTag(dataList, ctx);
+  };
+  _proto.renderTag = function renderTag(dataArray, ctx) {
+    var _this = this;
+    var fieldProps = this.getFieldProps({}, ctx);
+    var className = cx(fieldProps.className, {
+      'pro-tag--bordered': fieldProps.bordered
+    });
+    var tagProps = this.getTagProps(fieldProps);
+    return /*#__PURE__*/React.createElement(ReadonlyWrapper, {
+      style: {
+        gap: 4
+      }
+    }, dataArray.map(function (data, index) {
+      var _a;
+      var _preset = (_a = fieldProps.colorPreset) === null || _a === void 0 ? void 0 : _a[data];
+      var text = _this.getText(data, fieldProps.textMap);
+      // 没有预设颜色，则显示默认Tag样式
+      if (!_preset) {
+        return /*#__PURE__*/React.createElement("span", {
+          key: index
+        }, /*#__PURE__*/React.createElement(Tag, Object.assign({
+          type: "default"
+        }, tagProps, {
+          className: className
+        }), text));
+      }
+      // 内置类型
+      var type = _this.getType(_preset);
+      // 自定义颜色(文字色和背景色)
+      var color = _this.getColor(_preset);
+      return /*#__PURE__*/React.createElement("span", {
+        key: index
+      }, /*#__PURE__*/React.createElement(Tag, Object.assign({
+        type: type,
+        color: color === null || color === void 0 ? void 0 : color.fore,
+        background: color === null || color === void 0 ? void 0 : color.back
+      }, tagProps, {
+        className: className
+      }), text));
+    }));
+  };
+  _proto.getTagProps = function getTagProps(props) {
+    return omit(props, ['bordered', 'colorPreset']);
+  };
+  _proto.getType = function getType(preset) {
+    if (typeof preset !== 'string') return undefined;
+    if (preset in colorPreset) return undefined;
+    return preset;
+  };
+  _proto.getColor = function getColor(preset) {
+    if (typeof preset !== 'string') return preset;
+    if (preset in colorPreset) return colorPreset[preset];
+    return undefined;
+  };
+  _proto.getText = function getText(data, textMap) {
+    var _a, _b;
+    if (!textMap) return data;
+    if (textMap instanceof Map) return (_a = textMap.get(data)) !== null && _a !== void 0 ? _a : data;
+    return (_b = textMap[data]) !== null && _b !== void 0 ? _b : data;
+  };
+  return ProTag;
+}(ProField);
+export { ProTag };

package/lib/fields/semantic/tag/preset.d.ts

@@ -0,0 +1,54 @@
+import { type TagProps } from '@hi-ui/tag';
+export type ColorPreset = {
+    back: TagProps['background'];
+    fore: TagProps['color'];
+};
+export declare const colorPreset: {
+    blue: {
+        back: string;
+        fore: string;
+    };
+    yellow: {
+        back: string;
+        fore: string;
+    };
+    green: {
+        back: string;
+        fore: string;
+    };
+    red: {
+        back: string;
+        fore: string;
+    };
+    orange: {
+        back: string;
+        fore: string;
+    };
+    purple: {
+        back: string;
+        fore: string;
+    };
+    /** 蓝绿色 */ cyan: {
+        back: string;
+        fore: string;
+    };
+    /** 天蓝色 */ skyblue: {
+        back: string;
+        fore: string;
+    };
+    /** 深紫色 */ darkPurple: {
+        back: string;
+        fore: string;
+    };
+    /** 蓝灰色 */ blueGray: {
+        back: string;
+        fore: string;
+    };
+    /** 中灰色 */ midGray: {
+        back: string;
+        fore: string;
+    };
+};
+export type BuiltinColorEnum = Required<TagProps>['type'];
+export type SCMColorEnumPreset = keyof typeof colorPreset;
+export declare const ColorEnumPreset: SCMColorEnumPreset[];

package/lib/fields/semantic/tag/preset.js

@@ -0,0 +1,60 @@
+/** @LICENSE
+ * @hi-ui/schema-fields
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-fields#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+// 内部的的标签颜色规范 // TODO 待确认后更新
+var colorPreset = {
+  blue: {
+    back: '#EDF7FE',
+    fore: '#0744AD'
+  },
+  yellow: {
+    back: '#FEFCE9',
+    fore: '#875100'
+  },
+  green: {
+    back: '#EEFEF2',
+    fore: '#007D3E'
+  },
+  red: {
+    back: '#FEF1EE',
+    fore: '#B32D36'
+  },
+  orange: {
+    back: '#FEF5EE',
+    fore: '#B23E1B'
+  },
+  purple: {
+    back: '#F5EEFE',
+    fore: '#533DAD'
+  },
+  /** 蓝绿色 */cyan: {
+    back: '#ECFEFC',
+    fore: '#0C737A'
+  },
+  /** 天蓝色 */skyblue: {
+    back: '#ECFCFE',
+    fore: '#006BB3'
+  },
+  /** 深紫色 */darkPurple: {
+    back: '#EEF2FE',
+    fore: '#363AB3'
+  },
+  /** 蓝灰色 */blueGray: {
+    back: '#EEF7FE',
+    fore: '#3C5485'
+  },
+  /** 中灰色 */midGray: {
+    back: '#F2F4F7',
+    fore: '#1F2733'
+  }
+  // eslint-disable-next-line prettier/prettier
+};
+
+var ColorEnumPreset = Object.keys(colorPreset);
+export { ColorEnumPreset, colorPreset };

package/lib/index.d.ts

@@ -26,5 +26,5 @@ export * from './components/span';
 export * from './ctx';
 export * from './utils';
 export { DumbInput } from './fields/semantic/text';
-export { colorPreset, ColorEnumPreset } from './fields/semantic/tag';
+export { colorPreset, ColorEnumPreset } from './fields/semantic/tag/preset';
 export * from './editable';

package/lib/index.js

@@ -12,7 +12,7 @@ export { ReadonlyWrapper, ReadonlyWrapper as Span } from './components/span/inde
 export { FieldMapProvider, getFieldRenderFn, matchFieldClass, matchFieldRenderFn, useFieldMap, useMatchFieldClass } from './ctx.js';
 export { getFieldProps, getFormItemProps, getWrapperProps } from './utils.js';
 export { DumbInput } from './fields/semantic/text/index.js';
-export { ColorEnumPreset, colorPreset } from './fields/semantic/tag/index.js';
+export { ColorEnumPreset, colorPreset } from './fields/semantic/tag/preset.js';
 export { EditableField } from './editable/index.js';
 export { getLabel } from './utils/label.js';
 export { BatchDepUpdate } from './utils/batch-dep-update.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/schema-fields",
-  "version": "4.0.0-experimental.6",
+  "version": "4.0.0-experimental.8",
   "description": "A sub-package for @hi-ui/schema.",
   "keywords": [],
   "author": "HiUI <mi-hiui@xiaomi.com>",