{"version":3,"file":"select.vue2.mjs","sources":["../../../../../packages/components/select/src/select.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { defineComponent as __MACROS_defineComponent } from \"vue\";\nexport default /*#__PURE__*/ __MACROS_defineComponent({\n  name: 'ElSelect'\n});\n</script>\n<template>\n  <div\n    ref=\"selectRef\"\n    v-click-outside:[popperRef]=\"handleClickOutside\"\n    :class=\"[ns.b(), ns.m(selectSize)]\"\n    @click.stop=\"toggleMenu\"\n    @mouseenter=\"states.comboBoxHovering = true\"\n    @mouseleave=\"states.comboBoxHovering = false\"\n  >\n    <el-tooltip\n      ref=\"tooltipRef\"\n      v-model:visible=\"dropdownMenuVisible\"\n      :teleported=\"teleported\"\n      :popper-class=\"[ns.e('popper'), popperClass]\"\n      :gpu-acceleration=\"false\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-options=\"popperOptions\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      :effect=\"effect\"\n      placement=\"bottom-start\"\n      pure\n      :transition=\"`${ns.namespace}-zoom-in-top`\"\n      trigger=\"click\"\n      persistent\n      @show=\"handleMenuEnter\"\n      @hide=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #default>\n        <div\n          ref=\"selectionRef\"\n          :class=\"[\n            ns.e('wrapper'),\n            ns.is('focused', states.isComposing),\n            ns.is('hovering', states.comboBoxHovering),\n            ns.is('filterable', filterable),\n            ns.is('disabled', selectDisabled)\n          ]\"\n        >\n          <div v-if=\"$slots.prefix\">\n            <slot name=\"prefix\"></slot>\n          </div>\n          <div v-if=\"multiple && modelValue\" :class=\"ns.e('selection')\">\n            <template v-if=\"collapseTags && modelValue?.length > 0\">\n              <div :class=\"ns.e('selected-item')\">\n                <el-tag\n                  :closable=\"\n                    !selectDisabled && !states.cachedOptions[0]?.disable\n                  \"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  max-width=\"100px\"\n                  @close=\"deleteTag($event, states.cachedOptions[0])\"\n                >\n                  <span\n                    :class=\"ns.e('tags-text')\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`\n                    }\"\n                  >\n                    {{ getLabel(states.cachedOptions[0]) }}\n                  </span>\n                </el-tag>\n                <el-tag\n                  v-if=\"modelValue.length > 1\"\n                  :closable=\"false\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                >\n                  <span\n                    :class=\"ns.e('tags-text')\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`\n                    }\"\n                    >+ {{ modelValue.length - 1 }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n\n            <template v-else>\n              <div\n                v-for=\"(selected, idx) in states.cachedOptions\"\n                :key=\"idx\"\n                :class=\"ns.e('selected-item')\"\n              >\n                <el-tag\n                  :key=\"getValue(selected)\"\n                  :closable=\"!selectDisabled && !selected.disabled\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  max-width=\"100px\"\n                  disable-transitions\n                  @close=\"deleteTag($event, selected)\"\n                >\n                  <span\n                    :class=\"ns.e('tags-text')\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`\n                    }\"\n                    >{{ getLabel(selected) }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n            <div\n              :class=\"[ns.e('selected-item'), ns.e('input-wrapper')]\"\n              :style=\"inputWrapperStyle\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model=\"states.displayInputValue\"\n                :autocomplete=\"autocomplete\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                autocapitalize=\"off\"\n                :aria-expanded=\"expanded\"\n                :class=\"[ns.is(selectSize), ns.e('combobox-input')]\"\n                :disabled=\"selectDisabled\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                text\n                :name=\"name\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @update:modelValue=\"onUpdateInputValue\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @keydown.delete.stop=\"handleDel\"\n              />\n              <span\n                v-if=\"filterable\"\n                ref=\"calculatorRef\"\n                aria-hidden=\"true\"\n                :class=\"ns.e('input-calculator')\"\n                v-text=\"states.displayInputValue\"\n              >\n              </span>\n            </div>\n          </div>\n          <template v-else>\n            <div :class=\"[ns.e('selected-item'), ns.e('input-wrapper')]\">\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model=\"states.displayInputValue\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                :aria-expanded=\"expanded\"\n                autocapitalize=\"off\"\n                :autocomplete=\"autocomplete\"\n                :class=\"ns.e('combobox-input')\"\n                :disabled=\"selectDisabled\"\n                :name=\"name\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                text\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @update:modelValue=\"onUpdateInputValue\"\n              />\n            </div>\n            <span\n              v-if=\"filterable\"\n              ref=\"calculatorRef\"\n              aria-hidden=\"true\"\n              :class=\"[ns.e('selected-item'), ns.e('input-calculator')]\"\n              v-text=\"states.displayInputValue\"\n            >\n            </span>\n          </template>\n          <span\n            v-if=\"shouldShowPlaceholder\"\n            :class=\"[\n              ns.e('placeholder'),\n              ns.is(\n                'transparent',\n                states.isComposing ||\n                  (placeholder && multiple\n                    ? (modelValue || []).length === 0\n                    : !hasModelValue)\n              )\n            ]\"\n          >\n            {{ currentPlaceholder }}\n          </span>\n          <span :class=\"ns.e('suffix')\">\n            <el-icon\n              v-if=\"iconComponent && !selectDisabled\"\n              v-show=\"!showClearBtn\"\n              :class=\"[ns.e('caret'), nsInput.e('icon'), iconReverse]\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <el-icon\n              v-if=\"showClearBtn && clearIcon\"\n              :class=\"[ns.e('caret'), nsInput.e('icon')]\"\n              @click.prevent.stop=\"handleClear\"\n            >\n              <component :is=\"clearIcon\" />\n            </el-icon>\n          </span>\n        </div>\n      </template>\n      <template #content>\n        <el-select-dropdown\n          ref=\"dropdownRef\"\n          :data=\"filteredOptions\"\n          :width=\"popperSize\"\n          :hovering-index=\"states.hoveringIndex\"\n          :scrollbar-always-on=\"scrollbarAlwaysOn\"\n        >\n          <template #default=\"scope\">\n            <slot v-bind=\"scope\"></slot>\n          </template>\n          <template #empty>\n            <slot name=\"empty\">\n              <p :class=\"ns.e('empty')\">\n                {{ emptyText ? emptyText : '' }}\n              </p>\n            </slot>\n          </template>\n        </el-select-dropdown>\n      </template>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { provide, toRefs, reactive } from 'vue'\nimport { ClickOutside as vClickOutside } from '@element-ultra/directives'\nimport ElTooltip from '@element-ultra/components/tooltip'\nimport ElTag from '@element-ultra/components/tag'\nimport ElIcon from '@element-ultra/components/icon'\nimport ElSelectDropdown from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectInjectionKey } from './token'\nimport { SelectEmits, SelectProps } from './defaults'\n\n\n\nconst props = defineProps(SelectProps)\n\nconst emit = defineEmits(SelectEmits)\n\nconst {\n  collapseTagSize,\n  currentPlaceholder,\n  expanded,\n  emptyText,\n  popupHeight,\n  filteredOptions,\n  iconComponent,\n  iconReverse,\n  inputWrapperStyle,\n  popperSize,\n  dropdownMenuVisible,\n  hasModelValue,\n\n  // 只读,\n  shouldShowPlaceholder,\n  selectDisabled,\n  selectSize,\n  showClearBtn,\n  states,\n  tagMaxWidth,\n  ns,\n  nsInput,\n\n  // 模板引用\n  calculatorRef,\n  inputRef,\n  dropdownRef,\n  tooltipRef,\n  selectRef,\n  selectionRef,\n\n  popperRef,\n\n  // methods exports\n  deleteTag,\n  getLabel,\n  getValue,\n  handleClear,\n  handleClickOutside,\n  handleDel,\n  handleEsc,\n  handleFocus,\n  handleMenuEnter,\n  toggleMenu,\n  onInput,\n  onKeyboardNavigate,\n  onKeyboardSelect,\n  handleSelect,\n  onHover,\n  onUpdateInputValue,\n  handleCompositionStart,\n  handleCompositionEnd,\n  update,\n  handleCompositionUpdate\n} = useSelect(props, emit)\n\nprovide(selectInjectionKey, {\n  props: reactive({\n    ...toRefs(props),\n    height: popupHeight\n  }),\n  expanded,\n  states,\n  filteredOptions,\n  getLabel,\n  getValue,\n  handleSelect,\n  onHover,\n  update,\n  onKeyboardNavigate,\n  onKeyboardSelect\n})\n</script>\n"],"names":["__MACROS_defineComponent"],"mappings":";;;;;;;;;;;;;;;;;;;AAEA,MAA6B,cAAAA,eAAyB,CAAA;AAAA,EACpD,IAAM,EAAA,UAAA;AACR,CAAC,CAAA,CAAA;;;;;;;AAyQD,IAAM,MAAA;AAAA,MACJ,eAAA;AAAA,MACA,kBAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA;AAAA,MACA,iBAAA;AAAA,MACA,UAAA;AAAA,MACA,mBAAA;AAAA,MACA,aAAA;AAAA;AAAA,MAGA,qBAAA;AAAA,MACA,cAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,WAAA;AAAA,MACA,EAAA;AAAA,MACA,OAAA;AAAA;AAAA,MAGA,aAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAA;AAAA,MAEA,SAAA;AAAA;AAAA,MAGA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,kBAAA;AAAA,MACA,SAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,MACA,kBAAA;AAAA,MACA,gBAAA;AAAA,MACA,YAAA;AAAA,MACA,OAAA;AAAA,MACA,kBAAA;AAAA,MACA,sBAAA;AAAA,MACA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,uBAAA;AAAA,KACF,GAAI,SAAU,CAAA,KAAA,EAAO,IAAI,CAAA,CAAA;AAEzB,IAAA,OAAA,CAAQ,kBAAoB,EAAA;AAAA,MAC1B,OAAO,QAAS,CAAA;AAAA,QACd,GAAG,OAAO,KAAK,CAAA;AAAA,QACf,MAAQ,EAAA,WAAA;AAAA,OACT,CAAA;AAAA,MACD,QAAA;AAAA,MACA,MAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,kBAAA;AAAA,MACA,gBAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}