@aloudata/aloudata-design 2.0.2 → 2.0.4

package/dist/Button/style/type.less

@@ -16,6 +16,10 @@
       text-shadow: none;
       text-decoration: none;
 
+      .ald-icon {
+        color: #fff;
+      }
+
       /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
       &:focus-visible {
         outline: none;
@@ -127,6 +131,10 @@
       border-color: @button-secondary-border-color;
       box-shadow: none;
 
+      .ald-icon {
+        color: #6b7280;
+      }
+
       &:focus {
         color: @button-secondary-color;
         //text-shadow: @text-shadow;
@@ -172,6 +180,10 @@
       border-color: @button-text-border-color;
       box-shadow: none;
 
+      .ald-icon {
+        color: #6b7280;
+      }
+
       &:focus {
         color: @button-text-color;
         background-color: @button-text-bg-color;
@@ -183,6 +195,10 @@
         color: @button-text-color-hover;
         background-color: @button-text-bg-color-hover;
         border-color: @button-text-border-color-hover;
+
+        .ald-icon {
+          color: #2986f4;
+        }
       }
 
       &:active {
@@ -190,6 +206,10 @@
         background-color: @button-text-bg-color-active;
         border-color: @button-text-border-color-active;
         box-shadow: none;
+
+        .ald-icon {
+          color: #2986f4;
+        }
       }
 
       &[disabled],

package/dist/Select/index.js

@@ -361,14 +361,46 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
       updatedRef.current = true;
     }
   }, [value, innerOptions, isMultiple, defaultValue]);
+  var wrapRef = useRef(null);
+  useEffect(function () {
+    var observer = new MutationObserver(function m(mutations) {
+      mutations.forEach(function (m) {
+        var target = m.target;
+        var classList = target.classList;
+        if (classList.contains('ant-select')) {
+          if (classList.contains('ant-select-focused')) {
+            console.log(222, JSON.stringify(classList));
+            setIsFocus(true);
+          } else {
+            console.log(111);
+            console.log(JSON.stringify(classList));
+            setIsFocus(false);
+          }
+        }
+        return;
+      });
+    });
+    // 以上述配置开始观察目标节点
+    if (wrapRef && wrapRef.current) {
+      observer.observe(wrapRef.current, {
+        attributeFilter: ['class'],
+        subtree: true,
+        attributeOldValue: true
+      });
+    }
+    return function () {
+      observer.disconnect();
+    };
+  }, [selectRef]);
   return /*#__PURE__*/React.createElement("div", {
+    ref: wrapRef,
     onMouseDown: function onMouseDown() {
       if (disabled) return;
       if (!isOpen && Date.now() - dropDownTimeRef.current > 300) {
         setIsOpen(!isOpen);
       }
     },
-    className: classNames('ald-select', className, (_classNames = {}, _defineProperty(_classNames, "ald-select-".concat(type), type === 'primary' || type === 'secondary'), _defineProperty(_classNames, 'ald-select-multiple', isMultiple), _defineProperty(_classNames, 'ald-select-single', !isMultiple), _defineProperty(_classNames, 'ald-select-large', size === 'large'), _defineProperty(_classNames, 'ald-select-small', size === 'small'), _defineProperty(_classNames, 'ald-select-disabled', mergedDisabled), _defineProperty(_classNames, 'ald-select-middle', size !== 'large' && size !== 'small'), _defineProperty(_classNames, 'ald-select-open', typeof _open === 'boolean' ? _open : isOpen), _defineProperty(_classNames, 'ald-select-focus', isFocus), _defineProperty(_classNames, "ald-select-status-".concat(mergedStatus), mergedStatus), _defineProperty(_classNames, 'ald-select-empty-show-all', type === 'primary'), _defineProperty(_classNames, 'ald-select-has-value', !_.isEmpty(value) || !_.isEmpty(currentValue)), _classNames), compactItemClassnames, hashId),
+    className: classNames('ald-select', className, (_classNames = {}, _defineProperty(_classNames, "ald-select-".concat(type), type === 'primary' || type === 'secondary'), _defineProperty(_classNames, 'ald-select-multiple', isMultiple), _defineProperty(_classNames, 'ald-select-single', !isMultiple), _defineProperty(_classNames, 'ald-select-large', size === 'large'), _defineProperty(_classNames, 'ald-select-small', size === 'small'), _defineProperty(_classNames, 'ald-select-disabled', mergedDisabled), _defineProperty(_classNames, 'ald-select-middle', size !== 'large' && size !== 'small'), _defineProperty(_classNames, 'ald-select-open', typeof _open === 'boolean' ? _open : isOpen), _defineProperty(_classNames, 'ald-select-focused', isFocus), _defineProperty(_classNames, "ald-select-status-".concat(mergedStatus), mergedStatus), _defineProperty(_classNames, 'ald-select-empty-show-all', type === 'primary'), _defineProperty(_classNames, 'ald-select-has-value', !_.isEmpty(value) || !_.isEmpty(currentValue)), _classNames), compactItemClassnames, hashId),
     spellCheck: false,
     style: Object.assign(styleVar, style)
   }, !!prefix && /*#__PURE__*/React.createElement("span", {
@@ -380,7 +412,7 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
     placeholder: placeholder,
     showSearch: showSearch,
     options: innerOptions,
-    showArrow: isMultiple ? false : showArrow,
+    showArrow: isMultiple && type === 'primary' ? false : showArrow,
     mode: isMultiple ? 'multiple' : undefined,
     bordered: false,
     open: typeof _open === 'boolean' ? _open : isOpen,
@@ -418,8 +450,9 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
     onFocus: function onFocus() {
       setIsFocus(true);
     },
-    onBlur: function onBlur() {
-      setIsFocus(false);
+    onBlur: function onBlur(e) {
+      var _props$onBlur;
+      (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, e);
     }
   })));
 });

package/dist/Select/style/emptyShowAll.less

@@ -8,3 +8,20 @@
     }
   }
 }
+
+.ald-select.ald-select-empty-show-all:not(.ald-select-has-value) {
+  .ant-select {
+    .ant-select-selector {
+      .ant-select-selection-placeholder {
+        right: auto;
+        padding-right: 0;
+      }
+
+      .ant-select-selection-overflow {
+        right: auto;
+        min-width: 24px;
+        padding-right: 0;
+      }
+    }
+  }
+}

package/dist/Select/style/status.less

@@ -35,6 +35,10 @@
     .select-color(var(--alias-colors-border-accent-gray-subtle-hover, #9ca3af), var(--alias-colors-bg-accent-gray-subtler-default, #F9FAFB),var(--alias-colors-text-default, #1f2937));
   }
 
+  &.ald-select-focused {
+    .select-color(var(--alias-colors-border-selected, #126fdd), var(--alias-colors-bg-accent-gray-subtler-default, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+  }
+
   &:active {
     .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-strong, #F3F4F6),var(--alias-colors-text-default, #1f2937));
   }
@@ -93,6 +97,10 @@
       .select-color(var(--alias-colors-border-accent-gray-subtle-hover, #9ca3af),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
     }
 
+    &.ald-select-focused {
+      .select-color(var(--alias-colors-border-selected, #126fdd),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
+    }
+
     &:active {
       .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
     }