diginet-core-ui 1.4.6-beta.1 → 1.4.7-beta.1

package/components/form-control/dropdown/index.js

@@ -144,7 +144,7 @@ const Dropdown = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   const _InputCSS = InputCSS(multiple, typeof renderSelectedItem === 'function');
   const _DropdownInputCSS = DropdownInputCSS(viewType, multiple, placeholder, disabled, readOnly, multilineSelectedItem);
   const _IconCSS = IconCSS(viewType);
-  const _DropdownFormCSS = DropdownFormCSS(viewType, multiple, disabled, placeholder, _DropdownInputCSS.name);
+  const _DropdownFormCSS = DropdownFormCSS(viewType, multiple, disabled, readOnly, placeholder, _DropdownInputCSS.name);
   const _DropdownListCSS = DropdownListCSS(loadingState);
   const _DropdownItemCSS = DropdownItemCSS(multiple, selectBox);
   const _DropdownRootCSS = DropdownRootCSS(_DropdownFormCSS.name, _DropdownInputCSS.name);
@@ -360,7 +360,7 @@ const Dropdown = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       // convert {id} - {name} to {<data[id]>} - {<data[name]>}
       if (!mask && regexBetween.test(displayExpr)) {
         var _displayExpr;
-        mask = (_displayExpr = displayExpr) === null || _displayExpr === void 0 ? void 0 : _displayExpr.replace(regexBetween, _ => data[_]);
+        mask = (_displayExpr = displayExpr) === null || _displayExpr === void 0 ? void 0 : _displayExpr.replace(regexBetween, _ => (data === null || data === void 0 ? void 0 : data[_]) || '');
       } else if (!mask) {
         mask = typeof data !== 'object' ? data : '';
       }
@@ -544,7 +544,7 @@ const Dropdown = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       };
       // Nếu đối tượng đã được hiển thị ở trên rồi thì không hiển thị ra nữa
       if (onLoadMore && i > notExistItem && currentObjectDefault[unique].some(valueObject => valueObject[valueExpr] === data[valueExpr])) continue;
-      let displayText = typeof data === 'object' ? keyArr ? renderData(data, keyArr) : data[displayExpr] || data[valueExpr] : data;
+      let displayText = typeof data === 'object' ? keyArr ? displayValue(data) : data[displayExpr] || data[valueExpr] : data;
       if (pattern && !new RegExp(pattern).test(displayText.normalize())) continue;
       const value = typeof data === 'object' ? data[valueExpr] : data;
       const icon = getIconFromData(data);
@@ -599,18 +599,24 @@ const Dropdown = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       }
     }
   };
-  const renderData = (data, keyArr) => {
-    const pattern = keyArr.join('|').replace(/([{}])/g, '\\$1');
-    const separatorArr = displayExpr.split(new RegExp(pattern));
-    let str = '';
-    let i = 0;
-    for (i; i < keyArr.length; i++) {
-      str += separatorArr[i] + (data[keyArr[i].replace(/\W/g, '')] !== undefined ? data[keyArr[i].replace(/\W/g, '')] : keyArr[i]);
-    }
-    return str + separatorArr[i];
-  };
+
+  // const renderData = (data, keyArr) => {
+  //     const pattern = keyArr.join('|').replace(/([{}])/g, '\\$1');
+  //     const separatorArr = displayExpr.split(new RegExp(pattern));
+  //     let str = '';
+  //     let i = 0;
+  //     for (i; i < keyArr.length; i++) {
+  //         str +=
+  //             separatorArr[i] +
+  //             (data[keyArr[i].replace(/\W/g, '')] !== undefined
+  //                 ? data[keyArr[i].replace(/\W/g, '')]
+  //                 : keyArr[i]);
+  //     }
+  //     return str + separatorArr[i];
+  // };
+
   const getIconFromData = (data, insideChip = false) => {
-    if (!iconExpr || iconExpr === 'none') return null;
+    if (!data || !iconExpr || iconExpr === 'none') return null;
     let _src;
     if (typeof iconExpr === 'string') _src = data[iconExpr];else {
       let prefix = iconExpr.prefix || '';
@@ -1054,7 +1060,7 @@ const Dropdown = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     currentValue[unique].push(value);
   };
   const setSingleValueHandler = (data, keyArr) => {
-    const text = keyArr ? renderData(data, keyArr) : typeof renderSelectedItem === 'string' ? data[renderSelectedItem] : data[displayExpr] || data[valueExpr] || data;
+    const text = keyArr ? displayValue(data) : typeof renderSelectedItem === 'string' ? data[renderSelectedItem] : data[displayExpr] || data[valueExpr] || data;
     const renderContent = content => jsx(Typography, {
       type: 'p1',
       lineClamp: multilineSelectedItem ? undefined : 1,
@@ -1314,43 +1320,28 @@ const Dropdown = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     }, valueMulti.map((vl, index) => {
       let dataFilter = getData();
       const data = dataFilter.find(v => v[valueExpr] === vl || v === vl);
-      let text = '';
-      if (data || data === 0) {
-        displayExpr = displayExpr || valueExpr;
-        // displayExpr =
-        //     typeof renderSelectedItem === 'string'
-        //         ? renderSelectedItem
-        //         : displayExpr || valueExpr;
-        let mask = data === null || data === void 0 ? void 0 : data[displayExpr];
-
-        // convert {id} - {name} to {<data[id]>} - {<data[name]>}
-        if (!mask && regexBetween.test(displayExpr)) {
-          var _displayExpr3;
-          mask = (_displayExpr3 = displayExpr) === null || _displayExpr3 === void 0 ? void 0 : _displayExpr3.replace(regexBetween, _ => data[_]);
-        } else if (!mask) {
-          mask = typeof data !== 'object' ? data : '';
+      if (data) {
+        const displayText = displayValue(data);
+        let item;
+        if (typeof renderSelectedItem === 'function') {
+          item = renderSelectedItem({
+            data,
+            index
+          });
+        } else {
+          item = jsx(Chip, {
+            css: [parseWidth('100%'), parseMaxWidth('max-content')],
+            key: index,
+            startIcon: getIconFromData(data, true),
+            label: displayText,
+            size: 'medium',
+            disabled: disabled,
+            clearAble: !readOnly && !disabled,
+            onRemove: e => onRemove(e, vl)
+          });
         }
-        text = mask.toString().replace(regexInclude, '');
-      }
-      let item;
-      if (typeof renderSelectedItem === 'function') {
-        item = renderSelectedItem({
-          data,
-          index
-        });
-      } else {
-        item = jsx(Chip, {
-          css: [parseWidth('100%'), parseMaxWidth('max-content')],
-          key: index,
-          startIcon: getIconFromData(data, true),
-          label: text,
-          size: 'medium',
-          disabled: disabled,
-          clearAble: !readOnly && !disabled,
-          onRemove: e => onRemove(e, vl)
-        });
+        return item;
       }
-      return item;
     })) : typeof renderSelectedItem === 'function' || iconExpr && iconExpr !== 'none' ? jsx("div", {
       ...inputProps,
       style: inputStyle,
@@ -1491,7 +1482,7 @@ const IconCSS = viewType => css`
     ${mgl([2])};
     ${mgr([viewType !== 'outlined' ? 0 : 4])};
 `;
-const DropdownFormCSS = (viewType, multiple, disabled, placeholder, DropdownInputCSSName) => viewType !== 'outlined' ? css`
+const DropdownFormCSS = (viewType, multiple, disabled, readOnly, placeholder, DropdownInputCSSName) => viewType !== 'outlined' ? css`
               ${displayFlex};
               ${flexRow};
               ${itemsCenter};
@@ -1499,7 +1490,7 @@ const DropdownFormCSS = (viewType, multiple, disabled, placeholder, DropdownInpu
               ${boxBorder};
               ${parseWidth('100%')};
               ${pdy([multiple ? 0.25 : 1])};
-              ${!disabled && css`
+              ${!disabled && !readOnly && css`
                   &:not(:focus-within):hover {
                       &::before {
                           ${borderBottomColor('system/active')};
@@ -1559,7 +1550,7 @@ const DropdownFormCSS = (viewType, multiple, disabled, placeholder, DropdownInpu
               ${parseWidth('100%')};
               ${parseMinHeight(40)};
               ${mgt([0.5])};
-              ${!disabled && css`
+              ${!disabled && !readOnly && css`
                   &:not(:focus-within):hover {
                       ${bgColor('fill/hover')};
                       ${borderColor('system/active')};

package/components/form-control/number-input/index2.js

@@ -82,13 +82,13 @@ const NumberInput = /*#__PURE__*/forwardRef(({
 
   // if (valueProps || valueProps === 0) valueProps = clamp(valueProps, min, max);
 
-  /**
-   * Convert number to format money
-   * @param vl {number} - value
-   * @type {function}
-   * @return {string}
-   * @example 1200300.123 => 1,200,300.123
-   * @example 1200300,123 => 1.200.300,123
+  /**
+   * Convert number to format money
+   * @param vl {number} - value
+   * @type {function}
+   * @return {string}
+   * @example 1200300.123 => 1,200,300.123
+   * @example 1200300,123 => 1.200.300,123
    */
   const parseNumberToMoney = useCallback((vl, isNumber) => {
     var _number, _number2, _number$, _number3;
@@ -124,13 +124,13 @@ const NumberInput = /*#__PURE__*/forwardRef(({
     return number;
   }, [decimalSymbol, max, value]);
 
-  /**
-   * Convert money to format number
-   * @param vl {string} - value
-   * @type {function}
-   * @return {number}
-   * @example 1,200,300.123 => 1200300.123
-   * @example 1.200.300,123 => 1200300.123
+  /**
+   * Convert money to format number
+   * @param vl {string} - value
+   * @type {function}
+   * @return {number}
+   * @example 1,200,300.123 => 1200300.123
+   * @example 1.200.300,123 => 1200300.123
    */
   const convertMoneyToNumber = useCallback((vl, isNumber) => {
     var _number4, _number4$toString, _number4$toString$rep, _number4$toString$rep2, _number4$toString$rep3;
@@ -440,10 +440,10 @@ NumberInput.propTypes = {
   style: PropTypes.object,
   /** Thousand separator character. */
   thousandSeparator: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['.', ','])]),
-  /** Validation value, argument can:<br/>
-   * * string: the validation rule. Example required.<br/>
-   * * object: the validation rule insist name, property, message. Example {name: 'min', compareValue: 9, message: 'Error'} or {max: 99}<br/>
-   * * array: the validation rule list, insist object/string
+  /** Validation value, argument can:<br/>
+   * * string: the validation rule. Example required.<br/>
+   * * object: the validation rule insist name, property, message. Example {name: 'min', compareValue: 9, message: 'Error'} or {max: 99}<br/>
+   * * array: the validation rule list, insist object/string
    */
   validates: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.array, PropTypes.func]),
   /** The value of the input element, required for a controlled component. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "diginet-core-ui",
-  "version": "1.4.6-beta.1",
+  "version": "1.4.7-beta.1",
   "description": "",
   "main": "index.js",
   "license": "UNLICENSED",

package/readme.md

@@ -38,6 +38,9 @@ npm test
 ```
 
 ## Changelog
+## 1.4.7
+- \[Changed\]: Button – Remove attribute disabled in button tag
+
 ## 1.4.6
 - \[Added\]: Icon – Add MoneyHand
 - \[Changed\]: DatePicker – Add default placeholder