@element-plus/nightly 0.0.20220108 → 0.0.20220112

package/lib/components/time-select/src/time-select.vue_vue_type_script_lang.js

@@ -3,16 +3,30 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
+var dayjs = require('dayjs');
+var customParseFormat = require('dayjs/plugin/customParseFormat');
 var index = require('../../select/index.js');
 var index$1 = require('../../icon/index.js');
 var iconsVue = require('@element-plus/icons-vue');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
+var customParseFormat__default = /*#__PURE__*/_interopDefaultLegacy(customParseFormat);
+
+dayjs__default["default"].extend(customParseFormat__default["default"]);
 const { Option: ElOption } = index.ElSelect;
 const parseTime = (time) => {
   const values = (time || "").split(":");
   if (values.length >= 2) {
-    const hours = parseInt(values[0], 10);
+    let hours = parseInt(values[0], 10);
     const minutes = parseInt(values[1], 10);
+    const timeUpper = time.toUpperCase();
+    if (timeUpper.includes("AM") && hours === 12) {
+      hours = 0;
+    } else if (timeUpper.includes("PM") && hours !== 12) {
+      hours += 12;
+    }
     return {
       hours,
       minutes
@@ -30,8 +44,11 @@ const compareTime = (time1, time2) => {
   }
   return minutes1 > minutes2 ? 1 : -1;
 };
+const padTime = (time) => {
+  return `${time}`.padStart(2, "0");
+};
 const formatTime = (time) => {
-  return `${time.hours < 10 ? `0${time.hours}` : time.hours}:${time.minutes < 10 ? `0${time.minutes}` : time.minutes}`;
+  return `${padTime(time.hours)}:${padTime(time.minutes)}`;
 };
 const nextTime = (time, step) => {
   const timeValue = parseTime(time);
@@ -54,6 +71,10 @@ var script = vue.defineComponent({
     event: "change"
   },
   props: {
+    format: {
+      type: String,
+      default: "HH:mm"
+    },
     modelValue: String,
     disabled: {
       type: Boolean,
@@ -113,16 +134,38 @@ var script = vue.defineComponent({
   setup(props) {
     const select = vue.ref(null);
     const value = vue.computed(() => props.modelValue);
+    const start = vue.computed(() => {
+      const time = parseTime(props.start);
+      return formatTime(time);
+    });
+    const end = vue.computed(() => {
+      const time = parseTime(props.end);
+      return formatTime(time);
+    });
+    const step = vue.computed(() => {
+      const time = parseTime(props.step);
+      return formatTime(time);
+    });
+    const minTime = vue.computed(() => {
+      const time = parseTime(props.minTime);
+      return time ? formatTime(time) : null;
+    });
+    const maxTime = vue.computed(() => {
+      const time = parseTime(props.maxTime);
+      return time ? formatTime(time) : null;
+    });
     const items = vue.computed(() => {
       const result = [];
       if (props.start && props.end && props.step) {
-        let current = props.start;
-        while (compareTime(current, props.end) <= 0) {
+        let current = start.value;
+        let currentTime;
+        while (compareTime(current, end.value) <= 0) {
+          currentTime = dayjs__default["default"](current, "HH:mm").format(props.format);
           result.push({
-            value: current,
-            disabled: compareTime(current, props.minTime || "-1:-1") <= 0 || compareTime(current, props.maxTime || "100:100") >= 0
+            value: currentTime,
+            disabled: compareTime(current, minTime.value || "-1:-1") <= 0 || compareTime(current, maxTime.value || "100:100") >= 0
           });
-          current = nextTime(current, props.step);
+          current = nextTime(current, step.value);
         }
       }
       return result;

package/lib/components/time-select/src/time-select.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-select.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/time-select/src/time-select.vue"],"sourcesContent":["<template>\n  <el-select\n    ref=\"select\"\n    :model-value=\"value\"\n    :disabled=\"disabled\"\n    :clearable=\"clearable\"\n    :clear-icon=\"clearIcon\"\n    :size=\"size\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    @update:model-value=\"(event) => $emit('update:modelValue', event)\"\n    @change=\"(event) => $emit('change', event)\"\n    @blur=\"(event) => $emit('blur', event)\"\n    @focus=\"(event) => $emit('focus', event)\"\n  >\n    <el-option\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :label=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled\"\n    />\n    <template #prefix>\n      <el-icon v-if=\"prefixIcon\" class=\"el-input__prefix-icon\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport ElSelect from '@element-plus/components/select'\nimport ElIcon from '@element-plus/components/icon'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\n\nconst { Option: ElOption } = ElSelect\n\ninterface Time {\n  hours: number\n  minutes: number\n}\n\nconst parseTime = (time: string): null | Time => {\n  const values = (time || '').split(':')\n  if (values.length >= 2) {\n    const hours = parseInt(values[0], 10)\n    const minutes = parseInt(values[1], 10)\n    return {\n      hours,\n      minutes,\n    }\n  }\n  return null\n}\nconst compareTime = (time1: string, time2: string): number => {\n  const value1 = parseTime(time1)\n  const value2 = parseTime(time2)\n  const minutes1 = value1.minutes + value1.hours * 60\n  const minutes2 = value2.minutes + value2.hours * 60\n  if (minutes1 === minutes2) {\n    return 0\n  }\n  return minutes1 > minutes2 ? 1 : -1\n}\nconst formatTime = (time: Time): string => {\n  return `${time.hours < 10 ? `0${time.hours}` : time.hours}:${\n    time.minutes < 10 ? `0${time.minutes}` : time.minutes\n  }`\n}\nconst nextTime = (time: string, step: string): string => {\n  const timeValue = parseTime(time)\n  const stepValue = parseTime(step)\n  const next = {\n    hours: timeValue.hours,\n    minutes: timeValue.minutes,\n  }\n  next.minutes += stepValue.minutes\n  next.hours += stepValue.hours\n  next.hours += Math.floor(next.minutes / 60)\n  next.minutes = next.minutes % 60\n  return formatTime(next)\n}\n\nexport default defineComponent({\n  name: 'ElTimeSelect',\n  components: { ElSelect, ElOption, ElIcon },\n  model: {\n    prop: 'value',\n    event: 'change',\n  },\n  props: {\n    modelValue: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    editable: {\n      type: Boolean,\n      default: true,\n    },\n    clearable: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      default: 'default',\n      validator: (value: string) =>\n        !value || ['large', 'default', 'small'].indexOf(value) !== -1,\n    },\n    placeholder: {\n      type: String,\n      default: '',\n    },\n    start: {\n      type: String,\n      default: '09:00',\n    },\n    end: {\n      type: String,\n      default: '18:00',\n    },\n    step: {\n      type: String,\n      default: '00:30',\n    },\n    minTime: {\n      type: String,\n      default: '',\n    },\n    maxTime: {\n      type: String,\n      default: '',\n    },\n    name: {\n      type: String,\n      default: '',\n    },\n    prefixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: Clock,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n  },\n  emits: ['change', 'blur', 'focus', 'update:modelValue'],\n  setup(props) {\n    // computed\n    const select = ref(null)\n    const value = computed(() => props.modelValue)\n    const items = computed(() => {\n      const result = []\n      if (props.start && props.end && props.step) {\n        let current = props.start\n        while (compareTime(current, props.end) <= 0) {\n          result.push({\n            value: current,\n            disabled:\n              compareTime(current, props.minTime || '-1:-1') <= 0 ||\n              compareTime(current, props.maxTime || '100:100') >= 0,\n          })\n          current = nextTime(current, props.step)\n        }\n      }\n      return result\n    })\n    const blur = () => {\n      select.value?.blur?.()\n    }\n    const focus = () => {\n      select.value?.focus?.()\n    }\n\n    return {\n      select,\n      value,\n      items,\n      blur,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElSelect","computed"],"mappings":";;;;;;;;;AAmCA,cAAc,EAAE,QAAQ,EAAE,iBAAW,CAAC;;AAEtC,EAAE,MAAM,MAAM,GAAG,CAAC,IAAI,IAAI,EAAE,EAAE,MAAM,GAAG,EAAE;AACzC,EAAE,UAAU,OAAO,IAAI,CAAC,EAAE;;AAE1B,IAAI,MAAM,OAAO,GAAG,SAAS,MAAM,CAAC;;AAEpC,MAAM,KAAK;MACL,OAAO;KACR,CAAC;AACN;;AAEA,CAAC,CAAC;MACI,WAAW,GAAG,CAAC,KAAK,EAAE,KAAK,KAAK;EACpC,MAAM,MAAM,GAAG,SAAS;QAClB,MAAM,YAAY,CAAC,KAAK,CAAC,CAAC;QAC1B,QAAQ,SAAS,CAAC,OAAO,GAAG,MAAM;QAClC;MACF;WACK,CAAC,CAAC;;EAEX;EACA;AACF;AACA,EAAE,OAAO,CAAC,EAAE,IAAI,MAAM,GAAG,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC;EAC1D;MACI,WAAW,CAAC,IAAI,EAAE,IAAI;EAC1B,MAAM,SAAS,GAAG,SAAS,CAAC,IAAI,EAAE;EAClC,MAAM,SAAS,GAAG,SAAS,CAAC,IAAI,EAAE;EAClC,MAAM,IAAI,GAAG;IACX,KAAK,EAAE;;GAER,CAAC;AACJ;AACA,EAAE,IAAI,CAAC,KAAK,cAAc,KAAK;EAC7B,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;MACvC,CAAC,OAAO,GAAG,KAAK,OAAO,GAAG,EAAE,CAAC;EACjC;AACF;AACA,aAAeA,mBAAe;EAC5B,IAAI,EAAE,cAAc;EACpB,UAAU,EAAE,YAAEC,cAAQ,EAAE,QAAQ;EAChC,OAAO;IACL,IAAI,SAAS;IACb,KAAK,EAAE,QAAQ;;EAEjB,KAAK,EAAE;IACL,UAAU,EAAE,MAAM;IAClB,UAAU;MACR,IAAI,EAAE,OAAO;MACb,OAAO,EAAE,KAAK;AACpB;;AAEA,UAAU,EAAE,OAAO;MACb,OAAO,EAAE,IAAI;KACd;IACD;MACE,IAAI,EAAE;MACN,OAAO,EAAE,IAAI;;IAEf;MACE,IAAI,EAAE,MAAM;MACZ;MACA,SAAS,EAAE,CAAC;;IAEd;MACE,IAAI,EAAE;MACN,OAAO,EAAE,EAAE;;IAEb;MACE,IAAI,EAAE;MACN,OAAO,EAAE;;IAEX;MACE,IAAI;MACJ,OAAO,EAAE,OAAO;;QAEd,EAAE;UACA,EAAE,MAAM;;KAEb;aACQ;MACP,IAAI,EAAE;;KAEP;aACQ;MACP,IAAI,EAAE,MAAM;;KAEb;QACG,EAAE;MACJ,IAAI,EAAE,MAAM;;KAEb;cACS,EAAE;MACV,IAAI,EAAE,CAAC,MAAM,EAAE;;KAEhB;aACQ,EAAE;MACT,IAAI,EAAE,CAAC;;KAER;;OAEE,EAAE,CAAC;;IAEN,MAAM;UACA,KAAK,GAAGC;UACR,KAAK;;MAET,IAAI,MAAM;QACR,IAAI,OAAO,GAAG,KAAK,MAAM,CAAC;QAC1B,OAAO;;YAEH;YACA,UAAU,WAAW,CAAC,OAAO,EAAE,KAAK,QAAQ,IAAI;WACjD,CAAC,CAAC;;;OAGN;MACD,OAAO;KACR,EAAE;IACH,MAAM,IAAI,GAAG,MAAM;MACjB,IAAI,EAAE,EAAE,EAAE;MACV,CAAC,KAAK,CAAC,KAAK,MAAM,CAAC,KAAK;MACxB;UACI,KAAK,GAAG;UACR,EAAE,EAAE,EAAE,CAAC;SACR,GAAG,GAAG,GAAG,MAAM,CAAC,KAAK,SAAS,GAAG,KAAK,CAAC,GAAG,EAAE;;;YAGzC;;;UAGF;WACC;;;;;;;"}
+{"version":3,"file":"time-select.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/time-select/src/time-select.vue"],"sourcesContent":["<template>\n  <el-select\n    ref=\"select\"\n    :model-value=\"value\"\n    :disabled=\"disabled\"\n    :clearable=\"clearable\"\n    :clear-icon=\"clearIcon\"\n    :size=\"size\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    @update:model-value=\"(event) => $emit('update:modelValue', event)\"\n    @change=\"(event) => $emit('change', event)\"\n    @blur=\"(event) => $emit('blur', event)\"\n    @focus=\"(event) => $emit('focus', event)\"\n  >\n    <el-option\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :label=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled\"\n    />\n    <template #prefix>\n      <el-icon v-if=\"prefixIcon\" class=\"el-input__prefix-icon\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\nimport ElSelect from '@element-plus/components/select'\nimport ElIcon from '@element-plus/components/icon'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\ndayjs.extend(customParseFormat)\n\nconst { Option: ElOption } = ElSelect\n\ninterface Time {\n  hours: number\n  minutes: number\n}\n\nconst parseTime = (time: string): null | Time => {\n  const values = (time || '').split(':')\n  if (values.length >= 2) {\n    let hours = parseInt(values[0], 10)\n    const minutes = parseInt(values[1], 10)\n    const timeUpper = time.toUpperCase()\n    if (timeUpper.includes('AM') && hours === 12) {\n      hours = 0\n    } else if (timeUpper.includes('PM') && hours !== 12) {\n      hours += 12\n    }\n    return {\n      hours,\n      minutes,\n    }\n  }\n  return null\n}\nconst compareTime = (time1: string, time2: string): number => {\n  const value1 = parseTime(time1)\n  const value2 = parseTime(time2)\n  const minutes1 = value1.minutes + value1.hours * 60\n  const minutes2 = value2.minutes + value2.hours * 60\n  if (minutes1 === minutes2) {\n    return 0\n  }\n  return minutes1 > minutes2 ? 1 : -1\n}\nconst padTime = (time: number | string) => {\n  return `${time}`.padStart(2, '0')\n}\nconst formatTime = (time: Time): string => {\n  return `${padTime(time.hours)}:${padTime(time.minutes)}`\n}\nconst nextTime = (time: string, step: string): string => {\n  const timeValue = parseTime(time)\n  const stepValue = parseTime(step)\n  const next = {\n    hours: timeValue.hours,\n    minutes: timeValue.minutes,\n  }\n  next.minutes += stepValue.minutes\n  next.hours += stepValue.hours\n  next.hours += Math.floor(next.minutes / 60)\n  next.minutes = next.minutes % 60\n  return formatTime(next)\n}\n\nexport default defineComponent({\n  name: 'ElTimeSelect',\n  components: { ElSelect, ElOption, ElIcon },\n  model: {\n    prop: 'value',\n    event: 'change',\n  },\n  props: {\n    format: {\n      type: String,\n      default: 'HH:mm',\n    },\n    modelValue: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    editable: {\n      type: Boolean,\n      default: true,\n    },\n    clearable: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      default: 'default',\n      validator: (value: string) =>\n        !value || ['large', 'default', 'small'].indexOf(value) !== -1,\n    },\n    placeholder: {\n      type: String,\n      default: '',\n    },\n    start: {\n      type: String,\n      default: '09:00',\n    },\n    end: {\n      type: String,\n      default: '18:00',\n    },\n    step: {\n      type: String,\n      default: '00:30',\n    },\n    minTime: {\n      type: String,\n      default: '',\n    },\n    maxTime: {\n      type: String,\n      default: '',\n    },\n    name: {\n      type: String,\n      default: '',\n    },\n    prefixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: Clock,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n  },\n  emits: ['change', 'blur', 'focus', 'update:modelValue'],\n  setup(props) {\n    // computed\n    const select = ref(null)\n    const value = computed(() => props.modelValue)\n    const start = computed(() => {\n      const time = parseTime(props.start)\n      return formatTime(time)\n    })\n    const end = computed(() => {\n      const time = parseTime(props.end)\n      return formatTime(time)\n    })\n    const step = computed(() => {\n      const time = parseTime(props.step)\n      return formatTime(time)\n    })\n    const minTime = computed(() => {\n      const time = parseTime(props.minTime)\n      return time ? formatTime(time) : null\n    })\n    const maxTime = computed(() => {\n      const time = parseTime(props.maxTime)\n      return time ? formatTime(time) : null\n    })\n    const items = computed(() => {\n      const result = []\n      if (props.start && props.end && props.step) {\n        let current = start.value\n        let currentTime\n        while (compareTime(current, end.value) <= 0) {\n          currentTime = dayjs(current, 'HH:mm').format(props.format)\n          result.push({\n            value: currentTime,\n            disabled:\n              compareTime(current, minTime.value || '-1:-1') <= 0 ||\n              compareTime(current, maxTime.value || '100:100') >= 0,\n          })\n          current = nextTime(current, step.value)\n        }\n      }\n      return result\n    })\n    const blur = () => {\n      select.value?.blur?.()\n    }\n    const focus = () => {\n      select.value?.focus?.()\n    }\n\n    return {\n      select,\n      value,\n      items,\n      blur,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":["dayjs","customParseFormat","defineComponent","ElSelect","Clock","CircleClose","computed"],"mappings":";;;;;;;;;;;;;;;;AAqCAA,yBAAK,OAAO,CAACC,qCAAiB,CAAC,CAAC;;AAEhC,eAAe,GAAG,CAAC,SAAS;AAC5B,EAAE,MAAM,MAAM,GAAG,CAAC,IAAI,IAAI,EAAE,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;AACzC,EAAE,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,EAAE;;AAE1B,IAAI,MAAM,OAAO,GAAG,SAAS,MAAM,CAAC;;AAEpC,IAAI,IAAI;MACF,KAAK,GAAG;KACT,MAAM,IAAI;AACf;;AAEA,IAAI,OAAO;MACL,KAAK;MACL,OAAO;KACR,CAAC;;aAEO,CAAC;;MAER;QACE,MAAM,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;QAC1B;;QAEA;MACF;WACK,CAAC,CAAC;;EAEX;EACA;AACF;AACA,EAAE,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,CAAC,EAAE,GAAG,EAAE;EAClC;MACI,aAAa,CAAC,IAAI,KAAK;EAC3B,OAAO,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,IAAI;EAC7C;MACI,WAAW,KAAK,EAAE;QAChB;EACN;EACA,UAAU,GAAG;AACf;AACA,IAAI,OAAO,YAAY,OAAO;GAC3B,CAAC;AACJ;AACA,EAAE,IAAI,CAAC,KAAK,cAAc,KAAK;EAC7B,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;AAC9C;AACA,EAAE,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC;EACxB;aACaC,mBAAe,CAAC;EAC7B,IAAI,EAAE;YACI,EAAE,YAAEC,cAAQ,EAAE;OACnB,EAAE;;IAEL,KAAK,EAAE,QAAQ;GAChB;EACD,KAAK,EAAE;IACL,MAAM,EAAE;MACN,IAAI,EAAE,MAAM;AAClB;;AAEA,IAAI,YAAY,MAAM;IAClB,QAAQ,EAAE;MACR,IAAI,EAAE,OAAO;MACb;KACD;IACD,QAAQ,EAAE;;MAER;KACD;aACQ,EAAE;MACT,IAAI,EAAE,OAAO;;KAEd;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE;;KAEV;eACU,EAAE;MACX,IAAI,EAAE,MAAM;;KAEb;SACI;MACH,IAAI,EAAE,MAAM;;KAEb;OACE,EAAE;MACH,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,OAAO;;IAElB;MACE,IAAI,EAAE;MACN,OAAO,EAAE;;IAEX;MACE;MACA,OAAO,EAAE,EAAE;;IAEb;MACE;MACA,OAAO,EAAE,EAAE;;IAEb;MACE,IAAI;MACJ,OAAO,EAAE,EAAE;;IAEb;MACE,IAAI,GAAG;MACP,OAAO,EAAEC;;IAEX;MACE,IAAI,GAAG;MACP,OAAO,EAAEC;;;OAGR,GAAG;OACH,CAAC,KAAK,EAAE;UACL,MAAM;IACZ;IACA,MAAM;MACJ,MAAM,IAAI,GAAG,UAAU,KAAK,CAAC,KAAK,CAAC,CAAC;MACpC,OAAO;KACR;IACD,MAAM,GAAG;MACP,MAAM,IAAI,GAAG,UAAU,KAAK,CAAC,GAAG,CAAC,CAAC;MAClC,OAAO,UAAU,CAAC;KACnB;;MAEC,MAAM,IAAI,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;MACnC,OAAO;KACR,EAAE;IACH,MAAM,OAAO,GAAGC;MACd,MAAM,IAAI,GAAG,SAAS,MAAM,CAAC,OAAO,CAAC,CAAC;MACtC,OAAO,OAAO,UAAU,CAAC;MACzB,CAAC;UACG,OAAO,GAAGA,YAAQ;;MAEtB,WAAW,GAAG,WAAW;MACzB,CAAC;UACG,KAAK,GAAGA,YAAQ,CAAC;;MAErB,IAAI,KAAK,MAAM,IAAI,KAAK;QACtB,IAAI,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC;QAC1B,eAAe,CAAC;;UAEd,WAAW,GAAGN,yBAAK,CAAC;UACpB,OAAO,IAAI,CAAC;8BACQ;;WAEnB,CAAC,CAAC;UACH,OAAO,GAAG,QAAQ,CAAC,OAAO,EAAE,IAAI;SACjC;;MAEH,OAAO,MAAM,CAAC;MACd,CAAC;UACG,IAAI,GAAG,MAAM;UACb,EAAE,EAAE,EAAE,CAAC;SACR,GAAG,CAAC,EAAE,GAAG;;UAER,KAAK,GAAG,MAAM;UACd,EAAE,EAAE,EAAE,CAAC;YACL,CAAC,EAAE,SAAS,CAAC,KAAK;;;;WAInB;WACA;;MAEL;MACA;;;;;;"}

package/lib/components/time-select/src/time-select.vue_vue_type_template_id_5beb6389_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-select.vue_vue_type_template_id_5beb6389_lang.js","sources":["../../../../../../packages/components/time-select/src/time-select.vue?vue&type=template&id=5beb6389&lang.js"],"sourcesContent":["<template>\n  <el-select\n    ref=\"select\"\n    :model-value=\"value\"\n    :disabled=\"disabled\"\n    :clearable=\"clearable\"\n    :clear-icon=\"clearIcon\"\n    :size=\"size\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    @update:model-value=\"(event) => $emit('update:modelValue', event)\"\n    @change=\"(event) => $emit('change', event)\"\n    @blur=\"(event) => $emit('blur', event)\"\n    @focus=\"(event) => $emit('focus', event)\"\n  >\n    <el-option\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :label=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled\"\n    />\n    <template #prefix>\n      <el-icon v-if=\"prefixIcon\" class=\"el-input__prefix-icon\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport ElSelect from '@element-plus/components/select'\nimport ElIcon from '@element-plus/components/icon'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\n\nconst { Option: ElOption } = ElSelect\n\ninterface Time {\n  hours: number\n  minutes: number\n}\n\nconst parseTime = (time: string): null | Time => {\n  const values = (time || '').split(':')\n  if (values.length >= 2) {\n    const hours = parseInt(values[0], 10)\n    const minutes = parseInt(values[1], 10)\n    return {\n      hours,\n      minutes,\n    }\n  }\n  return null\n}\nconst compareTime = (time1: string, time2: string): number => {\n  const value1 = parseTime(time1)\n  const value2 = parseTime(time2)\n  const minutes1 = value1.minutes + value1.hours * 60\n  const minutes2 = value2.minutes + value2.hours * 60\n  if (minutes1 === minutes2) {\n    return 0\n  }\n  return minutes1 > minutes2 ? 1 : -1\n}\nconst formatTime = (time: Time): string => {\n  return `${time.hours < 10 ? `0${time.hours}` : time.hours}:${\n    time.minutes < 10 ? `0${time.minutes}` : time.minutes\n  }`\n}\nconst nextTime = (time: string, step: string): string => {\n  const timeValue = parseTime(time)\n  const stepValue = parseTime(step)\n  const next = {\n    hours: timeValue.hours,\n    minutes: timeValue.minutes,\n  }\n  next.minutes += stepValue.minutes\n  next.hours += stepValue.hours\n  next.hours += Math.floor(next.minutes / 60)\n  next.minutes = next.minutes % 60\n  return formatTime(next)\n}\n\nexport default defineComponent({\n  name: 'ElTimeSelect',\n  components: { ElSelect, ElOption, ElIcon },\n  model: {\n    prop: 'value',\n    event: 'change',\n  },\n  props: {\n    modelValue: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    editable: {\n      type: Boolean,\n      default: true,\n    },\n    clearable: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      default: 'default',\n      validator: (value: string) =>\n        !value || ['large', 'default', 'small'].indexOf(value) !== -1,\n    },\n    placeholder: {\n      type: String,\n      default: '',\n    },\n    start: {\n      type: String,\n      default: '09:00',\n    },\n    end: {\n      type: String,\n      default: '18:00',\n    },\n    step: {\n      type: String,\n      default: '00:30',\n    },\n    minTime: {\n      type: String,\n      default: '',\n    },\n    maxTime: {\n      type: String,\n      default: '',\n    },\n    name: {\n      type: String,\n      default: '',\n    },\n    prefixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: Clock,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n  },\n  emits: ['change', 'blur', 'focus', 'update:modelValue'],\n  setup(props) {\n    // computed\n    const select = ref(null)\n    const value = computed(() => props.modelValue)\n    const items = computed(() => {\n      const result = []\n      if (props.start && props.end && props.step) {\n        let current = props.start\n        while (compareTime(current, props.end) <= 0) {\n          result.push({\n            value: current,\n            disabled:\n              compareTime(current, props.minTime || '-1:-1') <= 0 ||\n              compareTime(current, props.maxTime || '100:100') >= 0,\n          })\n          current = nextTime(current, props.step)\n        }\n      }\n      return result\n    })\n    const blur = () => {\n      select.value?.blur?.()\n    }\n    const focus = () => {\n      select.value?.focus?.()\n    }\n\n    return {\n      select,\n      value,\n      items,\n      blur,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;wBACE;IACE;IACC,eAAa,UAAK;IAClB;IACA,WAAW;IACX;IACA;IACA;IACD;IACC,UAAU;IACV,kDAAqB,KAAK,eAAU;IACpC,yDAAwB,gBAAgB;;IAExC;;;;;;;;;;;;;;;sBAGC;;;eACM,KAAK;UACV;;;;;;;;"}
+{"version":3,"file":"time-select.vue_vue_type_template_id_5beb6389_lang.js","sources":["../../../../../../packages/components/time-select/src/time-select.vue?vue&type=template&id=5beb6389&lang.js"],"sourcesContent":["<template>\n  <el-select\n    ref=\"select\"\n    :model-value=\"value\"\n    :disabled=\"disabled\"\n    :clearable=\"clearable\"\n    :clear-icon=\"clearIcon\"\n    :size=\"size\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    @update:model-value=\"(event) => $emit('update:modelValue', event)\"\n    @change=\"(event) => $emit('change', event)\"\n    @blur=\"(event) => $emit('blur', event)\"\n    @focus=\"(event) => $emit('focus', event)\"\n  >\n    <el-option\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :label=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled\"\n    />\n    <template #prefix>\n      <el-icon v-if=\"prefixIcon\" class=\"el-input__prefix-icon\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\nimport ElSelect from '@element-plus/components/select'\nimport ElIcon from '@element-plus/components/icon'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\ndayjs.extend(customParseFormat)\n\nconst { Option: ElOption } = ElSelect\n\ninterface Time {\n  hours: number\n  minutes: number\n}\n\nconst parseTime = (time: string): null | Time => {\n  const values = (time || '').split(':')\n  if (values.length >= 2) {\n    let hours = parseInt(values[0], 10)\n    const minutes = parseInt(values[1], 10)\n    const timeUpper = time.toUpperCase()\n    if (timeUpper.includes('AM') && hours === 12) {\n      hours = 0\n    } else if (timeUpper.includes('PM') && hours !== 12) {\n      hours += 12\n    }\n    return {\n      hours,\n      minutes,\n    }\n  }\n  return null\n}\nconst compareTime = (time1: string, time2: string): number => {\n  const value1 = parseTime(time1)\n  const value2 = parseTime(time2)\n  const minutes1 = value1.minutes + value1.hours * 60\n  const minutes2 = value2.minutes + value2.hours * 60\n  if (minutes1 === minutes2) {\n    return 0\n  }\n  return minutes1 > minutes2 ? 1 : -1\n}\nconst padTime = (time: number | string) => {\n  return `${time}`.padStart(2, '0')\n}\nconst formatTime = (time: Time): string => {\n  return `${padTime(time.hours)}:${padTime(time.minutes)}`\n}\nconst nextTime = (time: string, step: string): string => {\n  const timeValue = parseTime(time)\n  const stepValue = parseTime(step)\n  const next = {\n    hours: timeValue.hours,\n    minutes: timeValue.minutes,\n  }\n  next.minutes += stepValue.minutes\n  next.hours += stepValue.hours\n  next.hours += Math.floor(next.minutes / 60)\n  next.minutes = next.minutes % 60\n  return formatTime(next)\n}\n\nexport default defineComponent({\n  name: 'ElTimeSelect',\n  components: { ElSelect, ElOption, ElIcon },\n  model: {\n    prop: 'value',\n    event: 'change',\n  },\n  props: {\n    format: {\n      type: String,\n      default: 'HH:mm',\n    },\n    modelValue: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    editable: {\n      type: Boolean,\n      default: true,\n    },\n    clearable: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      default: 'default',\n      validator: (value: string) =>\n        !value || ['large', 'default', 'small'].indexOf(value) !== -1,\n    },\n    placeholder: {\n      type: String,\n      default: '',\n    },\n    start: {\n      type: String,\n      default: '09:00',\n    },\n    end: {\n      type: String,\n      default: '18:00',\n    },\n    step: {\n      type: String,\n      default: '00:30',\n    },\n    minTime: {\n      type: String,\n      default: '',\n    },\n    maxTime: {\n      type: String,\n      default: '',\n    },\n    name: {\n      type: String,\n      default: '',\n    },\n    prefixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: Clock,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n  },\n  emits: ['change', 'blur', 'focus', 'update:modelValue'],\n  setup(props) {\n    // computed\n    const select = ref(null)\n    const value = computed(() => props.modelValue)\n    const start = computed(() => {\n      const time = parseTime(props.start)\n      return formatTime(time)\n    })\n    const end = computed(() => {\n      const time = parseTime(props.end)\n      return formatTime(time)\n    })\n    const step = computed(() => {\n      const time = parseTime(props.step)\n      return formatTime(time)\n    })\n    const minTime = computed(() => {\n      const time = parseTime(props.minTime)\n      return time ? formatTime(time) : null\n    })\n    const maxTime = computed(() => {\n      const time = parseTime(props.maxTime)\n      return time ? formatTime(time) : null\n    })\n    const items = computed(() => {\n      const result = []\n      if (props.start && props.end && props.step) {\n        let current = start.value\n        let currentTime\n        while (compareTime(current, end.value) <= 0) {\n          currentTime = dayjs(current, 'HH:mm').format(props.format)\n          result.push({\n            value: currentTime,\n            disabled:\n              compareTime(current, minTime.value || '-1:-1') <= 0 ||\n              compareTime(current, maxTime.value || '100:100') >= 0,\n          })\n          current = nextTime(current, step.value)\n        }\n      }\n      return result\n    })\n    const blur = () => {\n      select.value?.blur?.()\n    }\n    const focus = () => {\n      select.value?.focus?.()\n    }\n\n    return {\n      select,\n      value,\n      items,\n      blur,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;wBACE;IACE;IACC,eAAa,UAAK;IAClB;IACA,WAAW;IACX;IACA;IACA;IACD;IACC,UAAU;IACV,kDAAqB,KAAK,eAAU;IACpC,yDAAwB,gBAAgB;;IAExC;;;;;;;;;;;;;;;sBAGC;;;eACM,KAAK;UACV;;;;;;;;"}

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

@@ -11,6 +11,7 @@ export declare const ElTooltip: import("../../utils/types").SFCWithInstall<impor
     };
     virtualRef: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("..").Measurable>, unknown, unknown, unknown, unknown>;
     virtualTriggering: import("../../utils/props").BuildPropReturn<BooleanConstructor, unknown, unknown, unknown, unknown>;
+    appendTo: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<string | HTMLElement>, string | (() => string) | undefined, unknown, unknown, unknown>;
     content: import("../../utils/props").BuildPropReturn<StringConstructor, string | (() => string) | undefined, unknown, unknown, unknown>;
     rawContent: import("../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     persistent: BooleanConstructor;
@@ -187,6 +188,7 @@ export declare const ElTooltip: import("../../utils/types").SFCWithInstall<impor
     trigger?: unknown;
     virtualRef?: unknown;
     virtualTriggering?: unknown;
+    appendTo?: unknown;
     content?: unknown;
     rawContent?: unknown;
     persistent?: unknown;
@@ -284,6 +286,7 @@ export declare const ElTooltip: import("../../utils/types").SFCWithInstall<impor
     stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     showAfter: number;
     hideAfter: number;
+    appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
     rawContent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     persistent: boolean;
     teleported: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
@@ -370,6 +373,7 @@ export declare const ElTooltip: import("../../utils/types").SFCWithInstall<impor
     stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     showAfter: number;
     hideAfter: number;
+    appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
     rawContent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     persistent: boolean;
     teleported: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
@@ -381,4 +385,5 @@ export declare const ElTooltip: import("../../utils/types").SFCWithInstall<impor
     showArrow: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
 }>> & Record<string, any>;
 export * from './src/tooltip';
+export * from './src/tokens';
 export default ElTooltip;

package/lib/components/tooltip/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var withInstall = require('../../utils/with-install.js');
 require('./src/tooltip2.js');
 var tooltip = require('./src/tooltip.js');
+var tokens = require('./src/tokens.js');
 var tooltip_vue_vue_type_script_lang = require('./src/tooltip.vue_vue_type_script_lang.js');
 
 const ElTooltip = withInstall.withInstall(tooltip_vue_vue_type_script_lang["default"]);
@@ -12,6 +13,7 @@ const ElTooltip = withInstall.withInstall(tooltip_vue_vue_type_script_lang["defa
 exports.useTooltipContentProps = tooltip.useTooltipContentProps;
 exports.useTooltipProps = tooltip.useTooltipProps;
 exports.useTooltipTriggerProps = tooltip.useTooltipTriggerProps;
+exports.TOOLTIP_INJECTION_KEY = tokens.TOOLTIP_INJECTION_KEY;
 exports.ElTooltip = ElTooltip;
 exports["default"] = ElTooltip;
 //# sourceMappingURL=index.js.map

package/lib/components/tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/tooltip/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\nimport Tooltip from './src/tooltip.vue'\n\nexport const ElTooltip = withInstall(Tooltip)\nexport * from './src/tooltip'\nexport default ElTooltip\n"],"names":["withInstall","Tooltip"],"mappings":";;;;;;;;;AAEY,MAAC,SAAS,GAAGA,uBAAW,CAACC,2CAAO;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/tooltip/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\nimport Tooltip from './src/tooltip.vue'\n\nexport const ElTooltip = withInstall(Tooltip)\nexport * from './src/tooltip'\nexport * from './src/tokens'\nexport default ElTooltip\n"],"names":["withInstall","Tooltip"],"mappings":";;;;;;;;;;AAEY,MAAC,SAAS,GAAGA,uBAAW,CAACC,2CAAO;;;;;;;;;"}

package/lib/components/tooltip/src/content.vue.d.ts

@@ -1,5 +1,5 @@
-import { nextTick } from 'vue';
 declare const _default: import("vue").DefineComponent<{
+    appendTo: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | HTMLElement>, string | (() => string) | undefined, unknown, unknown, unknown>;
     content: import("../../../utils/props").BuildPropReturn<StringConstructor, string | (() => string) | undefined, unknown, unknown, unknown>;
     rawContent: import("../../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     persistent: BooleanConstructor;
@@ -7,6 +7,7 @@ declare const _default: import("vue").DefineComponent<{
     visible: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<boolean | null>, (() => null) | null | undefined, unknown, unknown, unknown>;
     transition: import("../../../utils/props").BuildPropReturn<StringConstructor, string | (() => string) | undefined, unknown, unknown, unknown>;
     teleported: import("../../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
+    disabled: import("../../../utils/props").BuildPropReturn<BooleanConstructor, boolean | (() => false) | (() => true) | undefined, unknown, unknown, unknown>;
     style: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<import("vue").StyleValue>, string | import("vue").CSSProperties | (() => string) | (() => import("vue").CSSProperties) | (() => import("vue").StyleValue[]) | undefined, unknown, unknown, unknown>;
     className: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | {
         [x: string]: any;
@@ -500,7 +501,7 @@ declare const _default: import("vue").DefineComponent<{
             errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
         };
         $forceUpdate: () => void;
-        $nextTick: typeof nextTick;
+        $nextTick: typeof import("vue").nextTick;
         $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
     } & Readonly<{
         style?: unknown;
@@ -621,15 +622,16 @@ declare const _default: import("vue").DefineComponent<{
         } | any)[])[])[])[])[])[])[])[])[])[])[])[]>;
         updatePopper: () => void;
     }> & {} & {} & import("vue").ComponentCustomProperties) | null>;
-    shouldRenderTeleport: import("vue").ComputedRef<boolean>;
-    shouldRenderPopperContent: import("vue").ComputedRef<boolean>;
-    shouldShowPopperContent: import("vue").ComputedRef<boolean>;
+    shouldRender: import("vue").ComputedRef<boolean>;
+    shouldShow: import("vue").ComputedRef<boolean>;
     open: import("vue").Ref<boolean>;
-    POPPER_CONTAINER_SELECTOR: string;
+    onAfterShow: () => void;
+    onBeforeEnter: () => void;
     onContentEnter: (event: unknown) => void;
     onContentLeave: (event: unknown) => void;
     onTransitionLeave: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    appendTo?: unknown;
     content?: unknown;
     rawContent?: unknown;
     persistent?: unknown;
@@ -637,6 +639,7 @@ declare const _default: import("vue").DefineComponent<{
     visible?: unknown;
     transition?: unknown;
     teleported?: unknown;
+    disabled?: unknown;
     style?: unknown;
     className?: unknown;
     effect?: unknown;
@@ -657,6 +660,7 @@ declare const _default: import("vue").DefineComponent<{
     showAfter?: unknown;
     hideAfter?: unknown;
 } & {
+    disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     style: import("vue").StyleValue;
     transition: string;
     offset: number;
@@ -726,6 +730,7 @@ declare const _default: import("vue").DefineComponent<{
     stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     showAfter: number;
     hideAfter: number;
+    appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
     rawContent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     persistent: boolean;
     teleported: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
@@ -733,6 +738,7 @@ declare const _default: import("vue").DefineComponent<{
     zIndex?: number | undefined;
     ariaLabel?: string | undefined;
 }>, {
+    disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     style: import("vue").StyleValue;
     transition: string;
     offset: number;
@@ -802,6 +808,7 @@ declare const _default: import("vue").DefineComponent<{
     stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     showAfter: number;
     hideAfter: number;
+    appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
     rawContent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     persistent: boolean;
     teleported: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;

package/lib/components/tooltip/src/content.vue_vue_type_script_lang.js

@@ -3,23 +3,20 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
+var core = require('@vueuse/core');
 require('../../popper/index.js');
 require('../../visual-hidden/index.js');
-var index = require('../../teleport/index.js');
 var dom = require('../../../utils/dom.js');
 require('../../../hooks/index.js');
 var tooltip = require('./tooltip.js');
 var tokens = require('./tokens.js');
 var content_vue_vue_type_script_lang = require('../../popper/src/content.vue_vue_type_script_lang.js');
 var visualHidden_vue_vue_type_script_lang = require('../../visual-hidden/src/visual-hidden.vue_vue_type_script_lang.js');
-var index$1 = require('../../../hooks/use-escape-keydown/index.js');
-var index$2 = require('../../../hooks/use-intermediate-render/index.js');
-var index$3 = require('../../../hooks/use-popper-container/index.js');
+var index = require('../../../hooks/use-escape-keydown/index.js');
 
 var script = vue.defineComponent({
   name: "ElTooltipContent",
   components: {
-    ElTeleport: index.ElTeleport,
     ElPopperContent: content_vue_vue_type_script_lang["default"],
     ElVisuallyHidden: visualHidden_vue_vue_type_script_lang["default"]
   },
@@ -37,76 +34,27 @@ var script = vue.defineComponent({
       }
       return props.persistent;
     });
+    const shouldRender = vue.computed(() => {
+      return vue.unref(persistentRef) ? true : vue.unref(open);
+    });
+    const shouldShow = vue.computed(() => {
+      return props.disabled ? false : vue.unref(open);
+    });
     const contentStyle = vue.computed(() => {
       var _a;
       return (_a = props.style) != null ? _a : {};
     });
-    const shouldRenderTeleport = vue.computed(() => {
-      if (vue.unref(persistentRef))
-        return true;
-      return vue.unref(vue.unref(entering) ? open : intermediateOpen);
-    });
-    const shouldRenderPopperContent = vue.computed(() => {
-      if (vue.unref(persistentRef))
-        return true;
-      return vue.unref(vue.unref(leaving) ? open : intermediateOpen);
-    });
-    const shouldShowPopperContent = vue.computed(() => {
-      if (vue.unref(persistentRef)) {
-        return vue.unref(vue.unref(leaving) ? open : intermediateOpen);
-      }
-      return true;
-    });
-    const ariaHidden = vue.computed(() => !(vue.unref(shouldRenderPopperContent) && vue.unref(shouldShowPopperContent)));
-    index$1.useEscapeKeydown(onClose);
-    index$2.useDelayedRender({
-      indicator: open,
-      intermediateIndicator: intermediateOpen,
-      shouldSetIntermediate: (step) => {
-        return step === "hide" ? false : true;
-      },
-      beforeShow: () => {
-        if (vue.unref(leaving)) {
-          leaving.value = false;
-          intermediateOpen.value = false;
-        }
-        entering.value = true;
-      },
-      beforeHide: () => {
-        if (vue.unref(entering)) {
-          entering.value = false;
-          return;
-        }
-        leaving.value = true;
-      },
-      afterShow: () => {
-        if (!vue.unref(open))
-          return;
-        entering.value = false;
-        onShow();
-        vue.nextTick(() => {
-          var _a;
-          (_a = vue.unref(contentRef)) == null ? void 0 : _a.updatePopper();
-        });
-      },
-      afterHide: () => {
-        if (vue.unref(open))
-          return;
-        onHide();
-      }
-    });
+    const ariaHidden = vue.computed(() => !vue.unref(open));
+    index.useEscapeKeydown(onClose);
     const onTransitionLeave = () => {
-      if (vue.unref(open))
-        return;
-      leaving.value = false;
-      intermediateOpen.value = false;
+      onHide();
     };
     const stopWhenControlled = () => {
       if (vue.unref(controlled))
         return true;
     };
     const onContentEnter = dom.composeEventHandlers(stopWhenControlled, () => {
-      if (props.enterable) {
+      if (props.enterable && vue.unref(trigger) === "hover") {
         onOpen();
       }
     });
@@ -115,6 +63,33 @@ var script = vue.defineComponent({
         onClose();
       }
     });
+    const onBeforeEnter = () => {
+      var _a, _b;
+      (_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
+    };
+    const onAfterShow = () => {
+      onShow();
+    };
+    let stopHandle;
+    vue.watch(() => vue.unref(open), (val) => {
+      if (val) {
+        stopHandle = core.onClickOutside(vue.computed(() => {
+          var _a;
+          return (_a = contentRef.value) == null ? void 0 : _a.popperContentRef;
+        }), () => {
+          if (vue.unref(controlled))
+            return;
+          const $trigger = vue.unref(trigger);
+          if ($trigger !== "hover") {
+            onClose();
+          }
+        });
+      } else {
+        stopHandle == null ? void 0 : stopHandle();
+      }
+    }, {
+      flush: "post"
+    });
     return {
       ariaHidden,
       entering,
@@ -123,11 +98,11 @@ var script = vue.defineComponent({
       intermediateOpen,
       contentStyle,
       contentRef,
-      shouldRenderTeleport,
-      shouldRenderPopperContent,
-      shouldShowPopperContent,
+      shouldRender,
+      shouldShow,
       open,
-      POPPER_CONTAINER_SELECTOR: index$3.POPPER_CONTAINER_SELECTOR,
+      onAfterShow,
+      onBeforeEnter,
       onContentEnter,
       onContentLeave,
       onTransitionLeave

package/lib/components/tooltip/src/content.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"content.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/tooltip/src/content.vue"],"sourcesContent":["<template>\n  <el-teleport\n    v-if=\"shouldRenderTeleport\"\n    :disabled=\"!teleported\"\n    :container=\"POPPER_CONTAINER_SELECTOR\"\n  >\n    <transition :name=\"transition\" @after-leave=\"onTransitionLeave\">\n      <el-popper-content\n        v-if=\"shouldRenderPopperContent\"\n        v-show=\"shouldShowPopperContent\"\n        ref=\"contentRef\"\n        v-bind=\"$attrs\"\n        :aria-hidden=\"ariaHidden\"\n        :boundaries-padding=\"boundariesPadding\"\n        :fallback-placements=\"fallbackPlacements\"\n        :gpu-acceleration=\"gpuAcceleration\"\n        :offset=\"offset\"\n        :placement=\"placement\"\n        :popper-options=\"popperOptions\"\n        :strategy=\"strategy\"\n        :effect=\"effect\"\n        :enterable=\"enterable\"\n        :pure=\"pure\"\n        :popper-class=\"popperClass\"\n        :popper-style=\"[popperStyle, contentStyle]\"\n        :reference-el=\"referenceEl\"\n        :z-index=\"zIndex\"\n        @mouseenter=\"onContentEnter\"\n        @mouseleave=\"onContentLeave\"\n      >\n        <slot />\n        <el-visually-hidden :id=\"id\" role=\"tooltip\">\n          {{ ariaLabel }}\n        </el-visually-hidden>\n      </el-popper-content>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, nextTick, ref, unref } from 'vue'\nimport { ElPopperContent } from '@element-plus/components/popper'\nimport { ElVisuallyHidden } from '@element-plus/components/visual-hidden'\nimport { ElTeleport } from '@element-plus/components/teleport'\nimport { composeEventHandlers } from '@element-plus/utils/dom'\nimport {\n  useEscapeKeydown,\n  POPPER_CONTAINER_SELECTOR,\n  useDelayedRender,\n} from '@element-plus/hooks'\n\nimport { useTooltipContentProps } from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n  name: 'ElTooltipContent',\n  components: {\n    ElTeleport,\n    ElPopperContent,\n    ElVisuallyHidden,\n  },\n  inheritAttrs: false,\n  props: useTooltipContentProps,\n  setup(props) {\n    const contentRef = ref<InstanceType<typeof ElPopperContent> | null>(null)\n    const intermediateOpen = ref(false)\n    const entering = ref(false)\n    const leaving = ref(false)\n    const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide } =\n      inject(TOOLTIP_INJECTION_KEY, undefined)!\n    const persistentRef = computed(() => {\n      // For testing, we would always want the content to be rendered\n      // to the DOM, so we need to return true here.\n      if (process.env.NODE_ENV === 'test') {\n        return true\n      }\n      return props.persistent\n    })\n\n    const contentStyle = computed(() => (props.style ?? {}) as any)\n    const shouldRenderTeleport = computed(() => {\n      if (unref(persistentRef)) return true\n      return unref(unref(entering) ? open : intermediateOpen)\n    })\n\n    const shouldRenderPopperContent = computed(() => {\n      if (unref(persistentRef)) return true\n      return unref(unref(leaving) ? open : intermediateOpen)\n    })\n\n    const shouldShowPopperContent = computed(() => {\n      // This is for control persistent mode transition\n      // When persistent this element will always be rendered, we simply use v-show to control the transition\n      if (unref(persistentRef)) {\n        return unref(unref(leaving) ? open : intermediateOpen)\n      }\n      return true\n    })\n\n    const ariaHidden = computed(\n      () =>\n        !(unref(shouldRenderPopperContent) && unref(shouldShowPopperContent))\n    )\n\n    useEscapeKeydown(onClose)\n\n    useDelayedRender({\n      indicator: open,\n      intermediateIndicator: intermediateOpen,\n      shouldSetIntermediate: (step) => {\n        // we don't want to set the intermediateOpen because we want the transition to finish.\n        // After transition finishes, with the hook after-leave we can call intermediate.value = false\n        return step === 'hide' ? false : true\n      },\n      beforeShow: () => {\n        // indicates interruption of hide transition\n        if (unref(leaving)) {\n          leaving.value = false\n          intermediateOpen.value = false\n        }\n        entering.value = true\n      },\n      beforeHide: () => {\n        // indicates interruption of show transition\n        if (unref(entering)) {\n          entering.value = false\n          return\n        }\n        leaving.value = true\n      },\n      afterShow: () => {\n        if (!unref(open)) return\n        entering.value = false\n        onShow()\n        nextTick(() => {\n          unref(contentRef)?.updatePopper()\n        })\n      },\n      afterHide: () => {\n        if (unref(open)) return\n        // prevent the content from hiding if it's still open\n        onHide()\n      },\n    })\n\n    const onTransitionLeave = () => {\n      if (unref(open)) return\n      leaving.value = false\n      intermediateOpen.value = false\n    }\n\n    const stopWhenControlled = () => {\n      if (unref(controlled)) return true\n    }\n\n    const onContentEnter = composeEventHandlers(stopWhenControlled, () => {\n      if (props.enterable) {\n        onOpen()\n      }\n    })\n\n    const onContentLeave = composeEventHandlers(stopWhenControlled, () => {\n      if (unref(trigger) === 'hover') {\n        onClose()\n      }\n    })\n\n    return {\n      ariaHidden,\n      entering,\n      leaving,\n      id,\n      intermediateOpen,\n      contentStyle,\n      contentRef,\n      shouldRenderTeleport,\n      shouldRenderPopperContent,\n      shouldShowPopperContent,\n      open,\n      POPPER_CONTAINER_SELECTOR,\n      onContentEnter,\n      onContentLeave,\n      onTransitionLeave,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElTeleport","ElPopperContent","ElVisuallyHidden","useTooltipContentProps","ref","computed","unref","nextTick","composeEventHandlers","POPPER_CONTAINER_SELECTOR"],"mappings":";;;;;;;;;;;;;;;;;;AAmDA,aAAeA,mBAAe;AAC9B,EAAE,wBAAwB;;AAE1B,gBAAIC;qBACAC,2CAAe;sBACfC;;cAEU,EAAE;OACT,EAAEC;EACP;IACE,MAAM,UAAU;IAChB,MAAM,gBAAgB,GAAGC;IACzB,MAAM;IACN,MAAM,OAAO,UAAM,CAAC,KAAK,CAAC,CAAC;IAC3B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE;IAC9B,MAAM,aAAa,GAAGC;MACpB,IAAI,QAAQ,GAAG,CAAC;QACd,OAAO,IAAI,CAAC;OACb;MACD,OAAO,KAAK,CAAC,UAAU,CAAC;MACxB,CAAC;UACG,YAAY,GAAGA,YAAQ,OAAO;MAClC,IAAI,EAAE,CAAC;aACA,GAAG;MACV;UACI;;;MAGJ,OAAOC,SAAK,CAACA,UAAM,QAAQ,CAAC,GAAG,IAAI,GAAG,gBAAgB,CAAC;KACxD,CAAC,CAAC;UACG,yBAAyB;MAC7B,IAAIA,SAAK,CAAC,aAAa,CAAC;;;KAGzB,CAAC,CAAC;UACG,uBAAuB,GAAGD;MAC9B,IAAIC,SAAK,CAAC,aAAa,CAAC,EAAE;;;MAG1B,OAAO,IAAI,CAAC;MACZ,CAAC;UACG,UAAU,GAAGD,YAAQ,CAAC,MAAM,EAAEC,SAAK,CAAC,yBAAyB,cAAU,CAAC,uBAAuB,CAAC,CAAC,CAAC;4BACxF,CAAC,OAAO,CAAC,CAAC;4BACV,CAAC;MACf;MACA;;;OAGC;MACD;QACE,IAAIA,SAAK,CAAC,OAAO,CAAC,EAAE;;;SAGnB;;OAEF;MACD,YAAY;QACV,IAAIA,SAAK,CAAC,QAAQ,CAAC,EAAE;UACnB,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAC;iBAChB;SACR;QACD,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC;OACtB;MACD,SAAS;QACP,IAAI,CAACA,SAAK,CAAC,IAAI,CAAC;iBACP;gBACD,CAAC,KAAK,QAAQ;cAChB,EAAE,CAAC;QACTC;UACE,IAAI,EAAE,CAAC;;SAER,CAAC,CAAC;;eAEI,EAAE,MAAM;YACXD,SAAK,CAAC,IAAI,CAAC;UACb;QACF;;MAEF,CAAC;UACG;mBACK,CAAC,IAAI,CAAC;QACb,OAAO;aACF,CAAC;uBACS;;;MAGjB;QACE,OAAO,KAAK;;wBAEI,GAAGE,wBAAoB,CAAC;UACtC,KAAK;;;;IAIX,MAAM,cAAc;MAClB,IAAIF,SAAK,CAAC,OAAO,CAAC;QAChB,OAAO,EAAE,CAAC;OACX;;;MAGD,UAAU;MACV,QAAQ;;;MAGR,gBAAgB;MAChB,YAAY;;MAEZ;;;MAGA,IAAI;iCACJG,iCAAyB;;MAEzB;;;;;;;;"}
+{"version":3,"file":"content.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/tooltip/src/content.vue"],"sourcesContent":["<template>\n  <teleport :disabled=\"!teleported\" :to=\"appendTo\">\n    <transition\n      :name=\"transition\"\n      @after-leave=\"onTransitionLeave\"\n      @before-enter=\"onBeforeEnter\"\n      @after-enter=\"onAfterShow\"\n    >\n      <el-popper-content\n        v-if=\"shouldRender\"\n        v-show=\"shouldShow\"\n        ref=\"contentRef\"\n        v-bind=\"$attrs\"\n        :aria-hidden=\"ariaHidden\"\n        :boundaries-padding=\"boundariesPadding\"\n        :fallback-placements=\"fallbackPlacements\"\n        :gpu-acceleration=\"gpuAcceleration\"\n        :offset=\"offset\"\n        :placement=\"placement\"\n        :popper-options=\"popperOptions\"\n        :strategy=\"strategy\"\n        :effect=\"effect\"\n        :enterable=\"enterable\"\n        :pure=\"pure\"\n        :popper-class=\"popperClass\"\n        :popper-style=\"[popperStyle, contentStyle]\"\n        :reference-el=\"referenceEl\"\n        :z-index=\"zIndex\"\n        @mouseenter=\"onContentEnter\"\n        @mouseleave=\"onContentLeave\"\n      >\n        <slot />\n        <el-visually-hidden :id=\"id\" role=\"tooltip\">\n          {{ ariaLabel }}\n        </el-visually-hidden>\n      </el-popper-content>\n    </transition>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, inject, ref, unref, watch } from 'vue'\nimport { onClickOutside } from '@vueuse/core'\nimport { ElPopperContent } from '@element-plus/components/popper'\nimport { ElVisuallyHidden } from '@element-plus/components/visual-hidden'\nimport { composeEventHandlers } from '@element-plus/utils/dom'\nimport { useEscapeKeydown } from '@element-plus/hooks'\n\nimport { useTooltipContentProps } from './tooltip'\nimport { TOOLTIP_INJECTION_KEY } from './tokens'\n\nexport default defineComponent({\n  name: 'ElTooltipContent',\n  components: {\n    ElPopperContent,\n    ElVisuallyHidden,\n  },\n  inheritAttrs: false,\n  props: useTooltipContentProps,\n  setup(props) {\n    const contentRef = ref<InstanceType<typeof ElPopperContent> | null>(null)\n    const intermediateOpen = ref(false)\n    const entering = ref(false)\n    const leaving = ref(false)\n    const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide } =\n      inject(TOOLTIP_INJECTION_KEY, undefined)!\n    const persistentRef = computed(() => {\n      // For testing, we would always want the content to be rendered\n      // to the DOM, so we need to return true here.\n      if (process.env.NODE_ENV === 'test') {\n        return true\n      }\n      return props.persistent\n    })\n\n    const shouldRender = computed(() => {\n      return unref(persistentRef) ? true : unref(open)\n    })\n\n    const shouldShow = computed(() => {\n      return props.disabled ? false : unref(open)\n    })\n\n    const contentStyle = computed(() => (props.style ?? {}) as any)\n\n    const ariaHidden = computed(() => !unref(open))\n\n    useEscapeKeydown(onClose)\n\n    const onTransitionLeave = () => {\n      onHide()\n    }\n\n    const stopWhenControlled = () => {\n      if (unref(controlled)) return true\n    }\n\n    const onContentEnter = composeEventHandlers(stopWhenControlled, () => {\n      if (props.enterable && unref(trigger) === 'hover') {\n        onOpen()\n      }\n    })\n\n    const onContentLeave = composeEventHandlers(stopWhenControlled, () => {\n      if (unref(trigger) === 'hover') {\n        onClose()\n      }\n    })\n\n    const onBeforeEnter = () => {\n      contentRef.value?.updatePopper?.()\n    }\n\n    const onAfterShow = () => {\n      onShow()\n    }\n\n    let stopHandle: ReturnType<typeof onClickOutside>\n\n    watch(\n      () => unref(open),\n      (val) => {\n        if (val) {\n          stopHandle = onClickOutside(\n            computed(() => {\n              return contentRef.value?.popperContentRef\n            }),\n            () => {\n              if (unref(controlled)) return\n              const $trigger = unref(trigger)\n              if ($trigger !== 'hover') {\n                onClose()\n              }\n            }\n          )\n        } else {\n          stopHandle?.()\n        }\n      },\n      {\n        flush: 'post',\n      }\n    )\n\n    return {\n      ariaHidden,\n      entering,\n      leaving,\n      id,\n      intermediateOpen,\n      contentStyle,\n      contentRef,\n      shouldRender,\n      shouldShow,\n      open,\n      onAfterShow,\n      onBeforeEnter,\n      onContentEnter,\n      onContentLeave,\n      onTransitionLeave,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElPopperContent","ElVisuallyHidden","useTooltipContentProps","ref","computed","unref","useEscapeKeydown","composeEventHandlers"],"mappings":";;;;;;;;;;;;;;;;AAgDA,aAAeA,mBAAe;AAC9B,EAAE,wBAAwB;;AAE1B,qBAAIC,2CAAe;sBACfC,gDAAgB;GACjB;cACW,EAAE;OACT,EAAEC;EACP;IACE,MAAM,UAAU;IAChB,MAAM,gBAAgB,GAAGC;IACzB,MAAM;IACN,MAAM,OAAO,UAAM,CAAC,KAAK,CAAC,CAAC;IAC3B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE;IAC9B,MAAM,aAAa,GAAGC;MACpB,IAAI,QAAQ,GAAG,CAAC;QACd,OAAO,IAAI,CAAC;OACb;MACD,OAAO,KAAK,CAAC,UAAU,CAAC;MACxB,CAAC;UACG,YAAY,GAAGA,YAAQ,OAAO;MAClC,OAAOC,SAAK,CAAC,aAAa,CAAC,GAAG,IAAI,GAAGA;;;MAGrC,OAAO,KAAK,CAAC,QAAQ;KACtB;;MAEC,IAAI,EAAE,CAAC;MACP,OAAO,CAAC,EAAE,GAAG,KAAK,CAAC,KAAK,SAAS,KAAK,GAAG,EAAE,CAAC;KAC7C;;IAEDC,uBAAiB,OAAO,CAAC,CAAC;UACpB,oBAAoB,MAAM;;;IAGhC,MAAM,kBAAkB,GAAG,MAAM;;QAE7B,OAAO,IAAI;;IAEf,MAAM,cAAc,GAAGC;;QAEnB,MAAM,EAAE,CAAC;OACV;;;MAGD,IAAIF,SAAK,CAAC,OAAO,CAAC,KAAK;eACd,EAAE,CAAC;;;IAGd,MAAM,aAAa,SAAS;MAC1B,IAAI,EAAE,EAAE,EAAE,CAAC;SACR,GAAG,CAAC,EAAE;MACT;IACF;;KAEC,CAAC;kBACY,CAAC;aACV,CAAC,MAAMA;MACV;;;UAGI,OAAO,CAAC,EAAE;SACX,CAAC,EAAE,MAAM;;;UAGR,MAAM,QAAQ,GAAGA;UACjB;;;SAGD,CAAC,CAAC;;QAEH;OACD;OACA;WACI,EAAE;;;gBAGG;cACF;aACD;;sBAES;kBACJ;gBACF;;;UAGN;;mBAES;;MAEb;MACA;;;;;;;"}