@element-plus/nightly 0.0.20240920 → 0.0.20240922

package/es/components/time-select/src/time-select.mjs

@@ -1,56 +1,129 @@
-import '../../../utils/index.mjs';
-import { Clock, CircleClose } from '@element-plus/icons-vue';
+import { defineComponent, ref, computed, openBlock, createBlock, unref, withCtx, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, Fragment, renderList } from 'vue';
+import dayjs from 'dayjs';
+import customParseFormat from 'dayjs/plugin/customParseFormat.js';
+import { ElSelect } from '../../select/index.mjs';
+import '../../form/index.mjs';
+import { ElIcon } from '../../icon/index.mjs';
 import '../../../hooks/index.mjs';
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
-import { useSizeProp } from '../../../hooks/use-size/index.mjs';
-import { useEmptyValuesProps } from '../../../hooks/use-empty-values/index.mjs';
+import { timeSelectProps } from './time-select2.mjs';
+import { parseTime, formatTime, compareTime, nextTime } from './utils.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { useFormDisabled } from '../../form/src/hooks/use-form-common-props.mjs';
+import { useLocale } from '../../../hooks/use-locale/index.mjs';
 
-const timeSelectProps = buildProps({
-  format: {
-    type: String,
-    default: "HH:mm"
-  },
-  modelValue: String,
-  disabled: Boolean,
-  editable: {
-    type: Boolean,
-    default: true
-  },
-  effect: {
-    type: definePropType(String),
-    default: "light"
-  },
-  clearable: {
-    type: Boolean,
-    default: true
-  },
-  size: useSizeProp,
-  placeholder: String,
-  start: {
-    type: String,
-    default: "09:00"
-  },
-  end: {
-    type: String,
-    default: "18:00"
-  },
-  step: {
-    type: String,
-    default: "00:30"
-  },
-  minTime: String,
-  maxTime: String,
-  name: String,
-  prefixIcon: {
-    type: definePropType([String, Object]),
-    default: () => Clock
-  },
-  clearIcon: {
-    type: definePropType([String, Object]),
-    default: () => CircleClose
-  },
-  ...useEmptyValuesProps
+const __default__ = defineComponent({
+  name: "ElTimeSelect"
 });
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: timeSelectProps,
+  emits: ["change", "blur", "focus", "clear", "update:modelValue"],
+  setup(__props, { expose }) {
+    const props = __props;
+    dayjs.extend(customParseFormat);
+    const { Option: ElOption } = ElSelect;
+    const nsInput = useNamespace("input");
+    const select = ref();
+    const _disabled = useFormDisabled();
+    const { lang } = useLocale();
+    const value = computed(() => props.modelValue);
+    const start = computed(() => {
+      const time = parseTime(props.start);
+      return time ? formatTime(time) : null;
+    });
+    const end = computed(() => {
+      const time = parseTime(props.end);
+      return time ? formatTime(time) : null;
+    });
+    const step = computed(() => {
+      const time = parseTime(props.step);
+      return time ? formatTime(time) : null;
+    });
+    const minTime = computed(() => {
+      const time = parseTime(props.minTime || "");
+      return time ? formatTime(time) : null;
+    });
+    const maxTime = computed(() => {
+      const time = parseTime(props.maxTime || "");
+      return time ? formatTime(time) : null;
+    });
+    const items = computed(() => {
+      const result = [];
+      if (props.start && props.end && props.step) {
+        let current = start.value;
+        let currentTime;
+        while (current && end.value && compareTime(current, end.value) <= 0) {
+          currentTime = dayjs(current, "HH:mm").locale(lang.value).format(props.format);
+          result.push({
+            value: currentTime,
+            disabled: compareTime(current, minTime.value || "-1:-1") <= 0 || compareTime(current, maxTime.value || "100:100") >= 0
+          });
+          current = nextTime(current, step.value);
+        }
+      }
+      return result;
+    });
+    const blur = () => {
+      var _a, _b;
+      (_b = (_a = select.value) == null ? void 0 : _a.blur) == null ? void 0 : _b.call(_a);
+    };
+    const focus = () => {
+      var _a, _b;
+      (_b = (_a = select.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+    };
+    expose({
+      blur,
+      focus
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ElSelect), {
+        ref_key: "select",
+        ref: select,
+        "model-value": unref(value),
+        disabled: unref(_disabled),
+        clearable: _ctx.clearable,
+        "clear-icon": _ctx.clearIcon,
+        size: _ctx.size,
+        effect: _ctx.effect,
+        placeholder: _ctx.placeholder,
+        "default-first-option": "",
+        filterable: _ctx.editable,
+        "empty-values": _ctx.emptyValues,
+        "value-on-clear": _ctx.valueOnClear,
+        "onUpdate:modelValue": (event) => _ctx.$emit("update:modelValue", event),
+        onChange: (event) => _ctx.$emit("change", event),
+        onBlur: (event) => _ctx.$emit("blur", event),
+        onFocus: (event) => _ctx.$emit("focus", event),
+        onClear: () => _ctx.$emit("clear")
+      }, {
+        prefix: withCtx(() => [
+          _ctx.prefixIcon ? (openBlock(), createBlock(unref(ElIcon), {
+            key: 0,
+            class: normalizeClass(unref(nsInput).e("prefix-icon"))
+          }, {
+            default: withCtx(() => [
+              (openBlock(), createBlock(resolveDynamicComponent(_ctx.prefixIcon)))
+            ]),
+            _: 1
+          }, 8, ["class"])) : createCommentVNode("v-if", true)
+        ]),
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(items), (item) => {
+            return openBlock(), createBlock(unref(ElOption), {
+              key: item.value,
+              label: item.value,
+              value: item.value,
+              disabled: item.disabled
+            }, null, 8, ["label", "value", "disabled"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 8, ["model-value", "disabled", "clearable", "clear-icon", "size", "effect", "placeholder", "filterable", "empty-values", "value-on-clear", "onUpdate:modelValue", "onChange", "onBlur", "onFocus", "onClear"]);
+    };
+  }
+});
+var TimeSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "time-select.vue"]]);
 
-export { timeSelectProps };
+export { TimeSelect as default };
 //# sourceMappingURL=time-select.mjs.map

package/es/components/time-select/src/time-select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"time-select.mjs","sources":["../../../../../../packages/components/time-select/src/time-select.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\nimport { useEmptyValuesProps, useSizeProp } from '@element-plus/hooks'\nimport type { PopperEffect } from '@element-plus/components/popper'\nimport type TimeSelect from './time-select.vue'\nimport type { Component, ExtractPropTypes } from 'vue'\n\nexport const timeSelectProps = buildProps({\n  /**\n   * @description set format of time\n   */\n  format: {\n    type: String,\n    default: 'HH:mm',\n  },\n  /**\n   * @description binding value\n   */\n  modelValue: String,\n  /**\n   * @description whether TimeSelect is disabled\n   */\n  disabled: Boolean,\n  /**\n   * @description whether the input is editable\n   */\n  editable: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description Tooltip theme, built-in theme: `dark` / `light`\n   */\n  effect: {\n    type: definePropType<PopperEffect | string>(String),\n    default: 'light',\n  },\n  /**\n   * @description whether to show clear button\n   */\n  clearable: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description size of Input\n   */\n  size: useSizeProp,\n  /**\n   * @description placeholder in non-range mode\n   */\n  placeholder: String,\n  /**\n   * @description start time\n   */\n  start: {\n    type: String,\n    default: '09:00',\n  },\n  /**\n   * @description end time\n   */\n  end: {\n    type: String,\n    default: '18:00',\n  },\n  /**\n   * @description time step\n   */\n  step: {\n    type: String,\n    default: '00:30',\n  },\n  /**\n   * @description minimum time, any time before this time will be disabled\n   */\n  minTime: String,\n  /**\n   * @description maximum time, any time after this time will be disabled\n   */\n  maxTime: String,\n  /**\n   * @description same as `name` in native input\n   */\n  name: String,\n  /**\n   * @description custom prefix icon component\n   */\n  prefixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: () => Clock,\n  },\n  /**\n   * @description custom clear icon component\n   */\n  clearIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: () => CircleClose,\n  },\n  ...useEmptyValuesProps,\n} as const)\n\nexport type TimeSelectProps = ExtractPropTypes<typeof timeSelectProps>\n\nexport type TimeSelectInstance = InstanceType<typeof TimeSelect>\n"],"names":[],"mappings":";;;;;;;AAGY,MAAC,eAAe,GAAG,UAAU,CAAC;AAC1C,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,UAAU,EAAE,MAAM;AACpB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,OAAO,EAAE,MAAM;AACjB,EAAE,OAAO,EAAE,MAAM;AACjB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAM,KAAK;AACxB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAM,WAAW;AAC9B,GAAG;AACH,EAAE,GAAG,mBAAmB;AACxB,CAAC;;;;"}
+{"version":3,"file":"time-select.mjs","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    :effect=\"effect\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    :empty-values=\"emptyValues\"\n    :value-on-clear=\"valueOnClear\"\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    @clear=\"() => $emit('clear')\"\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=\"nsInput.e('prefix-icon')\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat.js'\nimport ElSelect from '@element-plus/components/select'\nimport { useFormDisabled } from '@element-plus/components/form'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { timeSelectProps } from './time-select'\nimport { compareTime, formatTime, nextTime, parseTime } from './utils'\n\ndayjs.extend(customParseFormat)\n\nconst { Option: ElOption } = ElSelect\n\ndefineOptions({\n  name: 'ElTimeSelect',\n})\n\ndefineEmits(['change', 'blur', 'focus', 'clear', 'update:modelValue'])\n\nconst props = defineProps(timeSelectProps)\n\nconst nsInput = useNamespace('input')\nconst select = ref<typeof ElSelect>()\n\nconst _disabled = useFormDisabled()\nconst { lang } = useLocale()\n\nconst value = computed(() => props.modelValue)\nconst start = computed(() => {\n  const time = parseTime(props.start)\n  return time ? formatTime(time) : null\n})\n\nconst end = computed(() => {\n  const time = parseTime(props.end)\n  return time ? formatTime(time) : null\n})\n\nconst step = computed(() => {\n  const time = parseTime(props.step)\n  return time ? formatTime(time) : null\n})\n\nconst minTime = computed(() => {\n  const time = parseTime(props.minTime || '')\n  return time ? formatTime(time) : null\n})\n\nconst maxTime = computed(() => {\n  const time = parseTime(props.maxTime || '')\n  return time ? formatTime(time) : null\n})\n\nconst items = computed(() => {\n  const result: { value: string; disabled: boolean }[] = []\n  if (props.start && props.end && props.step) {\n    let current = start.value\n    let currentTime: string\n    while (current && end.value && compareTime(current, end.value) <= 0) {\n      currentTime = dayjs(current, 'HH:mm')\n        .locale(lang.value)\n        .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\nconst blur = () => {\n  select.value?.blur?.()\n}\n\nconst focus = () => {\n  select.value?.focus?.()\n}\n\ndefineExpose({\n  /**\n   * @description focus the Input component\n   */\n  blur,\n  /**\n   * @description blur the Input component\n   */\n  focus,\n})\n</script>\n"],"names":[],"mappings":"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"}

package/es/components/time-select/src/time-select2.mjs

@@ -1,129 +1,56 @@
-import { defineComponent, ref, computed, openBlock, createBlock, unref, withCtx, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, Fragment, renderList } from 'vue';
-import dayjs from 'dayjs';
-import customParseFormat from 'dayjs/plugin/customParseFormat.js';
-import { ElSelect } from '../../select/index.mjs';
-import '../../form/index.mjs';
-import { ElIcon } from '../../icon/index.mjs';
+import '../../../utils/index.mjs';
+import { Clock, CircleClose } from '@element-plus/icons-vue';
 import '../../../hooks/index.mjs';
-import { timeSelectProps } from './time-select.mjs';
-import { parseTime, formatTime, compareTime, nextTime } from './utils.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { useFormDisabled } from '../../form/src/hooks/use-form-common-props.mjs';
-import { useLocale } from '../../../hooks/use-locale/index.mjs';
+import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
+import { useSizeProp } from '../../../hooks/use-size/index.mjs';
+import { useEmptyValuesProps } from '../../../hooks/use-empty-values/index.mjs';
 
-const __default__ = defineComponent({
-  name: "ElTimeSelect"
+const timeSelectProps = buildProps({
+  format: {
+    type: String,
+    default: "HH:mm"
+  },
+  modelValue: String,
+  disabled: Boolean,
+  editable: {
+    type: Boolean,
+    default: true
+  },
+  effect: {
+    type: definePropType(String),
+    default: "light"
+  },
+  clearable: {
+    type: Boolean,
+    default: true
+  },
+  size: useSizeProp,
+  placeholder: String,
+  start: {
+    type: String,
+    default: "09:00"
+  },
+  end: {
+    type: String,
+    default: "18:00"
+  },
+  step: {
+    type: String,
+    default: "00:30"
+  },
+  minTime: String,
+  maxTime: String,
+  name: String,
+  prefixIcon: {
+    type: definePropType([String, Object]),
+    default: () => Clock
+  },
+  clearIcon: {
+    type: definePropType([String, Object]),
+    default: () => CircleClose
+  },
+  ...useEmptyValuesProps
 });
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: timeSelectProps,
-  emits: ["change", "blur", "focus", "clear", "update:modelValue"],
-  setup(__props, { expose }) {
-    const props = __props;
-    dayjs.extend(customParseFormat);
-    const { Option: ElOption } = ElSelect;
-    const nsInput = useNamespace("input");
-    const select = ref();
-    const _disabled = useFormDisabled();
-    const { lang } = useLocale();
-    const value = computed(() => props.modelValue);
-    const start = computed(() => {
-      const time = parseTime(props.start);
-      return time ? formatTime(time) : null;
-    });
-    const end = computed(() => {
-      const time = parseTime(props.end);
-      return time ? formatTime(time) : null;
-    });
-    const step = computed(() => {
-      const time = parseTime(props.step);
-      return time ? formatTime(time) : null;
-    });
-    const minTime = computed(() => {
-      const time = parseTime(props.minTime || "");
-      return time ? formatTime(time) : null;
-    });
-    const maxTime = computed(() => {
-      const time = parseTime(props.maxTime || "");
-      return time ? formatTime(time) : null;
-    });
-    const items = computed(() => {
-      const result = [];
-      if (props.start && props.end && props.step) {
-        let current = start.value;
-        let currentTime;
-        while (current && end.value && compareTime(current, end.value) <= 0) {
-          currentTime = dayjs(current, "HH:mm").locale(lang.value).format(props.format);
-          result.push({
-            value: currentTime,
-            disabled: compareTime(current, minTime.value || "-1:-1") <= 0 || compareTime(current, maxTime.value || "100:100") >= 0
-          });
-          current = nextTime(current, step.value);
-        }
-      }
-      return result;
-    });
-    const blur = () => {
-      var _a, _b;
-      (_b = (_a = select.value) == null ? void 0 : _a.blur) == null ? void 0 : _b.call(_a);
-    };
-    const focus = () => {
-      var _a, _b;
-      (_b = (_a = select.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
-    };
-    expose({
-      blur,
-      focus
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(ElSelect), {
-        ref_key: "select",
-        ref: select,
-        "model-value": unref(value),
-        disabled: unref(_disabled),
-        clearable: _ctx.clearable,
-        "clear-icon": _ctx.clearIcon,
-        size: _ctx.size,
-        effect: _ctx.effect,
-        placeholder: _ctx.placeholder,
-        "default-first-option": "",
-        filterable: _ctx.editable,
-        "empty-values": _ctx.emptyValues,
-        "value-on-clear": _ctx.valueOnClear,
-        "onUpdate:modelValue": (event) => _ctx.$emit("update:modelValue", event),
-        onChange: (event) => _ctx.$emit("change", event),
-        onBlur: (event) => _ctx.$emit("blur", event),
-        onFocus: (event) => _ctx.$emit("focus", event),
-        onClear: () => _ctx.$emit("clear")
-      }, {
-        prefix: withCtx(() => [
-          _ctx.prefixIcon ? (openBlock(), createBlock(unref(ElIcon), {
-            key: 0,
-            class: normalizeClass(unref(nsInput).e("prefix-icon"))
-          }, {
-            default: withCtx(() => [
-              (openBlock(), createBlock(resolveDynamicComponent(_ctx.prefixIcon)))
-            ]),
-            _: 1
-          }, 8, ["class"])) : createCommentVNode("v-if", true)
-        ]),
-        default: withCtx(() => [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(items), (item) => {
-            return openBlock(), createBlock(unref(ElOption), {
-              key: item.value,
-              label: item.value,
-              value: item.value,
-              disabled: item.disabled
-            }, null, 8, ["label", "value", "disabled"]);
-          }), 128))
-        ]),
-        _: 1
-      }, 8, ["model-value", "disabled", "clearable", "clear-icon", "size", "effect", "placeholder", "filterable", "empty-values", "value-on-clear", "onUpdate:modelValue", "onChange", "onBlur", "onFocus", "onClear"]);
-    };
-  }
-});
-var TimeSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "time-select.vue"]]);
 
-export { TimeSelect as default };
+export { timeSelectProps };
 //# sourceMappingURL=time-select2.mjs.map

package/es/components/time-select/src/time-select2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"time-select2.mjs","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    :effect=\"effect\"\n    :placeholder=\"placeholder\"\n    default-first-option\n    :filterable=\"editable\"\n    :empty-values=\"emptyValues\"\n    :value-on-clear=\"valueOnClear\"\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    @clear=\"() => $emit('clear')\"\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=\"nsInput.e('prefix-icon')\">\n        <component :is=\"prefixIcon\" />\n      </el-icon>\n    </template>\n  </el-select>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat.js'\nimport ElSelect from '@element-plus/components/select'\nimport { useFormDisabled } from '@element-plus/components/form'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { timeSelectProps } from './time-select'\nimport { compareTime, formatTime, nextTime, parseTime } from './utils'\n\ndayjs.extend(customParseFormat)\n\nconst { Option: ElOption } = ElSelect\n\ndefineOptions({\n  name: 'ElTimeSelect',\n})\n\ndefineEmits(['change', 'blur', 'focus', 'clear', 'update:modelValue'])\n\nconst props = defineProps(timeSelectProps)\n\nconst nsInput = useNamespace('input')\nconst select = ref<typeof ElSelect>()\n\nconst _disabled = useFormDisabled()\nconst { lang } = useLocale()\n\nconst value = computed(() => props.modelValue)\nconst start = computed(() => {\n  const time = parseTime(props.start)\n  return time ? formatTime(time) : null\n})\n\nconst end = computed(() => {\n  const time = parseTime(props.end)\n  return time ? formatTime(time) : null\n})\n\nconst step = computed(() => {\n  const time = parseTime(props.step)\n  return time ? formatTime(time) : null\n})\n\nconst minTime = computed(() => {\n  const time = parseTime(props.minTime || '')\n  return time ? formatTime(time) : null\n})\n\nconst maxTime = computed(() => {\n  const time = parseTime(props.maxTime || '')\n  return time ? formatTime(time) : null\n})\n\nconst items = computed(() => {\n  const result: { value: string; disabled: boolean }[] = []\n  if (props.start && props.end && props.step) {\n    let current = start.value\n    let currentTime: string\n    while (current && end.value && compareTime(current, end.value) <= 0) {\n      currentTime = dayjs(current, 'HH:mm')\n        .locale(lang.value)\n        .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\nconst blur = () => {\n  select.value?.blur?.()\n}\n\nconst focus = () => {\n  select.value?.focus?.()\n}\n\ndefineExpose({\n  /**\n   * @description focus the Input component\n   */\n  blur,\n  /**\n   * @description blur the Input component\n   */\n  focus,\n})\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"time-select2.mjs","sources":["../../../../../../packages/components/time-select/src/time-select.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\nimport { useEmptyValuesProps, useSizeProp } from '@element-plus/hooks'\nimport type { PopperEffect } from '@element-plus/components/popper'\nimport type TimeSelect from './time-select.vue'\nimport type { Component, ExtractPropTypes } from 'vue'\n\nexport const timeSelectProps = buildProps({\n  /**\n   * @description set format of time\n   */\n  format: {\n    type: String,\n    default: 'HH:mm',\n  },\n  /**\n   * @description binding value\n   */\n  modelValue: String,\n  /**\n   * @description whether TimeSelect is disabled\n   */\n  disabled: Boolean,\n  /**\n   * @description whether the input is editable\n   */\n  editable: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description Tooltip theme, built-in theme: `dark` / `light`\n   */\n  effect: {\n    type: definePropType<PopperEffect | string>(String),\n    default: 'light',\n  },\n  /**\n   * @description whether to show clear button\n   */\n  clearable: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description size of Input\n   */\n  size: useSizeProp,\n  /**\n   * @description placeholder in non-range mode\n   */\n  placeholder: String,\n  /**\n   * @description start time\n   */\n  start: {\n    type: String,\n    default: '09:00',\n  },\n  /**\n   * @description end time\n   */\n  end: {\n    type: String,\n    default: '18:00',\n  },\n  /**\n   * @description time step\n   */\n  step: {\n    type: String,\n    default: '00:30',\n  },\n  /**\n   * @description minimum time, any time before this time will be disabled\n   */\n  minTime: String,\n  /**\n   * @description maximum time, any time after this time will be disabled\n   */\n  maxTime: String,\n  /**\n   * @description same as `name` in native input\n   */\n  name: String,\n  /**\n   * @description custom prefix icon component\n   */\n  prefixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: () => Clock,\n  },\n  /**\n   * @description custom clear icon component\n   */\n  clearIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: () => CircleClose,\n  },\n  ...useEmptyValuesProps,\n} as const)\n\nexport type TimeSelectProps = ExtractPropTypes<typeof timeSelectProps>\n\nexport type TimeSelectInstance = InstanceType<typeof TimeSelect>\n"],"names":[],"mappings":";;;;;;;AAGY,MAAC,eAAe,GAAG,UAAU,CAAC;AAC1C,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,UAAU,EAAE,MAAM;AACpB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,OAAO,EAAE,MAAM;AACjB,EAAE,OAAO,EAAE,MAAM;AACjB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAM,KAAK;AACxB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAM,WAAW;AAC9B,GAAG;AACH,EAAE,GAAG,mBAAmB;AACxB,CAAC;;;;"}

package/es/components/tooltip/src/tooltip.mjs

@@ -6,7 +6,7 @@ import { useTooltipTriggerProps } from './trigger.mjs';
 import { createModelToggleComposable } from '../../../hooks/use-model-toggle/index.mjs';
 import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 import { popperProps } from '../../popper/src/popper.mjs';
-import { popperArrowProps } from '../../popper/src/arrow.mjs';
+import { popperArrowProps } from '../../popper/src/arrow2.mjs';
 
 const {
   useModelToggleProps: useTooltipModelToggleProps,

package/es/components/tooltip/src/tooltip2.mjs

@@ -11,7 +11,7 @@ import { usePopperContainer } from '../../../hooks/use-popper-container/index.mj
 import { useId } from '../../../hooks/use-id/index.mjs';
 import { useDelayedToggle } from '../../../hooks/use-delayed-toggle/index.mjs';
 import { isBoolean } from '../../../utils/types.mjs';
-import ElPopperArrow from '../../popper/src/arrow2.mjs';
+import ElPopperArrow from '../../popper/src/arrow.mjs';
 
 const __default__ = defineComponent({
   name: "ElTooltip"

package/es/components/tour/index.mjs

@@ -1,8 +1,8 @@
 import '../../utils/index.mjs';
 import Tour from './src/tour2.mjs';
-import TourStep from './src/step2.mjs';
+import TourStep from './src/step.mjs';
 export { tourEmits, tourProps } from './src/tour.mjs';
-export { tourStepEmits, tourStepProps } from './src/step.mjs';
+export { tourStepEmits, tourStepProps } from './src/step2.mjs';
 export { tourContentEmits, tourContentProps, tourPlacements, tourStrategies } from './src/content.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';
 

package/es/components/tour/src/mask.mjs

@@ -1,24 +1,81 @@
-import '../../../utils/index.mjs';
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, inject, computed, toRef, openBlock, createElementBlock, mergeProps, unref, createElementVNode, normalizeClass, normalizeStyle, createCommentVNode } from 'vue';
+import '../../../hooks/index.mjs';
+import { maskProps } from './mask2.mjs';
+import { tourKey } from './helper.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useLockscreen } from '../../../hooks/use-lockscreen/index.mjs';
 
-const maskProps = buildProps({
-  zIndex: {
-    type: Number,
-    default: 1001
-  },
-  visible: Boolean,
-  fill: {
-    type: String,
-    default: "rgba(0,0,0,0.5)"
-  },
-  pos: {
-    type: definePropType(Object)
-  },
-  targetAreaClickable: {
-    type: Boolean,
-    default: true
+const __default__ = defineComponent({
+  name: "ElTourMask",
+  inheritAttrs: false
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: maskProps,
+  setup(__props) {
+    const props = __props;
+    const { ns } = inject(tourKey);
+    const radius = computed(() => {
+      var _a, _b;
+      return (_b = (_a = props.pos) == null ? void 0 : _a.radius) != null ? _b : 2;
+    });
+    const roundInfo = computed(() => {
+      const v = radius.value;
+      const baseInfo = `a${v},${v} 0 0 1`;
+      return {
+        topRight: `${baseInfo} ${v},${v}`,
+        bottomRight: `${baseInfo} ${-v},${v}`,
+        bottomLeft: `${baseInfo} ${-v},${-v}`,
+        topLeft: `${baseInfo} ${v},${-v}`
+      };
+    });
+    const path = computed(() => {
+      const width = window.innerWidth;
+      const height = window.innerHeight;
+      const info = roundInfo.value;
+      const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`;
+      const _radius = radius.value;
+      return props.pos ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${props.pos.width - _radius * 2} ${info.topRight} v${props.pos.height - _radius * 2} ${info.bottomRight} h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${-props.pos.height + _radius * 2} ${info.topLeft} z` : _path;
+    });
+    const pathStyle = computed(() => {
+      return {
+        fill: props.fill,
+        pointerEvents: "auto",
+        cursor: "auto"
+      };
+    });
+    useLockscreen(toRef(props, "visible"), {
+      ns
+    });
+    return (_ctx, _cache) => {
+      return _ctx.visible ? (openBlock(), createElementBlock("div", mergeProps({
+        key: 0,
+        class: unref(ns).e("mask"),
+        style: {
+          position: "fixed",
+          left: 0,
+          right: 0,
+          top: 0,
+          bottom: 0,
+          zIndex: _ctx.zIndex,
+          pointerEvents: _ctx.pos && _ctx.targetAreaClickable ? "none" : "auto"
+        }
+      }, _ctx.$attrs), [
+        (openBlock(), createElementBlock("svg", { style: {
+          width: "100%",
+          height: "100%"
+        } }, [
+          createElementVNode("path", {
+            class: normalizeClass(unref(ns).e("hollow")),
+            style: normalizeStyle(unref(pathStyle)),
+            d: unref(path)
+          }, null, 14, ["d"])
+        ]))
+      ], 16)) : createCommentVNode("v-if", true);
+    };
   }
 });
+var ElTourMask = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "mask.vue"]]);
 
-export { maskProps };
+export { ElTourMask as default };
 //# sourceMappingURL=mask.mjs.map

package/es/components/tour/src/mask.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mask.mjs","sources":["../../../../../../packages/components/tour/src/mask.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type { PosInfo } from './types'\n\nexport const maskProps = buildProps({\n  /**\n   * @description mask's zIndex\n   */\n  zIndex: {\n    type: Number,\n    default: 1001,\n  },\n  /**\n   * @description whether to show the mask\n   */\n  visible: Boolean,\n  /**\n   * @description mask's fill\n   */\n  fill: {\n    type: String,\n    default: 'rgba(0,0,0,0.5)',\n  },\n  /***\n   * @description mask's transparent space position\n   */\n  pos: {\n    type: definePropType<PosInfo | null>(Object),\n  },\n  /**\n   * @description whether the target element can be clickable, when using mask\n   */\n  targetAreaClickable: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nexport type MaskProps = ExtractPropTypes<typeof maskProps>\n"],"names":[],"mappings":";;;AACY,MAAC,SAAS,GAAG,UAAU,CAAC;AACpC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,iBAAiB;AAC9B,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,mBAAmB,EAAE;AACvB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"mask.mjs","sources":["../../../../../../packages/components/tour/src/mask.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"visible\"\n    :class=\"ns.e('mask')\"\n    :style=\"({\n    position: 'fixed',\n    left: 0,\n    right: 0,\n    top: 0,\n    bottom: 0,\n    zIndex,\n    pointerEvents: pos && targetAreaClickable ? 'none' : 'auto',\n  } as any)\"\n    v-bind=\"$attrs\"\n  >\n    <svg\n      :style=\"{\n        width: '100%',\n        height: '100%',\n      }\"\n    >\n      <path :class=\"ns.e('hollow')\" :style=\"pathStyle\" :d=\"path\" />\n    </svg>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, toRef } from 'vue'\nimport { useLockscreen } from '@element-plus/hooks'\nimport { maskProps } from './mask'\nimport { tourKey } from './helper'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElTourMask',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(maskProps)\n\nconst { ns } = inject(tourKey)!\nconst radius = computed(() => props.pos?.radius ?? 2)\nconst roundInfo = computed(() => {\n  const v = radius.value\n  const baseInfo = `a${v},${v} 0 0 1`\n  return {\n    topRight: `${baseInfo} ${v},${v}`,\n    bottomRight: `${baseInfo} ${-v},${v}`,\n    bottomLeft: `${baseInfo} ${-v},${-v}`,\n    topLeft: `${baseInfo} ${v},${-v}`,\n  }\n})\n\nconst path = computed(() => {\n  const width = window.innerWidth\n  const height = window.innerHeight\n  const info = roundInfo.value\n  const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`\n  const _radius = radius.value\n  return props.pos\n    ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${\n        props.pos.width - _radius * 2\n      } ${info.topRight} v${props.pos.height - _radius * 2} ${\n        info.bottomRight\n      } h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${\n        -props.pos.height + _radius * 2\n      } ${info.topLeft} z`\n    : _path\n})\n\nconst pathStyle = computed<CSSProperties>(() => {\n  return {\n    fill: props.fill,\n    pointerEvents: 'auto',\n    cursor: 'auto',\n  }\n})\n\nuseLockscreen(toRef(props, 'visible'), {\n  ns,\n})\n</script>\n"],"names":[],"mappings":"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"}