element-plus/es/components/time-select/src/time-select2.mjs.map

A Component Library for Vue 3

{"version":3,"file":"time-select2.mjs","names":[],"sources":["../../../../../../packages/components/time-select/src/time-select.vue"],"sourcesContent":["<template>\n  <el-select\n    ref=\"select\"\n    :name=\"name\"\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    :popper-class=\"popperClass\"\n    :popper-style=\"popperStyle\"\n    @update:model-value=\"(event) => $emit(UPDATE_MODEL_EVENT, event)\"\n    @change=\"(event) => $emit(CHANGE_EVENT, 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 { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { CircleClose, Clock } from '@element-plus/icons-vue'\nimport {\n  compareTime,\n  formatTime,\n  isValidTime,\n  nextTime,\n  parseTime,\n} from './utils'\nimport { debugWarn } from '@element-plus/utils'\nimport { DEFAULT_END, DEFAULT_START, DEFAULT_STEP } from './time-select'\n\nimport type { TimeSelectProps } from './time-select'\n\ndayjs.extend(customParseFormat)\n\nconst { Option: ElOption } = ElSelect\n\ndefineOptions({\n  name: 'ElTimeSelect',\n})\n\ndefineEmits([CHANGE_EVENT, 'blur', 'focus', 'clear', UPDATE_MODEL_EVENT])\n\nconst props = withDefaults(defineProps<TimeSelectProps>(), {\n  format: 'HH:mm',\n  disabled: undefined,\n  editable: true,\n  effect: 'light',\n  clearable: true,\n  start: DEFAULT_START,\n  end: DEFAULT_END,\n  step: DEFAULT_STEP,\n  prefixIcon: () => Clock,\n  clearIcon: () => CircleClose,\n  popperClass: '',\n  valueOnClear: undefined,\n  popperStyle: undefined,\n})\n\nconst nsInput = useNamespace('input')\nconst select = ref<typeof ElSelect>()\n\nconst _disabled = useFormDisabled()\nconst { lang } = useLocale()\n\nconst getValidTimeOrDefault = (\n  value: string,\n  propName: 'start' | 'end' | 'step',\n  defaultValue: string,\n  allowZero = true\n) => {\n  const time = parseTime(value)\n  if (\n    !isValidTime(time) ||\n    (!allowZero && time.hours === 0 && time.minutes === 0)\n  ) {\n    debugWarn(\n      'ElTimeSelect',\n      `invalid ${propName}, fallback to default ${propName} (${defaultValue}).`\n    )\n    return defaultValue\n  }\n  return formatTime(time)\n}\n\nconst value = computed(() => props.modelValue)\nconst start = computed(() =>\n  getValidTimeOrDefault(props.start, 'start', DEFAULT_START)\n)\n\nconst end = computed(() => getValidTimeOrDefault(props.end, 'end', DEFAULT_END))\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 step = computed(() =>\n  getValidTimeOrDefault(props.step, 'step', DEFAULT_STEP, false)\n)\n\nconst items = computed(() => {\n  const result: { value: string; rawValue: string; disabled: boolean }[] = []\n  const push = (formattedValue: string, rawValue: string) => {\n    result.push({\n      value: formattedValue,\n      rawValue,\n      disabled:\n        compareTime(rawValue, minTime.value || '-1:-1') <= 0 ||\n        compareTime(rawValue, maxTime.value || '100:100') >= 0,\n    })\n  }\n\n  let current = start.value\n  while (compareTime(current, end.value) <= 0) {\n    const currentTime = dayjs(current, 'HH:mm')\n      .locale(lang.value)\n      .format(props.format)\n    push(currentTime, current)\n    current = nextTime(current, step.value)\n  }\n  if (\n    props.includeEndTime &&\n    result[result.length - 1]?.rawValue !== end.value\n  ) {\n    const formattedValue = dayjs(end.value, 'HH:mm')\n      .locale(lang.value)\n      .format(props.format)\n    push(formattedValue, end.value)\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 blur the Input component\n   */\n  blur,\n  /**\n   * @description focus the Input component\n   */\n  focus,\n})\n</script>\n"],"mappings":""}