ele-admin-plus 1.1.9-beta.1 → 1.1.9-beta.11

package/es/ele-icon-select/index.d.ts

@@ -1,6 +1,7 @@
-import type { EleBasicSelectInstance } from '../ele-app/plus';
-import type { IconItem } from './types';
-declare const _default: import("vue").DefineComponent<{
+import { IconItem } from './types';
+import { EleBasicSelectInstance } from '../ele-app/plus';
+
+declare const _default: import('vue').DefineComponent<{
     modelValue: StringConstructor;
     data: {
         type: import("vue").PropType<string[] | IconItem[]>;
@@ -11,7 +12,7 @@ declare const _default: import("vue").DefineComponent<{
     clearable: BooleanConstructor;
     placeholder: StringConstructor;
     automaticDropdown: BooleanConstructor;
-    filterable: BooleanConstructor;
+    filterable: (BooleanConstructor | StringConstructor)[];
     teleported: {
         type: BooleanConstructor;
         default: boolean;
@@ -20,6 +21,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    /** 下拉组件 */
     placement: {
         type: import("vue").PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
@@ -31,16 +33,16 @@ declare const _default: import("vue").DefineComponent<{
     popperOptions: import("vue").PropType<Partial<import("element-plus").Options> | undefined>;
     popperClass: StringConstructor;
     popperWidth: {
-        type: (StringConstructor | NumberConstructor)[]; /** 是否显示选项卡栏 */
+        type: (StringConstructor | NumberConstructor)[];
         default: number;
     };
     popperHeight: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
-    };
+    }; /** 是否显示选项卡栏 */
     selectStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     inputStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
-    hideOnSingleTab: BooleanConstructor; /** 下拉框类名 */
+    hideOnSingleTab: BooleanConstructor;
     emptyProps: import("vue").PropType<import("../ele-app/el").ElEmptyProps>;
     tooltip: {
         type: BooleanConstructor;
@@ -54,11 +56,16 @@ declare const _default: import("vue").DefineComponent<{
     bodyStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     gridStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     itemStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
+    filterPlaceholder: {
+        type: StringConstructor;
+        default: string;
+    };
     responsive: {
         type: BooleanConstructor;
         default: null;
     };
 }, {
+    SearchOutlined: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
     selectRef: import("vue").Ref<EleBasicSelectInstance>;
     selectVisible: import("vue").Ref<boolean>;
     tabs: import("vue").Ref<string[]>;
@@ -66,6 +73,7 @@ declare const _default: import("vue").DefineComponent<{
     menus: import("vue").Ref<string[]>;
     menuActive: import("vue").Ref<number | undefined>;
     icons: import("vue").Ref<string[]>;
+    keywords: import("vue").Ref<string>;
     tabBar: import("vue").ComputedRef<boolean>;
     selectPopperClass: import("vue").ComputedRef<string>;
     iconPopperStyle: import("vue").ComputedRef<Partial<import("vue").CSSProperties> | undefined>;
@@ -74,7 +82,7 @@ declare const _default: import("vue").DefineComponent<{
     onSelectClear: () => void;
     onSelectFocus: (e: FocusEvent) => void;
     onSelectBlur: (e: FocusEvent) => void;
-    onSelectFilter: (keywords: string) => void;
+    onSelectFilter: (value: string) => void;
     onTabClick: (index: number) => void;
     onMenuClick: (index: number) => void;
     onIconSelect: (icon: string) => void;
@@ -96,7 +104,7 @@ declare const _default: import("vue").DefineComponent<{
     clearable: BooleanConstructor;
     placeholder: StringConstructor;
     automaticDropdown: BooleanConstructor;
-    filterable: BooleanConstructor;
+    filterable: (BooleanConstructor | StringConstructor)[];
     teleported: {
         type: BooleanConstructor;
         default: boolean;
@@ -105,6 +113,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    /** 下拉组件 */
     placement: {
         type: import("vue").PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
@@ -116,16 +125,16 @@ declare const _default: import("vue").DefineComponent<{
     popperOptions: import("vue").PropType<Partial<import("element-plus").Options> | undefined>;
     popperClass: StringConstructor;
     popperWidth: {
-        type: (StringConstructor | NumberConstructor)[]; /** 是否显示选项卡栏 */
+        type: (StringConstructor | NumberConstructor)[];
         default: number;
     };
     popperHeight: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
-    };
+    }; /** 是否显示选项卡栏 */
     selectStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     inputStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
-    hideOnSingleTab: BooleanConstructor; /** 下拉框类名 */
+    hideOnSingleTab: BooleanConstructor;
     emptyProps: import("vue").PropType<import("../ele-app/el").ElEmptyProps>;
     tooltip: {
         type: BooleanConstructor;
@@ -139,6 +148,10 @@ declare const _default: import("vue").DefineComponent<{
     bodyStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     gridStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     itemStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
+    filterPlaceholder: {
+        type: StringConstructor;
+        default: string;
+    };
     responsive: {
         type: BooleanConstructor;
         default: null;
@@ -146,8 +159,8 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_e: FocusEvent) => any) | undefined;
     onBlur?: ((_e: FocusEvent) => any) | undefined;
-    "onUpdate:modelValue"?: ((_value?: string | null | undefined) => any) | undefined;
     onChange?: ((_value?: string | null | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((_value?: string | null | undefined) => any) | undefined;
     onClear?: (() => any) | undefined;
     onVisibleChange?: ((_visible: boolean) => any) | undefined;
 }, {
@@ -160,9 +173,9 @@ declare const _default: import("vue").DefineComponent<{
     tooltip: boolean;
     responsive: boolean;
     automaticDropdown: boolean;
-    filterable: boolean;
     popperWidth: string | number;
     popperHeight: string | number;
     hideOnSingleTab: boolean;
+    filterPlaceholder: string;
 }, {}>;
 export default _default;

package/es/ele-icon-select/index.js

@@ -1,17 +1,18 @@
 import { defineComponent, ref, computed, watch, resolveComponent, openBlock, createBlock, createSlots, withCtx, createElementVNode, normalizeStyle, createElementBlock, renderSlot, Fragment, renderList, normalizeClass, toDisplayString, createCommentVNode, createVNode, normalizeProps, guardReactiveProps } from "vue";
+import { ElInput } from "element-plus";
 import { useResponsive } from "../ele-config-provider/receiver";
 import EleBasicSelect from "../ele-basic-select/index";
 import { valueIsChanged } from "../ele-basic-select/util";
+import { SearchOutlined } from "../icons";
 import IconGrid from "./components/icon-grid";
 import { iconSelectProps, iconSelectEmits } from "./props";
 const _sfc_main = defineComponent({
   name: "EleIconSelect",
-  components: { EleBasicSelect, IconGrid },
+  components: { ElInput, EleBasicSelect, IconGrid },
   props: iconSelectProps,
   emits: iconSelectEmits,
   setup(props, { emit }) {
     const isResponsive = useResponsive(props);
-    const iconState = { keyword: "" };
     const selectRef = ref(null);
     const selectVisible = ref(false);
     const tabs = ref([]);
@@ -19,6 +20,7 @@ const _sfc_main = defineComponent({
     const menus = ref([]);
     const menuActive = ref();
     const icons = ref([]);
+    const keywords = ref("");
     const tabBar = computed(() => {
       if (!tabs.value || !tabs.value.length) {
         return false;
@@ -81,10 +83,11 @@ const _sfc_main = defineComponent({
       if (!data) {
         return [];
       }
-      if (!iconState.keyword) {
+      if (!keywords.value) {
         return data;
       }
-      return data.filter((t) => t.toLowerCase().includes(iconState.keyword));
+      const keyword = keywords.value.toLowerCase();
+      return data.filter((t) => t.toLowerCase().includes(keyword));
     };
     const updateVisible = (visible) => {
       if (visible) {
@@ -112,9 +115,11 @@ const _sfc_main = defineComponent({
     const onSelectBlur = (e) => {
       emit("blur", e);
     };
-    const onSelectFilter = (keywords) => {
+    const onSelectFilter = (value) => {
       var _a;
-      iconState.keyword = keywords ? keywords.toLowerCase() : "";
+      if (keywords.value !== value) {
+        keywords.value = value;
+      }
       initData();
       if (!((_a = props.data) == null ? void 0 : _a.length) || icons.value.length) {
         return;
@@ -124,17 +129,18 @@ const _sfc_main = defineComponent({
         if (typeof d === "string") {
           return;
         }
+        const keyword = keywords.value.toLowerCase();
         if (d.children != null && d.children.length) {
           for (let j = 0; j < d.children.length; j++) {
             const icons2 = d.children[j].icons;
-            if (icons2 && icons2.some((t) => t.toLowerCase().includes(iconState.keyword))) {
+            if (icons2 && icons2.some((t) => t.toLowerCase().includes(keyword))) {
               menuActive.value = j;
               tabActive.value = i;
               initData();
               return;
             }
           }
-        } else if (d.icons != null && d.icons.some((t) => t.toLowerCase().includes(iconState.keyword))) {
+        } else if (d.icons != null && d.icons.some((t) => t.toLowerCase().includes(keyword))) {
           tabActive.value = i;
           initData();
           return;
@@ -164,6 +170,7 @@ const _sfc_main = defineComponent({
       }
     );
     return {
+      SearchOutlined,
       selectRef,
       selectVisible,
       tabs,
@@ -171,6 +178,7 @@ const _sfc_main = defineComponent({
       menus,
       menuActive,
       icons,
+      keywords,
       tabBar,
       selectPopperClass,
       iconPopperStyle,
@@ -197,6 +205,7 @@ const _hoisted_1 = ["onClick"];
 const _hoisted_2 = { class: "ele-icon-select-main" };
 const _hoisted_3 = ["onClick"];
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_ElInput = resolveComponent("ElInput");
   const _component_IconGrid = resolveComponent("IconGrid");
   const _component_EleBasicSelect = resolveComponent("EleBasicSelect");
   return openBlock(), createBlock(_component_EleBasicSelect, {
@@ -208,7 +217,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     clearable: _ctx.clearable,
     placeholder: _ctx.placeholder,
     automaticDropdown: _ctx.automaticDropdown,
-    filterable: _ctx.filterable,
+    filterable: typeof _ctx.filterable === "boolean" ? _ctx.filterable : false,
     teleported: _ctx.teleported,
     persistent: _ctx.persistent,
     placement: _ctx.placement,
@@ -232,7 +241,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         class: "ele-icon-select",
         style: normalizeStyle(_ctx.iconPopperStyle)
       }, [
-        _ctx.tabBar ? (openBlock(), createElementBlock("div", {
+        _ctx.tabBar || _ctx.filterable === "popper" ? (openBlock(), createElementBlock("div", {
           key: 0,
           class: "ele-icon-select-header",
           style: normalizeStyle(_ctx.headerStyle)
@@ -251,6 +260,20 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
               }, toDisplayString(t), 11, _hoisted_1);
             }), 128))
           ], 4)) : createCommentVNode("", true),
+          _ctx.filterable === "popper" ? (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: "ele-icon-select-search",
+            style: normalizeStyle(_ctx.searchStyle)
+          }, [
+            createVNode(_component_ElInput, {
+              size: "small",
+              clearable: true,
+              modelValue: _ctx.keywords,
+              prefixIcon: _ctx.SearchOutlined,
+              placeholder: _ctx.filterPlaceholder,
+              "onUpdate:modelValue": _ctx.onSelectFilter
+            }, null, 8, ["modelValue", "prefixIcon", "placeholder", "onUpdate:modelValue"])
+          ], 4)) : createCommentVNode("", true),
           renderSlot(_ctx.$slots, "tabRightExtra")
         ], 4)) : createCommentVNode("", true),
         createElementVNode("div", _hoisted_2, [

package/es/ele-icon-select/props.d.ts

@@ -1,6 +1,7 @@
-import type { PropType, ExtractPropTypes } from 'vue';
-import type { ElEmptyProps } from '../ele-app/el';
-import type { IconItem } from './types';
+import { IconItem } from './types';
+import { ElEmptyProps } from '../ele-app/el';
+import { PropType, ExtractPropTypes } from 'vue';
+
 /**
  * 属性
  */
@@ -15,7 +16,7 @@ export declare const iconSelectProps: {
     /** 是否禁用 */
     disabled: BooleanConstructor;
     /** 尺寸 */
-    size: PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never> | undefined>;
+    size: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never> | undefined>;
     /** 是否支持清除 */
     clearable: BooleanConstructor;
     /** 无选中时提示文本 */
@@ -23,7 +24,7 @@ export declare const iconSelectProps: {
     /** 是否在输入框获得焦点后自动弹出选项菜单 */
     automaticDropdown: BooleanConstructor;
     /** 是否可以筛选 */
-    filterable: BooleanConstructor;
+    filterable: (BooleanConstructor | StringConstructor)[];
     /** 是否将下拉框插入 body */
     teleported: {
         type: BooleanConstructor;
@@ -36,7 +37,7 @@ export declare const iconSelectProps: {
     };
     /** 下拉框位置 */
     placement: {
-        type: PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
+        type: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
     };
     /** 下拉框渐变动画 */
@@ -45,7 +46,7 @@ export declare const iconSelectProps: {
         default: string;
     };
     /** popper.js 参数 */
-    popperOptions: PropType<Partial<import("element-plus").Options> | undefined>;
+    popperOptions: PropType<Partial<import('element-plus').Options> | undefined>;
     /** 下拉框类名 */
     popperClass: StringConstructor;
     /** 下拉框宽度 */
@@ -59,9 +60,9 @@ export declare const iconSelectProps: {
         default: number;
     };
     /** 自定义样式 */
-    selectStyle: PropType<Partial<import("vue").CSSProperties>>;
+    selectStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 自定义样式 */
-    inputStyle: PropType<Partial<import("vue").CSSProperties>>;
+    inputStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 顶部选项卡只有一个时隐藏 */
     hideOnSingleTab: BooleanConstructor;
     /** 空组件属性 */
@@ -72,21 +73,26 @@ export declare const iconSelectProps: {
         default: boolean;
     };
     /** 提示属性 */
-    tooltipProps: PropType<Partial<import("../ele-tooltip/props").TooltipProps>>;
+    tooltipProps: PropType<Partial<import('../ele-tooltip/props').TooltipProps>>;
     /** 头部样式 */
-    headerStyle: PropType<Partial<import("vue").CSSProperties>>;
+    headerStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 选项卡样式 */
-    tabsStyle: PropType<Partial<import("vue").CSSProperties>>;
+    tabsStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 搜索区样式 */
-    searchStyle: PropType<Partial<import("vue").CSSProperties>>;
+    searchStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 菜单样式 */
-    menusStyle: PropType<Partial<import("vue").CSSProperties>>;
+    menusStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 主体样式 */
-    bodyStyle: PropType<Partial<import("vue").CSSProperties>>;
+    bodyStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 网格样式 */
-    gridStyle: PropType<Partial<import("vue").CSSProperties>>;
+    gridStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 图标样式 */
-    itemStyle: PropType<Partial<import("vue").CSSProperties>>;
+    itemStyle: PropType<Partial<import('vue').CSSProperties>>;
+    /** 搜索框提示文本 */
+    filterPlaceholder: {
+        type: StringConstructor;
+        default: string;
+    };
     /** 是否开启响应式 */
     responsive: {
         type: BooleanConstructor;

package/es/ele-icon-select/props.js

@@ -17,7 +17,7 @@ const iconSelectProps = {
   /** 是否在输入框获得焦点后自动弹出选项菜单 */
   automaticDropdown: Boolean,
   /** 是否可以筛选 */
-  filterable: Boolean,
+  filterable: [Boolean, String],
   /** 是否将下拉框插入 body */
   teleported: {
     type: Boolean,
@@ -81,6 +81,11 @@ const iconSelectProps = {
   gridStyle: Object,
   /** 图标样式 */
   itemStyle: Object,
+  /** 搜索框提示文本 */
+  filterPlaceholder: {
+    type: String,
+    default: ""
+  },
   /** 是否开启响应式 */
   responsive: {
     type: Boolean,

package/es/ele-icon-select/style/index.js

@@ -1,5 +1,6 @@
 import 'element-plus/es/components/empty/style/index';
 import 'element-plus/es/components/scrollbar/style/index';
+import 'element-plus/es/components/input/style/index';
 import '../../ele-tooltip/style/index';
 import '../../ele-basic-select/style/index';
 import './index.scss';

package/es/ele-icon-select/style/index.scss

@@ -28,7 +28,6 @@
 .ele-icon-select-tabs {
   flex: 1;
   overflow: auto;
-  overflow: overlay;
   display: flex;
   align-items: center;
 
@@ -92,6 +91,22 @@
   }
 }
 
+.ele-icon-select-search {
+  width: 100%;
+  flex-shrink: 0;
+  padding: eleVar('icon', 'search-padding');
+  box-sizing: border-box;
+
+  & > .el-input .el-input__prefix .el-input__icon {
+    font-size: eleVar('icon', 'search-icon-size');
+  }
+}
+
+.ele-icon-select-tabs + .ele-icon-select-search {
+  width: eleVar('icon', 'search-width');
+  padding-left: 12px;
+}
+
 .ele-icon-select-main {
   flex: 1;
   display: flex;
@@ -103,7 +118,6 @@
   width: eleVar('icon', 'menus-width');
   flex-shrink: 0;
   overflow: auto;
-  overflow: overlay;
   padding: eleVar('icon', 'menus-padding');
   box-shadow: -0.8px 0 0 elVar('border-color', 'light') inset;
   box-sizing: border-box;

package/es/ele-loading/index.d.ts

@@ -1,6 +1,4 @@
-import { ComponentProps } from '../ele-app/types';
-import type { CircleProps } from './types';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import('vue').DefineComponent<{
     loading: BooleanConstructor;
     text: StringConstructor;
     background: StringConstructor;
@@ -13,11 +11,9 @@ declare const _default: import("vue").DefineComponent<{
     blur: BooleanConstructor;
     size: import("vue").PropType<import("./types").LoadingSize>;
     spinnerStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
-    /** 根节点属性 */
     textStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
 }, {
     isCircle: import("vue").ComputedRef<boolean>;
-    rootProps: import("vue").ComputedRef<ComponentProps<CircleProps>>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     loading: BooleanConstructor;
     text: StringConstructor;
@@ -31,7 +27,6 @@ declare const _default: import("vue").DefineComponent<{
     blur: BooleanConstructor;
     size: import("vue").PropType<import("./types").LoadingSize>;
     spinnerStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
-    /** 根节点属性 */
     textStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
 }>>, {
     type: import("./types").LoadingType;

package/es/ele-loading/index.js

@@ -1,31 +1,17 @@
-import { defineComponent, computed, resolveDirective, withDirectives, openBlock, createElementBlock, normalizeProps, guardReactiveProps, renderSlot, normalizeStyle, normalizeClass, toDisplayString, createCommentVNode, vShow, createElementVNode } from "vue";
+import { defineComponent, computed, resolveComponent, resolveDirective, withDirectives, openBlock, createBlock, normalizeClass, withCtx, renderSlot, createElementBlock, normalizeStyle, toDisplayString, createCommentVNode, vShow, createElementVNode } from "vue";
 import { vLoading } from "element-plus";
-import { useLicense } from "../ele-config-provider/receiver";
+import ReceiverView from "../ele-config-provider/components/receiver-view";
 import { loadingProps } from "./props";
 const _sfc_main = defineComponent({
   name: "EleLoading",
-  directives: {
-    loading: vLoading
-  },
+  directives: { loading: vLoading },
+  components: { ReceiverView },
   props: loadingProps,
   setup(props) {
-    const { authenticated } = useLicense();
     const isCircle = computed(() => {
-      return !authenticated.value || props.type === "circle";
+      return props.type === "circle";
     });
-    const rootProps = computed(() => {
-      const obj = {
-        class: ["ele-loading", { "ele-loading-show": props.loading }]
-      };
-      if (isCircle.value) {
-        obj["element-loading-text"] = props.text;
-        obj["element-loading-background"] = props.background;
-        obj["element-loading-spinner"] = props.spinner;
-        obj["element-loading-svg-view-box"] = props.svgViewBox;
-      }
-      return obj;
-    });
-    return { isCircle, rootProps };
+    return { isCircle };
   }
 });
 const _export_sfc = (sfc, props) => {
@@ -42,31 +28,41 @@ const _hoisted_1 = /* @__PURE__ */ createElementVNode("div", { class: "ele-loadi
   /* @__PURE__ */ createElementVNode("i")
 ], -1);
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_ReceiverView = resolveComponent("ReceiverView");
   const _directive_loading = resolveDirective("loading");
-  return withDirectives((openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(_ctx.rootProps)), [
-    renderSlot(_ctx.$slots, "default"),
-    !_ctx.isCircle ? withDirectives((openBlock(), createElementBlock("div", {
-      key: 0,
-      style: normalizeStyle(_ctx.spinnerStyle),
-      class: normalizeClass([
-        "ele-loading-spinner",
-        { "ele-loading-blur": _ctx.blur },
-        { "ele-loading-small": _ctx.size === "small" },
-        { "ele-loading-large": _ctx.size === "large" }
-      ])
-    }, [
-      renderSlot(_ctx.$slots, "spinner", {}, () => [
-        _hoisted_1
-      ]),
-      _ctx.text ? (openBlock(), createElementBlock("div", {
+  return withDirectives((openBlock(), createBlock(_component_ReceiverView, {
+    "element-loading-text": _ctx.isCircle ? _ctx.text : void 0,
+    "element-loading-background": _ctx.isCircle ? _ctx.background : void 0,
+    "element-loading-spinner": _ctx.isCircle ? _ctx.spinner : void 0,
+    "element-loading-svg-view-box": _ctx.isCircle ? _ctx.svgViewBox : void 0,
+    class: normalizeClass(["ele-loading", { "ele-loading-show": _ctx.loading }])
+  }, {
+    default: withCtx(() => [
+      renderSlot(_ctx.$slots, "default"),
+      !_ctx.isCircle ? withDirectives((openBlock(), createElementBlock("div", {
         key: 0,
-        class: "ele-loading-text",
-        style: normalizeStyle(_ctx.textStyle)
-      }, toDisplayString(_ctx.text), 5)) : createCommentVNode("", true)
-    ], 6)), [
-      [vShow, _ctx.loading]
-    ]) : createCommentVNode("", true)
-  ], 16)), [
+        style: normalizeStyle(_ctx.spinnerStyle),
+        class: normalizeClass([
+          "ele-loading-spinner",
+          { "ele-loading-blur": _ctx.blur },
+          { "ele-loading-small": _ctx.size === "small" },
+          { "ele-loading-large": _ctx.size === "large" }
+        ])
+      }, [
+        renderSlot(_ctx.$slots, "spinner", {}, () => [
+          _hoisted_1
+        ]),
+        _ctx.text ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "ele-loading-text",
+          style: normalizeStyle(_ctx.textStyle)
+        }, toDisplayString(_ctx.text), 5)) : createCommentVNode("", true)
+      ], 6)), [
+        [vShow, _ctx.loading]
+      ]) : createCommentVNode("", true)
+    ]),
+    _: 3
+  }, 8, ["element-loading-text", "element-loading-background", "element-loading-spinner", "element-loading-svg-view-box", "class"])), [
     [_directive_loading, _ctx.isCircle && _ctx.loading]
   ]);
 }

package/es/ele-loading/props.d.ts

@@ -1,5 +1,6 @@
-import type { PropType, ExtractPropTypes } from 'vue';
-import type { LoadingType, LoadingSize } from './types';
+import { LoadingType, LoadingSize } from './types';
+import { PropType, ExtractPropTypes } from 'vue';
+
 /**
  * 属性
  */
@@ -24,8 +25,8 @@ export declare const loadingProps: {
     /** 加载器尺寸 */
     size: PropType<LoadingSize>;
     /** 自定义加载器样式 */
-    spinnerStyle: PropType<Partial<import("vue").CSSProperties>>;
+    spinnerStyle: PropType<Partial<import('vue').CSSProperties>>;
     /** 自定义文本样式 */
-    textStyle: PropType<Partial<import("vue").CSSProperties>>;
+    textStyle: PropType<Partial<import('vue').CSSProperties>>;
 };
 export type LoadingProps = ExtractPropTypes<typeof loadingProps>;