linkmore-design 1.0.83 → 1.0.85

package/lib/Button/index.js

@@ -17,6 +17,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var _SizeContext = _interopRequireDefault(require("@/ConfigProvider/SizeContext"));
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -33,14 +35,15 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
 var LMButton = function LMButton(props) {
   var children = props.children,
       className = props.className,
-      _props$size = props.size,
-      size = _props$size === void 0 ? 'middle' : _props$size,
+      customizeSize = props.size,
       _props$type = props.type,
       type = _props$type === void 0 ? 'default' : _props$type,
       _props$hover = props.hover,
       hover = _props$hover === void 0 ? false : _props$hover,
       restProps = __rest(props, ["children", "className", "size", "type", "hover"]);
 
+  var size = customizeSize || _react.default.useContext(_SizeContext.default) || 'middle'; // const { getPrefixCls, autoInsertSpaceInButton, direction } = React.useContext(ConfigContext);
+
   var classs = (0, _classnames.default)('lm-button', className, {
     'lm-button-icon-only': !children
   }, (0, _defineProperty2.default)({}, "lm-button-".concat(size), size), (0, _defineProperty2.default)({}, "lm-button-".concat(type), type), (0, _defineProperty2.default)({}, "lm-button-".concat(type, "-hover"), type && hover));

package/lib/ConfigProvider/cssVariables.js

@@ -98,7 +98,7 @@ function getStyle(globalPrefixCls, theme) {
 
 
   var cssList = Object.keys(variables).map(function (key) {
-    return "--".concat(globalPrefixCls, "-").concat(key, ": ").concat(variables[key], ";");
+    return globalPrefixCls ? "--".concat(globalPrefixCls, "-").concat(key, ": ").concat(variables[key], ";") : "--".concat(key, ": ").concat(variables[key], ";");
   });
   return "\n  :root {\n    ".concat(cssList.join('\n'), "\n  }\n  ").trim();
 }

package/lib/ConfigProvider/index.d.ts

@@ -8,7 +8,7 @@ import type { CSPConfig, DirectionType, ConfigConsumerProps } from './context';
 import type { RenderEmptyHandler } from './defaultRenderEmpty';
 import type { SizeType } from './SizeContext';
 import SizeContext from './SizeContext';
-export { RenderEmptyHandler, ConfigContext, ConfigConsumer, CSPConfig, DirectionType, ConfigConsumerProps, };
+export { RenderEmptyHandler, ConfigContext, ConfigConsumer, CSPConfig, DirectionType, ConfigConsumerProps, SizeType };
 export declare const configConsumerProps: string[];
 export interface ConfigProviderProps {
     getTargetContainer?: () => HTMLElement;
@@ -43,7 +43,7 @@ export interface ConfigProviderProps {
     virtual?: boolean;
     dropdownMatchSelectWidth?: boolean;
 }
-export declare const defaultPrefixCls = "ant";
+export declare const defaultPrefixCls = "";
 export declare const defaultIconPrefixCls = "anticon";
 declare function getGlobalIconPrefixCls(): string;
 declare const setGlobalConfig: ({ prefixCls, iconPrefixCls, theme, }: Pick<ConfigProviderProps, "prefixCls" | "iconPrefixCls"> & {

package/lib/ConfigProvider/index.js

@@ -21,6 +21,10 @@ Object.defineProperty(exports, "ConfigContext", {
 });
 exports.globalConfig = exports.defaultPrefixCls = exports.defaultIconPrefixCls = exports.default = exports.configConsumerProps = void 0;
 
+require("antd/es/config-provider/style");
+
+var _configProvider = _interopRequireDefault(require("antd/es/config-provider"));
+
 var _Context = _interopRequireDefault(require("@ant-design/icons/lib/components/Context"));
 
 var _rcFieldForm = require("rc-field-form");
@@ -51,7 +55,8 @@ var configConsumerProps = ['getTargetContainer', 'getPopupContainer', 'rootPrefi
 
 exports.configConsumerProps = configConsumerProps;
 var PASSED_PROPS = ['getTargetContainer', 'getPopupContainer', 'renderEmpty', 'pageHeader', 'input', 'pagination', 'form'];
-var defaultPrefixCls = 'ant';
+var defaultPrefixCls = ''; //'ant';
+
 exports.defaultPrefixCls = defaultPrefixCls;
 var defaultIconPrefixCls = 'anticon';
 exports.defaultIconPrefixCls = defaultIconPrefixCls;
@@ -237,12 +242,12 @@ var ConfigProvider = function ConfigProvider(props) {
     /*#__PURE__*/
     // @ts-ignore
     React.createElement(_LocaleReceiver.default, null, function (_, __, legacyLocale) {
-      return /*#__PURE__*/React.createElement(_context.ConfigConsumer, null, function (context) {
+      return /*#__PURE__*/React.createElement(_configProvider.default, Object.assign({}, props), /*#__PURE__*/React.createElement(_context.ConfigConsumer, null, function (context) {
         return /*#__PURE__*/React.createElement(ProviderChildren, Object.assign({
           parentContext: context,
           legacyLocale: legacyLocale
         }, props));
-      });
+      }));
     })
   );
 };

package/lib/DatePicker/generatePicker/generateSinglePicker.js

@@ -25,12 +25,6 @@ var React = _interopRequireWildcard(require("react"));
 
 var _ = require(".");
 
-var _configProvider = require("antd/es/config-provider");
-
-var _DisabledContext = _interopRequireDefault(require("antd/es/config-provider/DisabledContext"));
-
-var _SizeContext = _interopRequireDefault(require("antd/es/config-provider/SizeContext"));
-
 var _context = require("antd/es/form/context");
 
 var _LocaleReceiver = _interopRequireDefault(require("antd/es/locale-provider/LocaleReceiver"));
@@ -43,6 +37,12 @@ var _en_US = _interopRequireDefault(require("antd/es/date-picker/locale/en_US"))
 
 var _util = require("../util");
 
+var _SizeContext = _interopRequireDefault(require("@/ConfigProvider/SizeContext"));
+
+var _DisabledContext = _interopRequireDefault(require("@/ConfigProvider/DisabledContext"));
+
+var _context2 = require("@/ConfigProvider/context");
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -74,7 +74,7 @@ function generatePicker(generateConfig) {
       console.log(restProps, '---restProps');
       (0, _warning.default)(picker !== 'quarter', displayName, "DatePicker.".concat(displayName, " is legacy usage. Please use DatePicker[picker='").concat(picker, "'] directly."));
 
-      var _useContext = (0, React.useContext)(_configProvider.ConfigContext),
+      var _useContext = (0, React.useContext)(_context2.ConfigContext),
           getPrefixCls = _useContext.getPrefixCls,
           direction = _useContext.direction,
           getPopupContainer = _useContext.getPopupContainer;

package/lib/Form/container.js

@@ -17,6 +17,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _lodash = require("lodash");
 
+var _util = require("./util");
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -77,22 +79,7 @@ var LMContainer = function LMContainer(props) {
   var changeSize = function changeSize() {
     var _a;
 
-    var index = 1;
-    containerWrapRef.current.querySelectorAll('.ant-form-item').forEach(function (el) {
-      if (el.classList.contains('ant-form-item-responsive')) {
-        if (index % 3 === 0) {
-          el.classList.add('nth-three');
-        } else if (index % 4 === 0) {
-          el.classList.add('nth-four');
-        } else if (index % 5 === 0) {
-          el.classList.add('nth-five');
-        }
-
-        index++;
-      } else {
-        index = 1;
-      }
-    });
+    (0, _util.updateFormResponsiveClass)(containerWrapRef.current);
 
     var _ref = ((_a = containerWrapRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) || {},
         _ref$width = _ref.width,

package/lib/Form/style/index.css

@@ -563,10 +563,10 @@ p {
   flex-direction: row;
   flex-wrap: wrap;
 }
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item {
+.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive {
   margin-right: 24px;
 }
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item .ant-form-item-control {
+.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive .ant-form-item-control {
   width: 100%;
 }
 .lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item {
@@ -684,3 +684,9 @@ p {
 .lm_form-item-tip-error-bottom .ant-form-item-explain .ant-form-item-explain-error {
   margin-left: -4px;
 }
+.ant-form-item.ant-form-item-responsive .lm_select {
+  width: 100%;
+}
+.ant-form-item-explain-error {
+  font-size: 12px;
+}

package/lib/Form/util.d.ts

@@ -1,3 +1,4 @@
 import type { InternalNamePath } from './interface';
 export declare function toArray<T>(candidate?: T | T[] | false): T[];
 export declare function getFieldId(namePath: InternalNamePath, formName?: string): string | undefined;
+export declare function updateFormResponsiveClass(dom: HTMLElement): void;

package/lib/Form/util.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getFieldId = getFieldId;
 exports.toArray = toArray;
+exports.updateFormResponsiveClass = updateFormResponsiveClass;
 // form item name black list.  in form ,you can use form.id get the form item element.
 // use object hasOwnProperty will get better performance if black list is longer.
 var formItemNameBlackList = ['parentNode']; // default form item id prefix.
@@ -26,4 +27,27 @@ function getFieldId(namePath, formName) {
 
   var isIllegalName = formItemNameBlackList.indexOf(mergedId) >= 0;
   return isIllegalName ? "".concat(defaultItemNamePrefixCls, "_").concat(mergedId) : mergedId;
+}
+
+function updateFormResponsiveClass(dom) {
+  var form = dom.tagName.toLocaleLowerCase() === 'form' ? dom : dom.querySelector('form');
+
+  if (form) {
+    var index = 0;
+    Array.prototype.slice.call(form.children).forEach(function (element) {
+      if (element.classList.contains('ant-form-item-responsive')) {
+        index += 1;
+
+        if (index % 3 === 0) {
+          element.classList.add('nth-three');
+        } else if (index % 4 === 0) {
+          element.classList.add('nth-four');
+        } else if (index % 5 === 0) {
+          element.classList.add('nth-five');
+        }
+      } else {
+        index = 0;
+      }
+    });
+  }
 }

package/lib/ImageViewer/components/Carousel.js

@@ -16,7 +16,8 @@ var ListItem = function ListItem(_ref) {
       index = _ref.index,
       item = _ref.item,
       instance = _ref.instance;
-  var state = instance.state;
+  var state = instance.state,
+      getIsVideo = instance.getIsVideo;
   var transformProps = (0, _react.useMemo)(function () {
     if (index !== state.currentIndex) return {};
     var _state$transform = state.transform,
@@ -29,7 +30,24 @@ var ListItem = function ListItem(_ref) {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "preview_item",
     key: key
-  }, /*#__PURE__*/_react.default.createElement("img", {
+  }, getIsVideo(item) ?
+  /*#__PURE__*/
+  // @ts-ignore
+  // eslint-disable-next-line jsx-a11y/media-has-caption
+  _react.default.createElement("video", {
+    width: "100%",
+    height: "100%",
+    controls: "controls"
+  }, /*#__PURE__*/_react.default.createElement("source", {
+    src: item,
+    type: "video/mp4"
+  }), /*#__PURE__*/_react.default.createElement("source", {
+    src: item,
+    type: "video/webm"
+  }), /*#__PURE__*/_react.default.createElement("source", {
+    src: item,
+    type: "video/ogg"
+  }), "\u89C6\u9891\u64AD\u653E\u5931\u8D25\uFF01") : /*#__PURE__*/_react.default.createElement("img", {
     src: item,
     alt: "",
     style: transformProps

package/lib/ImageViewer/components/Thumb.js

@@ -13,8 +13,28 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var Thumb = function Thumb(_ref) {
-  var instance = _ref.instance;
+var _linkmoreDesign = require("linkmore-design");
+
+var ThumbItem = function ThumbItem(_ref) {
+  var item = _ref.item,
+      instance = _ref.instance;
+  var getIsVideo = instance.getIsVideo;
+
+  if (getIsVideo(item)) {
+    return /*#__PURE__*/_react.default.createElement(_linkmoreDesign.IconFont, {
+      type: "lmweb-video",
+      className: "thumb_item_icon"
+    });
+  }
+
+  return /*#__PURE__*/_react.default.createElement("img", {
+    src: item,
+    alt: ""
+  });
+};
+
+var Thumb = function Thumb(_ref2) {
+  var instance = _ref2.instance;
   var state = instance.state,
       urlList = instance.urlList,
       slickGoTo = instance.slickGoTo;
@@ -39,9 +59,9 @@ var Thumb = function Thumb(_ref) {
       onClick: function onClick(e) {
         return handleGoTo(e, idx);
       }
-    }, /*#__PURE__*/_react.default.createElement("img", {
-      src: v,
-      alt: ""
+    }, /*#__PURE__*/_react.default.createElement(ThumbItem, {
+      item: v,
+      instance: instance
     }));
   }));
 };

package/lib/ImageViewer/fns/index.d.ts

@@ -6,6 +6,7 @@ declare const useCoreOptions: ({ state, dispatch, props, previewRef }: {
 }) => {
     CoreMethods: {
         getVisible: () => any;
+        getIsVideo: (url: any) => boolean;
         onClose: () => void;
         setTransform: (type: any) => void;
         afterChange: (currentIndex: any) => void;

package/lib/ImageViewer/fns/index.js

@@ -15,7 +15,12 @@ var useCoreOptions = function useCoreOptions(_ref) {
   // 获取显示状态
   var getVisible = (0, _react.useCallback)(function () {
     return typeof props.visible === 'boolean' ? props.visible : state.visible;
-  }, [props, state.visible]); // 关闭事件
+  }, [props.visible, state.visible]); // 获取是否为视频格式
+
+  var getIsVideo = (0, _react.useCallback)(function (url) {
+    var fileExtension = url.replace(/.*\./, '').toLowerCase();
+    return ['mp4', 'm2v', 'mkv', 'ogm', 'webm'].includes(fileExtension);
+  }, []); // 关闭事件
 
   var onClose = (0, _react.useCallback)(function () {
     var _a;
@@ -84,8 +89,20 @@ var useCoreOptions = function useCoreOptions(_ref) {
   var slickPrev = (0, _react.useCallback)(function () {
     previewRef.current.prev();
   }, []);
+  (0, _react.useEffect)(function () {
+    if (getVisible()) {
+      slickGoTo(props.initialIndex);
+      dispatch({
+        type: 'changeCurrent',
+        current: {
+          currentIndex: props.initialIndex
+        }
+      });
+    }
+  }, [getVisible, props.initialIndex, slickGoTo]);
   var CoreMethods = {
     getVisible: getVisible,
+    getIsVideo: getIsVideo,
     onClose: onClose,
     setTransform: setTransform,
     afterChange: afterChange,

package/lib/ImageViewer/style/index.css

@@ -1,20 +1,20 @@
 .lm_image_viewer_wrapper {
   position: fixed;
-  inset: 0;
   z-index: 1001;
+  inset: 0;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_mask {
   position: absolute;
-  inset: 0;
   background-color: rgba(0, 0, 0, 0.5);
+  inset: 0;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container {
   position: relative;
   z-index: 2;
   display: flex;
   flex-flow: column;
-  align-items: center;
   gap: var(--gap);
+  align-items: center;
   height: 100vh;
   padding: 50px 0;
 }
@@ -29,9 +29,9 @@
   height: 100%;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item {
+  overflow: hidden;
   text-align: center;
   border-radius: 2px;
-  overflow: hidden;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item img {
   display: inline-block;
@@ -42,16 +42,27 @@
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list {
   display: flex;
-  width: 51%;
   gap: var(--gap);
+  width: 51%;
   overflow-x: auto;
+  overflow-y: hidden;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 98px;
+  height: 98px;
   text-align: center;
-  border-radius: 2px;
+  background-color: var(--color-contrast);
   border: 2px solid transparent;
+  border-radius: 2px;
   transition: 0.3s;
 }
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item .thumb_item_icon {
+  color: var(--color-45);
+  font-size: 34px;
+}
 .lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item img {
   display: inline-block;
   width: 94px;
@@ -63,21 +74,21 @@
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action {
   position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
   bottom: 50px;
+  left: 50%;
   display: flex;
+  gap: 24px;
   align-items: center;
   justify-content: space-between;
+  padding: 8px 12px;
+  font-size: 24px;
   background-color: #fff;
   border-radius: 100px;
-  gap: 24px;
-  font-size: 24px;
-  padding: 8px 12px;
+  transform: translateX(-50%);
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon {
-  transition: 0.3s;
   cursor: pointer;
+  transition: 0.3s;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon:hover {
   color: var(--primary-color);
@@ -85,16 +96,16 @@
 .lm_image_viewer_wrapper .lm_image_viewer_container .arrow {
   position: absolute;
   top: 50%;
-  transform: translateY(-50%);
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: 32px;
   height: 48px;
   color: var(--color-contrast);
+  font-size: 32px;
   background-color: var(--text-color);
-  transition: 0.3s;
+  transform: translateY(-50%);
   cursor: pointer;
+  transition: 0.3s;
 }
 .lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_left {
   left: 40px;

package/lib/Input/index.js

@@ -17,6 +17,8 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _IconFont = _interopRequireDefault(require("../IconFont"));
 
+var _SizeContext = _interopRequireDefault(require("@/ConfigProvider/SizeContext"));
+
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
 
@@ -33,11 +35,14 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
 var LmInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$allowClear = props.allowClear,
       allowClear = _props$allowClear === void 0 ? true : _props$allowClear,
-      rest = __rest(props, ["allowClear"]);
+      customizeSize = props.size,
+      rest = __rest(props, ["allowClear", "size"]);
 
+  var size = customizeSize || _react.default.useContext(_SizeContext.default) || 'middle';
   return /*#__PURE__*/_react.default.createElement(_input.default, Object.assign({
     ref: ref,
-    className: "lm_input"
+    className: "lm_input",
+    size: size
   }, rest, {
     allowClear: true
   }));

package/lib/Input/style/index.css

@@ -564,6 +564,15 @@ p {
   height: 22px;
   font-size: 12px;
 }
+.lm_input_search .ant-input-affix-wrapper.ant-input-affix-wrapper-lg {
+  height: 40px;
+  padding: 6px 11px;
+}
+.lm_input_search .ant-input-affix-wrapper.ant-input-affix-wrapper-lg > .ant-input.ant-input-lg {
+  font-size: 16px !important;
+  line-height: 28px;
+  height: 28px;
+}
 .lm_input_search .ant-input-affix-wrapper.ant-input-affix-wrapper-focused {
   box-shadow: none !important;
 }

package/lib/LmEditTable/EditTable.js

@@ -540,7 +540,7 @@ var EditableCell = function EditableCell(props) {
         {
           var render = resultComponentProps.render;
           var fromData = form.getFieldsValue();
-          return render === null || render === void 0 ? void 0 : render(Object.assign(Object.assign({}, !(0, _util.isObjEmpty)(fromData) ? fromData : record), {
+          return render === null || render === void 0 ? void 0 : render(Object.assign(Object.assign({}, !(0, _util.isObjEmpty)(fromData) ? Object.assign(Object.assign({}, record), fromData) : record), {
             onChange: save
           }));
         }

package/lib/LmFilter/style/index.css

@@ -258,6 +258,165 @@
 .ant-dropdown .filter_dropdown .ant-checkbox-wrapper .ant-checkbox {
   top: initial;
 }
+.ant-drawer .ant-drawer-header .ant-drawer-title {
+  font-size: 14px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group {
+  font-size: 12px;
+  line-height: 1;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group .ant-form-item {
+  margin-bottom: 16px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group .ant-form-item-label {
+  padding-bottom: 0;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group .ant-form-item-label label {
+  font-size: 12px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group input {
+  font-size: 12px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group .ant-radio-wrapper {
+  display: inline-flex;
+  align-items: center;
+  font-size: 12px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group .ant-radio-wrapper .ant-radio {
+  top: 0;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_add {
+  padding: 0 0 8px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_add .ant-btn {
+  font-size: 12px;
+  max-width: initial;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item {
+  margin-bottom: var(--gap);
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box {
+  line-height: 1;
+  border: 1px solid transparent;
+  border-radius: 2px;
+  background: var(--background-color);
+  padding: calc(var(--gap) * 2);
+  cursor: pointer;
+  transition: 0.3s;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_header .item_header_title {
+  font-size: 12px;
+  font-weight: 500;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_header .item_header_icon {
+  font-size: 16px;
+  color: #8C8C8C;
+  transition: 0.3s;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_header .item_header_icon.icon_plus {
+  color: var(--font-color);
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_header .item_header_icon:hover {
+  color: var(--font-color);
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_tags {
+  display: flex;
+  flex-flow: wrap;
+  gap: var(--gap);
+  padding-top: 12px;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_tags .ant-tag {
+  color: var(--font-color);
+  background-color: var(--background-color);
+  margin: 0;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_tags .ant-tag.add_tags {
+  background: transparent;
+  border-style: dashed;
+  cursor: pointer;
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_tags .ant-tag.add_tags:hover {
+  color: var(--primary-color);
+  border-color: var(--primary-color);
+}
+.ant-drawer.lm_filter_drawer .filter_drawer_group_list .filter_drawer_group_item .item_box .item_tags .tag-input {
+  width: 78px;
+  margin-right: 8px;
+  vertical-align: top;
+}
+.ant-drawer.lm_filter_drawer .complex_filter_body .checked_group {
+  margin-bottom: 24px;
+}
+.ant-drawer.lm_filter_drawer .complex_filter_body .list_group .list_group_title {
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 1.25;
+}
+.ant-drawer.lm_filter_drawer .complex_filter_body .list_group .list_group_search {
+  margin: 16px 0;
+}
+.ant-drawer.lm_det_drawer .checkbox_tag {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 12px;
+  height: 24px;
+  border-radius: 2px;
+  color: var(--font-color);
+  background-color: var(--stripe-color);
+  padding: 0 8px;
+  transition: 0.3s;
+  cursor: pointer;
+}
+.ant-drawer.lm_det_drawer .checkbox_tag:hover,
+.ant-drawer.lm_det_drawer .checkbox_tag.active {
+  color: #fff;
+  background-color: var(--primary-color);
+}
+.ant-drawer.lm_det_drawer .ant-form-item {
+  margin-bottom: 16px;
+}
+.ant-drawer.lm_det_drawer .ant-form-item .ant-form-item-label > label {
+  font-weight: 500;
+}
+.ant-drawer.lm_det_drawer .auto_height {
+  max-height: 418px;
+  overflow-y: auto;
+}
+.ant-drawer.lm_det_drawer .ant-radio-wrapper {
+  display: inline-flex;
+  align-items: center;
+  font-size: 12px;
+}
+.ant-drawer.lm_det_drawer .ant-radio-wrapper .ant-radio {
+  top: 0;
+}
+.ant-drawer.lm_det_drawer .ant-select {
+  font-size: 12px;
+  width: 100%;
+}
+.ant-drawer.lm_det_drawer .custom_form {
+  display: flex;
+  flex-flow: column;
+  height: 100%;
+  gap: 24px;
+}
+.ant-drawer.lm_det_drawer .custom_form .custom_label {
+  font-size: 14px;
+  font-weight: 500;
+  margin-bottom: 16px;
+  color: var(--font-color);
+}
+.ant-drawer.lm_det_drawer .custom_form .custom_full {
+  display: flex;
+  flex-flow: column;
+  flex: 1;
+}
 .lm_filter_dropdown_picker {
   padding: 0 !important;
 }