@element-plus/nightly 0.0.20250703 → 0.0.20250704

package/lib/components/tour/src/step2.js

@@ -2,53 +2,176 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var content = require('./content.js');
-var runtime = require('../../../utils/vue/props/runtime.js');
+var vue = require('vue');
+var lodashUnified = require('lodash-unified');
+var index$2 = require('../../button/index.js');
+var index$1 = require('../../icon/index.js');
+var step = require('./step.js');
+var helper = require('./helper.js');
+var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
+var index = require('../../../hooks/use-locale/index.js');
 var icon = require('../../../utils/vue/icon.js');
 
-const tourStepProps = runtime.buildProps({
-  target: {
-    type: runtime.definePropType([String, Object, Function])
-  },
-  title: String,
-  description: String,
-  showClose: {
-    type: Boolean,
-    default: void 0
-  },
-  closeIcon: {
-    type: icon.iconPropType
-  },
-  showArrow: {
-    type: Boolean,
-    default: void 0
-  },
-  placement: content.tourContentProps.placement,
-  mask: {
-    type: runtime.definePropType([Boolean, Object]),
-    default: void 0
-  },
-  contentStyle: {
-    type: runtime.definePropType([Object])
-  },
-  prevButtonProps: {
-    type: runtime.definePropType(Object)
-  },
-  nextButtonProps: {
-    type: runtime.definePropType(Object)
-  },
-  scrollIntoViewOptions: {
-    type: runtime.definePropType([Boolean, Object]),
-    default: void 0
-  },
-  type: {
-    type: runtime.definePropType(String)
+const __default__ = vue.defineComponent({
+  name: "ElTourStep"
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: step.tourStepProps,
+  emits: step.tourStepEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const { Close } = icon.CloseComponents;
+    const { t } = index.useLocale();
+    const {
+      currentStep,
+      current,
+      total,
+      showClose,
+      closeIcon,
+      mergedType,
+      ns,
+      slots: tourSlots,
+      updateModelValue,
+      onClose: tourOnClose,
+      onFinish: tourOnFinish,
+      onChange
+    } = vue.inject(helper.tourKey);
+    vue.watch(props, (val) => {
+      currentStep.value = val;
+    }, {
+      immediate: true
+    });
+    const mergedShowClose = vue.computed(() => {
+      var _a;
+      return (_a = props.showClose) != null ? _a : showClose.value;
+    });
+    const mergedCloseIcon = vue.computed(() => {
+      var _a, _b;
+      return (_b = (_a = props.closeIcon) != null ? _a : closeIcon.value) != null ? _b : Close;
+    });
+    const filterButtonProps = (btnProps) => {
+      if (!btnProps)
+        return;
+      return lodashUnified.omit(btnProps, ["children", "onClick"]);
+    };
+    const onPrev = () => {
+      var _a, _b;
+      current.value -= 1;
+      if ((_a = props.prevButtonProps) == null ? void 0 : _a.onClick) {
+        (_b = props.prevButtonProps) == null ? void 0 : _b.onClick();
+      }
+      onChange();
+    };
+    const onNext = () => {
+      var _a;
+      if (current.value >= total.value - 1) {
+        onFinish();
+      } else {
+        current.value += 1;
+      }
+      if ((_a = props.nextButtonProps) == null ? void 0 : _a.onClick) {
+        props.nextButtonProps.onClick();
+      }
+      onChange();
+    };
+    const onFinish = () => {
+      onClose();
+      tourOnFinish();
+    };
+    const onClose = () => {
+      updateModelValue(false);
+      tourOnClose();
+      emit("close");
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+        vue.unref(mergedShowClose) ? (vue.openBlock(), vue.createElementBlock("button", {
+          key: 0,
+          "aria-label": "Close",
+          class: vue.normalizeClass(vue.unref(ns).e("closebtn")),
+          type: "button",
+          onClick: onClose
+        }, [
+          vue.createVNode(vue.unref(index$1.ElIcon), {
+            class: vue.normalizeClass(vue.unref(ns).e("close"))
+          }, {
+            default: vue.withCtx(() => [
+              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(mergedCloseIcon))))
+            ]),
+            _: 1
+          }, 8, ["class"])
+        ], 2)) : vue.createCommentVNode("v-if", true),
+        vue.createElementVNode("header", {
+          class: vue.normalizeClass([vue.unref(ns).e("header"), { "show-close": vue.unref(showClose) }])
+        }, [
+          vue.renderSlot(_ctx.$slots, "header", {}, () => [
+            vue.createElementVNode("span", {
+              role: "heading",
+              class: vue.normalizeClass(vue.unref(ns).e("title"))
+            }, vue.toDisplayString(_ctx.title), 3)
+          ])
+        ], 2),
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(ns).e("body"))
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, () => [
+            vue.createElementVNode("span", null, vue.toDisplayString(_ctx.description), 1)
+          ])
+        ], 2),
+        vue.createElementVNode("footer", {
+          class: vue.normalizeClass(vue.unref(ns).e("footer"))
+        }, [
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(vue.unref(ns).b("indicators"))
+          }, [
+            vue.unref(tourSlots).indicators ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(tourSlots).indicators), {
+              key: 0,
+              current: vue.unref(current),
+              total: vue.unref(total)
+            }, null, 8, ["current", "total"])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(vue.unref(total), (item, index) => {
+              return vue.openBlock(), vue.createElementBlock("span", {
+                key: item,
+                class: vue.normalizeClass([vue.unref(ns).b("indicator"), index === vue.unref(current) ? "is-active" : ""])
+              }, null, 2);
+            }), 128))
+          ], 2),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(vue.unref(ns).b("buttons"))
+          }, [
+            vue.unref(current) > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElButton), vue.mergeProps({
+              key: 0,
+              size: "small",
+              type: vue.unref(mergedType)
+            }, filterButtonProps(_ctx.prevButtonProps), { onClick: onPrev }), {
+              default: vue.withCtx(() => {
+                var _a, _b;
+                return [
+                  vue.createTextVNode(vue.toDisplayString((_b = (_a = _ctx.prevButtonProps) == null ? void 0 : _a.children) != null ? _b : vue.unref(t)("el.tour.previous")), 1)
+                ];
+              }),
+              _: 1
+            }, 16, ["type"])) : vue.createCommentVNode("v-if", true),
+            vue.unref(current) <= vue.unref(total) - 1 ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElButton), vue.mergeProps({
+              key: 1,
+              size: "small",
+              type: vue.unref(mergedType) === "primary" ? "default" : "primary"
+            }, filterButtonProps(_ctx.nextButtonProps), { onClick: onNext }), {
+              default: vue.withCtx(() => {
+                var _a, _b;
+                return [
+                  vue.createTextVNode(vue.toDisplayString((_b = (_a = _ctx.nextButtonProps) == null ? void 0 : _a.children) != null ? _b : vue.unref(current) === vue.unref(total) - 1 ? vue.unref(t)("el.tour.finish") : vue.unref(t)("el.tour.next")), 1)
+                ];
+              }),
+              _: 1
+            }, 16, ["type"])) : vue.createCommentVNode("v-if", true)
+          ], 2)
+        ], 2)
+      ], 64);
+    };
   }
 });
-const tourStepEmits = {
-  close: () => true
-};
+var TourStep = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "step.vue"]]);
 
-exports.tourStepEmits = tourStepEmits;
-exports.tourStepProps = tourStepProps;
+exports["default"] = TourStep;
 //# sourceMappingURL=step2.js.map

package/lib/components/tour/src/step2.js.map

@@ -1 +1 @@
-{"version":3,"file":"step2.js","sources":["../../../../../../packages/components/tour/src/step.ts"],"sourcesContent":["import { buildProps, definePropType, iconPropType } from '@element-plus/utils'\nimport { tourContentProps } from './content'\n\nimport type { CSSProperties, ExtractPropTypes } from 'vue'\nimport type { TourBtnProps, TourMask } from './types'\n\nexport const tourStepProps = buildProps({\n  /**\n   * @description get the element the guide card points to. empty makes it show in center of screen\n   */\n  target: {\n    type: definePropType<\n      string | HTMLElement | (() => HTMLElement | null) | null\n    >([String, Object, Function]),\n  },\n  /**\n   * @description the title of the tour content\n   */\n  title: String,\n  /**\n   * @description description\n   */\n  description: String,\n  /**\n   * @description whether to show a close button\n   */\n  showClose: {\n    type: Boolean,\n    default: undefined,\n  },\n  /**\n   * @description custom close icon, default is Close\n   */\n  closeIcon: {\n    type: iconPropType,\n  },\n  /**\n   * @description whether to show the arrow\n   */\n  showArrow: {\n    type: Boolean,\n    default: undefined,\n  },\n  /**\n   * @description position of the guide card relative to the target element\n   */\n  placement: tourContentProps.placement,\n  /**\n   * @description whether to enable masking, change mask style and fill color by pass custom props\n   */\n  mask: {\n    type: definePropType<TourMask>([Boolean, Object]),\n    default: undefined,\n  },\n  /**\n   * @description custom style for content\n   */\n  contentStyle: {\n    type: definePropType<CSSProperties>([Object]),\n  },\n  /**\n   * @description properties of the previous button\n   */\n  prevButtonProps: {\n    type: definePropType<TourBtnProps>(Object),\n  },\n  /**\n   * @description properties of the Next button\n   */\n  nextButtonProps: {\n    type: definePropType<TourBtnProps>(Object),\n  },\n  /**\n   * @description support pass custom scrollIntoView options\n   */\n  scrollIntoViewOptions: {\n    type: definePropType<boolean | ScrollIntoViewOptions>([Boolean, Object]),\n    default: undefined,\n  },\n  /**\n   * @description type, affects the background color and text color\n   */\n  type: {\n    type: definePropType<'default' | 'primary'>(String),\n  },\n})\n\nexport type TourStepProps = ExtractPropTypes<typeof tourStepProps>\n\nexport const tourStepEmits = {\n  close: () => true,\n}\nexport type TourStepEmits = typeof tourStepEmits\n"],"names":["buildProps","definePropType","iconPropType","tourContentProps"],"mappings":";;;;;;;;AAEY,MAAC,aAAa,GAAGA,kBAAU,CAAC;AACxC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAEC,sBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;AACpD,GAAG;AACH,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAEC,iBAAY;AACtB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,SAAS,EAAEC,wBAAgB,CAAC,SAAS;AACvC,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAEF,sBAAc,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;AAC3C,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAEA,sBAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAClC,GAAG;AACH,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAEA,sBAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAEA,sBAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,qBAAqB,EAAE;AACzB,IAAI,IAAI,EAAEA,sBAAc,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;AAC3C,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAEA,sBAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,CAAC,EAAE;AACS,MAAC,aAAa,GAAG;AAC7B,EAAE,KAAK,EAAE,MAAM,IAAI;AACnB;;;;;"}
+{"version":3,"file":"step2.js","sources":["../../../../../../packages/components/tour/src/step.vue"],"sourcesContent":["<template>\n  <button\n    v-if=\"mergedShowClose\"\n    aria-label=\"Close\"\n    :class=\"ns.e('closebtn')\"\n    type=\"button\"\n    @click=\"onClose\"\n  >\n    <el-icon :class=\"ns.e('close')\">\n      <component :is=\"mergedCloseIcon\" />\n    </el-icon>\n  </button>\n  <header :class=\"[ns.e('header'), { 'show-close': showClose }]\">\n    <slot name=\"header\">\n      <span role=\"heading\" :class=\"ns.e('title')\">\n        {{ title }}\n      </span>\n    </slot>\n  </header>\n  <div :class=\"ns.e('body')\">\n    <slot>\n      <span>{{ description }}</span>\n    </slot>\n  </div>\n  <footer :class=\"ns.e('footer')\">\n    <div :class=\"ns.b('indicators')\">\n      <component\n        :is=\"tourSlots.indicators\"\n        v-if=\"tourSlots.indicators\"\n        :current=\"current\"\n        :total=\"total\"\n      />\n      <template v-else>\n        <span\n          v-for=\"(item, index) in total\"\n          :key=\"item\"\n          :class=\"[ns.b('indicator'), index === current ? 'is-active' : '']\"\n        />\n      </template>\n    </div>\n    <div :class=\"ns.b('buttons')\">\n      <el-button\n        v-if=\"current > 0\"\n        size=\"small\"\n        :type=\"mergedType\"\n        v-bind=\"filterButtonProps(prevButtonProps)\"\n        @click=\"onPrev\"\n      >\n        {{ prevButtonProps?.children ?? t('el.tour.previous') }}\n      </el-button>\n      <el-button\n        v-if=\"current <= total - 1\"\n        size=\"small\"\n        :type=\"mergedType === 'primary' ? 'default' : 'primary'\"\n        v-bind=\"filterButtonProps(nextButtonProps)\"\n        @click=\"onNext\"\n      >\n        {{\n          nextButtonProps?.children ??\n          (current === total - 1 ? t('el.tour.finish') : t('el.tour.next'))\n        }}\n      </el-button>\n    </div>\n  </footer>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, watch } from 'vue'\nimport { omit } from 'lodash-unified'\nimport { ElButton } from '@element-plus/components/button'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CloseComponents } from '@element-plus/utils'\nimport { useLocale } from '@element-plus/hooks'\nimport { tourStepEmits, tourStepProps } from './step'\nimport { tourKey } from './helper'\n\nimport type { TourBtnProps } from './types'\n\ndefineOptions({\n  name: 'ElTourStep',\n})\n\nconst props = defineProps(tourStepProps)\nconst emit = defineEmits(tourStepEmits)\n\nconst { Close } = CloseComponents\n\nconst { t } = useLocale()\n\nconst {\n  currentStep,\n  current,\n  total,\n  showClose,\n  closeIcon,\n  mergedType,\n  ns,\n  slots: tourSlots,\n  updateModelValue,\n  onClose: tourOnClose,\n  onFinish: tourOnFinish,\n  onChange,\n} = inject(tourKey)!\n\nwatch(\n  props,\n  (val) => {\n    currentStep.value = val\n  },\n  {\n    immediate: true,\n  }\n)\n\nconst mergedShowClose = computed(() => props.showClose ?? showClose.value)\nconst mergedCloseIcon = computed(\n  () => props.closeIcon ?? closeIcon.value ?? Close\n)\n\nconst filterButtonProps = (btnProps?: TourBtnProps) => {\n  if (!btnProps) return\n  return omit(btnProps, ['children', 'onClick'])\n}\n\nconst onPrev = () => {\n  current.value -= 1\n  if (props.prevButtonProps?.onClick) {\n    props.prevButtonProps?.onClick()\n  }\n  onChange()\n}\n\nconst onNext = () => {\n  if (current.value >= total.value - 1) {\n    onFinish()\n  } else {\n    current.value += 1\n  }\n  if (props.nextButtonProps?.onClick) {\n    props.nextButtonProps.onClick()\n  }\n  onChange()\n}\n\nconst onFinish = () => {\n  onClose()\n  tourOnFinish()\n}\n\nconst onClose = () => {\n  updateModelValue(false)\n  tourOnClose()\n  emit('close')\n}\n</script>\n"],"names":["CloseComponents","useLocale","inject","tourKey","watch","computed","omit"],"mappings":"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"}

package/lib/hooks/use-ordered-children/index.d.ts

@@ -1,7 +1,9 @@
 import type { ComponentInternalInstance, VNode } from 'vue';
-export declare const useOrderedChildren: <T extends {
+type ChildEssential = {
     uid: number;
-}>(vm: ComponentInternalInstance, childComponentName: string) => {
+    getVnode: () => VNode;
+};
+export declare const useOrderedChildren: <T extends ChildEssential>(vm: ComponentInternalInstance, childComponentName: string) => {
     children: import("vue").ShallowRef<T[]>;
     addChild: (child: T) => void;
     removeChild: (child: T) => void;
@@ -9,3 +11,4 @@ export declare const useOrderedChildren: <T extends {
         [key: string]: any;
     }> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 };
+export {};

package/lib/hooks/use-ordered-children/index.js

@@ -16,13 +16,34 @@ const getOrderedChildren = (vm, childComponentName, children) => {
 const useOrderedChildren = (vm, childComponentName) => {
   const children = vue.shallowRef({});
   const orderedChildren = vue.shallowRef([]);
+  const nodesMap = /* @__PURE__ */ new WeakMap();
   const addChild = (child) => {
     children.value[child.uid] = child;
     vue.triggerRef(children);
+    vue.onMounted(() => {
+      const childNode = child.getVnode().el;
+      const parentNode = childNode.parentNode;
+      if (!nodesMap.has(parentNode)) {
+        nodesMap.set(parentNode, []);
+        const originalFn = parentNode.insertBefore.bind(parentNode);
+        parentNode.insertBefore = (node, anchor) => {
+          const shouldSortChildren = nodesMap.get(parentNode).some((el) => node === el || anchor === el);
+          if (shouldSortChildren)
+            vue.triggerRef(children);
+          return originalFn(node, anchor);
+        };
+      }
+      nodesMap.get(parentNode).push(childNode);
+    });
   };
   const removeChild = (child) => {
     delete children.value[child.uid];
     vue.triggerRef(children);
+    const childNode = child.getVnode().el;
+    const parentNode = childNode.parentNode;
+    const childNodes = nodesMap.get(parentNode);
+    const index = childNodes.indexOf(childNode);
+    childNodes.splice(index, 1);
   };
   const sortChildren = () => {
     orderedChildren.value = getOrderedChildren(vm, childComponentName, children.value);

package/lib/hooks/use-ordered-children/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-ordered-children/index.ts"],"sourcesContent":["import { defineComponent, h, isVNode, shallowRef, triggerRef } from 'vue'\nimport { flattedChildren } from '@element-plus/utils'\n\nimport type { ComponentInternalInstance, VNode } from 'vue'\n\nconst getOrderedChildren = <T>(\n  vm: ComponentInternalInstance,\n  childComponentName: string,\n  children: Record<number, T>\n): T[] => {\n  const nodes = flattedChildren(vm.subTree).filter(\n    (n): n is VNode =>\n      isVNode(n) &&\n      (n.type as any)?.name === childComponentName &&\n      !!n.component\n  )\n  const uids = nodes.map((n) => n.component!.uid)\n  return uids.map((uid) => children[uid]).filter((p) => !!p)\n}\n\nexport const useOrderedChildren = <T extends { uid: number }>(\n  vm: ComponentInternalInstance,\n  childComponentName: string\n) => {\n  const children = shallowRef<Record<number, T>>({})\n  const orderedChildren = shallowRef<T[]>([])\n\n  const addChild = (child: T) => {\n    children.value[child.uid] = child\n    triggerRef(children)\n  }\n\n  const removeChild = (child: T) => {\n    delete children.value[child.uid]\n    triggerRef(children)\n  }\n\n  const sortChildren = () => {\n    orderedChildren.value = getOrderedChildren(\n      vm,\n      childComponentName,\n      children.value\n    )\n  }\n\n  const IsolatedRenderer = (props: { render: () => VNode[] }) => {\n    return props.render()\n  }\n\n  // TODO: Refactor `el-description` before converting this to a functional component\n  const ChildrenSorter = defineComponent({\n    setup(_, { slots }) {\n      return () => {\n        sortChildren()\n\n        return slots.default\n          ? // Create a new `ReactiveEffect` to ensure `ChildrenSorter` doesn't track any extra dependencies\n            // @ts-ignore TODO: Remove this after Vue is upgraded\n            h(IsolatedRenderer, {\n              render: slots.default,\n            })\n          : null\n      }\n    },\n  })\n\n  return {\n    children: orderedChildren,\n    addChild,\n    removeChild,\n    ChildrenSorter,\n  }\n}\n"],"names":["flattedChildren","isVNode","shallowRef","triggerRef","defineComponent","h"],"mappings":";;;;;;;AAEA,MAAM,kBAAkB,GAAG,CAAC,EAAE,EAAE,kBAAkB,EAAE,QAAQ,KAAK;AACjE,EAAE,MAAM,KAAK,GAAGA,qBAAe,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK;AAC1D,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,OAAOC,WAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,kBAAkB,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;AAC5G,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;AACjD,EAAE,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC7D,CAAC,CAAC;AACU,MAAC,kBAAkB,GAAG,CAAC,EAAE,EAAE,kBAAkB,KAAK;AAC9D,EAAE,MAAM,QAAQ,GAAGC,cAAU,CAAC,EAAE,CAAC,CAAC;AAClC,EAAE,MAAM,eAAe,GAAGA,cAAU,CAAC,EAAE,CAAC,CAAC;AACzC,EAAE,MAAM,QAAQ,GAAG,CAAC,KAAK,KAAK;AAC9B,IAAI,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AACtC,IAAIC,cAAU,CAAC,QAAQ,CAAC,CAAC;AACzB,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK;AACjC,IAAI,OAAO,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AACrC,IAAIA,cAAU,CAAC,QAAQ,CAAC,CAAC;AACzB,GAAG,CAAC;AACJ,EAAE,MAAM,YAAY,GAAG,MAAM;AAC7B,IAAI,eAAe,CAAC,KAAK,GAAG,kBAAkB,CAAC,EAAE,EAAE,kBAAkB,EAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;AACvF,GAAG,CAAC;AACJ,EAAE,MAAM,gBAAgB,GAAG,CAAC,KAAK,KAAK;AACtC,IAAI,OAAO,KAAK,CAAC,MAAM,EAAE,CAAC;AAC1B,GAAG,CAAC;AACJ,EAAE,MAAM,cAAc,GAAGC,mBAAe,CAAC;AACzC,IAAI,KAAK,CAAC,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE;AACxB,MAAM,OAAO,MAAM;AACnB,QAAQ,YAAY,EAAE,CAAC;AACvB,QAAQ,OAAO,KAAK,CAAC,OAAO,GAAGC,KAAC,CAAC,gBAAgB,EAAE;AACnD,UAAU,MAAM,EAAE,KAAK,CAAC,OAAO;AAC/B,SAAS,CAAC,GAAG,IAAI,CAAC;AAClB,OAAO,CAAC;AACR,KAAK;AACL,GAAG,CAAC,CAAC;AACL,EAAE,OAAO;AACT,IAAI,QAAQ,EAAE,eAAe;AAC7B,IAAI,QAAQ;AACZ,IAAI,WAAW;AACf,IAAI,cAAc;AAClB,GAAG,CAAC;AACJ;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-ordered-children/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  h,\n  isVNode,\n  onMounted,\n  shallowRef,\n  triggerRef,\n} from 'vue'\nimport { flattedChildren } from '@element-plus/utils'\n\nimport type { ComponentInternalInstance, VNode } from 'vue'\n\ntype ChildEssential = {\n  uid: number\n  getVnode: () => VNode\n}\n\nconst getOrderedChildren = <T>(\n  vm: ComponentInternalInstance,\n  childComponentName: string,\n  children: Record<number, T>\n): T[] => {\n  const nodes = flattedChildren(vm.subTree).filter(\n    (n): n is VNode =>\n      isVNode(n) &&\n      (n.type as any)?.name === childComponentName &&\n      !!n.component\n  )\n  const uids = nodes.map((n) => n.component!.uid)\n  return uids.map((uid) => children[uid]).filter((p) => !!p)\n}\n\nexport const useOrderedChildren = <T extends ChildEssential>(\n  vm: ComponentInternalInstance,\n  childComponentName: string\n) => {\n  const children = shallowRef<Record<number, T>>({})\n  const orderedChildren = shallowRef<T[]>([])\n  const nodesMap = new WeakMap<ParentNode, Node[]>()\n\n  const addChild = (child: T) => {\n    children.value[child.uid] = child\n    triggerRef(children)\n\n    onMounted(() => {\n      const childNode = child.getVnode().el! as Node\n      const parentNode = childNode.parentNode!\n\n      if (!nodesMap.has(parentNode)) {\n        nodesMap.set(parentNode, [])\n\n        const originalFn = parentNode.insertBefore.bind(parentNode)\n        parentNode.insertBefore = <T extends Node>(\n          node: T,\n          anchor: Node | null\n        ) => {\n          // Schedule a job to update `orderedChildren` if the root element of child components is moved\n          const shouldSortChildren = nodesMap\n            .get(parentNode)!\n            .some((el) => node === el || anchor === el)\n          if (shouldSortChildren) triggerRef(children)\n\n          return originalFn(node, anchor)\n        }\n      }\n\n      nodesMap.get(parentNode)!.push(childNode)\n    })\n  }\n\n  const removeChild = (child: T) => {\n    delete children.value[child.uid]\n    triggerRef(children)\n\n    const childNode = child.getVnode().el! as Node\n    const parentNode = childNode.parentNode!\n    const childNodes = nodesMap.get(parentNode)!\n    const index = childNodes.indexOf(childNode)\n    childNodes.splice(index, 1)\n  }\n\n  const sortChildren = () => {\n    orderedChildren.value = getOrderedChildren(\n      vm,\n      childComponentName,\n      children.value\n    )\n  }\n\n  const IsolatedRenderer = (props: { render: () => VNode[] }) => {\n    return props.render()\n  }\n\n  // TODO: Refactor `el-description` before converting this to a functional component\n  const ChildrenSorter = defineComponent({\n    setup(_, { slots }) {\n      return () => {\n        sortChildren()\n\n        return slots.default\n          ? // Create a new `ReactiveEffect` to ensure `ChildrenSorter` doesn't track any extra dependencies\n            // @ts-ignore TODO: Remove this after Vue is upgraded\n            h(IsolatedRenderer, {\n              render: slots.default,\n            })\n          : null\n      }\n    },\n  })\n\n  return {\n    children: orderedChildren,\n    addChild,\n    removeChild,\n    ChildrenSorter,\n  }\n}\n"],"names":["flattedChildren","isVNode","shallowRef","triggerRef","onMounted","defineComponent","h"],"mappings":"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"}

package/lib/index.d.ts

@@ -10985,6 +10985,7 @@ export declare type CarouselItemContext = {
     props: CarouselItemProps;
     states: CarouselItemStates;
     uid: number;
+    getVnode: () => VNode;
     translateItem: (index: number, activeIndex: number, oldIndex?: number) => void;
 };
 export declare type CarouselItemInstance = InstanceType<typeof _default_20> & unknown;
@@ -11395,6 +11396,10 @@ export declare const checkTagProps: {
     readonly disabled: BooleanConstructor;
     readonly type: EpPropFinalized<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown, "primary", boolean>;
 };
+declare type ChildEssential = {
+    uid: number;
+    getVnode: () => VNode;
+};
 declare type ChildrenData = CascaderOption[] | undefined;
 declare type CI<T extends DefaultRow> = {
     column: TableColumnCtx<T>;
@@ -15462,6 +15467,7 @@ declare const _default_85: __VLS_WithTemplateSlots_68<typeof __VLS_component_68,
 declare const _default_86: DefineComponent<{
     readonly tabs: EpPropFinalized<(new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15480,6 +15486,7 @@ declare const _default_86: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15498,6 +15505,7 @@ declare const _default_86: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | ((new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15516,6 +15524,7 @@ declare const _default_86: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15555,6 +15564,7 @@ declare const _default_86: DefineComponent<{
 }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
     readonly tabs: EpPropFinalized<(new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15573,6 +15583,7 @@ declare const _default_86: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15591,6 +15602,7 @@ declare const _default_86: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | ((new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15609,6 +15621,7 @@ declare const _default_86: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -15643,6 +15656,7 @@ declare const _default_86: DefineComponent<{
 }>>, {
     readonly tabs: {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -22399,6 +22413,7 @@ export declare type TabBarProps = ExtractPropTypes<typeof tabBarProps>;
 export declare const tabBarProps: {
     readonly tabs: EpPropFinalized<(new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -22417,6 +22432,7 @@ export declare const tabBarProps: {
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -22435,6 +22451,7 @@ export declare const tabBarProps: {
         isFocusInsidePane: () => boolean | undefined;
     }[]) | ((new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -22453,6 +22470,7 @@ export declare const tabBarProps: {
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23510,6 +23528,7 @@ export declare enum TableV2SortOrder {
 declare const TabNav: DefineComponent<{
     readonly panes: EpPropFinalized<(new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23528,6 +23547,7 @@ declare const TabNav: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23546,6 +23566,7 @@ declare const TabNav: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | ((new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23564,6 +23585,7 @@ declare const TabNav: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23595,6 +23617,7 @@ declare const TabNav: DefineComponent<{
 }, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
     readonly panes: EpPropFinalized<(new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23613,6 +23636,7 @@ declare const TabNav: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23631,6 +23655,7 @@ declare const TabNav: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | ((new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23649,6 +23674,7 @@ declare const TabNav: DefineComponent<{
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23677,6 +23703,7 @@ declare const TabNav: DefineComponent<{
 }>> & {
     onTabClick?: ((tab: {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23696,6 +23723,7 @@ declare const TabNav: DefineComponent<{
     }, tabName: TabPaneName, ev: Event) => any) | undefined;
     onTabRemove?: ((tab: {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23719,6 +23747,7 @@ declare const TabNav: DefineComponent<{
     readonly editable: boolean;
     readonly panes: {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23750,6 +23779,7 @@ export declare type TabNavInstance = InstanceType<typeof TabNav> & {
     scrollToActiveTab: () => Promise<void>;
     removeFocus: () => void;
     focusActiveTab: () => void;
+    scheduleRender: () => void;
     tabListRef: HTMLDivElement | undefined;
     tabBarRef: TabBarInstance | undefined;
 };
@@ -23757,6 +23787,7 @@ export declare type TabNavProps = ExtractPropTypes<typeof tabNavProps>;
 export declare const tabNavProps: {
     readonly panes: EpPropFinalized<(new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23775,6 +23806,7 @@ export declare const tabNavProps: {
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23793,6 +23825,7 @@ export declare const tabNavProps: {
         isFocusInsidePane: () => boolean | undefined;
     }[]) | ((new (...args: any[]) => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23811,6 +23844,7 @@ export declare const tabNavProps: {
         isFocusInsidePane: () => boolean | undefined;
     }[]) | (() => {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23916,6 +23950,7 @@ declare const Tabs: DefineComponent<{
     "onUpdate:modelValue"?: ((name: TabPaneName) => any) | undefined;
     onTabClick?: ((pane: {
         uid: number;
+        getVnode: () => VNode;
         slots: Slots;
         props: {
             readonly label: string;
@@ -23961,6 +23996,7 @@ export declare type TabsInstance = InstanceType<typeof Tabs> & {
 };
 export declare type TabsPaneContext = UnwrapRef<{
     uid: number;
+    getVnode: () => VNode;
     slots: Slots;
     props: TabPaneProps;
     paneName: ComputedRef<TabPaneName | undefined>;
@@ -24002,6 +24038,7 @@ export declare interface TabsRootContext {
     currentName: Ref<TabPaneName>;
     registerPane: (pane: TabsPaneContext) => void;
     unregisterPane: (pane: TabsPaneContext) => void;
+    nav$: Ref<TabNavInstance | undefined>;
 }
 export declare const tabsRootContextKey: InjectionKey<TabsRootContext>;
 export declare interface Tag {
@@ -25461,9 +25498,7 @@ export declare const useNamespace: (block: string, namespaceOverrides?: Ref<stri
     cssVarBlockName: (name: string) => string;
 };
 export declare type UseNamespaceReturn = ReturnType<typeof useNamespace>;
-export declare const useOrderedChildren: <T extends {
-    uid: number;
-}>(vm: ComponentInternalInstance, childComponentName: string) => {
+export declare const useOrderedChildren: <T extends ChildEssential>(vm: ComponentInternalInstance, childComponentName: string) => {
     children: ShallowRef<T[]>;
     addChild: (child: T) => void;
     removeChild: (child: T) => void;