linkmore-design 1.1.18 → 1.1.19

package/lib/Select/index.d.ts

@@ -6,6 +6,9 @@ export interface ISelectProps extends SelectProps {
     Option?: typeof Select.Option;
     OptGroup?: typeof Select.OptGroup;
     defaultLabel?: string;
+    suffix?: React.ReactNode;
+    icon?: React.ReactNode;
+    iconClick?: () => void;
 }
 declare type SelectType = typeof Select & typeof Select.Option & typeof Select.OptGroup;
 declare const LMSelect: SelectType;

package/lib/Select/index.js

@@ -15,6 +15,8 @@ var _select = _interopRequireDefault(require("antd/es/select"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _Button = _interopRequireDefault(require("../Button"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
 
 var _SizeContext = _interopRequireDefault(require("../ConfigProvider/SizeContext"));
@@ -44,8 +46,11 @@ var CLMSelect = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       options = props.options,
       value = props.value,
       defaultLabel = props.defaultLabel,
+      suffix = props.suffix,
+      icon = props.icon,
+      iconClick = props.iconClick,
       rest = __rest(props // ===================== Size =====================
-  , ["children", "className", "size", "disabled", "dropdownClassName", "options", "value", "defaultLabel"]); // ===================== Size =====================
+  , ["children", "className", "size", "disabled", "dropdownClassName", "options", "value", "defaultLabel", "suffix", "icon", "iconClick"]); // ===================== Size =====================
 
 
   var size = customizeSize || _react.default.useContext(_SizeContext.default) || 'middle'; // ===================== Disabled =====================
@@ -84,6 +89,29 @@ var CLMSelect = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     if (value && !hasOption) return defaultLabel !== null && defaultLabel !== void 0 ? defaultLabel : value;
     return value;
   }, [value, defaultLabel, hasOption]);
+
+  if (icon) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: 'lm_select_has_icon',
+      style: props.style
+    }, /*#__PURE__*/_react.default.createElement(_select.default, Object.assign({
+      className: (0, _classnames.default)(className, prefixCls),
+      size: size,
+      ref: ref,
+      value: resetValue,
+      options: options,
+      disabled: mergedDisabled || undefined
+    }, rest, {
+      dropdownClassName: (0, _classnames.default)('lm_select_dropdown', dropdownClassName)
+    }), children), /*#__PURE__*/_react.default.createElement(_Button.default, {
+      size: size,
+      onClick: iconClick,
+      className: 'lm_select_icon_button',
+      disabled: mergedDisabled || undefined,
+      icon: icon
+    }));
+  }
+
   return /*#__PURE__*/_react.default.createElement(_select.default, Object.assign({
     className: (0, _classnames.default)(className, prefixCls),
     size: size,

package/lib/Select/style/index.css

@@ -526,3 +526,30 @@ p {
 .lm_select_dropdown .ant-select-item-option-disabled {
   color: var(--disabled-font-color);
 }
+.lm_select_has_icon {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+}
+.lm_select_has_icon .ant-select {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  z-index: 3;
+}
+.lm_select_has_icon .ant-select .ant-select-selector {
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
+}
+.lm_select_has_icon .lm_select_icon_button {
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  z-index: 2;
+}
+.lm_select_has_icon .lm_select_icon_button:hover,
+.lm_select_has_icon .lm_select_icon_button:focus {
+  z-index: 5;
+}

package/lib/Select/style/variables.css

@@ -14,3 +14,30 @@
 .lm_select_dropdown .ant-select-item-option-disabled {
   color: var(--disabled-font-color);
 }
+.lm_select_has_icon {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+}
+.lm_select_has_icon .ant-select {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  z-index: 3;
+}
+.lm_select_has_icon .ant-select .ant-select-selector {
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
+}
+.lm_select_has_icon .lm_select_icon_button {
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  z-index: 2;
+}
+.lm_select_has_icon .lm_select_icon_button:hover,
+.lm_select_has_icon .lm_select_icon_button:focus {
+  z-index: 5;
+}

package/lib/TreeSelect/index.js

@@ -15,6 +15,10 @@ var _treeSelect = _interopRequireDefault(require("antd/es/tree-select"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _DisabledContext = _interopRequireDefault(require("../ConfigProvider/DisabledContext"));
+
+var _SizeContext = _interopRequireDefault(require("../ConfigProvider/SizeContext"));
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -33,8 +37,19 @@ var CLMTreeSelect = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       treeData = props.treeData,
       value = props.value,
       defaultLabel = props.defaultLabel,
-      resetProps = __rest(props, ["children", "treeData", "value", "defaultLabel"]);
+      customDisabled = props.disabled,
+      customizeSize = props.size,
+      resetProps = __rest(props // ===================== Disabled =====================
+  , ["children", "treeData", "value", "defaultLabel", "disabled", "size"]); // ===================== Disabled =====================
+
+
+  var disabled = _react.default.useContext(_DisabledContext.default);
+
+  var mergedDisabled = customDisabled || disabled; // ===================== size =====================
+
+  var size = _react.default.useContext(_SizeContext.default);
 
+  var mergeSize = customizeSize || size;
   var deepChildren = (0, _react.useCallback)(function (arr) {
     var flag = false;
 
@@ -83,7 +98,10 @@ var CLMTreeSelect = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, [value, hasOption]);
   return /*#__PURE__*/_react.default.createElement(_treeSelect.default, Object.assign({
     ref: ref,
-    value: resetValue
+    className: 'lm_tree_select',
+    value: resetValue,
+    size: mergeSize,
+    disabled: mergedDisabled
   }, resetProps), children);
 });
 var LMTreeSelect = CLMTreeSelect;

package/lib/TreeSelect/style/index.css

@@ -510,3 +510,6 @@ html {
 p {
   margin-bottom: 0;
 }
+.lm_tree_select .ant-select-selection-placeholder {
+  font-size: 12px;
+}

package/lib/TreeSelect/style/variables.css

@@ -0,0 +1,3 @@
+.lm_tree_select .ant-select-selection-placeholder {
+  font-size: 12px;
+}

package/lib/styles/variables.css

@@ -746,12 +746,13 @@ p {
   padding: 0 var(--gap);
 }
 .ant-btn.lm-button {
-  border: 0;
   display: inline-flex !important;
   flex-direction: row;
   align-items: center;
   justify-content: center;
+  color: var(--font-color);
   vertical-align: middle;
+  border: 1px solid var(--stroke-color);
   box-shadow: none;
 }
 .ant-btn.lm-button .anticon {
@@ -769,12 +770,24 @@ p {
   white-space: nowrap;
 }
 .ant-btn.lm-button::before {
-  display: none !important;
+  position: absolute;
+  z-index: 1;
+  display: none;
+  background: #fff;
+  border-radius: inherit;
+  opacity: 0.35;
+  transition: opacity 0.2s;
+  content: '';
+  pointer-events: none;
+  inset: -1px;
+}
+.ant-btn.lm-button.ant-btn-loading::before {
+  display: block;
 }
 .ant-btn.lm-button:disabled {
+  color: var(--disabled-font-color) !important;
   background: var(--disabled-bg-color) !important;
   border: 1px solid var(--disabled-border-color) !important;
-  color: var(--disabled-font-color) !important;
 }
 .ant-btn.lm-button > span:not(.anticon) {
   font-size: 12px;
@@ -795,57 +808,46 @@ p {
 .ant-btn.lm-button-middle .anticon {
   font-size: 16px;
 }
-.ant-btn.lm-button-default {
-  border: 1px solid var(--stroke-color);
-  color: var(--font-color);
-}
-.ant-btn.lm-button-default-hover,
-.ant-btn.lm-button-default:hover {
-  border: 1px solid var(--primary-hover-color);
-  color: var(--primary-hover-color);
-}
-.ant-btn.lm-button-default.ant-btn-loading {
-  border-color: rgba(0, 0, 0, 0.15);
-  color: rgba(0, 0, 0, 0.15);
-}
 .ant-btn.lm-button-primary {
-  background: var(--primary-color);
   color: #fff;
+  background: var(--primary-color);
+  border-color: var(--primary-color);
 }
-.ant-btn.lm-button-primary-hover,
 .ant-btn.lm-button-primary:hover {
   background: var(--primary-hover-color);
 }
+.ant-btn.lm-button-primary:active {
+  background-color: var(--primary-click-color);
+}
 .ant-btn.lm-button-primary.ant-btn-loading {
   background: var(--primary-loading-color);
 }
 .ant-btn.lm-button-ghost {
   color: var(--font-color);
-  border-color: var(--color-15);
   background: transparent;
+  border: 1px solid var(--color-15);
 }
 .ant-btn.lm-button-danger {
-  border: 1px solid var(--error-color);
   color: var(--error-color);
   text-shadow: none;
+  border: 1px solid var(--error-color);
   box-shadow: none;
 }
-.ant-btn.lm-button-danger-hover,
 .ant-btn.lm-button-danger:hover {
-  border-color: var(--error-hover-color);
   color: var(--error-hover-color);
+  border-color: var(--error-hover-color);
 }
 .ant-btn.lm-button-danger.ant-btn-loading {
-  border-color: var(--error-loading-color);
   color: var(--error-hover-color);
+  border-color: var(--error-loading-color);
 }
 .ant-btn.lm-button-dashed {
   border: 1px dashed var(--color-15);
 }
 .ant-btn.lm-button-link {
   color: var(--primary-color);
+  border-color: transparent;
 }
-.ant-btn.lm-button-link-hover,
 .ant-btn.lm-button-link:hover {
   color: var(--primary-hover-color);
 }
@@ -853,11 +855,12 @@ p {
   color: var(--primary-loading-color);
 }
 .ant-btn.lm-button-link[disabled] {
-  border: 0 !important;
   background: transparent !important;
+  border: 0 !important;
 }
 .ant-btn.ant-btn-text {
   background: transparent;
+  border-color: transparent;
 }
 .ant-btn.lm-button-icon-only .anticon {
   font-size: 16px;
@@ -2241,6 +2244,9 @@ p {
   padding-right: 24px;
   padding-bottom: 8px;
 }
+.lm_descriptions .ant-descriptions-item:last-child {
+  padding-right: 0;
+}
 .lm_descriptions .ant-descriptions-item .ant-descriptions-item-container {
   color: var(--color-85);
   font-size: 12px;
@@ -9540,6 +9546,9 @@ p {
 .lm_input-number.ant-input-number-status-warning {
   border-color: var(--warning-color) !important;
 }
+.lm_input-number .ant-input-number-input::placeholder {
+  font-size: 12px;
+}
 .lm_grid_tree {
   position: relative;
   font-size: 12px;
@@ -12398,6 +12407,33 @@ button.ant-table-row-expand-icon::after {
 .lm_select_dropdown .ant-select-item-option-disabled {
   color: var(--disabled-font-color);
 }
+.lm_select_has_icon {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+}
+.lm_select_has_icon .ant-select {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  z-index: 3;
+}
+.lm_select_has_icon .ant-select .ant-select-selector {
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
+}
+.lm_select_has_icon .lm_select_icon_button {
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  z-index: 2;
+}
+.lm_select_has_icon .lm_select_icon_button:hover,
+.lm_select_has_icon .lm_select_icon_button:focus {
+  z-index: 5;
+}
 .ant-switch.lm-switch {
   width: 48px;
   height: 24px;
@@ -12574,6 +12610,9 @@ button.ant-table-row-expand-icon::after {
 .lm_tree .ant-tree-node-selected > .ant-tree-title {
   color: var(--primary-color);
 }
+.lm_tree_select .ant-select-selection-placeholder {
+  font-size: 12px;
+}
 .ant-upload-select-picture-card div {
   margin-top: 8px;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "linkmore-design",
-  "version": "1.1.18",
+  "version": "1.1.19",
   "author": {
     "name": "nowthen",
     "email": "rnlvwyx@gmail.com"
@@ -97,8 +97,8 @@
     "use-resize-observer": "^9.0.2"
   },
   "peerDependencies": {
-    "react": "17.0.1",
-    "react-dom": "17.0.1"
+    "react": ">= 17.0.1",
+    "react-dom": ">= 17.0.1"
   },
   "browserslist": [
     "> 1%",