@hi-ui/input 4.0.0-alpha.24 → 4.0.0-alpha.28

package/lib/esm/use-input.js

@@ -11,6 +11,7 @@ import { useCallback, useState, useMemo } from 'react';
 import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
 import { useLatestCallback } from '@hi-ui/use-latest';
 import { setAttrStatus } from '@hi-ui/dom-utils';
+import { pure, format, formatAmount } from './utils/index.js';
 
 var useInput = function useInput(_ref) {
   var name = _ref.name,
@@ -29,16 +30,37 @@ var useInput = function useInput(_ref) {
       onFocus = _ref.onFocus,
       onBlur = _ref.onBlur,
       _ref$trimValueOnBlur = _ref.trimValueOnBlur,
-      trimValueOnBlur = _ref$trimValueOnBlur === void 0 ? false : _ref$trimValueOnBlur;
+      trimValueOnBlur = _ref$trimValueOnBlur === void 0 ? false : _ref$trimValueOnBlur,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'text' : _ref$type,
+      clearElementRef = _ref.clearElementRef; // Object.is 避免 trimValueOnBlur 和 点击 clearIcon 触发 2 次相同的 onCHange
 
-  var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange),
+  var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange, Object.is),
       value = _useUncontrolledState[0],
       tryChangeValue = _useUncontrolledState[1];
 
-  var handleChange = useCallback(function (evt) {
+  var handleChange = useCallback(function (evt, trim) {
+    if (trim === void 0) {
+      trim = false;
+    }
+
+    evt.persist();
     var nextValue = evt.target.value;
-    tryChangeValue(nextValue, evt);
-  }, [tryChangeValue]);
+    var valueTrue = pure(nextValue, type); // 防溢出，保证 onChange 拿到的是值是最新的 formatted value
+
+    var value = format(nextValue, type);
+
+    if (trim) {
+      valueTrue = valueTrue.trim();
+      value = value.trim();
+    }
+
+    var event = Object.create(evt);
+    event.target = Object.assign(Object.assign({}, evt.target), {
+      value: value
+    });
+    tryChangeValue(valueTrue, event);
+  }, [tryChangeValue, type]);
 
   var _useState = useState(autoFocus),
       focused = _useState[0],
@@ -49,11 +71,19 @@ var useInput = function useInput(_ref) {
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(evt);
   });
   var handleBlur = useLatestCallback(function (event) {
-    setFocused(false);
+    var relatedTarget = event.relatedTarget; // 拦截 clear 情况 触发 input 失焦
+
+    if (clearElementRef && clearElementRef.current && clearElementRef.current === relatedTarget) {
+      return;
+    }
+
+    setFocused(false); // amount 自动添加小数
 
-    if (trimValueOnBlur) {
-      var nextValue = event.target.value;
-      tryChangeValue(nextValue.trim(), event);
+    if (type === 'amount') {
+      event.target.value = formatAmount(value, true);
+      handleChange(event, trimValueOnBlur);
+    } else if (trimValueOnBlur) {
+      handleChange(event, true);
     }
 
     onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
@@ -71,12 +101,12 @@ var useInput = function useInput(_ref) {
   }, [disabled, readOnly, autoFocus, placeholder, maxLength, name, focused]);
   var getInputProps = useCallback(function () {
     return Object.assign(Object.assign({}, nativeInputProps), {
-      value: value,
+      value: format(value, type),
       onChange: handleChange,
       onFocus: handleFocus,
       onBlur: handleBlur
     });
-  }, [value, handleChange, handleFocus, handleBlur, nativeInputProps]);
+  }, [value, type, handleChange, handleFocus, handleBlur, nativeInputProps]);
   return {
     focused: focused,
     value: value,

package/lib/esm/use-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-input.js","sources":["../../src/use-input.ts"],"sourcesContent":[null],"names":["useInput","name","autoFocus","disabled","readOnly","maxLength","placeholder","defaultValue","valueProp","value","onChange","onFocus","onBlur","trimValueOnBlur","useUncontrolledState","tryChangeValue","handleChange","useCallback","evt","nextValue","target","useState","focused","setFocused","handleFocus","useLatestCallback","handleBlur","event","trim","nativeInputProps","useMemo","setAttrStatus","getInputProps"],"mappings":";;;;;;;;;;;;;;IAKaA,QAAQ,GAAG,SAAXA,QAAW,KAAA;MACtBC,YAAAA;4BACAC;MAAAA,wCAAY;2BACZC;MAAAA,sCAAW;2BACXC;MAAAA,sCAAW;MACXC,iBAAAA;MACAC,mBAAAA;+BACAC;MAAAA,8CAAe;MACRC,iBAAPC;MACAC,gBAAAA;MACAC,eAAAA;MACAC,cAAAA;kCACAC;MAAAA,oDAAkB;;8BAEcC,oBAAoB,CAACP,YAAD,EAAeC,SAAf,EAA0BE,QAA1B;MAA7CD,KAAP;MAAcM,cAAd;;MAEMC,YAAY,GAAGC,WAAW,CAC9B,UAACC,GAAD;QACQC,SAAS,GAAGD,GAAG,CAACE,MAAJF,CAAWT;AAC7BM,IAAAA,cAAc,CAACI,SAAD,EAAYD,GAAZ,CAAdH;AAH4B,GAAA,EAK9B,CAACA,cAAD,CAL8B;;kBAQFM,QAAQ,CAACnB,SAAD;MAA/BoB,OAAP;MAAgBC,UAAhB;;MAEMC,WAAW,GAAGC,iBAAiB,CACnC,UAACP,GAAD;AACEK,IAAAA,UAAU,CAAC,IAAD,CAAVA;AACAZ,IAAAA,OAAO,SAAPA,IAAAA,OAAO,WAAPA,SAAAA,GAAAA,OAAO,CAAGO,GAAH,CAAPP;AAHiC,GAAA;MAO/Be,UAAU,GAAGD,iBAAiB,CAClC,UAACE,KAAD;AACEJ,IAAAA,UAAU,CAAC,KAAD,CAAVA;;QAEIV,iBAAiB;UACbM,SAAS,GAAGQ,KAAK,CAACP,MAANO,CAAalB;AAC/BM,MAAAA,cAAc,CAACI,SAAS,CAACS,IAAVT,EAAD,EAAmBQ,KAAnB,CAAdZ;;;AAGFH,IAAAA,MAAM,SAANA,IAAAA,MAAM,WAANA,SAAAA,GAAAA,MAAM,CAAGe,KAAH,CAANf;AATgC,GAAA;MAa9BiB,gBAAgB,GAAGC,OAAO,CAC9B;WAAO;AACL7B,MAAAA,IAAI,EAAJA,IADK;AAELE,MAAAA,QAAQ,EAARA,QAFK;AAGLC,MAAAA,QAAQ,EAARA,QAHK;AAILF,MAAAA,SAAS,EAATA,SAJK;AAKLI,MAAAA,WAAW,EAAXA,WALK;AAMLD,MAAAA,SAAS,EAATA,SANK;sBAOW0B,aAAa,CAACT,OAAD;AAPxB;AADuB,GAAA,EAU9B,CAACnB,QAAD,EAAWC,QAAX,EAAqBF,SAArB,EAAgCI,WAAhC,EAA6CD,SAA7C,EAAwDJ,IAAxD,EAA8DqB,OAA9D,CAV8B;MAa1BU,aAAa,GAAGf,WAAW,CAAC;2CAE3BY;AACHpB,MAAAA,KAAK,EAALA;AACAC,MAAAA,QAAQ,EAAEM;AACVL,MAAAA,OAAO,EAAEa;AACTZ,MAAAA,MAAM,EAAEc;;AANqB,GAAA,EAQ9B,CAACjB,KAAD,EAAQO,YAAR,EAAsBQ,WAAtB,EAAmCE,UAAnC,EAA+CG,gBAA/C,CAR8B;SAU1B;AACLP,IAAAA,OAAO,EAAPA,OADK;AAELb,IAAAA,KAAK,EAALA,KAFK;AAGLM,IAAAA,cAAc,EAAdA,cAHK;AAILiB,IAAAA,aAAa,EAAbA;AAJK;;;"}
+{"version":3,"file":"use-input.js","sources":["../../src/use-input.ts"],"sourcesContent":[null],"names":["useInput","name","autoFocus","disabled","readOnly","maxLength","placeholder","defaultValue","valueProp","value","onChange","onFocus","onBlur","trimValueOnBlur","type","clearElementRef","useUncontrolledState","Object","is","tryChangeValue","handleChange","useCallback","evt","trim","persist","nextValue","target","valueTrue","pure","format","event","create","useState","focused","setFocused","handleFocus","useLatestCallback","handleBlur","relatedTarget","current","formatAmount","nativeInputProps","useMemo","setAttrStatus","getInputProps"],"mappings":"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"}

package/lib/esm/utils/index.js

@@ -0,0 +1,176 @@
+/** @LICENSE
+ * @hi-ui/input
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/input#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.
+ */
+
+/**
+ * 格式化身份证
+ */
+var formatId = function formatId(val) {
+  val = val.replace(/[^a-zA-Z0-9]/g, '');
+  var len = val.length;
+
+  if (val === '' || len < 7) {
+    return val;
+  }
+
+  if (len < 11) {
+    return val.slice(0, 6) + ' ' + val.slice(6, 10);
+  } else if (len < 15) {
+    return val.slice(0, 6) + ' ' + val.slice(6, 10) + ' ' + val.slice(10, 14);
+  } else {
+    return val.slice(0, 6) + ' ' + val.slice(6, 10) + ' ' + val.slice(10, 14) + ' ' + val.slice(14, 18);
+  }
+};
+
+var pureId = function pureId(val) {
+  var tmp = val.replace(/[^\d|.]/g, '');
+  return tmp.slice(0, 18);
+};
+/**
+ * 格式化手机号
+ */
+
+
+var formatTel = function formatTel(val) {
+  val = val.replace(/\D/g, '');
+  var len = val.length;
+
+  if (val === '' || len < 4) {
+    return val;
+  }
+
+  if (len < 8) {
+    return val.slice(0, 3) + ' ' + val.slice(3, 7);
+  } else {
+    return val.slice(0, 3) + ' ' + val.slice(3, 7) + ' ' + val.slice(7, 11);
+  }
+};
+
+var pureTel = function pureTel(val) {
+  var tmp = val.replace(/[^\d|.]/g, '');
+  return tmp.slice(0, 11);
+};
+/**
+ * 格式化银行卡号
+ */
+
+
+var formatCard = function formatCard(val) {
+  val = val.replace(/\D/g, '');
+  var len = val.length;
+
+  if (val === '' || val.length < 5) {
+    return val;
+  }
+
+  if (len < 9) {
+    return val.slice(0, 4) + ' ' + val.slice(4, 8);
+  } else if (len < 13) {
+    return val.slice(0, 4) + ' ' + val.slice(4, 8) + ' ' + val.slice(8, 12);
+  } else if (len < 17) {
+    return val.slice(0, 4) + ' ' + val.slice(4, 8) + ' ' + val.slice(8, 12) + ' ' + val.slice(12, 16);
+  } else {
+    return val.slice(0, 4) + ' ' + val.slice(4, 8) + ' ' + val.slice(8, 12) + ' ' + val.slice(12, 16) + ' ' + val.slice(16, 19);
+  }
+};
+
+var pureCard = function pureCard(val) {
+  var tmp = val.replace(/[^\d|.]/g, '');
+  return tmp.slice(0, 19);
+};
+/**
+ * 金额自动生成小数
+ * @param {string} val  需要处理的值
+ */
+
+
+var formatAmount = function formatAmount(val, fill) {
+  if (fill === void 0) {
+    fill = false;
+  }
+
+  val = val.replace(/[^\d|.|,]/g, '').replace(/(\.\d*?)(\.|,).*/, function (_, $1) {
+    return $1;
+  });
+
+  if (fill) {
+    if (!val) return val;
+    return val.indexOf('.') > -1 ? val : val + '.00';
+  }
+
+  return val;
+};
+
+var pureAmount = function pureAmount(val) {
+  var tmp = val.replace(/[^\d|.]/g, '');
+  return tmp;
+};
+
+var formatEmail = function formatEmail(val) {
+  return val.replace(/\W/g, '');
+};
+
+var pureEmail = function pureEmail(val) {
+  return val;
+};
+/**
+ * 输入规则
+ */
+
+
+var format = function format(val, type) {
+  switch (type) {
+    case 'id':
+      return formatId(val);
+
+    case 'tel':
+      return formatTel(val);
+
+    case 'card':
+      return formatCard(val);
+
+    case 'email':
+      return formatEmail(val);
+
+    case 'amount':
+      return formatAmount(val);
+
+    default:
+      return val;
+  }
+};
+/**
+ * 净化规则
+ */
+
+
+var pure = function pure(val, type) {
+  switch (type) {
+    case 'id':
+      return pureId(val);
+
+    case 'tel':
+      return pureTel(val);
+
+    case 'card':
+      return pureCard(val);
+
+    case 'email':
+      return pureEmail(val);
+
+    case 'amount':
+      return pureAmount(val);
+
+    default:
+      return val;
+  }
+};
+
+export { format, formatAmount, formatCard, formatEmail, formatId, formatTel, pure, pureAmount, pureCard, pureEmail, pureId, pureTel };
+//# sourceMappingURL=index.js.map

package/lib/esm/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/utils/index.ts"],"sourcesContent":[null],"names":["formatId","val","replace","len","length","slice","pureId","tmp","formatTel","pureTel","formatCard","pureCard","formatAmount","fill","_","$1","indexOf","pureAmount","formatEmail","pureEmail","format","type","pure"],"mappings":"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"}

package/lib/types/Input.d.ts

@@ -1,7 +1,14 @@
 import React from 'react';
 import { HiBaseHTMLFieldProps } from '@hi-ui/core';
 /**
- * TODO: What is Input
+ * 输入框
+ *
+ * @TODO:
+ * 1. size api 确认
+ * 2. 修改类名结构
+ * 3. 支持带数字展示
+ * 4. InputGroup 模式支持
+ * 5. 手动聚焦支持额外配置
  */
 export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | null>>;
 export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
@@ -17,10 +24,6 @@ export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
      * 开启输入框自动聚焦
      */
     autoFocus?: boolean;
-    /**
-     * 输入框字段名称
-     */
-    name?: string;
     /**
      * 设置输入框的值
      */
@@ -32,17 +35,17 @@ export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
     /**
      * 设置输入框类型，支持原生 input 的 type 属性所有值
      */
-    type?: 'text' | 'number' | string;
+    type?: 'text' | 'id' | 'tel' | 'card' | 'amount' | 'email' | string;
     /**
      * 输入最大长度
      */
     maxLength?: number;
     /**
-     * 输入框前置外部标签
+     * 输入框前置外部内容
      */
     prepend?: React.ReactNode;
     /**
-     * 输入框后置外部标签
+     * 输入框后置外部内容
      */
     append?: React.ReactNode;
     /**
@@ -58,17 +61,13 @@ export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
      */
     clearable?: boolean;
     /**
-     * 再失焦时触发对值的 trim onChange 给用户
+     * 开启失焦时触发对值的 trim，将触发 onChange 给用户
      */
     trimValueOnBlur?: boolean;
     /**
      * 清除按钮展示的触发形态
      */
     clearableTrigger?: 'always' | 'hover';
-    /**
-     * 开启动画浮动提示
-     */
-    floatLabel?: React.ReactNode;
     /**
      * 输入框占位符
      */
@@ -79,13 +78,13 @@ export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
      */
     appearance?: 'outline' | 'unset' | 'filled' | 'underline';
     /**
-     * 设置输入框尺寸
+     * 设置尺寸
      */
     size?: 'sm' | 'md' | 'lg';
     /**
      * 值改变时的回调
      */
-    onChange?: (evt: React.ChangeEvent<HTMLInputElement>) => void;
+    onChange?: (evt: React.ChangeEvent<HTMLInputElement>, value: string) => void;
 }
 /**
  * 模拟伪装目标事件 target
@@ -96,4 +95,4 @@ export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
  * @param targetValue
  * @returns
  */
-export declare function onChangeMock(onChange: (event: React.ChangeEvent<HTMLInputElement>) => void, evt: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLElement>, target: HTMLInputElement | null, targetValue: string): void;
+export declare function onChangeMock(onChange: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void, evt: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLElement>, target: HTMLInputElement | null, targetValue: string): void;

package/lib/types/MockInput.d.ts

@@ -3,7 +3,7 @@ import type { HiBaseDataItem, HiBaseHTMLFieldProps } from '@hi-ui/core';
 /**
  * 支持自定义渲染输入框内容，暂时仅供内部 Picker 类组件使用，不对外提供
  */
-export declare const MockInput: React.ForwardRefExoticComponent<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "disabled" | "readOnly" | "placeholder" | "defaultValue" | "value" | "onChange" | "focused" | "type" | "onSelect" | "title" | "size" | "prefix" | "data" | "onClick" | "appearance" | "suffix" | "clearableTrigger" | "clearable" | "displayRender"> & {
+export declare const MockInput: React.ForwardRefExoticComponent<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "disabled" | "readOnly" | "placeholder" | "defaultValue" | "value" | "onChange" | "type" | "focused" | "onSelect" | "title" | "size" | "prefix" | "data" | "onClick" | "appearance" | "suffix" | "clearableTrigger" | "clearable" | "displayRender"> & {
     prefixCls?: string | undefined;
     role?: string | undefined;
 } & {
@@ -18,7 +18,7 @@ export declare const MockInput: React.ForwardRefExoticComponent<Omit<Pick<React.
     /**
      * 多选值改变时的回调
      */
-    onChange?: ((values: React.ReactText) => void) | undefined;
+    onChange?: ((value: React.ReactText, item: any) => void) | undefined;
     /**
      * 是否可清空
      */
@@ -82,7 +82,7 @@ export declare type MockInputProps = HiBaseHTMLFieldProps<'div', {
     /**
      * 多选值改变时的回调
      */
-    onChange?: (values: React.ReactText) => void;
+    onChange?: (value: React.ReactText, item: any) => void;
     /**
      * 是否可清空
      */

package/lib/types/TextArea.d.ts

@@ -2,10 +2,17 @@ import React from 'react';
 import { HiBaseHTMLFieldProps } from '@hi-ui/core';
 import { UseInputProps } from './use-input';
 /**
- * TODO: What is TextArea
+ * 动态文本域输入框
+ *
+ *  @TODO:
+ * 1. 支持带数字展示
+ * 2. 支持自适应行高大小
+ * 3. 支持清空按钮
+ * 4. 支持最大最小行支持
+ * 5. 手动聚焦支持额外配置
  */
 export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement | null>>;
-export interface TextAreaProps extends HiBaseHTMLFieldProps<'textarea'>, Omit<UseInputProps, 'onFocus' | 'onBlur' | 'onChange'> {
+export interface TextAreaProps extends HiBaseHTMLFieldProps<'textarea'>, Omit<UseInputProps, 'onFocus' | 'onBlur' | 'onChange' | 'type'> {
     /**
      * 设置输入框尺寸
      */

package/lib/types/use-input.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
-export declare const useInput: ({ name, autoFocus, disabled, readOnly, maxLength, placeholder, defaultValue, value: valueProp, onChange, onFocus, onBlur, trimValueOnBlur, }: UseInputProps) => {
+export declare const useInput: ({ name, autoFocus, disabled, readOnly, maxLength, placeholder, defaultValue, value: valueProp, onChange, onFocus, onBlur, trimValueOnBlur, type, clearElementRef, }: UseInputProps) => {
     focused: boolean;
     value: string;
     tryChangeValue: (stateOrFunction: React.SetStateAction<string>, ...args: any[]) => void;
     getInputProps: () => {
         value: string;
-        onChange: (evt: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+        onChange: (evt: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>, trim?: any) => void;
         onFocus: (evt: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
         onBlur: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
         name: string | undefined;
@@ -66,5 +66,13 @@ export interface UseInputProps {
      * 输入框失焦时的回调
      */
     onBlur?: (evt: React.FocusEvent<any>) => void;
+    /**
+     * 设置输入框类型，支持原生 input 的 type 属性所有值
+     */
+    type?: 'text' | 'id' | 'tel' | 'card' | 'amount' | 'email' | string;
+    /**
+     * @private
+     */
+    clearElementRef?: any;
 }
 export declare type useInputReturn = ReturnType<typeof useInput>;

package/lib/types/utils/index.d.ts

@@ -17,7 +17,15 @@ export declare const pureCard: (val: string) => string;
  * 金额自动生成小数
  * @param {string} val  需要处理的值
  */
-export declare const formatAmount: (val: string) => string;
+export declare const formatAmount: (val: string, fill?: boolean) => string;
 export declare const pureAmount: (val: string) => string;
 export declare const formatEmail: (val: string) => string;
 export declare const pureEmail: (val: string) => string;
+/**
+ * 输入规则
+ */
+export declare const format: (val: string, type: string) => string;
+/**
+ * 净化规则
+ */
+export declare const pure: (val: string, type: string) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/input",
-  "version": "4.0.0-alpha.24",
+  "version": "4.0.0-alpha.28",
   "description": "A sub-package for @hi-ui/hiui.",
   "keywords": [],
   "author": "HIUI <mi-hiui@xiaomi.com>",
@@ -44,23 +44,23 @@
   },
   "dependencies": {
     "@hi-ui/classname": "^4.0.0-alpha.3",
-    "@hi-ui/core": "^4.0.0-alpha.14",
-    "@hi-ui/core-css": "^4.0.0-alpha.10",
+    "@hi-ui/core": "^4.0.0-alpha.17",
+    "@hi-ui/core-css": "^4.0.0-alpha.13",
     "@hi-ui/dom-utils": "^4.0.0-alpha.6",
     "@hi-ui/env": "^4.0.0-alpha.5",
-    "@hi-ui/icons": "^4.0.0-alpha.20",
+    "@hi-ui/icons": "^4.0.0-alpha.24",
     "@hi-ui/use-latest": "^4.0.0-alpha.4",
     "@hi-ui/use-merge-refs": "^4.0.0-alpha.4",
     "@hi-ui/use-uncontrolled-state": "^4.0.0-alpha.12"
   },
   "peerDependencies": {
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1"
+    "react": ">=16.8.6",
+    "react-dom": ">=16.8.6"
   },
   "devDependencies": {
     "@hi-ui/hi-build": "^4.0.0-alpha.4",
     "react": "^17.0.1",
     "react-dom": "^17.0.1"
   },
-  "gitHead": "dbe7ec19bc067527f0cfcf8c71100619fc98cc72"
+  "gitHead": "88a8b8aa1b659b247bfca62f2f8ba594c25b90f6"
 }