element-plus 2.0.2 → 2.0.3

package/es/version.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '2.0.2'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}
+{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '2.0.3'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}

package/lib/components/affix/index.d.ts

@@ -4,6 +4,22 @@ export declare const ElAffix: import("element-plus/es/utils").SFCWithInstall<imp
     readonly offset: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
     readonly position: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom", unknown>;
 }, {
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        readonly zIndex: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<import("csstype").ZIndexProperty>, 100, unknown, unknown, unknown>;
+        readonly target: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly offset: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+        readonly position: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom", unknown>;
+    }>> & {
+        onChange?: ((fixed: boolean) => any) | undefined;
+        onScroll?: ((args_0: {
+            scrollTop: number;
+            fixed: boolean;
+        }) => any) | undefined;
+    }>>;
+    emit: ((event: "change", fixed: boolean) => void) & ((event: "scroll", args_0: {
+        scrollTop: number;
+        fixed: boolean;
+    }) => void);
     ns: {
         namespace: import("vue").ComputedRef<string>;
         b: (blockSuffix?: string) => string;
@@ -18,18 +34,19 @@ export declare const ElAffix: import("element-plus/es/utils").SFCWithInstall<imp
             (name: string): string;
         };
     };
+    target: import("vue").ShallowRef<HTMLElement | undefined>;
     root: import("vue").ShallowRef<HTMLDivElement | undefined>;
-    state: {
-        fixed: boolean;
-        height: number;
-        width: number;
-        scrollTop: number;
-        clientHeight: number;
-        transform: number;
-    };
+    scrollContainer: import("vue").ShallowRef<Window | HTMLElement | undefined>;
+    fixed: import("vue").Ref<boolean>;
+    height: import("vue").Ref<number>;
+    width: import("vue").Ref<number>;
+    scrollTop: import("vue").Ref<number>;
+    clientHeight: import("vue").Ref<number>;
+    transform: import("vue").Ref<number>;
     rootStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
     affixStyle: import("vue").ComputedRef<import("vue").CSSProperties | undefined>;
     update: () => void;
+    onScroll: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     scroll: ({ scrollTop, fixed }: {
         scrollTop: number;

package/lib/components/affix/src/affix.vue.d.ts

@@ -5,6 +5,22 @@ declare const _default: import("vue").DefineComponent<{
     readonly offset: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
     readonly position: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom", unknown>;
 }, {
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        readonly zIndex: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<import("csstype").ZIndexProperty>, 100, unknown, unknown, unknown>;
+        readonly target: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly offset: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+        readonly position: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom", unknown>;
+    }>> & {
+        onChange?: ((fixed: boolean) => any) | undefined;
+        onScroll?: ((args_0: {
+            scrollTop: number;
+            fixed: boolean;
+        }) => any) | undefined;
+    }>>;
+    emit: ((event: "change", fixed: boolean) => void) & ((event: "scroll", args_0: {
+        scrollTop: number;
+        fixed: boolean;
+    }) => void);
     ns: {
         namespace: import("vue").ComputedRef<string>;
         b: (blockSuffix?: string) => string;
@@ -19,18 +35,19 @@ declare const _default: import("vue").DefineComponent<{
             (name: string): string;
         };
     };
+    target: import("vue").ShallowRef<HTMLElement | undefined>;
     root: import("vue").ShallowRef<HTMLDivElement | undefined>;
-    state: {
-        fixed: boolean;
-        height: number;
-        width: number;
-        scrollTop: number;
-        clientHeight: number;
-        transform: number;
-    };
+    scrollContainer: import("vue").ShallowRef<Window | HTMLElement | undefined>;
+    fixed: import("vue").Ref<boolean>;
+    height: import("vue").Ref<number>;
+    width: import("vue").Ref<number>;
+    scrollTop: import("vue").Ref<number>;
+    clientHeight: import("vue").Ref<number>;
+    transform: import("vue").Ref<number>;
     rootStyle: import("vue").ComputedRef<CSSProperties>;
     affixStyle: import("vue").ComputedRef<CSSProperties | undefined>;
     update: () => void;
+    onScroll: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     scroll: ({ scrollTop, fixed }: {
         scrollTop: number;

package/lib/components/affix/src/affix2.js

@@ -7,44 +7,45 @@ var core = require('@vueuse/core');
 require('../../../utils/index.js');
 require('../../../hooks/index.js');
 var affix = require('./affix.js');
-var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
 var index = require('../../../hooks/use-namespace/index.js');
 var scroll = require('../../../utils/dom/scroll.js');
 
-const _sfc_main = vue.defineComponent({
-  name: "ElAffix",
+const __default__ = {
+  name: "ElAffix"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
   props: affix.affixProps,
   emits: affix.affixEmits,
-  setup(props, { emit }) {
+  setup(__props, { expose, emit }) {
+    const props = __props;
     const ns = index.useNamespace("affix");
     const target = vue.shallowRef();
     const root = vue.shallowRef();
     const scrollContainer = vue.shallowRef();
-    const state = vue.reactive({
-      fixed: false,
-      height: 0,
-      width: 0,
-      scrollTop: 0,
-      clientHeight: 0,
-      transform: 0
-    });
+    const fixed = vue.ref(false);
+    const height = vue.ref(0);
+    const width = vue.ref(0);
+    const scrollTop = vue.ref(0);
+    const clientHeight = vue.ref(0);
+    const transform = vue.ref(0);
     const rootStyle = vue.computed(() => {
       return {
-        height: state.fixed ? `${state.height}px` : "",
-        width: state.fixed ? `${state.width}px` : ""
+        height: fixed.value ? `${height.value}px` : "",
+        width: fixed.value ? `${width.value}px` : ""
       };
     });
     const affixStyle = vue.computed(() => {
-      if (!state.fixed)
+      if (!fixed.value)
         return;
       const offset = props.offset ? `${props.offset}px` : 0;
-      const transform = state.transform ? `translateY(${state.transform}px)` : "";
+      const _transform = transform.value ? `translateY(${transform.value}px)` : "";
       return {
-        height: `${state.height}px`,
-        width: `${state.width}px`,
+        height: `${height.value}px`,
+        width: `${width.value}px`,
         top: props.position === "top" ? offset : "",
         bottom: props.position === "bottom" ? offset : "",
-        transform,
+        transform: _transform,
         zIndex: props.zIndex
       };
     });
@@ -53,37 +54,37 @@ const _sfc_main = vue.defineComponent({
         return;
       const rootRect = root.value.getBoundingClientRect();
       const targetRect = target.value.getBoundingClientRect();
-      state.height = rootRect.height;
-      state.width = rootRect.width;
-      state.scrollTop = scrollContainer.value instanceof Window ? document.documentElement.scrollTop : scrollContainer.value.scrollTop || 0;
-      state.clientHeight = document.documentElement.clientHeight;
+      height.value = rootRect.height;
+      width.value = rootRect.width;
+      scrollTop.value = scrollContainer.value instanceof Window ? document.documentElement.scrollTop : scrollContainer.value.scrollTop || 0;
+      clientHeight.value = document.documentElement.clientHeight;
       if (props.position === "top") {
         if (props.target) {
-          const difference = targetRect.bottom - props.offset - state.height;
-          state.fixed = props.offset > rootRect.top && targetRect.bottom > 0;
-          state.transform = difference < 0 ? difference : 0;
+          const difference = targetRect.bottom - props.offset - height.value;
+          fixed.value = props.offset > rootRect.top && targetRect.bottom > 0;
+          transform.value = difference < 0 ? difference : 0;
         } else {
-          state.fixed = props.offset > rootRect.top;
+          fixed.value = props.offset > rootRect.top;
         }
       } else {
         if (props.target) {
-          const difference = state.clientHeight - targetRect.top - props.offset - state.height;
-          state.fixed = state.clientHeight - props.offset < rootRect.bottom && state.clientHeight > targetRect.top;
-          state.transform = difference < 0 ? -difference : 0;
+          const difference = clientHeight.value - targetRect.top - props.offset - height.value;
+          fixed.value = clientHeight.value - props.offset < rootRect.bottom && clientHeight.value > targetRect.top;
+          transform.value = difference < 0 ? -difference : 0;
         } else {
-          state.fixed = state.clientHeight - props.offset < rootRect.bottom;
+          fixed.value = clientHeight.value - props.offset < rootRect.bottom;
         }
       }
     };
     const onScroll = () => {
       update();
       emit("scroll", {
-        scrollTop: state.scrollTop,
-        fixed: state.fixed
+        scrollTop: scrollTop.value,
+        fixed: fixed.value
       });
     };
-    vue.watch(() => state.fixed, () => {
-      emit("change", state.fixed);
+    vue.watch(fixed, (fixed2) => {
+      emit("change", fixed2);
     });
     vue.onMounted(() => {
       var _a;
@@ -100,31 +101,26 @@ const _sfc_main = vue.defineComponent({
     core.useEventListener(scrollContainer, "scroll", onScroll);
     core.useResizeObserver(root, () => update());
     core.useResizeObserver(target, () => update());
-    return {
-      ns,
-      root,
-      state,
-      rootStyle,
-      affixStyle,
+    expose({
       update
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        ref_key: "root",
+        ref: root,
+        class: vue.normalizeClass(vue.unref(ns).b()),
+        style: vue.normalizeStyle(vue.unref(rootStyle))
+      }, [
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass({ [vue.unref(ns).m("fixed")]: fixed.value }),
+          style: vue.normalizeStyle(vue.unref(affixStyle))
+        }, [
+          vue.renderSlot(_ctx.$slots, "default")
+        ], 6)
+      ], 6);
     };
   }
 });
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", {
-    ref: "root",
-    class: vue.normalizeClass(_ctx.ns.b()),
-    style: vue.normalizeStyle(_ctx.rootStyle)
-  }, [
-    vue.createElementVNode("div", {
-      class: vue.normalizeClass({ [_ctx.ns.m("fixed")]: _ctx.state.fixed }),
-      style: vue.normalizeStyle(_ctx.affixStyle)
-    }, [
-      vue.renderSlot(_ctx.$slots, "default")
-    ], 6)
-  ], 6);
-}
-var Affix = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render]]);
 
-exports["default"] = Affix;
+exports["default"] = _sfc_main;
 //# sourceMappingURL=affix2.js.map

package/lib/components/affix/src/affix2.js.map

@@ -1 +1 @@
-{"version":3,"file":"affix2.js","sources":["../../../../../../packages/components/affix/src/affix.vue"],"sourcesContent":["<template>\n  <div ref=\"root\" :class=\"ns.b()\" :style=\"rootStyle\">\n    <div :class=\"{ [ns.m('fixed')]: state.fixed }\" :style=\"affixStyle\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  onMounted,\n  reactive,\n  shallowRef,\n  watch,\n} from 'vue'\nimport { useEventListener, useResizeObserver } from '@vueuse/core'\nimport { getScrollContainer } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { affixEmits, affixProps } from './affix'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAffix',\n\n  props: affixProps,\n  emits: affixEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('affix')\n\n    const target = shallowRef<HTMLElement>()\n    const root = shallowRef<HTMLDivElement>()\n    const scrollContainer = shallowRef<HTMLElement | Window>()\n\n    const state = reactive({\n      fixed: false,\n      height: 0, // height of root\n      width: 0, // width of root\n      scrollTop: 0, // scrollTop of documentElement\n      clientHeight: 0, // clientHeight of documentElement\n      transform: 0,\n    })\n\n    const rootStyle = computed<CSSProperties>(() => {\n      return {\n        height: state.fixed ? `${state.height}px` : '',\n        width: state.fixed ? `${state.width}px` : '',\n      }\n    })\n\n    const affixStyle = computed<CSSProperties | undefined>(() => {\n      if (!state.fixed) return\n\n      const offset = props.offset ? `${props.offset}px` : 0\n      const transform = state.transform\n        ? `translateY(${state.transform}px)`\n        : ''\n\n      return {\n        height: `${state.height}px`,\n        width: `${state.width}px`,\n        top: props.position === 'top' ? offset : '',\n        bottom: props.position === 'bottom' ? offset : '',\n        transform,\n        zIndex: props.zIndex,\n      }\n    })\n\n    const update = () => {\n      if (!root.value || !target.value || !scrollContainer.value) return\n\n      const rootRect = root.value.getBoundingClientRect()\n      const targetRect = target.value.getBoundingClientRect()\n      state.height = rootRect.height\n      state.width = rootRect.width\n      state.scrollTop =\n        scrollContainer.value instanceof Window\n          ? document.documentElement.scrollTop\n          : scrollContainer.value.scrollTop || 0\n      state.clientHeight = document.documentElement.clientHeight\n\n      if (props.position === 'top') {\n        if (props.target) {\n          const difference = targetRect.bottom - props.offset - state.height\n          state.fixed = props.offset > rootRect.top && targetRect.bottom > 0\n          state.transform = difference < 0 ? difference : 0\n        } else {\n          state.fixed = props.offset > rootRect.top\n        }\n      } else {\n        if (props.target) {\n          const difference =\n            state.clientHeight - targetRect.top - props.offset - state.height\n          state.fixed =\n            state.clientHeight - props.offset < rootRect.bottom &&\n            state.clientHeight > targetRect.top\n          state.transform = difference < 0 ? -difference : 0\n        } else {\n          state.fixed = state.clientHeight - props.offset < rootRect.bottom\n        }\n      }\n    }\n\n    const onScroll = () => {\n      update()\n\n      emit('scroll', {\n        scrollTop: state.scrollTop,\n        fixed: state.fixed,\n      })\n    }\n\n    watch(\n      () => state.fixed,\n      () => {\n        emit('change', state.fixed)\n      }\n    )\n\n    onMounted(() => {\n      if (props.target) {\n        target.value =\n          document.querySelector<HTMLElement>(props.target) ?? undefined\n        if (!target.value) {\n          throw new Error(`Target is not existed: ${props.target}`)\n        }\n      } else {\n        target.value = document.documentElement\n      }\n      scrollContainer.value = getScrollContainer(root.value!, true)\n    })\n\n    useEventListener(scrollContainer, 'scroll', onScroll)\n    useResizeObserver(root, () => update())\n    useResizeObserver(target, () => update())\n\n    return {\n      ns,\n      root,\n      state,\n      rootStyle,\n      affixStyle,\n      update,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","affixProps","affixEmits","useNamespace","shallowRef","reactive","computed","_openBlock"],"mappings":";;;;;;;;;;;;;AAuBA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EAEN,OAAOC;AAAA,EACP,OAAOC;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,KAAKC,mBAAa;AAExB,UAAM,SAASC;AACf,UAAM,OAAOA;AACb,UAAM,kBAAkBA;AAExB,UAAM,QAAQC,aAAS;AAAA,MACrB,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,WAAW;AAAA,MACX,cAAc;AAAA,MACd,WAAW;AAAA;AAGb,UAAM,YAAYC,aAAwB,MAAM;AAC9C,aAAO;AAAA,QACL,QAAQ,MAAM,QAAQ,GAAG,MAAM,aAAa;AAAA,QAC5C,OAAO,MAAM,QAAQ,GAAG,MAAM,YAAY;AAAA;AAAA;AAI9C,UAAM,aAAaA,aAAoC,MAAM;AAC3D,UAAI,CAAC,MAAM;AAAO;AAElB,YAAM,SAAS,MAAM,SAAS,GAAG,MAAM,aAAa;AACpD,YAAM,YAAY,MAAM,YACpB,cAAc,MAAM,iBACpB;AAEJ,aAAO;AAAA,QACL,QAAQ,GAAG,MAAM;AAAA,QACjB,OAAO,GAAG,MAAM;AAAA,QAChB,KAAK,MAAM,aAAa,QAAQ,SAAS;AAAA,QACzC,QAAQ,MAAM,aAAa,WAAW,SAAS;AAAA,QAC/C;AAAA,QACA,QAAQ,MAAM;AAAA;AAAA;AAIlB,UAAM,SAAS,MAAM;AACnB,UAAI,CAAC,KAAK,SAAS,CAAC,OAAO,SAAS,CAAC,gBAAgB;AAAO;AAE5D,YAAM,WAAW,KAAK,MAAM;AAC5B,YAAM,aAAa,OAAO,MAAM;AAChC,YAAM,SAAS,SAAS;AACxB,YAAM,QAAQ,SAAS;AACvB,YAAM,YACJ,gBAAgB,iBAAiB,SAC7B,SAAS,gBAAgB,YACzB,gBAAgB,MAAM,aAAa;AACzC,YAAM,eAAe,SAAS,gBAAgB;AAE9C,UAAI,MAAM,aAAa,OAAO;AAC5B,YAAI,MAAM,QAAQ;AAChB,gBAAM,aAAa,WAAW,SAAS,MAAM,SAAS,MAAM;AAC5D,gBAAM,QAAQ,MAAM,SAAS,SAAS,OAAO,WAAW,SAAS;AACjE,gBAAM,YAAY,aAAa,IAAI,aAAa;AAAA,eAC3C;AACL,gBAAM,QAAQ,MAAM,SAAS,SAAS;AAAA;AAAA,aAEnC;AACL,YAAI,MAAM,QAAQ;AAChB,gBAAM,aACJ,MAAM,eAAe,WAAW,MAAM,MAAM,SAAS,MAAM;AAC7D,gBAAM,QACJ,MAAM,eAAe,MAAM,SAAS,SAAS,UAC7C,MAAM,eAAe,WAAW;AAClC,gBAAM,YAAY,aAAa,IAAI,CAAC,aAAa;AAAA,eAC5C;AACL,gBAAM,QAAQ,MAAM,eAAe,MAAM,SAAS,SAAS;AAAA;AAAA;AAAA;AAKjE,UAAM,WAAW,MAAM;AACrB;AAEA,WAAK,UAAU;AAAA,QACb,WAAW,MAAM;AAAA,QACjB,OAAO,MAAM;AAAA;AAAA;AAIjB,cACE,MAAM,MAAM,OACZ,MAAM;AACJ,WAAK,UAAU,MAAM;AAAA;AAIzB,kBAAU,MAAM;AACd,UAAI;AACF,eAAO;AAEP,oBAAY;AACV,oBAAU;AAAsC;AAAA;AAGlD;AAAwB;AAE1B;AAAwD;AAG1D;AACA;AACA,2BAAkB;AAElB;AAAO;AACL,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;SA/IK;AAAM,SAAOC;AAAA,IAAW;AAAO;;AACtC;AAAW,gCAA4C;AAAU;;AAC/D;;;;;;;;;"}
+{"version":3,"file":"affix2.js","sources":["../../../../../../packages/components/affix/src/affix.vue"],"sourcesContent":["<template>\n  <div ref=\"root\" :class=\"ns.b()\" :style=\"rootStyle\">\n    <div :class=\"{ [ns.m('fixed')]: fixed }\" :style=\"affixStyle\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, onMounted, ref, shallowRef, watch } from 'vue'\nimport { useEventListener, useResizeObserver } from '@vueuse/core'\nimport { getScrollContainer } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { affixEmits, affixProps } from './affix'\n\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElAffix',\n})\n\nconst props = defineProps(affixProps)\nconst emit = defineEmits(affixEmits)\n\nconst ns = useNamespace('affix')\n\nconst target = shallowRef<HTMLElement>()\nconst root = shallowRef<HTMLDivElement>()\nconst scrollContainer = shallowRef<HTMLElement | Window>()\n\nconst fixed = ref(false)\nconst height = ref(0) // height of root\nconst width = ref(0) // width of root\nconst scrollTop = ref(0) // scrollTop of documentElement\nconst clientHeight = ref(0) // clientHeight of documentElement\nconst transform = ref(0)\n\nconst rootStyle = computed<CSSProperties>(() => {\n  return {\n    height: fixed.value ? `${height.value}px` : '',\n    width: fixed.value ? `${width.value}px` : '',\n  }\n})\n\nconst affixStyle = computed<CSSProperties | undefined>(() => {\n  if (!fixed.value) return\n\n  const offset = props.offset ? `${props.offset}px` : 0\n  const _transform = transform.value ? `translateY(${transform.value}px)` : ''\n\n  return {\n    height: `${height.value}px`,\n    width: `${width.value}px`,\n    top: props.position === 'top' ? offset : '',\n    bottom: props.position === 'bottom' ? offset : '',\n    transform: _transform,\n    zIndex: props.zIndex,\n  }\n})\n\nconst update = () => {\n  if (!root.value || !target.value || !scrollContainer.value) return\n\n  const rootRect = root.value.getBoundingClientRect()\n  const targetRect = target.value.getBoundingClientRect()\n  height.value = rootRect.height\n  width.value = rootRect.width\n  scrollTop.value =\n    scrollContainer.value instanceof Window\n      ? document.documentElement.scrollTop\n      : scrollContainer.value.scrollTop || 0\n  clientHeight.value = document.documentElement.clientHeight\n\n  if (props.position === 'top') {\n    if (props.target) {\n      const difference = targetRect.bottom - props.offset - height.value\n      fixed.value = props.offset > rootRect.top && targetRect.bottom > 0\n      transform.value = difference < 0 ? difference : 0\n    } else {\n      fixed.value = props.offset > rootRect.top\n    }\n  } else {\n    if (props.target) {\n      const difference =\n        clientHeight.value - targetRect.top - props.offset - height.value\n      fixed.value =\n        clientHeight.value - props.offset < rootRect.bottom &&\n        clientHeight.value > targetRect.top\n      transform.value = difference < 0 ? -difference : 0\n    } else {\n      fixed.value = clientHeight.value - props.offset < rootRect.bottom\n    }\n  }\n}\n\nconst onScroll = () => {\n  update()\n\n  emit('scroll', {\n    scrollTop: scrollTop.value,\n    fixed: fixed.value,\n  })\n}\n\nwatch(fixed, (fixed) => {\n  emit('change', fixed)\n})\n\nonMounted(() => {\n  if (props.target) {\n    target.value =\n      document.querySelector<HTMLElement>(props.target) ?? undefined\n    if (!target.value) {\n      throw new Error(`Target is not existed: ${props.target}`)\n    }\n  } else {\n    target.value = document.documentElement\n  }\n  scrollContainer.value = getScrollContainer(root.value!, true)\n})\n\nuseEventListener(scrollContainer, 'scroll', onScroll)\nuseResizeObserver(root, () => update())\nuseResizeObserver(target, () => update())\n\ndefineExpose({\n  /** @description update affix status */\n  update,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAuBA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;;;AAOA;;;;;;;;;;;;;;AAgBA;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA;;;;;;;AASA;;;AAIA;;;;;;;;;;;AAaA;AACA;AACA;AAEA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/alert/index.d.ts

@@ -8,6 +8,23 @@ export declare const ElAlert: import("element-plus/es/utils").SFCWithInstall<imp
     readonly center: BooleanConstructor;
     readonly effect: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
 }, {
+    Close: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        readonly title: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly description: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly type: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+        readonly closable: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+        readonly closeText: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly showIcon: BooleanConstructor;
+        readonly center: BooleanConstructor;
+        readonly effect: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
+    }>> & {
+        onClose?: ((evt: MouseEvent) => any) | undefined;
+    }>>;
+    emit: (event: "close", evt: MouseEvent) => void;
+    slots: Readonly<{
+        [name: string]: import("vue").Slot | undefined;
+    }>;
     ns: {
         namespace: import("vue").ComputedRef<string>;
         b: (blockSuffix?: string) => string;
@@ -24,9 +41,45 @@ export declare const ElAlert: import("element-plus/es/utils").SFCWithInstall<imp
     };
     visible: import("vue").Ref<boolean>;
     iconComponent: import("vue").ComputedRef<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>>;
-    isBigIcon: import("vue").ComputedRef<string>;
-    isBoldTitle: import("vue").ComputedRef<string>;
+    isBigIcon: import("vue").ComputedRef<string | {
+        [x: string]: import("vue").Slot | undefined;
+    }>;
+    isBoldTitle: import("vue").ComputedRef<string | {
+        [x: string]: import("vue").Slot | undefined;
+    }>;
     close: (evt: MouseEvent) => void;
+    ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
+        readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+        readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+    }, {
+        props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+            readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+            readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+        }>> & {
+            [x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
+        }>>;
+        ns: {
+            namespace: import("vue").ComputedRef<string>;
+            b: (blockSuffix?: string) => string;
+            e: (element?: string | undefined) => string;
+            m: (modifier?: string | undefined) => string;
+            be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+            em: (element?: string | undefined, modifier?: string | undefined) => string;
+            bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+            bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+            is: {
+                (name: string, state: boolean | undefined): string;
+                (name: string): string;
+            };
+        };
+        style: import("vue").ComputedRef<import("vue").CSSProperties>;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+        readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+    }>>, {
+        size: import("element-plus/es/utils").BuildPropType<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown>;
+        color: string;
+    }>> & Record<string, any>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (evt: MouseEvent) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{

package/lib/components/alert/src/alert.vue.d.ts

@@ -8,6 +8,23 @@ declare const _default: import("vue").DefineComponent<{
     readonly center: BooleanConstructor;
     readonly effect: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
 }, {
+    Close: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        readonly title: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly description: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly type: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+        readonly closable: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+        readonly closeText: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly showIcon: BooleanConstructor;
+        readonly center: BooleanConstructor;
+        readonly effect: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
+    }>> & {
+        onClose?: ((evt: MouseEvent) => any) | undefined;
+    }>>;
+    emit: (event: "close", evt: MouseEvent) => void;
+    slots: Readonly<{
+        [name: string]: import("vue").Slot | undefined;
+    }>;
     ns: {
         namespace: import("vue").ComputedRef<string>;
         b: (blockSuffix?: string) => string;
@@ -24,9 +41,45 @@ declare const _default: import("vue").DefineComponent<{
     };
     visible: import("vue").Ref<boolean>;
     iconComponent: import("vue").ComputedRef<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>>;
-    isBigIcon: import("vue").ComputedRef<string>;
-    isBoldTitle: import("vue").ComputedRef<string>;
+    isBigIcon: import("vue").ComputedRef<string | {
+        [x: string]: import("vue").Slot | undefined;
+    }>;
+    isBoldTitle: import("vue").ComputedRef<string | {
+        [x: string]: import("vue").Slot | undefined;
+    }>;
     close: (evt: MouseEvent) => void;
+    ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
+        readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+        readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+    }, {
+        props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+            readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+            readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+        }>> & {
+            [x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
+        }>>;
+        ns: {
+            namespace: import("vue").ComputedRef<string>;
+            b: (blockSuffix?: string) => string;
+            e: (element?: string | undefined) => string;
+            m: (modifier?: string | undefined) => string;
+            be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+            em: (element?: string | undefined, modifier?: string | undefined) => string;
+            bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+            bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+            is: {
+                (name: string, state: boolean | undefined): string;
+                (name: string): string;
+            };
+        };
+        style: import("vue").ComputedRef<import("vue").CSSProperties>;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+        readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+    }>>, {
+        size: import("element-plus/es/utils").BuildPropType<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown>;
+        color: string;
+    }>> & Record<string, any>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (evt: MouseEvent) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{