@das-fed/ui 6.4.0-dev.55.8 → 6.4.0-dev.55.9

package/packages/components/search/index.js

@@ -1,14 +1,14 @@
 import '@das-fed/ui/packages/components/search/style.css';
-import { withInstall as g } from "@das-fed/utils/with-install/index";
-import { defineComponent as I, ref as f, watch as x, openBlock as d, createElementBlock as v, normalizeClass as V, createVNode as S, unref as n, mergeProps as k, isRef as B, withCtx as m, createBlock as h, createCommentVNode as p } from "vue";
+import { withInstall as S } from "@das-fed/utils/with-install/index";
+import { defineComponent as B, ref as o, watch as k, computed as E, openBlock as h, createElementBlock as C, normalizeClass as F, normalizeStyle as z, createVNode as A, unref as u, mergeProps as $, isRef as L, withCtx as v, createBlock as y, createCommentVNode as b } from "vue";
 import "element-plus/es/components/input/style/css";
-import { ElInput as C } from "element-plus";
-import { DasAutoRegisterIcon as $, DasIcon as b } from "@das-fed/ui/packages/components/icon/index";
-import { setThemeRule as z } from "@das-fed/web/packages/theme/index";
-const L = {
+import { ElInput as w } from "element-plus";
+import { DasAutoRegisterIcon as D, DasIcon as x } from "@das-fed/ui/packages/components/icon/index";
+import { setThemeRule as R } from "@das-fed/web/packages/theme/index";
+const N = {
   inheritAttrs: !1
-}, D = /* @__PURE__ */ I({
-  ...L,
+}, T = /* @__PURE__ */ B({
+  ...N,
   __name: "Index",
   props: {
     modelValue: {
@@ -71,51 +71,67 @@ const L = {
     border: {
       type: Boolean,
       default: !1
+    },
+    /**
+    * 聚焦是否需要展开输入框宽度
+    */
+    isExpandAtFocus: {
+      type: [Boolean, String],
+      default: !1
     }
   },
   emits: ["update:modelValue", "change", "blur", "press-enter", "search"],
   setup(e, { emit: i }) {
-    $({
+    D({
       search: import("@das-fed/ui/packages/icons/search"),
       empty: import("@das-fed/ui/packages/icons/empty")
     });
-    const l = e, r = i;
-    let t = f(l.modelValue), s = f(l.modelValue);
-    const y = () => {
-      r("update:modelValue", t.value), s.value = t.value, r("change", t.value);
-    }, c = (a) => a === null || typeof a > "u" || a === "";
-    return x(
-      () => l.modelValue,
-      (a, o) => {
-        t.value = a, !c(o) && !c(s.value) && c(a) && (s.value = "", r("change", t.value));
+    const t = e, n = i;
+    let a = o(t.modelValue), s = o(t.modelValue);
+    const g = () => {
+      n("update:modelValue", a.value), s.value = a.value, n("change", a.value);
+    }, c = (l) => l === null || typeof l > "u" || l === "";
+    k(
+      () => t.modelValue,
+      (l, r) => {
+        a.value = l, !c(r) && !c(s.value) && c(l) && (s.value = "", n("change", a.value));
       },
       {
         immediate: !0,
         deep: !0
       }
-    ), (a, o) => (d(), v(
+    );
+    const d = o(""), f = o(!1), m = E(() => (t == null ? void 0 : t.isExpandAtFocus) === !0 || (t == null ? void 0 : t.isExpandAtFocus) === "true"), I = () => {
+      m.value && (d.value = "400px", f.value = !0);
+    }, V = () => {
+      m.value && (d.value = "", f.value = !1);
+    };
+    return (l, r) => (h(), C(
       "div",
       {
-        class: V(`das-ui-search ${e.size}`)
+        class: F(`das-ui-search ${e.size}`),
+        style: z({ width: m.value && f.value ? d.value : "" })
       },
       [
-        S(n(C), k({ ref: "$refSearch" }, a.$attrs, {
+        A(u(w), $({ ref: "$refSearch" }, l.$attrs, {
           type: "text",
           class: `main-input ${e.size} ${e.border ? "border" : ""} ${e.isIconLeft ? "left" : ""}`,
-          modelValue: n(t),
-          "onUpdate:modelValue": o[0] || (o[0] = (u) => B(t) ? t.value = u : t = u),
+          modelValue: u(a),
+          "onUpdate:modelValue": r[0] || (r[0] = (p) => L(a) ? a.value = p : a = p),
           disabled: e.disabled,
-          onChange: y,
-          clearable: l.clearable
+          onChange: g,
+          clearable: t.clearable,
+          onFocus: I,
+          onBlur: V
         }), {
-          prefix: m(() => [
-            e.isIconLeft ? (d(), h(n(b), {
+          prefix: v(() => [
+            e.isIconLeft ? (h(), y(u(x), {
               key: 0,
               icon: e.prefixIcon ? e.prefixIcon : "search"
-            }, null, 8, ["icon"])) : p("v-if", !0)
+            }, null, 8, ["icon"])) : b("v-if", !0)
           ]),
-          suffix: m(() => [
-            e.isIconLeft ? p("v-if", !0) : (d(), h(n(b), {
+          suffix: v(() => [
+            e.isIconLeft ? b("v-if", !0) : (h(), y(u(x), {
               key: 0,
               icon: e.suffixIcon ? e.suffixIcon : "search",
               style: { cursor: "pointer" }
@@ -125,16 +141,16 @@ const L = {
           /* STABLE */
         }, 16, ["class", "modelValue", "disabled", "clearable"])
       ],
-      2
-      /* CLASS */
+      6
+      /* CLASS, STYLE */
     ));
   }
-}), E = (e, i) => {
-  const l = e.__vccOpts || e;
-  for (const [r, t] of i)
-    l[r] = t;
-  return l;
-}, R = /* @__PURE__ */ E(D, [["__scopeId", "data-v-921d134d"]]), w = {
+}), O = (e, i) => {
+  const t = e.__vccOpts || e;
+  for (const [n, a] of i)
+    t[n] = a;
+  return t;
+}, P = /* @__PURE__ */ O(T, [["__scopeId", "data-v-f13d97d2"]]), U = {
   "--demo-alert-bg": {
     light: "#fff",
     dark: "rgba(255,255,255,.2)"
@@ -144,9 +160,9 @@ const L = {
   "--das-ui-search-text": "#212121",
   "--das-ui-search-border-active": "#5582F3"
 };
-z(w);
-const U = g(R);
+R(U);
+const K = S(P);
 export {
-  U as DasSearch,
-  U as default
+  K as DasSearch,
+  K as default
 };

package/packages/components/search/src/Index.vue.d.ts

@@ -60,6 +60,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+    * 聚焦是否需要展开输入框宽度
+    */
+    isExpandAtFocus: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     search: (...args: any[]) => void;
     "update:modelValue": (...args: any[]) => void;
@@ -127,6 +134,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+    * 聚焦是否需要展开输入框宽度
+    */
+    isExpandAtFocus: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: boolean;
+    };
 }>> & Readonly<{
     onSearch?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
@@ -141,6 +155,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     suffixIcon: string;
     prefixIcon: string;
     isIconLeft: boolean;
+    isExpandAtFocus: string | boolean;
     border: boolean;
     searchType: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/packages/components/search/src/type.d.ts

@@ -17,4 +17,6 @@ export interface Props {
   disabled: boolean
   
   border: boolean
+  
+  isExpandAtFocus: boolean
 }

package/packages/components/search/style.css

@@ -1 +1 @@
-.das-ui-search[data-v-921d134d]{position:relative}.das-ui-search[data-v-921d134d] .el-input__inner{font-size:12px}.das-ui-search.small[data-v-921d134d]{width:200px}.das-ui-search.small[data-v-921d134d] .el-input__inner{font-size:12px}.das-ui-search.large[data-v-921d134d]{width:320px}.das-ui-search.large[data-v-921d134d] .el-input__inner{font-size:16px}.das-ui-search.middle[data-v-921d134d]{width:260px}.das-ui-search[data-v-921d134d] .el-input{border-width:0 0 1px 0!important;border-color:var(--das-ui-search-border);box-shadow:none!important;outline:none}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper{border-radius:0;box-shadow:none!important;padding:0 0 1px}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper.is-focus .el-input__prefix .el-input__prefix-inner .das-icon,.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper.is-focus .el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon){color:var(--das-ui-search-border-active)}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__inner{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--das-ui-search-text)}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23d9d9d9'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e");background-size:cover;width:16px;height:16px}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear:hover{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23999999'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e")}.das-ui-search[data-v-921d134d] .el-input.border{border-radius:2px;border-width:1px!important}.das-ui-search[data-v-921d134d] .el-input.border .el-input__wrapper{padding:0 5px 0 8px}.das-ui-search[data-v-921d134d] .el-input:hover,.das-ui-search[data-v-921d134d] .el-input:active,.das-ui-search[data-v-921d134d] .el-input:focus{border-color:var(--das-ui-search-border-active)}.das-ui-search[data-v-921d134d] .el-input:hover.el-input__prefix .el-input__suffix-inner .das-icon,.das-ui-search[data-v-921d134d] .el-input:hover.el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon),.das-ui-search[data-v-921d134d] .el-input:active.el-input__prefix .el-input__suffix-inner .das-icon,.das-ui-search[data-v-921d134d] .el-input:active.el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon),.das-ui-search[data-v-921d134d] .el-input:focus.el-input__prefix .el-input__suffix-inner .das-icon,.das-ui-search[data-v-921d134d] .el-input:focus.el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon){color:var(--das-ui-search-border-active)}.das-ui-search[data-v-921d134d] .el-input.el-input__suffix{padding:0 0 1px;box-sizing:border-box}.das-ui-search[data-v-921d134d] .el-input.el-input__suffix.border{padding:5px}.das-ui-search[data-v-921d134d] .el-input.el-input__suffix.left .el-input__suffix .das-icon.close-icon{margin-right:0}.das-ui-search[data-v-921d134d] .el-input.el-input__suffix .el-input__prefix .das-icon{color:var(--das-ui-search-icon)}.das-ui-search[data-v-921d134d] .el-input.el-input__suffix .el-input__prefix .das-icon:hover{color:var(--das-ui-search-border-active)}.das-ui-search[data-v-921d134d] .el-input.small .el-input__inner{height:22px}.das-ui-search[data-v-921d134d] .el-input.middle .el-input__inner,.das-ui-search[data-v-921d134d] .el-input.custom .el-input__inner{height:26px}.das-ui-search[data-v-921d134d] .el-input.middle-l .el-input__inner{height:28px}.das-ui-search[data-v-921d134d] .el-input.middle-xl .el-input__inner{height:30px}.das-ui-search[data-v-921d134d] .el-input.large .el-input__inner{height:34px}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__inner{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23d9d9d9'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e");background-size:cover;width:16px;height:16px}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear:hover{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23999999'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e")}.das-ui-search[data-v-921d134d] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear svg{display:none}
+.das-ui-search[data-v-f13d97d2]{position:relative}.das-ui-search[data-v-f13d97d2] .el-input__inner{font-size:12px}.das-ui-search.small[data-v-f13d97d2]{width:200px}.das-ui-search.small[data-v-f13d97d2] .el-input__inner{font-size:12px}.das-ui-search.large[data-v-f13d97d2]{width:320px}.das-ui-search.large[data-v-f13d97d2] .el-input__inner{font-size:16px}.das-ui-search.middle[data-v-f13d97d2]{width:260px}.das-ui-search[data-v-f13d97d2] .el-input{border-width:0 0 1px 0!important;border-color:var(--das-ui-search-border);box-shadow:none!important;outline:none}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper{border-radius:0;box-shadow:none!important;padding:0 0 1px}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper.is-focus .el-input__prefix .el-input__prefix-inner .das-icon,.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper.is-focus .el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon){color:var(--das-ui-search-border-active)}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__inner{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--das-ui-search-text)}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23d9d9d9'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e");background-size:cover;width:16px;height:16px}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear:hover{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23999999'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e")}.das-ui-search[data-v-f13d97d2] .el-input.border{border-radius:2px;border-width:1px!important}.das-ui-search[data-v-f13d97d2] .el-input.border .el-input__wrapper{padding:0 5px 0 8px}.das-ui-search[data-v-f13d97d2] .el-input:hover,.das-ui-search[data-v-f13d97d2] .el-input:active,.das-ui-search[data-v-f13d97d2] .el-input:focus{border-color:var(--das-ui-search-border-active)}.das-ui-search[data-v-f13d97d2] .el-input:hover.el-input__prefix .el-input__suffix-inner .das-icon,.das-ui-search[data-v-f13d97d2] .el-input:hover.el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon),.das-ui-search[data-v-f13d97d2] .el-input:active.el-input__prefix .el-input__suffix-inner .das-icon,.das-ui-search[data-v-f13d97d2] .el-input:active.el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon),.das-ui-search[data-v-f13d97d2] .el-input:focus.el-input__prefix .el-input__suffix-inner .das-icon,.das-ui-search[data-v-f13d97d2] .el-input:focus.el-input__suffix .el-input__suffix-inner .das-icon:not(.close-icon){color:var(--das-ui-search-border-active)}.das-ui-search[data-v-f13d97d2] .el-input.el-input__suffix{padding:0 0 1px;box-sizing:border-box}.das-ui-search[data-v-f13d97d2] .el-input.el-input__suffix.border{padding:5px}.das-ui-search[data-v-f13d97d2] .el-input.el-input__suffix.left .el-input__suffix .das-icon.close-icon{margin-right:0}.das-ui-search[data-v-f13d97d2] .el-input.el-input__suffix .el-input__prefix .das-icon{color:var(--das-ui-search-icon)}.das-ui-search[data-v-f13d97d2] .el-input.el-input__suffix .el-input__prefix .das-icon:hover{color:var(--das-ui-search-border-active)}.das-ui-search[data-v-f13d97d2] .el-input.small .el-input__inner{height:22px}.das-ui-search[data-v-f13d97d2] .el-input.middle .el-input__inner,.das-ui-search[data-v-f13d97d2] .el-input.custom .el-input__inner{height:26px}.das-ui-search[data-v-f13d97d2] .el-input.middle-l .el-input__inner{height:28px}.das-ui-search[data-v-f13d97d2] .el-input.middle-xl .el-input__inner{height:30px}.das-ui-search[data-v-f13d97d2] .el-input.large .el-input__inner{height:34px}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__inner{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23d9d9d9'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e");background-size:cover;width:16px;height:16px}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear:hover{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1685934237687'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='2634'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%20128c212.064%200%20384%20171.936%20384%20384s-171.936%20384-384%20384S128%20724.064%20128%20512%20299.936%20128%20512%20128z%20m-140.384%20198.72a32%2032%200%200%200-42.24%202.656l-2.656%203.008a32%2032%200%200%200%202.656%2042.24L466.72%20512l-137.344%20137.376a32%2032%200%200%200%2045.248%2045.248L512%20557.28l137.376%20137.344%203.008%202.656a32%2032%200%200%200%2042.24-2.656l2.656-3.008a32%2032%200%200%200-2.656-42.24L557.28%20512l137.344-137.376a32%2032%200%200%200-45.248-45.248L512%20466.72l-137.376-137.344z'%20fill='%23999999'%20fill-opacity='1'%20p-id='2635'%3e%3c/path%3e%3c/svg%3e")}.das-ui-search[data-v-f13d97d2] .el-input .el-input__wrapper .el-input__suffix .el-input__suffix-inner .el-input__clear svg{display:none}