next-element-vue 0.5.8 → 0.5.10

package/dist/index.js

@@ -2,12 +2,12 @@
 /**
  * 作　　者：huangteng
  * 邮　　箱：htengweb@163.com
- * 当前版本：0.5.8 v
- * 发布日期：2025-04-15
+ * 当前版本：0.5.10 v
+ * 发布日期：2025-04-30
  * 地　　址：https://www.npmjs.com/package/next-element-vue
  */
 
-import { getCurrentInstance, inject, ref, computed, unref, isRef, defineComponent, createVNode, Fragment, createElementBlock, openBlock, createElementVNode, reactive, createTextVNode, resolveComponent, Teleport, isVNode, onUnmounted, provide, watch, nextTick, markRaw, watchEffect, h, onMounted, toRaw, render, toRef } from "vue";
+import { getCurrentInstance, inject, ref, computed, unref, isRef, defineComponent, createVNode, Fragment, createElementBlock, openBlock, createElementVNode, onUnmounted, reactive, createTextVNode, resolveComponent, Teleport, isVNode, provide, watch, nextTick, markRaw, watchEffect, h, onMounted, toRaw, render, toRef } from "vue";
 
 import { localeContextKey as localeContextKey$1, ElMessage, ElTooltip, ElScrollbar, ElDivider, ElColorPicker, ElSwitch, ElDropdown, ElDropdownMenu, ElDropdownItem, ElIcon, ElDrawer, ElMenuItem, ElSubMenu, ElMenu, ElContainer, ElCol, ElFormItem, ElInput, ElSelect, ElOption, ElDatePicker, ElInputNumber, ElForm, ElRow, ElButton, ElTable, ElTableColumn, ElCheckbox, ElMessageBox, ElPagination, ElDialog, ElTag, ElCheckboxGroup, ElRadioGroup, ElRadio, ElUpload, ElImageViewer, ElImage, ElTreeSelect, ElCascader, ElTimeSelect, ElEmpty, ElPopover, ElPopconfirm } from "element-plus";
 
@@ -1617,345 +1617,6 @@ var LogoView = defineComponent({
         fill: "currentColor",
         d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896m0 832a384 384 0 0 0 0-768 384 384 0 0 0 0 768m48-176a48 48 0 1 1-96 0 48 48 0 0 1 96 0m-48-464a32 32 0 0 1 32 32v288a32 32 0 0 1-64 0V288a32 32 0 0 1 32-32"
     }) ]))
-}), LayoutSetting = defineComponent({
-    setup() {},
-    render() {
-        const _slots = inject("__slots__", {}), _ns = inject("__ns__", {}), _config = inject("options", {}), _updateOptions = inject("updateOptions", null), settingConfig = reactive({
-            ..._config.setting
-        });
-        settingConfig.headerBarFontActiveColor || (settingConfig.headerBarFontActiveColor = settingConfig.themeColor);
-        const _changeUpdateOptions = () => {
-            const options = {
-                ..._config,
-                setting: {
-                    ...settingConfig
-                }
-            };
-            _updateOptions(options);
-        }, _onChangeThemeColor = color => {
-            if (!color) return ElMessage({
-                type: "warning",
-                message: "主题颜色不能为空"
-            }), !1;
-            settingConfig.themeColor = color, nextUseCssTheme("--el-color-primary", color), 
-            _changeUpdateOptions();
-        }, _onChangeSwitchDark = () => {
-            const body = document.documentElement;
-            settingConfig.isDark ? body.setAttribute("data-theme", "dark") : body.setAttribute("data-theme", ""), 
-            _changeUpdateOptions();
-        }, _onChangeColor = (color, key, cssvar) => {
-            settingConfig[key] = color, nextUseCssVar(cssvar, color), _changeUpdateOptions();
-        }, layouts = [ {
-            type: "defaults",
-            text: "默认"
-        }, {
-            type: "classic",
-            text: "经典"
-        }, {
-            type: "transverse",
-            text: "横向"
-        }, {
-            type: "columns",
-            text: "分栏"
-        }, {
-            type: "composite",
-            text: "综合"
-        } ];
-        return createVNode(ElScrollbar, null, {
-            default: () => [ createVNode(ElDivider, {
-                "border-style": "dashed"
-            }, {
-                default: () => [ createTextVNode("全局主题") ]
-            }), createVNode("div", {
-                class: _ns.b("config-bar-item")
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("主题颜色") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(ElColorPicker, {
-                modelValue: settingConfig.themeColor,
-                "onUpdate:modelValue": $event => settingConfig.themeColor = $event,
-                predefine: [ "#409eff", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
-                "show-alpha": !0,
-                onChange: _onChangeThemeColor
-            }, null) ]) ]), createVNode("div", {
-                class: _ns.b("config-bar-item")
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("暗黑模式") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(ElSwitch, {
-                modelValue: settingConfig.isDark,
-                "onUpdate:modelValue": $event => settingConfig.isDark = $event,
-                "inline-prompt": !0,
-                size: "large",
-                "active-icon": moon_night_default,
-                "inactive-icon": sunny_default,
-                "active-color": "#1f1f1f",
-                "inactive-color": "#dcdfe6",
-                onChange: _onChangeSwitchDark
-            }, null) ]) ]), createVNode("div", {
-                class: _ns.b("config-bar-item")
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("顶栏背景颜色") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(ElColorPicker, {
-                modelValue: settingConfig.headerBarColor,
-                "onUpdate:modelValue": $event => settingConfig.headerBarColor = $event,
-                predefine: [ "#282c34", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
-                "show-alpha": !0,
-                onChange: color => _onChangeColor(color, "headerBarColor", "--next-layout-bg-color")
-            }, null) ]) ]), createVNode("div", {
-                class: _ns.b("config-bar-item")
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("顶栏字体颜色") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(ElColorPicker, {
-                modelValue: settingConfig.headerBarFontColor,
-                "onUpdate:modelValue": $event => settingConfig.headerBarFontColor = $event,
-                predefine: [ "#282c34", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
-                "show-alpha": !0,
-                onChange: color => _onChangeColor(color, "headerBarFontColor", "--next-layout-font-color")
-            }, null) ]) ]), createVNode("div", {
-                class: _ns.b("config-bar-item")
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("顶栏激活字体颜色") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(ElColorPicker, {
-                modelValue: settingConfig.headerBarFontActiveColor,
-                "onUpdate:modelValue": $event => settingConfig.headerBarFontActiveColor = $event,
-                predefine: [ "#282c34", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
-                "show-alpha": !0,
-                onChange: color => _onChangeColor(color, "headerBarFontActiveColor", "--next-layout-active-color")
-            }, null) ]) ]), createVNode("div", {
-                class: _ns.b("config-bar-item")
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("顶栏背景渐变") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(resolveComponent("el-switch"), {
-                modelValue: settingConfig.isHeaderBarColorGradual,
-                "onUpdate:modelValue": $event => settingConfig.isHeaderBarColorGradual = $event,
-                onChange: _changeUpdateOptions
-            }, null) ]) ]), createVNode(ElDivider, {
-                "border-style": "dashed"
-            }, {
-                default: () => [ createTextVNode("布局方式") ]
-            }), createVNode("ul", {
-                class: _ns.b("config-bar-layout")
-            }, [ layouts.map((item => createVNode("li", {
-                class: [ _ns.be("config-bar-layout", item.type), _ns.is("active", settingConfig.layout === item.type) ],
-                onClick: event => ((event, layout) => {
-                    event.stopPropagation(), settingConfig.layout = layout.type, _changeUpdateOptions();
-                })(event, item)
-            }, [ createVNode("div", {
-                class: "layout-wrap"
-            }, [ createVNode("div", {
-                class: "layout-box"
-            }, [ createVNode("p", {
-                class: "layout-text"
-            }, [ item.text ]) ]) ]), createVNode("aside", null, null) ]))) ]), createVNode("div", {
-                class: _ns.b("config-bar-item"),
-                style: {
-                    "margin-top": "20px"
-                }
-            }, [ createVNode("span", {
-                class: _ns.be("config-bar-item", "label")
-            }, [ createTextVNode("是否显示标签栏") ]), createVNode("div", {
-                class: _ns.be("config-bar-item", "value")
-            }, [ createVNode(ElSwitch, {
-                modelValue: _config.showTabs,
-                "onUpdate:modelValue": $event => _config.showTabs = $event
-            }, null) ]) ]), _slots.setting?.({
-                config: settingConfig
-            }) ]
-        });
-    }
-});
-
-var HeaderTools = defineComponent({
-    setup() {
-        const locale = inject(localeContextKey, ref()), config = inject("options", {}), {t: t} = useLocale(), {toggle: toggle, isFullscreen: isFullscreen} = useFullscreen(), language = ref(computed((() => config.language)).value), settingDrawer = ref(!1);
-        return {
-            locale: locale,
-            config: config,
-            t: t,
-            toggle: toggle,
-            isFullscreen: isFullscreen,
-            language: language,
-            settingDrawer: settingDrawer
-        };
-    },
-    render() {
-        const _ns = inject("__ns__", {}), _config = this.config, _emit = inject("__emit__", {}), slots = this.$slots, _t = this.t, isFullscreen = this.isFullscreen, profile_url = _config.profile, _userDropdown = _config.userDropdown, _languageDropdown = _config.languageDropdown, _closeSettingDrawer = () => {
-            this.settingDrawer = !1;
-        };
-        return createVNode(Fragment, null, [ createVNode("ul", {
-            class: _ns.b("header-tools")
-        }, [ slots[slots_config_headerToolsPrefix]?.(), createVNode("li", null, [ createVNode(ElDropdown, {
-            "show-timeout": 70,
-            "hide-timeout": 50,
-            trigger: "click",
-            onCommand: command => {
-                this.language = command, _emit("changeLanguage", command), _config.onChangeLanguage && _config.onChangeLanguage(command);
-            }
-        }, {
-            default: () => createVNode("div", null, [ createVNode(ElIcon, {
-                size: 16
-            }, {
-                default: () => [ createVNode("svg", {
-                    class: "icon",
-                    viewBox: "0 0 1070 1024",
-                    version: "1.1",
-                    xmlns: "http://www.w3.org/2000/svg",
-                    "p-id": "1855",
-                    width: "128",
-                    height: "128"
-                }, [ createVNode("path", {
-                    d: "M232.58156522 358.13286957C244.86956522 394.4626087 265.17147826 425.984 293.48730435 453.76556522c24.04173913-26.17878261 42.2066087-58.23443478 53.96034782-95.63269565H232.58156522z",
-                    "p-id": "1856"
-                }, null), createVNode("path", {
-                    d: "M981.61530435 143.36h-448.77913044L507.19165217 6.05495652h-416.72347826c-45.94643478 0-83.34469565 37.39826087-83.34469565 83.34469565v708.42991305c0 45.94643478 37.39826087 83.34469565 83.34469565 83.34469565h379.85947826l-30.45286956 137.30504348h541.74052174c45.94643478 0 83.34469565-37.39826087 83.34469565-83.34469565V226.70469565c0-45.94643478-37.39826087-83.34469565-83.34469565-83.34469565zM415.83304348 564.35756522c-49.152-18.16486957-89.75582609-41.13808696-122.34573913-67.85113044-34.19269565 30.45286957-76.93356522 52.89182609-126.61982609 66.7826087l-17.09634783-28.31582609c48.61773913-12.82226087 89.22156522-32.05565217 121.2772174-59.30295652-33.12417391-33.65843478-56.0973913-72.65947826-68.91965218-117.00313044h-46.48069565v-32.05565217H276.92521739c-7.47965217-13.89078261-17.09634783-27.24730435-28.31582609-40.06956522l32.05565218-11.75373913c11.21947826 14.42504348 21.37043478 31.5213913 30.45286956 51.28904348h115.9346087v32.05565218h-46.48069565c-14.95930435 45.94643478-36.32973913 84.41321739-64.64556522 115.40034782 31.5213913 25.11026087 71.05669565 45.94643478 117.5373913 63.04278261l-17.63060869 27.78156522z m607.45460869 370.24278261c0 22.97321739-18.69913043 41.67234783-41.67234782 41.67234782H492.23234783l20.83617391-95.63269565h156.53843478l-89.22156522-497.39686957-0.53426087 2.67130435-3.73982608-19.76765217 1.06852174 0.53426087-32.58991305-181.64869565H982.14956522c22.97321739 0 41.67234783 18.69913043 41.67234782 41.67234782v707.89565218z",
-                    "p-id": "1857"
-                }, null), createVNode("path", {
-                    d: "M684.56626087 541.38434783h114.86608696v-30.45286957h-114.86608696V450.02573913h122.34573913v-30.45286956h-158.14121739v219.04695652h162.94956522V608.16695652h-127.15408696v-66.78260869z m239.88313043-65.71408696c-9.61669565 0-18.16486957 1.60278261-26.1787826 5.87686956-7.47965217 3.73982609-14.95930435 9.61669565-20.83617392 17.09634783V479.94434783h-34.72695652v158.67547826h34.72695652v-95.63269566c1.06852174-12.82226087 5.3426087-22.43895652 12.82226087-29.38434782 6.41113043-5.87686957 13.89078261-9.08243478 22.43895652-9.08243478 24.04173913 0 35.79547826 12.82226087 35.79547826 39.00104347v94.56417392h34.72695653v-97.76973913c1.06852174-43.27513043-19.2333913-64.64556522-58.76869566-64.64556522z",
-                    "p-id": "1858"
-                }, null) ]) ]
-            }) ]),
-            dropdown: () => {
-                let _slot;
-                return createVNode(ElDropdownMenu, null, "function" == typeof (s = _slot = _languageDropdown.map((item => createVNode(ElDropdownItem, {
-                    command: item.value,
-                    disabled: this.language === item.value
-                }, {
-                    default: () => [ item.label ]
-                })))) || "[object Object]" === Object.prototype.toString.call(s) && !isVNode(s) ? _slot : {
-                    default: () => [ _slot ]
-                });
-                var s;
-            }
-        }) ]), createVNode("li", null, [ createVNode("span", {
-            style: {
-                display: "inline-block",
-                lineHeight: 1
-            },
-            onClick: this.toggle
-        }, [ createVNode(ElIcon, {
-            size: 16
-        }, {
-            default: () => [ isFullscreen ? createVNode("svg", {
-                class: "icon",
-                viewBox: "0 0 1024 1024",
-                version: "1.1",
-                xmlns: "http://www.w3.org/2000/svg",
-                "p-id": "2676",
-                width: "128",
-                height: "128"
-            }, [ createVNode("path", {
-                d: "M749.248 704H864a32 32 0 1 0 0-64H672a32 32 0 0 0-32 32v192a32 32 0 1 0 64 0v-114.752l137.36 137.36a32 32 0 1 0 45.232-45.264L749.248 704zM320 749.248V864a32 32 0 1 0 64 0V672a32 32 0 0 0-32-32H160a32 32 0 1 0 0 64h114.752l-137.36 137.36a32 32 0 1 0 45.264 45.232L320 749.248zM749.248 320H864a32 32 0 1 1 0 64H672a32 32 0 0 1-32-32V160a32 32 0 1 1 64 0v114.752l137.36-137.36a32 32 0 1 1 45.232 45.264L749.248 320zM320 274.752V160a32 32 0 1 1 64 0v192a32 32 0 0 1-32 32H160a32 32 0 1 1 0-64h114.752l-137.36-137.36a32 32 0 1 1 45.264-45.232L320 274.752z",
-                "p-id": "2677"
-            }, null) ]) : createVNode("svg", {
-                class: "icon",
-                viewBox: "0 0 1024 1024",
-                version: "1.1",
-                xmlns: "http://www.w3.org/2000/svg",
-                "p-id": "2522",
-                width: "128",
-                height: "128"
-            }, [ createVNode("path", {
-                d: "M237.248 192H352a32 32 0 1 0 0-64H160a32 32 0 0 0-32 32v192a32 32 0 1 0 64 0v-114.752l137.36 137.36a32 32 0 1 0 45.232-45.264L237.248 192zM832 237.248V352a32 32 0 1 0 64 0V160a32 32 0 0 0-32-32H672a32 32 0 1 0 0 64h114.752l-137.36 137.36a32 32 0 1 0 45.264 45.232L832 237.248zM237.248 832H352a32 32 0 1 1 0 64H160a32 32 0 0 1-32-32V672a32 32 0 1 1 64 0v114.752l137.36-137.36a32 32 0 1 1 45.232 45.264L237.248 832zM832 786.752V672a32 32 0 1 1 64 0v192a32 32 0 0 1-32 32H672a32 32 0 1 1 0-64h114.752l-137.36-137.36a32 32 0 1 1 45.264-45.232L832 786.752z",
-                "p-id": "2523"
-            }, null) ]) ]
-        }) ]) ]), slots[slots_config_headerToolsSuffix]?.(), createVNode("li", null, [ createVNode(ElDropdown, {
-            "show-timeout": 70,
-            "hide-timeout": 80,
-            "popper-class": _ns.be("header-tools", "userDropdown"),
-            onCommand: command => {
-                _emit("changeUserDropdown", command), _config.onChangeUserDropdown && _config.onChangeUserDropdown(command);
-            }
-        }, {
-            default: () => createVNode("span", {
-                class: _ns.be("header-tools", "user")
-            }, [ profile_url ? createVNode("img", {
-                class: "user-photo",
-                src: profile_url
-            }, null) : null, createVNode("span", null, [ _config.userName ]), createVNode(ElIcon, {
-                class: "el-icon--right"
-            }, {
-                default: () => [ createVNode(arrow_down_default, null, null) ]
-            }) ]),
-            dropdown: () => createVNode(ElDropdownMenu, null, {
-                default: () => [ _userDropdown?.map((item => createVNode(ElDropdownItem, {
-                    command: item.value,
-                    divided: !!item.divided
-                }, {
-                    default: () => [ item.svg ? createVNode("span", {
-                        innerHTML: item.svg,
-                        class: "item-svg"
-                    }, null) : null, item.iconfont ? createVNode("i", {
-                        class: item.iconfont
-                    }, null) : null, _t(item.label) ]
-                }))) ]
-            })
-        }) ]), createVNode("li", null, [ createVNode("span", {
-            style: {
-                display: "inline-block",
-                lineHeight: 1
-            },
-            onClick: () => {
-                this.settingDrawer = !0;
-            }
-        }, [ createVNode(ElIcon, {
-            size: 16
-        }, {
-            default: () => [ createVNode(setting_default, null, null) ]
-        }) ]) ]) ]), createVNode(Teleport, {
-            to: "body"
-        }, {
-            default: () => [ createVNode(ElDrawer, {
-                modelValue: this.settingDrawer,
-                "onUpdate:modelValue": $event => this.settingDrawer = $event,
-                title: this.t("next.layout.systemSetting"),
-                direction: "rtl",
-                size: "380px",
-                class: _ns.be("drawer", "setting"),
-                "destroy-on-close": !0,
-                beforeClose: _closeSettingDrawer
-            }, {
-                default: () => [ createVNode(LayoutSetting, null, null) ]
-            }) ]
-        }) ]);
-    }
-});
-
-const {getLightColor: getLightColor$4} = useChangeColor();
-
-var Header$4 = defineComponent({
-    setup: () => ({
-        ns: inject("ns", {})
-    }),
-    render() {
-        const slots = this.$slots, _ns = this.ns, _config = inject("options", {}), headerStyle = computed((() => {
-            const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
-            return isHeaderBarColorGradual ? {
-                background: `linear-gradient(to bottom , ${color}, ${getLightColor$4(color, .5)})`
-            } : "";
-        })), __slots_header_tools = {};
-        return slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
-        slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]()), 
-        createVNode("header", {
-            class: _ns.b("header"),
-            style: headerStyle.value
-        }, [ createVNode(LogoView, null, null), createVNode("div", {
-            class: _ns.bf("header", "right")
-        }, [ createVNode(HeaderTools, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !isVNode(s) ? __slots_header_tools : {
-            default: () => [ __slots_header_tools ]
-        })) ]) ]);
-        var s;
-    }
 });
 
 function getDefaultExportFromCjs(x) {
@@ -2487,160 +2148,503 @@ function isElement(obj) {
     return obj && 1 === obj.nodeType;
 }
 
-var elementResizeDetector = function(options) {
-    var idHandler;
-    if ((options = options || {}).idHandler) idHandler = {
-        get: function(element) {
-            return options.idHandler.get(element, !0);
-        },
-        set: options.idHandler.set
-    }; else {
-        var idGenerator = idGeneratorMaker(), defaultIdHandler = idHandlerMaker({
-            idGenerator: idGenerator,
-            stateHandler: stateHandler
+var elementResizeDetector = function(options) {
+    var idHandler;
+    if ((options = options || {}).idHandler) idHandler = {
+        get: function(element) {
+            return options.idHandler.get(element, !0);
+        },
+        set: options.idHandler.set
+    }; else {
+        var idGenerator = idGeneratorMaker(), defaultIdHandler = idHandlerMaker({
+            idGenerator: idGenerator,
+            stateHandler: stateHandler
+        });
+        idHandler = defaultIdHandler;
+    }
+    var reporter = options.reporter;
+    reporter || (reporter = reporterMaker(!1 === reporter));
+    var batchProcessor = getOption(options, "batchProcessor", batchProcessorMaker({
+        reporter: reporter
+    })), globalOptions = {};
+    globalOptions.callOnAdd = !!getOption(options, "callOnAdd", !0), globalOptions.debug = !!getOption(options, "debug", !1);
+    var detectionStrategy, eventListenerHandler = listenerHandlerMaker(idHandler), elementUtils = elementUtilsMaker({
+        stateHandler: stateHandler
+    }), desiredStrategy = getOption(options, "strategy", "object"), importantCssRules = getOption(options, "important", !1), strategyOptions = {
+        reporter: reporter,
+        batchProcessor: batchProcessor,
+        stateHandler: stateHandler,
+        idHandler: idHandler,
+        important: importantCssRules
+    };
+    if ("scroll" === desiredStrategy && (browserDetector.isLegacyOpera() ? (reporter.warn("Scroll strategy is not supported on legacy Opera. Changing to object strategy."), 
+    desiredStrategy = "object") : browserDetector.isIE(9) && (reporter.warn("Scroll strategy is not supported on IE9. Changing to object strategy."), 
+    desiredStrategy = "object")), "scroll" === desiredStrategy) detectionStrategy = scrollStrategyMaker(strategyOptions); else {
+        if ("object" !== desiredStrategy) throw new Error("Invalid strategy name: " + desiredStrategy);
+        detectionStrategy = objectStrategyMaker(strategyOptions);
+    }
+    var onReadyCallbacks = {};
+    return {
+        listenTo: function(options, elements, listener) {
+            function onResizeCallback(element) {
+                var listeners = eventListenerHandler.get(element);
+                forEach(listeners, (function(listener) {
+                    listener(element);
+                }));
+            }
+            function addListener(callOnAdd, element, listener) {
+                eventListenerHandler.add(element, listener), callOnAdd && listener(element);
+            }
+            if (listener || (listener = elements, elements = options, options = {}), !elements) throw new Error("At least one element required.");
+            if (!listener) throw new Error("Listener required.");
+            if (isElement(elements)) elements = [ elements ]; else {
+                if (!isCollection(elements)) return reporter.error("Invalid arguments. Must be a DOM element or a collection of DOM elements.");
+                elements = toArray(elements);
+            }
+            var elementsReady = 0, callOnAdd = getOption(options, "callOnAdd", globalOptions.callOnAdd), onReadyCallback = getOption(options, "onReady", (function() {})), debug = getOption(options, "debug", globalOptions.debug);
+            forEach(elements, (function(element) {
+                stateHandler.getState(element) || (stateHandler.initState(element), idHandler.set(element));
+                var id = idHandler.get(element);
+                if (debug && reporter.log("Attaching listener to element", id, element), !elementUtils.isDetectable(element)) return debug && reporter.log(id, "Not detectable."), 
+                elementUtils.isBusy(element) ? (debug && reporter.log(id, "System busy making it detectable"), 
+                addListener(callOnAdd, element, listener), onReadyCallbacks[id] = onReadyCallbacks[id] || [], 
+                void onReadyCallbacks[id].push((function() {
+                    ++elementsReady === elements.length && onReadyCallback();
+                }))) : (debug && reporter.log(id, "Making detectable..."), elementUtils.markBusy(element, !0), 
+                detectionStrategy.makeDetectable({
+                    debug: debug,
+                    important: importantCssRules
+                }, element, (function(element) {
+                    if (debug && reporter.log(id, "onElementDetectable"), stateHandler.getState(element)) {
+                        elementUtils.markAsDetectable(element), elementUtils.markBusy(element, !1), detectionStrategy.addListener(element, onResizeCallback), 
+                        addListener(callOnAdd, element, listener);
+                        var state = stateHandler.getState(element);
+                        if (state && state.startSize) {
+                            var width = element.offsetWidth, height = element.offsetHeight;
+                            state.startSize.width === width && state.startSize.height === height || onResizeCallback(element);
+                        }
+                        onReadyCallbacks[id] && forEach(onReadyCallbacks[id], (function(callback) {
+                            callback();
+                        }));
+                    } else debug && reporter.log(id, "Element uninstalled before being detectable.");
+                    delete onReadyCallbacks[id], ++elementsReady === elements.length && onReadyCallback();
+                })));
+                debug && reporter.log(id, "Already detecable, adding listener."), addListener(callOnAdd, element, listener), 
+                elementsReady++;
+            })), elementsReady === elements.length && onReadyCallback();
+        },
+        removeListener: eventListenerHandler.removeListener,
+        removeAllListeners: eventListenerHandler.removeAllListeners,
+        uninstall: function(elements) {
+            if (!elements) return reporter.error("At least one element is required.");
+            if (isElement(elements)) elements = [ elements ]; else {
+                if (!isCollection(elements)) return reporter.error("Invalid arguments. Must be a DOM element or a collection of DOM elements.");
+                elements = toArray(elements);
+            }
+            forEach(elements, (function(element) {
+                eventListenerHandler.removeAllListeners(element), detectionStrategy.uninstall(element), 
+                stateHandler.cleanState(element);
+            }));
+        },
+        initDocument: function(targetDocument) {
+            detectionStrategy.initDocument && detectionStrategy.initDocument(targetDocument);
+        }
+    };
+};
+
+function getOption(options, name, defaultValue) {
+    var value = options[name];
+    return null == value && void 0 !== defaultValue ? defaultValue : value;
+}
+
+var elementResizeDetectorMaker = getDefaultExportFromCjs(elementResizeDetector);
+
+const elementResize = (el, cb) => {
+    const erd = elementResizeDetectorMaker();
+    let timer = null;
+    erd.listenTo(el, (() => {
+        null !== timer && clearTimeout(timer), timer = setTimeout((() => {
+            cb && cb(el), clearTimeout(timer);
+        }), 200);
+    })), onUnmounted((() => {
+        erd.removeListener(el, (() => {}));
+    }));
+}, deepClone = source => {
+    if (null == source) return source;
+    let target;
+    if ("object" == typeof source) {
+        target = Array.isArray(source) ? [] : {};
+        for (let key in source) "object" == typeof source[key] ? target[key] = deepClone(source[key]) : target[key] = source[key];
+    } else target = source;
+    return target;
+}, arrayObjNoRepeat = (arr, property) => {
+    const result = [], uniqueMap = new Map;
+    for (const item of arr) {
+        const key = item[property];
+        uniqueMap.has(key) || (uniqueMap.set(key, !0), result.push(item));
+    }
+    return result;
+}, isValueExist = value => null != value && ("string" == typeof value ? "" !== value.trim() : !1 !== value), valueExist = (...arg) => {
+    let exist = null;
+    for (let i = 0; i < arg.length; i++) {
+        const val = arg[i];
+        if (null != val) {
+            exist = val;
+            break;
+        }
+    }
+    return exist;
+}, shareObjectProperty = (target, source, key) => (Object.defineProperty(target, key, {
+    get: () => source[key]
+}), {
+    target: target,
+    source: source
+});
+
+var LayoutSetting = defineComponent({
+    setup() {
+        const config = inject("options", {});
+        return isValueExist(config.setting.headerBarFontActiveColor) || (config.setting.headerBarFontActiveColor = config.setting.themeColor), 
+        {
+            config: config
+        };
+    },
+    render() {
+        const _slots = inject("__slots__", {}), _ns = inject("__ns__", {}), _config = this.config, _updateOptions = inject("updateOptions", null), settingConfig = reactive({
+            ..._config.setting
+        }), _changeUpdateOptions = () => {
+            const options = {
+                ..._config,
+                setting: {
+                    ...settingConfig
+                }
+            };
+            _updateOptions(options);
+        }, _onChangeThemeColor = color => {
+            if (!color) return ElMessage({
+                type: "warning",
+                message: "主题颜色不能为空"
+            }), !1;
+            settingConfig.themeColor = color, nextUseCssTheme("--el-color-primary", color), 
+            _changeUpdateOptions();
+        }, _onChangeSwitchDark = () => {
+            const body = document.documentElement;
+            settingConfig.isDark ? body.setAttribute("data-theme", "dark") : body.setAttribute("data-theme", ""), 
+            _changeUpdateOptions();
+        }, _onChangeColor = (color, key, cssvar) => {
+            settingConfig[key] = color, nextUseCssVar(cssvar, color), _changeUpdateOptions();
+        }, layouts = [ {
+            type: "defaults",
+            text: "默认"
+        }, {
+            type: "classic",
+            text: "经典"
+        }, {
+            type: "transverse",
+            text: "横向"
+        }, {
+            type: "columns",
+            text: "分栏"
+        }, {
+            type: "composite",
+            text: "综合"
+        } ];
+        return createVNode(ElScrollbar, null, {
+            default: () => [ createVNode(ElDivider, {
+                "border-style": "dashed"
+            }, {
+                default: () => [ createTextVNode("全局主题") ]
+            }), createVNode("div", {
+                class: _ns.b("config-bar-item")
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("主题颜色") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(ElColorPicker, {
+                modelValue: settingConfig.themeColor,
+                "onUpdate:modelValue": $event => settingConfig.themeColor = $event,
+                predefine: [ "#409eff", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
+                "show-alpha": !0,
+                onChange: _onChangeThemeColor
+            }, null) ]) ]), createVNode("div", {
+                class: _ns.b("config-bar-item")
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("暗黑模式") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(ElSwitch, {
+                modelValue: settingConfig.isDark,
+                "onUpdate:modelValue": $event => settingConfig.isDark = $event,
+                "inline-prompt": !0,
+                size: "large",
+                "active-icon": moon_night_default,
+                "inactive-icon": sunny_default,
+                "active-color": "#1f1f1f",
+                "inactive-color": "#dcdfe6",
+                onChange: _onChangeSwitchDark
+            }, null) ]) ]), createVNode("div", {
+                class: _ns.b("config-bar-item")
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("顶栏背景颜色") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(ElColorPicker, {
+                modelValue: settingConfig.headerBarColor,
+                "onUpdate:modelValue": $event => settingConfig.headerBarColor = $event,
+                predefine: [ "#282c34", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
+                "show-alpha": !0,
+                onChange: color => _onChangeColor(color, "headerBarColor", "--next-layout-bg-color")
+            }, null) ]) ]), createVNode("div", {
+                class: _ns.b("config-bar-item")
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("顶栏字体颜色") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(ElColorPicker, {
+                modelValue: settingConfig.headerBarFontColor,
+                "onUpdate:modelValue": $event => settingConfig.headerBarFontColor = $event,
+                predefine: [ "#282c34", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
+                "show-alpha": !0,
+                onChange: color => _onChangeColor(color, "headerBarFontColor", "--next-layout-font-color")
+            }, null) ]) ]), createVNode("div", {
+                class: _ns.b("config-bar-item")
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("顶栏激活字体颜色") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(ElColorPicker, {
+                modelValue: settingConfig.headerBarFontActiveColor,
+                "onUpdate:modelValue": $event => settingConfig.headerBarFontActiveColor = $event,
+                predefine: [ "#282c34", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585", "#FB07A0" ],
+                "show-alpha": !0,
+                onChange: color => _onChangeColor(color, "headerBarFontActiveColor", "--next-layout-active-color")
+            }, null) ]) ]), createVNode("div", {
+                class: _ns.b("config-bar-item")
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("顶栏背景渐变") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(resolveComponent("el-switch"), {
+                modelValue: settingConfig.isHeaderBarColorGradual,
+                "onUpdate:modelValue": $event => settingConfig.isHeaderBarColorGradual = $event,
+                onChange: _changeUpdateOptions
+            }, null) ]) ]), createVNode(ElDivider, {
+                "border-style": "dashed"
+            }, {
+                default: () => [ createTextVNode("布局方式") ]
+            }), createVNode("ul", {
+                class: _ns.b("config-bar-layout")
+            }, [ layouts.map((item => createVNode("li", {
+                class: [ _ns.be("config-bar-layout", item.type), _ns.is("active", settingConfig.layout === item.type) ],
+                onClick: event => ((event, layout) => {
+                    event.stopPropagation(), settingConfig.layout = layout.type, _changeUpdateOptions();
+                })(event, item)
+            }, [ createVNode("div", {
+                class: "layout-wrap"
+            }, [ createVNode("div", {
+                class: "layout-box"
+            }, [ createVNode("p", {
+                class: "layout-text"
+            }, [ item.text ]) ]) ]), createVNode("aside", null, null) ]))) ]), createVNode("div", {
+                class: _ns.b("config-bar-item"),
+                style: {
+                    "margin-top": "20px"
+                }
+            }, [ createVNode("span", {
+                class: _ns.be("config-bar-item", "label")
+            }, [ createTextVNode("是否显示标签栏") ]), createVNode("div", {
+                class: _ns.be("config-bar-item", "value")
+            }, [ createVNode(ElSwitch, {
+                modelValue: _config.showTabs,
+                "onUpdate:modelValue": $event => _config.showTabs = $event
+            }, null) ]) ]), _slots.setting?.({
+                config: settingConfig
+            }) ]
         });
-        idHandler = defaultIdHandler;
-    }
-    var reporter = options.reporter;
-    reporter || (reporter = reporterMaker(!1 === reporter));
-    var batchProcessor = getOption(options, "batchProcessor", batchProcessorMaker({
-        reporter: reporter
-    })), globalOptions = {};
-    globalOptions.callOnAdd = !!getOption(options, "callOnAdd", !0), globalOptions.debug = !!getOption(options, "debug", !1);
-    var detectionStrategy, eventListenerHandler = listenerHandlerMaker(idHandler), elementUtils = elementUtilsMaker({
-        stateHandler: stateHandler
-    }), desiredStrategy = getOption(options, "strategy", "object"), importantCssRules = getOption(options, "important", !1), strategyOptions = {
-        reporter: reporter,
-        batchProcessor: batchProcessor,
-        stateHandler: stateHandler,
-        idHandler: idHandler,
-        important: importantCssRules
-    };
-    if ("scroll" === desiredStrategy && (browserDetector.isLegacyOpera() ? (reporter.warn("Scroll strategy is not supported on legacy Opera. Changing to object strategy."), 
-    desiredStrategy = "object") : browserDetector.isIE(9) && (reporter.warn("Scroll strategy is not supported on IE9. Changing to object strategy."), 
-    desiredStrategy = "object")), "scroll" === desiredStrategy) detectionStrategy = scrollStrategyMaker(strategyOptions); else {
-        if ("object" !== desiredStrategy) throw new Error("Invalid strategy name: " + desiredStrategy);
-        detectionStrategy = objectStrategyMaker(strategyOptions);
     }
-    var onReadyCallbacks = {};
-    return {
-        listenTo: function(options, elements, listener) {
-            function onResizeCallback(element) {
-                var listeners = eventListenerHandler.get(element);
-                forEach(listeners, (function(listener) {
-                    listener(element);
-                }));
+});
+
+var HeaderTools = defineComponent({
+    setup() {
+        const locale = inject(localeContextKey, ref()), config = inject("options", {}), {t: t} = useLocale(), {toggle: toggle, isFullscreen: isFullscreen} = useFullscreen(), language = ref(computed((() => config.language)).value), settingDrawer = ref(!1);
+        return {
+            locale: locale,
+            config: config,
+            t: t,
+            toggle: toggle,
+            isFullscreen: isFullscreen,
+            language: language,
+            settingDrawer: settingDrawer
+        };
+    },
+    render() {
+        const _ns = inject("__ns__", {}), _config = this.config, _emit = inject("__emit__", {}), slots = this.$slots, _t = this.t, isFullscreen = this.isFullscreen, profile_url = _config.profile, _userDropdown = _config.userDropdown, _languageDropdown = _config.languageDropdown, _closeSettingDrawer = () => {
+            this.settingDrawer = !1;
+        };
+        return createVNode(Fragment, null, [ createVNode("ul", {
+            class: _ns.b("header-tools")
+        }, [ slots[slots_config_headerToolsPrefix]?.(), createVNode("li", null, [ createVNode(ElDropdown, {
+            "show-timeout": 70,
+            "hide-timeout": 50,
+            trigger: "click",
+            onCommand: command => {
+                this.language = command, _emit("changeLanguage", command), _config.onChangeLanguage && _config.onChangeLanguage(command);
             }
-            function addListener(callOnAdd, element, listener) {
-                eventListenerHandler.add(element, listener), callOnAdd && listener(element);
+        }, {
+            default: () => createVNode("div", null, [ createVNode(ElIcon, {
+                size: 16
+            }, {
+                default: () => [ createVNode("svg", {
+                    class: "icon",
+                    viewBox: "0 0 1070 1024",
+                    version: "1.1",
+                    xmlns: "http://www.w3.org/2000/svg",
+                    "p-id": "1855",
+                    width: "128",
+                    height: "128"
+                }, [ createVNode("path", {
+                    d: "M232.58156522 358.13286957C244.86956522 394.4626087 265.17147826 425.984 293.48730435 453.76556522c24.04173913-26.17878261 42.2066087-58.23443478 53.96034782-95.63269565H232.58156522z",
+                    "p-id": "1856"
+                }, null), createVNode("path", {
+                    d: "M981.61530435 143.36h-448.77913044L507.19165217 6.05495652h-416.72347826c-45.94643478 0-83.34469565 37.39826087-83.34469565 83.34469565v708.42991305c0 45.94643478 37.39826087 83.34469565 83.34469565 83.34469565h379.85947826l-30.45286956 137.30504348h541.74052174c45.94643478 0 83.34469565-37.39826087 83.34469565-83.34469565V226.70469565c0-45.94643478-37.39826087-83.34469565-83.34469565-83.34469565zM415.83304348 564.35756522c-49.152-18.16486957-89.75582609-41.13808696-122.34573913-67.85113044-34.19269565 30.45286957-76.93356522 52.89182609-126.61982609 66.7826087l-17.09634783-28.31582609c48.61773913-12.82226087 89.22156522-32.05565217 121.2772174-59.30295652-33.12417391-33.65843478-56.0973913-72.65947826-68.91965218-117.00313044h-46.48069565v-32.05565217H276.92521739c-7.47965217-13.89078261-17.09634783-27.24730435-28.31582609-40.06956522l32.05565218-11.75373913c11.21947826 14.42504348 21.37043478 31.5213913 30.45286956 51.28904348h115.9346087v32.05565218h-46.48069565c-14.95930435 45.94643478-36.32973913 84.41321739-64.64556522 115.40034782 31.5213913 25.11026087 71.05669565 45.94643478 117.5373913 63.04278261l-17.63060869 27.78156522z m607.45460869 370.24278261c0 22.97321739-18.69913043 41.67234783-41.67234782 41.67234782H492.23234783l20.83617391-95.63269565h156.53843478l-89.22156522-497.39686957-0.53426087 2.67130435-3.73982608-19.76765217 1.06852174 0.53426087-32.58991305-181.64869565H982.14956522c22.97321739 0 41.67234783 18.69913043 41.67234782 41.67234782v707.89565218z",
+                    "p-id": "1857"
+                }, null), createVNode("path", {
+                    d: "M684.56626087 541.38434783h114.86608696v-30.45286957h-114.86608696V450.02573913h122.34573913v-30.45286956h-158.14121739v219.04695652h162.94956522V608.16695652h-127.15408696v-66.78260869z m239.88313043-65.71408696c-9.61669565 0-18.16486957 1.60278261-26.1787826 5.87686956-7.47965217 3.73982609-14.95930435 9.61669565-20.83617392 17.09634783V479.94434783h-34.72695652v158.67547826h34.72695652v-95.63269566c1.06852174-12.82226087 5.3426087-22.43895652 12.82226087-29.38434782 6.41113043-5.87686957 13.89078261-9.08243478 22.43895652-9.08243478 24.04173913 0 35.79547826 12.82226087 35.79547826 39.00104347v94.56417392h34.72695653v-97.76973913c1.06852174-43.27513043-19.2333913-64.64556522-58.76869566-64.64556522z",
+                    "p-id": "1858"
+                }, null) ]) ]
+            }) ]),
+            dropdown: () => {
+                let _slot;
+                return createVNode(ElDropdownMenu, null, "function" == typeof (s = _slot = _languageDropdown.map((item => createVNode(ElDropdownItem, {
+                    command: item.value,
+                    disabled: this.language === item.value
+                }, {
+                    default: () => [ item.label ]
+                })))) || "[object Object]" === Object.prototype.toString.call(s) && !isVNode(s) ? _slot : {
+                    default: () => [ _slot ]
+                });
+                var s;
             }
-            if (listener || (listener = elements, elements = options, options = {}), !elements) throw new Error("At least one element required.");
-            if (!listener) throw new Error("Listener required.");
-            if (isElement(elements)) elements = [ elements ]; else {
-                if (!isCollection(elements)) return reporter.error("Invalid arguments. Must be a DOM element or a collection of DOM elements.");
-                elements = toArray(elements);
+        }) ]), createVNode("li", null, [ createVNode("span", {
+            style: {
+                display: "inline-block",
+                lineHeight: 1
+            },
+            onClick: this.toggle
+        }, [ createVNode(ElIcon, {
+            size: 16
+        }, {
+            default: () => [ isFullscreen ? createVNode("svg", {
+                class: "icon",
+                viewBox: "0 0 1024 1024",
+                version: "1.1",
+                xmlns: "http://www.w3.org/2000/svg",
+                "p-id": "2676",
+                width: "128",
+                height: "128"
+            }, [ createVNode("path", {
+                d: "M749.248 704H864a32 32 0 1 0 0-64H672a32 32 0 0 0-32 32v192a32 32 0 1 0 64 0v-114.752l137.36 137.36a32 32 0 1 0 45.232-45.264L749.248 704zM320 749.248V864a32 32 0 1 0 64 0V672a32 32 0 0 0-32-32H160a32 32 0 1 0 0 64h114.752l-137.36 137.36a32 32 0 1 0 45.264 45.232L320 749.248zM749.248 320H864a32 32 0 1 1 0 64H672a32 32 0 0 1-32-32V160a32 32 0 1 1 64 0v114.752l137.36-137.36a32 32 0 1 1 45.232 45.264L749.248 320zM320 274.752V160a32 32 0 1 1 64 0v192a32 32 0 0 1-32 32H160a32 32 0 1 1 0-64h114.752l-137.36-137.36a32 32 0 1 1 45.264-45.232L320 274.752z",
+                "p-id": "2677"
+            }, null) ]) : createVNode("svg", {
+                class: "icon",
+                viewBox: "0 0 1024 1024",
+                version: "1.1",
+                xmlns: "http://www.w3.org/2000/svg",
+                "p-id": "2522",
+                width: "128",
+                height: "128"
+            }, [ createVNode("path", {
+                d: "M237.248 192H352a32 32 0 1 0 0-64H160a32 32 0 0 0-32 32v192a32 32 0 1 0 64 0v-114.752l137.36 137.36a32 32 0 1 0 45.232-45.264L237.248 192zM832 237.248V352a32 32 0 1 0 64 0V160a32 32 0 0 0-32-32H672a32 32 0 1 0 0 64h114.752l-137.36 137.36a32 32 0 1 0 45.264 45.232L832 237.248zM237.248 832H352a32 32 0 1 1 0 64H160a32 32 0 0 1-32-32V672a32 32 0 1 1 64 0v114.752l137.36-137.36a32 32 0 1 1 45.232 45.264L237.248 832zM832 786.752V672a32 32 0 1 1 64 0v192a32 32 0 0 1-32 32H672a32 32 0 1 1 0-64h114.752l-137.36-137.36a32 32 0 1 1 45.264-45.232L832 786.752z",
+                "p-id": "2523"
+            }, null) ]) ]
+        }) ]) ]), slots[slots_config_headerToolsSuffix]?.(), createVNode("li", null, [ createVNode(ElDropdown, {
+            "show-timeout": 70,
+            "hide-timeout": 80,
+            "popper-class": _ns.be("header-tools", "userDropdown"),
+            onCommand: command => {
+                _emit("changeUserDropdown", command), _config.onChangeUserDropdown && _config.onChangeUserDropdown(command);
             }
-            var elementsReady = 0, callOnAdd = getOption(options, "callOnAdd", globalOptions.callOnAdd), onReadyCallback = getOption(options, "onReady", (function() {})), debug = getOption(options, "debug", globalOptions.debug);
-            forEach(elements, (function(element) {
-                stateHandler.getState(element) || (stateHandler.initState(element), idHandler.set(element));
-                var id = idHandler.get(element);
-                if (debug && reporter.log("Attaching listener to element", id, element), !elementUtils.isDetectable(element)) return debug && reporter.log(id, "Not detectable."), 
-                elementUtils.isBusy(element) ? (debug && reporter.log(id, "System busy making it detectable"), 
-                addListener(callOnAdd, element, listener), onReadyCallbacks[id] = onReadyCallbacks[id] || [], 
-                void onReadyCallbacks[id].push((function() {
-                    ++elementsReady === elements.length && onReadyCallback();
-                }))) : (debug && reporter.log(id, "Making detectable..."), elementUtils.markBusy(element, !0), 
-                detectionStrategy.makeDetectable({
-                    debug: debug,
-                    important: importantCssRules
-                }, element, (function(element) {
-                    if (debug && reporter.log(id, "onElementDetectable"), stateHandler.getState(element)) {
-                        elementUtils.markAsDetectable(element), elementUtils.markBusy(element, !1), detectionStrategy.addListener(element, onResizeCallback), 
-                        addListener(callOnAdd, element, listener);
-                        var state = stateHandler.getState(element);
-                        if (state && state.startSize) {
-                            var width = element.offsetWidth, height = element.offsetHeight;
-                            state.startSize.width === width && state.startSize.height === height || onResizeCallback(element);
-                        }
-                        onReadyCallbacks[id] && forEach(onReadyCallbacks[id], (function(callback) {
-                            callback();
-                        }));
-                    } else debug && reporter.log(id, "Element uninstalled before being detectable.");
-                    delete onReadyCallbacks[id], ++elementsReady === elements.length && onReadyCallback();
-                })));
-                debug && reporter.log(id, "Already detecable, adding listener."), addListener(callOnAdd, element, listener), 
-                elementsReady++;
-            })), elementsReady === elements.length && onReadyCallback();
-        },
-        removeListener: eventListenerHandler.removeListener,
-        removeAllListeners: eventListenerHandler.removeAllListeners,
-        uninstall: function(elements) {
-            if (!elements) return reporter.error("At least one element is required.");
-            if (isElement(elements)) elements = [ elements ]; else {
-                if (!isCollection(elements)) return reporter.error("Invalid arguments. Must be a DOM element or a collection of DOM elements.");
-                elements = toArray(elements);
+        }, {
+            default: () => createVNode("span", {
+                class: _ns.be("header-tools", "user")
+            }, [ profile_url ? createVNode("img", {
+                class: "user-photo",
+                src: profile_url
+            }, null) : null, createVNode("span", null, [ _config.userName ]), createVNode(ElIcon, {
+                class: "el-icon--right"
+            }, {
+                default: () => [ createVNode(arrow_down_default, null, null) ]
+            }) ]),
+            dropdown: () => createVNode(ElDropdownMenu, null, {
+                default: () => [ _userDropdown?.map((item => createVNode(ElDropdownItem, {
+                    command: item.value,
+                    divided: !!item.divided
+                }, {
+                    default: () => [ item.svg ? createVNode("span", {
+                        innerHTML: item.svg,
+                        class: "item-svg"
+                    }, null) : null, item.iconfont ? createVNode("i", {
+                        class: item.iconfont
+                    }, null) : null, _t(item.label) ]
+                }))) ]
+            })
+        }) ]), createVNode("li", null, [ createVNode("span", {
+            style: {
+                display: "inline-block",
+                lineHeight: 1
+            },
+            onClick: () => {
+                this.settingDrawer = !0;
             }
-            forEach(elements, (function(element) {
-                eventListenerHandler.removeAllListeners(element), detectionStrategy.uninstall(element), 
-                stateHandler.cleanState(element);
-            }));
-        },
-        initDocument: function(targetDocument) {
-            detectionStrategy.initDocument && detectionStrategy.initDocument(targetDocument);
-        }
-    };
-};
-
-function getOption(options, name, defaultValue) {
-    var value = options[name];
-    return null == value && void 0 !== defaultValue ? defaultValue : value;
-}
-
-var elementResizeDetectorMaker = getDefaultExportFromCjs(elementResizeDetector);
-
-const elementResize = (el, cb) => {
-    const erd = elementResizeDetectorMaker();
-    let timer = null;
-    erd.listenTo(el, (() => {
-        null !== timer && clearTimeout(timer), timer = setTimeout((() => {
-            cb && cb(el), clearTimeout(timer);
-        }), 200);
-    })), onUnmounted((() => {
-        erd.removeListener(el, (() => {}));
-    }));
-}, deepClone = source => {
-    if (null == source) return source;
-    let target;
-    if ("object" == typeof source) {
-        target = Array.isArray(source) ? [] : {};
-        for (let key in source) "object" == typeof source[key] ? target[key] = deepClone(source[key]) : target[key] = source[key];
-    } else target = source;
-    return target;
-}, arrayObjNoRepeat = (arr, property) => {
-    const result = [], uniqueMap = new Map;
-    for (const item of arr) {
-        const key = item[property];
-        uniqueMap.has(key) || (uniqueMap.set(key, !0), result.push(item));
-    }
-    return result;
-}, isValueExist = value => null != value && ("string" == typeof value ? "" !== value.trim() : !1 !== value), valueExist = (...arg) => {
-    let exist = null;
-    for (let i = 0; i < arg.length; i++) {
-        const val = arg[i];
-        if (null != val) {
-            exist = val;
-            break;
-        }
+        }, [ createVNode(ElIcon, {
+            size: 16
+        }, {
+            default: () => [ createVNode(setting_default, null, null) ]
+        }) ]) ]) ]), createVNode(Teleport, {
+            to: "body"
+        }, {
+            default: () => [ createVNode(ElDrawer, {
+                modelValue: this.settingDrawer,
+                "onUpdate:modelValue": $event => this.settingDrawer = $event,
+                title: this.t("next.layout.systemSetting"),
+                direction: "rtl",
+                size: "380px",
+                class: _ns.be("drawer", "setting"),
+                "destroy-on-close": !0,
+                beforeClose: _closeSettingDrawer
+            }, {
+                default: () => [ createVNode(LayoutSetting, null, null) ]
+            }) ]
+        }) ]);
     }
-    return exist;
-}, shareObjectProperty = (target, source, key) => (Object.defineProperty(target, key, {
-    get: () => source[key]
-}), {
-    target: target,
-    source: source
 });
 
-var MenuItemTitle = defineComponent({
+const {getLightColor: getLightColor$4} = useChangeColor();
+
+var Header$4 = defineComponent({
+    setup: () => ({
+        ns: inject("ns", {})
+    }),
+    render() {
+        const slots = this.$slots, _ns = this.ns, _config = inject("options", {}), headerStyle = computed((() => {
+            const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
+            return isHeaderBarColorGradual ? {
+                background: `linear-gradient(to bottom , ${color}, ${getLightColor$4(color, .5)})`
+            } : "";
+        })), __slots_header_tools = {};
+        return slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+        slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]()), 
+        createVNode("header", {
+            class: _ns.b("header"),
+            style: headerStyle.value
+        }, [ createVNode(LogoView, null, null), createVNode("div", {
+            class: _ns.bf("header", "right")
+        }, [ createVNode(HeaderTools, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !isVNode(s) ? __slots_header_tools : {
+            default: () => [ __slots_header_tools ]
+        })) ]) ]);
+        var s;
+    }
+}), MenuItemTitle = defineComponent({
     props: {
         meta: {
             type: Object,
@@ -3429,20 +3433,31 @@ const NextContainer = withInstall(defineComponent({
                 padding: padding + "px"
             }), style;
         }));
-        return () => props.scrollbar ? createVNode(ElScrollbar, {
-            class: [ ns$e.b(), props.className ],
-            style: props.style
-        }, {
-            default: () => [ slots.default?.() ]
-        }) : createVNode("div", {
-            class: [ ns$e.b(), props.className ],
-            style: {
-                ...styles.value,
-                ...props.style
+        return () => (() => {
+            if (props.scrollbar) {
+                const scrollStyle = {
+                    "--next-container-padding": styles.value.padding
+                };
+                return createVNode(ElScrollbar, {
+                    class: [ ns$e.b(), props.className ],
+                    style: {
+                        ...scrollStyle,
+                        ...props.style
+                    }
+                }, {
+                    default: () => [ slots.default?.() ]
+                });
             }
-        }, [ props.card ? createVNode("div", {
-            class: ns$e.b("card")
-        }, [ slots.default?.() ]) : slots.default?.() ]);
+            return createVNode("div", {
+                class: [ ns$e.b(), props.className ],
+                style: {
+                    ...styles.value,
+                    ...props.style
+                }
+            }, [ props.card ? createVNode("div", {
+                class: ns$e.b("card")
+            }, [ slots.default?.() ]) : slots.default?.() ]);
+        })();
     }
 }));
 
@@ -4051,14 +4066,17 @@ var HeaderSearch = defineComponent({
     setup: () => ({}),
     emits: [ "clickAdd", "clickRefresh", "deleteRows" ],
     render() {
-        const _options = inject("options", {}), options = isRef(_options) ? unref(_options) : _options, {t: t} = useLocale(), ns = inject("ns", {}), multipleSelection = inject("multipleSelection"), multipleSelectionLength = computed((() => multipleSelection.value.length)), drawerSettingRef = ref();
+        const _options = inject("options", {}), options = isRef(_options) ? unref(_options) : _options, {t: t} = useLocale(), ns = inject("ns", {}), multipleSelection = inject("multipleSelection"), multipleSelectionLength = computed((() => multipleSelection.value.length)), onClickRefresh = () => {
+            this.$emit("clickRefresh");
+        }, drawerSettingRef = ref(), slotProps = {
+            size: options.size,
+            refresh: onClickRefresh
+        };
         return createVNode("div", {
             class: ns.b("header-menu")
         }, [ createVNode("div", {
             class: ns.b("header-menu-left")
-        }, [ this.$slots["menu-left-prefix"]?.({
-            size: options.size
-        }), options.addBtn && createVNode(ElButton, {
+        }, [ this.$slots["menu-left-prefix"]?.(slotProps), options.addBtn && createVNode(ElButton, {
             type: "primary",
             size: options.size,
             onClick: () => {
@@ -4095,18 +4113,12 @@ var HeaderSearch = defineComponent({
                 default: () => [ createVNode(delete_default, null, null) ]
             }),
             default: () => t("next.table.batchDelete")
-        }), this.$slots["menu-left-suffix"]?.({
-            size: options.size
-        }) ]), createVNode("div", {
+        }), this.$slots["menu-left-suffix"]?.(slotProps) ]), createVNode("div", {
             class: ns.b("header-menu-right")
-        }, [ this.$slots["menu-right-prefix"]?.({
-            size: options.size
-        }), options.refreshBtn && createVNode(ElButton, {
+        }, [ this.$slots["menu-right-prefix"]?.(slotProps), options.refreshBtn && createVNode(ElButton, {
             circle: !0,
             size: options.size,
-            onClick: () => {
-                this.$emit("clickRefresh");
-            }
+            onClick: onClickRefresh
         }, {
             icon: () => createVNode(ElIcon, null, {
                 default: () => [ createVNode(refresh_default, null, null) ]
@@ -4121,9 +4133,7 @@ var HeaderSearch = defineComponent({
             icon: () => createVNode(ElIcon, null, {
                 default: () => [ createVNode(tools_default, null, null) ]
             })
-        }), this.$slots["menu-right-suffix"]?.({
-            size: options.size
-        }) ]), createVNode(DrawerSetting, {
+        }), this.$slots["menu-right-suffix"]?.(slotProps) ]), createVNode(DrawerSetting, {
             ref: drawerSettingRef
         }, null) ]);
     }
@@ -4161,11 +4171,19 @@ const TableColumnDynamic = defineComponent({
                 });
                 var s;
             })) ]);
-            if (slots[columnSlotName(_prop)]) return slots[columnSlotName(_prop)]({
-                row: row,
-                index: $index,
-                column: columnOption
-            });
+            if (slots[columnSlotName(_prop)]) {
+                const btnCfg = {
+                    text: options.operationsBtnText,
+                    plain: options.operationsBtnPlain,
+                    size: options.operationsBtnSize
+                };
+                return slots[columnSlotName(_prop)]({
+                    row: row,
+                    index: $index,
+                    column: columnOption,
+                    btn: btnCfg
+                });
+            }
             if (columnOption.dicData?.length > 0) {
                 const loopDicData = list => {
                     const temp = [];
@@ -8532,17 +8550,20 @@ const zoomDialog = app => {
             }));
         }
     });
-}, version = "0.5.8", install = function(app) {
-    Object.keys(components).forEach((key => {
+}, configProviderContextKey = Symbol("configProviderContextKey"), version = "0.5.10", install = function(app, options) {
+    if (Object.keys(components).forEach((key => {
         const component = components[key];
         app.component(component.name, component);
     })), (app => {
         zoomDialog(app);
-    })(app);
+    })(app), options) {
+        const inSetup = !!getCurrentInstance();
+        (app?.provide ?? (inSetup ? provide : void 0))(configProviderContextKey, computed((() => options)));
+    }
 };
 
 var index = {
-    version: "0.5.8",
+    version: "0.5.10",
     install: install
 };