element-plus 1.3.0-beta.2 → 1.3.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (154) hide show
  1. package/dist/index.full.js +25 -10
  2. package/dist/index.full.min.js +4 -4
  3. package/dist/index.full.min.js.map +1 -1
  4. package/dist/index.full.min.mjs +4 -4
  5. package/dist/index.full.min.mjs.map +1 -1
  6. package/dist/index.full.mjs +25 -10
  7. package/es/components/alert/index.mjs +2 -2
  8. package/es/components/alert/src/alert.mjs +5 -37
  9. package/es/components/alert/src/alert.mjs.map +1 -1
  10. package/es/components/alert/src/alert.vue_vue_type_script_lang.mjs +1 -1
  11. package/es/components/alert/src/alert2.mjs +37 -5
  12. package/es/components/alert/src/alert2.mjs.map +1 -1
  13. package/es/components/autocomplete/src/index.vue_vue_type_script_lang.mjs.map +1 -1
  14. package/es/components/autocomplete/src/index.vue_vue_type_template_id_2f09f285_lang.mjs +1 -0
  15. package/es/components/autocomplete/src/index.vue_vue_type_template_id_2f09f285_lang.mjs.map +1 -1
  16. package/es/components/badge/index.mjs +2 -2
  17. package/es/components/badge/src/badge.mjs +5 -20
  18. package/es/components/badge/src/badge.mjs.map +1 -1
  19. package/es/components/badge/src/badge.vue_vue_type_script_lang.mjs +1 -1
  20. package/es/components/badge/src/badge2.mjs +20 -5
  21. package/es/components/badge/src/badge2.mjs.map +1 -1
  22. package/es/components/color-picker/src/index.vue_vue_type_script_lang.mjs.map +1 -1
  23. package/es/components/color-picker/src/index.vue_vue_type_template_id_46a474d5_lang.mjs +2 -1
  24. package/es/components/color-picker/src/index.vue_vue_type_template_id_46a474d5_lang.mjs.map +1 -1
  25. package/es/components/dropdown/src/dropdown.mjs +1 -1
  26. package/es/components/dropdown/src/dropdown.vue_vue_type_script_lang.mjs.map +1 -1
  27. package/es/components/dropdown/src/dropdown.vue_vue_type_template_id_3ed790a5_lang.mjs +1 -0
  28. package/es/components/dropdown/src/dropdown.vue_vue_type_template_id_3ed790a5_lang.mjs.map +1 -1
  29. package/es/components/index.mjs +5 -5
  30. package/es/components/menu/src/menu-item.vue_vue_type_script_lang.mjs.map +1 -1
  31. package/es/components/menu/src/menu-item.vue_vue_type_template_id_aa755baa_lang.mjs +2 -1
  32. package/es/components/menu/src/menu-item.vue_vue_type_template_id_aa755baa_lang.mjs.map +1 -1
  33. package/es/components/popconfirm/src/popconfirm.vue_vue_type_script_lang.mjs.map +1 -1
  34. package/es/components/popconfirm/src/popconfirm.vue_vue_type_template_id_16409d25_lang.mjs +2 -1
  35. package/es/components/popconfirm/src/popconfirm.vue_vue_type_template_id_16409d25_lang.mjs.map +1 -1
  36. package/es/components/popover/src/index.vue_vue_type_script_lang.mjs.map +1 -1
  37. package/es/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.mjs +2 -1
  38. package/es/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.mjs.map +1 -1
  39. package/es/components/popover/src/popover.mjs +1 -1
  40. package/es/components/result/index.mjs +2 -2
  41. package/es/components/result/src/result.mjs +5 -30
  42. package/es/components/result/src/result.mjs.map +1 -1
  43. package/es/components/result/src/result.vue_vue_type_script_lang.mjs +1 -1
  44. package/es/components/result/src/result2.mjs +30 -5
  45. package/es/components/result/src/result2.mjs.map +1 -1
  46. package/es/components/select/src/select.vue_vue_type_script_lang.mjs.map +1 -1
  47. package/es/components/select/src/select.vue_vue_type_template_id_33774f85_lang.mjs +1 -0
  48. package/es/components/select/src/select.vue_vue_type_template_id_33774f85_lang.mjs.map +1 -1
  49. package/es/components/select-v2/src/select.vue_vue_type_script_lang.mjs.map +1 -1
  50. package/es/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.mjs +1 -0
  51. package/es/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.mjs.map +1 -1
  52. package/es/components/skeleton/index.mjs +2 -2
  53. package/es/components/skeleton/src/skeleton.mjs +5 -24
  54. package/es/components/skeleton/src/skeleton.mjs.map +1 -1
  55. package/es/components/skeleton/src/skeleton.vue_vue_type_script_lang.mjs +1 -1
  56. package/es/components/skeleton/src/skeleton2.mjs +24 -5
  57. package/es/components/skeleton/src/skeleton2.mjs.map +1 -1
  58. package/es/components/slider/src/button.vue_vue_type_script_lang.mjs.map +1 -1
  59. package/es/components/slider/src/button.vue_vue_type_template_id_9cd3e794_lang.mjs +2 -1
  60. package/es/components/slider/src/button.vue_vue_type_template_id_9cd3e794_lang.mjs.map +1 -1
  61. package/es/components/table/src/filter-panel.vue_vue_type_script_lang.mjs.map +1 -1
  62. package/es/components/table/src/filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs +2 -1
  63. package/es/components/table/src/filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs.map +1 -1
  64. package/es/components/time-picker/src/common/picker.vue_vue_type_script_lang.mjs +6 -2
  65. package/es/components/time-picker/src/common/picker.vue_vue_type_script_lang.mjs.map +1 -1
  66. package/es/components/time-picker/src/common/picker.vue_vue_type_template_id_1d54be91_lang.mjs +1 -0
  67. package/es/components/time-picker/src/common/picker.vue_vue_type_template_id_1d54be91_lang.mjs.map +1 -1
  68. package/es/components/tooltip/index.mjs +2 -2
  69. package/es/components/tooltip/src/content.vue_vue_type_script_lang.mjs +1 -1
  70. package/es/components/tooltip/src/tooltip.mjs +5 -61
  71. package/es/components/tooltip/src/tooltip.mjs.map +1 -1
  72. package/es/components/tooltip/src/tooltip.vue_vue_type_script_lang.mjs +1 -1
  73. package/es/components/tooltip/src/tooltip2.mjs +61 -5
  74. package/es/components/tooltip/src/tooltip2.mjs.map +1 -1
  75. package/es/components/tooltip/src/trigger.vue_vue_type_script_lang.mjs +1 -1
  76. package/es/index.mjs +5 -5
  77. package/es/version.d.ts +1 -1
  78. package/es/version.mjs +1 -1
  79. package/es/version.mjs.map +1 -1
  80. package/lib/components/alert/index.js +2 -2
  81. package/lib/components/alert/src/alert.js +5 -37
  82. package/lib/components/alert/src/alert.js.map +1 -1
  83. package/lib/components/alert/src/alert.vue_vue_type_script_lang.js +1 -1
  84. package/lib/components/alert/src/alert2.js +37 -5
  85. package/lib/components/alert/src/alert2.js.map +1 -1
  86. package/lib/components/autocomplete/src/index.vue_vue_type_script_lang.js.map +1 -1
  87. package/lib/components/autocomplete/src/index.vue_vue_type_template_id_2f09f285_lang.js +1 -0
  88. package/lib/components/autocomplete/src/index.vue_vue_type_template_id_2f09f285_lang.js.map +1 -1
  89. package/lib/components/badge/index.js +2 -2
  90. package/lib/components/badge/src/badge.js +5 -19
  91. package/lib/components/badge/src/badge.js.map +1 -1
  92. package/lib/components/badge/src/badge.vue_vue_type_script_lang.js +1 -1
  93. package/lib/components/badge/src/badge2.js +19 -5
  94. package/lib/components/badge/src/badge2.js.map +1 -1
  95. package/lib/components/color-picker/src/index.vue_vue_type_script_lang.js.map +1 -1
  96. package/lib/components/color-picker/src/index.vue_vue_type_template_id_46a474d5_lang.js +2 -1
  97. package/lib/components/color-picker/src/index.vue_vue_type_template_id_46a474d5_lang.js.map +1 -1
  98. package/lib/components/dropdown/src/dropdown.js +1 -1
  99. package/lib/components/dropdown/src/dropdown.vue_vue_type_script_lang.js.map +1 -1
  100. package/lib/components/dropdown/src/dropdown.vue_vue_type_template_id_3ed790a5_lang.js +1 -0
  101. package/lib/components/dropdown/src/dropdown.vue_vue_type_template_id_3ed790a5_lang.js.map +1 -1
  102. package/lib/components/index.js +5 -5
  103. package/lib/components/menu/src/menu-item.vue_vue_type_script_lang.js.map +1 -1
  104. package/lib/components/menu/src/menu-item.vue_vue_type_template_id_aa755baa_lang.js +2 -1
  105. package/lib/components/menu/src/menu-item.vue_vue_type_template_id_aa755baa_lang.js.map +1 -1
  106. package/lib/components/popconfirm/src/popconfirm.vue_vue_type_script_lang.js.map +1 -1
  107. package/lib/components/popconfirm/src/popconfirm.vue_vue_type_template_id_16409d25_lang.js +2 -1
  108. package/lib/components/popconfirm/src/popconfirm.vue_vue_type_template_id_16409d25_lang.js.map +1 -1
  109. package/lib/components/popover/src/index.vue_vue_type_script_lang.js.map +1 -1
  110. package/lib/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.js +2 -1
  111. package/lib/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.js.map +1 -1
  112. package/lib/components/popover/src/popover.js +1 -1
  113. package/lib/components/result/index.js +2 -2
  114. package/lib/components/result/src/result.js +5 -31
  115. package/lib/components/result/src/result.js.map +1 -1
  116. package/lib/components/result/src/result.vue_vue_type_script_lang.js +1 -1
  117. package/lib/components/result/src/result2.js +31 -5
  118. package/lib/components/result/src/result2.js.map +1 -1
  119. package/lib/components/select/src/select.vue_vue_type_script_lang.js.map +1 -1
  120. package/lib/components/select/src/select.vue_vue_type_template_id_33774f85_lang.js +1 -0
  121. package/lib/components/select/src/select.vue_vue_type_template_id_33774f85_lang.js.map +1 -1
  122. package/lib/components/select-v2/src/select.vue_vue_type_script_lang.js.map +1 -1
  123. package/lib/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.js +1 -0
  124. package/lib/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.js.map +1 -1
  125. package/lib/components/skeleton/index.js +2 -2
  126. package/lib/components/skeleton/src/skeleton.js +5 -23
  127. package/lib/components/skeleton/src/skeleton.js.map +1 -1
  128. package/lib/components/skeleton/src/skeleton.vue_vue_type_script_lang.js +1 -1
  129. package/lib/components/skeleton/src/skeleton2.js +23 -5
  130. package/lib/components/skeleton/src/skeleton2.js.map +1 -1
  131. package/lib/components/slider/src/button.vue_vue_type_script_lang.js.map +1 -1
  132. package/lib/components/slider/src/button.vue_vue_type_template_id_9cd3e794_lang.js +2 -1
  133. package/lib/components/slider/src/button.vue_vue_type_template_id_9cd3e794_lang.js.map +1 -1
  134. package/lib/components/table/src/filter-panel.vue_vue_type_script_lang.js.map +1 -1
  135. package/lib/components/table/src/filter-panel.vue_vue_type_template_id_fde1c940_lang.js +2 -1
  136. package/lib/components/table/src/filter-panel.vue_vue_type_template_id_fde1c940_lang.js.map +1 -1
  137. package/lib/components/time-picker/src/common/picker.vue_vue_type_script_lang.js +6 -2
  138. package/lib/components/time-picker/src/common/picker.vue_vue_type_script_lang.js.map +1 -1
  139. package/lib/components/time-picker/src/common/picker.vue_vue_type_template_id_1d54be91_lang.js +1 -0
  140. package/lib/components/time-picker/src/common/picker.vue_vue_type_template_id_1d54be91_lang.js.map +1 -1
  141. package/lib/components/tooltip/index.js +2 -2
  142. package/lib/components/tooltip/src/content.vue_vue_type_script_lang.js +1 -1
  143. package/lib/components/tooltip/src/tooltip.js +5 -62
  144. package/lib/components/tooltip/src/tooltip.js.map +1 -1
  145. package/lib/components/tooltip/src/tooltip.vue_vue_type_script_lang.js +1 -1
  146. package/lib/components/tooltip/src/tooltip2.js +62 -5
  147. package/lib/components/tooltip/src/tooltip2.js.map +1 -1
  148. package/lib/components/tooltip/src/trigger.vue_vue_type_script_lang.js +1 -1
  149. package/lib/index.js +5 -5
  150. package/lib/version.d.ts +1 -1
  151. package/lib/version.js +1 -1
  152. package/lib/version.js.map +1 -1
  153. package/package.json +2 -2
  154. package/web-types.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"select.vue_vue_type_template_id_33774f85_lang.mjs","sources":["../../../../../../packages/components/select/src/select.vue?vue&type=template&id=33774f85&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"selectWrapper\"\n v-click-outside:[popperPaneRef]=\"handleClose\"\n :class=\"wrapperKls\"\n @click.stop=\"toggleMenu\"\n >\n <el-tooltip\n ref=\"tooltipRef\"\n v-model:visible=\"dropMenuVisible\"\n placement=\"bottom-start\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-select__popper ${popperClass}`\"\n :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n effect=\"light\"\n pure\n trigger=\"click\"\n transition=\"el-zoom-in-top\"\n :stop-popper-mouse-event=\"false\"\n :gpu-acceleration=\"false\"\n @show=\"handleMenuEnter\"\n >\n <template #default>\n <div class=\"select-trigger\">\n <div\n v-if=\"multiple\"\n ref=\"tags\"\n class=\"el-select__tags\"\n :style=\"selectTagsStyle\"\n >\n <span v-if=\"collapseTags && selected.length\">\n <el-tag\n :closable=\"!selectDisabled && !selected[0].isDisabled\"\n :size=\"collapseTagSize\"\n :hit=\"selected[0].hitState\"\n :type=\"tagType\"\n disable-transitions\n @close=\"deleteTag($event, selected[0])\"\n >\n <span\n class=\"el-select__tags-text\"\n :style=\"{ maxWidth: inputWidth - 123 + 'px' }\"\n >{{ selected[0].currentLabel }}</span\n >\n </el-tag>\n <el-tag\n v-if=\"selected.length > 1\"\n :closable=\"false\"\n :size=\"collapseTagSize\"\n :type=\"tagType\"\n disable-transitions\n >\n <span class=\"el-select__tags-text\"\n >+ {{ selected.length - 1 }}</span\n >\n </el-tag>\n </span>\n <!-- <div> -->\n <transition v-if=\"!collapseTags\" @after-leave=\"resetInputHeight\">\n <span\n :style=\"{\n marginLeft:\n prefixWidth && selected.length ? `${prefixWidth}px` : null,\n }\"\n >\n <el-tag\n v-for=\"item in selected\"\n :key=\"getValueKey(item)\"\n :closable=\"!selectDisabled && !item.isDisabled\"\n :size=\"collapseTagSize\"\n :hit=\"item.hitState\"\n :type=\"tagType\"\n disable-transitions\n @close=\"deleteTag($event, item)\"\n >\n <span\n class=\"el-select__tags-text\"\n :style=\"{ maxWidth: inputWidth - 75 + 'px' }\"\n >{{ item.currentLabel }}</span\n >\n </el-tag>\n </span>\n </transition>\n <!-- </div> -->\n <input\n v-if=\"filterable\"\n ref=\"input\"\n v-model=\"query\"\n type=\"text\"\n class=\"el-select__input\"\n :class=\"[selectSize ? `is-${selectSize}` : '']\"\n :disabled=\"selectDisabled\"\n :autocomplete=\"autocomplete\"\n :style=\"{\n marginLeft:\n (prefixWidth && !selected.length) || tagInMultiLine\n ? `${prefixWidth}px`\n : null,\n flexGrow: '1',\n width: `${inputLength / (inputWidth - 32)}%`,\n maxWidth: `${inputWidth - 42}px`,\n }\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n @keyup=\"managePlaceholder\"\n @keydown=\"resetInputState\"\n @keydown.down.prevent=\"navigateOptions('next')\"\n @keydown.up.prevent=\"navigateOptions('prev')\"\n @keydown.esc.stop.prevent=\"visible = false\"\n @keydown.enter.stop.prevent=\"selectOption\"\n @keydown.delete=\"deletePrevTag\"\n @keydown.tab=\"visible = false\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @input=\"debouncedQueryChange\"\n />\n </div>\n <el-input\n :id=\"id\"\n ref=\"reference\"\n v-model=\"selectedLabel\"\n type=\"text\"\n :placeholder=\"currentPlaceholder\"\n :name=\"name\"\n :autocomplete=\"autocomplete\"\n :size=\"selectSize\"\n :disabled=\"selectDisabled\"\n :readonly=\"readonly\"\n :validate-event=\"false\"\n :class=\"{ 'is-focus': visible }\"\n :tabindex=\"multiple && filterable ? -1 : undefined\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n @input=\"debouncedOnInputChange\"\n @paste=\"debouncedOnInputChange\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @keydown.down.stop.prevent=\"navigateOptions('next')\"\n @keydown.up.stop.prevent=\"navigateOptions('prev')\"\n @keydown.enter.stop.prevent=\"selectOption\"\n @keydown.esc.stop.prevent=\"visible = false\"\n @keydown.tab=\"visible = false\"\n @mouseenter=\"inputHovering = true\"\n @mouseleave=\"inputHovering = false\"\n >\n <template v-if=\"$slots.prefix\" #prefix>\n <div\n style=\"\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n \"\n >\n <slot name=\"prefix\"></slot>\n </div>\n </template>\n <template #suffix>\n <el-icon\n v-if=\"iconComponent\"\n v-show=\"!showClose\"\n :class=\"['el-select__caret', 'el-input__icon', iconReverse]\"\n >\n <component :is=\"iconComponent\" />\n </el-icon>\n <el-icon\n v-if=\"showClose && clearIcon\"\n class=\"el-select__caret el-input__icon\"\n @click=\"handleClearClick\"\n >\n <component :is=\"clearIcon\" />\n </el-icon>\n </template>\n </el-input>\n </div>\n </template>\n <template #content>\n <el-select-menu>\n <el-scrollbar\n v-show=\"options.size > 0 && !loading\"\n ref=\"scrollbar\"\n tag=\"ul\"\n wrap-class=\"el-select-dropdown__wrap\"\n view-class=\"el-select-dropdown__list\"\n :class=\"{\n 'is-empty': !allowCreate && query && filteredOptionsCount === 0,\n }\"\n >\n <el-option v-if=\"showNewOption\" :value=\"query\" :created=\"true\" />\n <slot></slot>\n </el-scrollbar>\n <template\n v-if=\"\n emptyText &&\n (!allowCreate || loading || (allowCreate && options.size === 0))\n \"\n >\n <slot v-if=\"$slots.empty\" name=\"empty\"></slot>\n <p v-else class=\"el-select-dropdown__empty\">\n {{ emptyText }}\n </p>\n </template>\n </el-select-menu>\n </template>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n toRefs,\n defineComponent,\n onMounted,\n onBeforeUnmount,\n nextTick,\n reactive,\n provide,\n computed,\n unref,\n} from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useFocus, useLocale } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport {\n addResizeListener,\n removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose, ArrowUp } from '@element-plus/icons-vue'\nimport ElOption from './option.vue'\nimport ElSelectMenu from './select-dropdown.vue'\nimport { useSelect, useSelectStates } from './useSelect'\nimport { selectKey } from './token'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { SelectContext } from './token'\n\nexport default defineComponent({\n name: 'ElSelect',\n componentName: 'ElSelect',\n components: {\n ElInput,\n ElSelectMenu,\n ElOption,\n ElTag,\n ElScrollbar,\n ElTooltip,\n ElIcon,\n },\n directives: { ClickOutside },\n props: {\n name: String,\n id: String,\n modelValue: {\n type: [Array, String, Number, Boolean, Object],\n default: undefined,\n },\n autocomplete: {\n type: String,\n default: 'off',\n },\n automaticDropdown: Boolean,\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n disabled: Boolean,\n clearable: Boolean,\n filterable: Boolean,\n allowCreate: Boolean,\n loading: Boolean,\n popperClass: {\n type: String,\n default: '',\n },\n remote: Boolean,\n loadingText: String,\n noMatchText: String,\n noDataText: String,\n remoteMethod: Function,\n filterMethod: Function,\n multiple: Boolean,\n multipleLimit: {\n type: Number,\n default: 0,\n },\n placeholder: {\n type: String,\n },\n defaultFirstOption: Boolean,\n reserveKeyword: Boolean,\n valueKey: {\n type: String,\n default: 'value',\n },\n collapseTags: Boolean,\n popperAppendToBody: {\n type: Boolean,\n default: true,\n },\n clearIcon: {\n type: [String, Object] as PropType<string | Component>,\n default: CircleClose,\n },\n fitInputWidth: {\n type: Boolean,\n default: false,\n },\n suffixIcon: {\n type: [String, Object] as PropType<string | Component>,\n default: ArrowUp,\n },\n tagType: {\n type: String,\n default: 'info',\n },\n },\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'remove-tag',\n 'clear',\n 'visible-change',\n 'focus',\n 'blur',\n ],\n\n setup(props, ctx) {\n const { t } = useLocale()\n const states = useSelectStates(props)\n const {\n optionsArray,\n selectSize,\n readonly,\n handleResize,\n collapseTagSize,\n debouncedOnInputChange,\n debouncedQueryChange,\n deletePrevTag,\n deleteTag,\n deleteSelected,\n handleOptionSelect,\n scrollToOption,\n setSelected,\n resetInputHeight,\n managePlaceholder,\n showClose,\n selectDisabled,\n iconComponent,\n iconReverse,\n showNewOption,\n emptyText,\n toggleLastOptionHitState,\n resetInputState,\n handleComposition,\n onOptionCreate,\n onOptionDestroy,\n handleMenuEnter,\n handleFocus,\n blur,\n handleBlur,\n handleClearClick,\n handleClose,\n toggleMenu,\n selectOption,\n getValueKey,\n navigateOptions,\n dropMenuVisible,\n\n reference,\n input,\n tooltipRef,\n tags,\n selectWrapper,\n scrollbar,\n queryChange,\n groupQueryChange,\n } = useSelect(props, states, ctx)\n\n const { focus } = useFocus(reference)\n\n const {\n inputWidth,\n selected,\n inputLength,\n filteredOptionsCount,\n visible,\n softFocus,\n selectedLabel,\n hoverIndex,\n query,\n inputHovering,\n currentPlaceholder,\n menuVisibleOnFocus,\n isOnComposition,\n isSilentBlur,\n options,\n cachedOptions,\n optionsCount,\n prefixWidth,\n tagInMultiLine,\n } = toRefs(states)\n\n const wrapperKls = computed(() => {\n const classList = ['el-select']\n const _selectSize = unref(selectSize)\n if (_selectSize) {\n classList.push(`el-select--${_selectSize}`)\n }\n return classList\n })\n\n const selectTagsStyle = computed(() => ({\n maxWidth: `${unref(inputWidth) - 32}px`,\n width: '100%',\n }))\n\n provide(\n selectKey,\n reactive({\n props,\n options,\n optionsArray,\n cachedOptions,\n optionsCount,\n filteredOptionsCount,\n hoverIndex,\n handleOptionSelect,\n onOptionCreate,\n onOptionDestroy,\n selectWrapper,\n selected,\n setSelected,\n queryChange,\n groupQueryChange,\n }) as unknown as SelectContext\n )\n\n onMounted(() => {\n states.cachedPlaceHolder = currentPlaceholder.value =\n props.placeholder || t('el.select.placeholder')\n if (\n props.multiple &&\n Array.isArray(props.modelValue) &&\n props.modelValue.length > 0\n ) {\n currentPlaceholder.value = ''\n }\n addResizeListener(selectWrapper.value as any, handleResize)\n if (reference.value && reference.value.$el) {\n const sizeMap = {\n large: 36,\n default: 32,\n small: 28,\n }\n const input = reference.value.input as HTMLInputElement\n states.initialInputHeight =\n input.getBoundingClientRect().height || sizeMap[selectSize.value]\n }\n if (props.remote && props.multiple) {\n resetInputHeight()\n }\n nextTick(() => {\n if (!reference.value) return\n if (reference.value.$el) {\n inputWidth.value = reference.value.$el.getBoundingClientRect().width\n }\n if (ctx.slots.prefix) {\n const inputChildNodes = reference.value.$el.childNodes\n const input = (Array.from(inputChildNodes) as HTMLElement[]).filter(\n (item) => item.tagName === 'INPUT'\n )[0]\n const prefix = reference.value.$el.querySelector('.el-input__prefix')\n prefixWidth.value = Math.max(\n prefix.getBoundingClientRect().width + 5,\n 30\n )\n if (states.prefixWidth) {\n input.style.paddingLeft = `${Math.max(states.prefixWidth, 30)}px`\n }\n }\n })\n setSelected()\n })\n\n onBeforeUnmount(() => {\n removeResizeListener(selectWrapper.value as any, handleResize)\n })\n\n if (props.multiple && !Array.isArray(props.modelValue)) {\n ctx.emit(UPDATE_MODEL_EVENT, [])\n }\n if (!props.multiple && Array.isArray(props.modelValue)) {\n ctx.emit(UPDATE_MODEL_EVENT, '')\n }\n\n const popperPaneRef = computed(() => {\n return tooltipRef.value?.popperRef?.contentRef\n })\n\n return {\n tagInMultiLine,\n prefixWidth,\n selectSize,\n readonly,\n handleResize,\n collapseTagSize,\n debouncedOnInputChange,\n debouncedQueryChange,\n deletePrevTag,\n deleteTag,\n deleteSelected,\n handleOptionSelect,\n scrollToOption,\n inputWidth,\n selected,\n inputLength,\n filteredOptionsCount,\n visible,\n softFocus,\n selectedLabel,\n hoverIndex,\n query,\n inputHovering,\n currentPlaceholder,\n menuVisibleOnFocus,\n isOnComposition,\n isSilentBlur,\n options,\n resetInputHeight,\n managePlaceholder,\n showClose,\n selectDisabled,\n iconComponent,\n iconReverse,\n showNewOption,\n emptyText,\n toggleLastOptionHitState,\n resetInputState,\n handleComposition,\n handleMenuEnter,\n handleFocus,\n blur,\n handleBlur,\n handleClearClick,\n handleClose,\n toggleMenu,\n selectOption,\n getValueKey,\n navigateOptions,\n dropMenuVisible,\n focus,\n\n reference,\n input,\n tooltipRef,\n popperPaneRef,\n tags,\n selectWrapper,\n scrollbar,\n\n wrapperKls,\n selectTagsStyle,\n }\n },\n})\n</script>\n"],"names":["_createVNode","_createCommentVNode","_withModifiers","_withDirectives","_createBlock"],"mappings":";;;qBAuBa,KAAK;;;;;;;EAiLI;;;;;;;;;;;;;;;IApMjBA;WACK;;;MAGJ;MACQ;;MACR;MACC;MACA;MACA;MACD;MACA;MACA;MACA,YAAW;;MAEV,iBAAgB;;;;;;;;gBAOX;;gBAEC;;sCAE2B;;;gCAEf,sDAA4C;;;;;qEAK7C,eAAU;;;;iCAGX;4BACJ;;;;;qCAKY;;;qCACJ;;;;;;8BAKX,yCACK;;;;;;;;;;;;;;;+BAOC;;;;;;iDAKN;iCAEM;gEAC2B;;;;8BAI/B;;;;;kCAIE,KAAKC;;uDAEI;;;;;;;;;;gBAKjB;;;;;;;;sBAQG,QAAQ;sBACR,cAAc;sBACd;;;;;;;;;6BASK;;;;;;;;;;;;sBAUL;;sBAEA;sBACA;;;;;;;;YAIF;YACD;;;YAEA;uBACY;;uBAECC,kBAAc;;oBAElB;;YAER,uBAAqB;YACrB;;YAEA;kBACI,iBAAYC;mBACX,EAAE;qBACA;;gCAEY;;;;;;;;;;;;;gCAwBGC;;;oBAElB;;;;;;;;;;eAKK;;;;;;;;;;;;;;;;;+BArB4B;;;;;;;;;;;aA+B1B;;;;;cAKZ;;;;;;;;;;;;"}
1
+ {"version":3,"file":"select.vue_vue_type_template_id_33774f85_lang.mjs","sources":["../../../../../../packages/components/select/src/select.vue?vue&type=template&id=33774f85&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"selectWrapper\"\n v-click-outside:[popperPaneRef]=\"handleClose\"\n :class=\"wrapperKls\"\n @click.stop=\"toggleMenu\"\n >\n <el-tooltip\n ref=\"tooltipRef\"\n v-model:visible=\"dropMenuVisible\"\n placement=\"bottom-start\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-select__popper ${popperClass}`\"\n :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n effect=\"light\"\n pure\n trigger=\"click\"\n transition=\"el-zoom-in-top\"\n :stop-popper-mouse-event=\"false\"\n :gpu-acceleration=\"false\"\n persistent\n @show=\"handleMenuEnter\"\n >\n <template #default>\n <div class=\"select-trigger\">\n <div\n v-if=\"multiple\"\n ref=\"tags\"\n class=\"el-select__tags\"\n :style=\"selectTagsStyle\"\n >\n <span v-if=\"collapseTags && selected.length\">\n <el-tag\n :closable=\"!selectDisabled && !selected[0].isDisabled\"\n :size=\"collapseTagSize\"\n :hit=\"selected[0].hitState\"\n :type=\"tagType\"\n disable-transitions\n @close=\"deleteTag($event, selected[0])\"\n >\n <span\n class=\"el-select__tags-text\"\n :style=\"{ maxWidth: inputWidth - 123 + 'px' }\"\n >{{ selected[0].currentLabel }}</span\n >\n </el-tag>\n <el-tag\n v-if=\"selected.length > 1\"\n :closable=\"false\"\n :size=\"collapseTagSize\"\n :type=\"tagType\"\n disable-transitions\n >\n <span class=\"el-select__tags-text\"\n >+ {{ selected.length - 1 }}</span\n >\n </el-tag>\n </span>\n <!-- <div> -->\n <transition v-if=\"!collapseTags\" @after-leave=\"resetInputHeight\">\n <span\n :style=\"{\n marginLeft:\n prefixWidth && selected.length ? `${prefixWidth}px` : null,\n }\"\n >\n <el-tag\n v-for=\"item in selected\"\n :key=\"getValueKey(item)\"\n :closable=\"!selectDisabled && !item.isDisabled\"\n :size=\"collapseTagSize\"\n :hit=\"item.hitState\"\n :type=\"tagType\"\n disable-transitions\n @close=\"deleteTag($event, item)\"\n >\n <span\n class=\"el-select__tags-text\"\n :style=\"{ maxWidth: inputWidth - 75 + 'px' }\"\n >{{ item.currentLabel }}</span\n >\n </el-tag>\n </span>\n </transition>\n <!-- </div> -->\n <input\n v-if=\"filterable\"\n ref=\"input\"\n v-model=\"query\"\n type=\"text\"\n class=\"el-select__input\"\n :class=\"[selectSize ? `is-${selectSize}` : '']\"\n :disabled=\"selectDisabled\"\n :autocomplete=\"autocomplete\"\n :style=\"{\n marginLeft:\n (prefixWidth && !selected.length) || tagInMultiLine\n ? `${prefixWidth}px`\n : null,\n flexGrow: '1',\n width: `${inputLength / (inputWidth - 32)}%`,\n maxWidth: `${inputWidth - 42}px`,\n }\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n @keyup=\"managePlaceholder\"\n @keydown=\"resetInputState\"\n @keydown.down.prevent=\"navigateOptions('next')\"\n @keydown.up.prevent=\"navigateOptions('prev')\"\n @keydown.esc.stop.prevent=\"visible = false\"\n @keydown.enter.stop.prevent=\"selectOption\"\n @keydown.delete=\"deletePrevTag\"\n @keydown.tab=\"visible = false\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @input=\"debouncedQueryChange\"\n />\n </div>\n <el-input\n :id=\"id\"\n ref=\"reference\"\n v-model=\"selectedLabel\"\n type=\"text\"\n :placeholder=\"currentPlaceholder\"\n :name=\"name\"\n :autocomplete=\"autocomplete\"\n :size=\"selectSize\"\n :disabled=\"selectDisabled\"\n :readonly=\"readonly\"\n :validate-event=\"false\"\n :class=\"{ 'is-focus': visible }\"\n :tabindex=\"multiple && filterable ? -1 : undefined\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n @input=\"debouncedOnInputChange\"\n @paste=\"debouncedOnInputChange\"\n @compositionstart=\"handleComposition\"\n @compositionupdate=\"handleComposition\"\n @compositionend=\"handleComposition\"\n @keydown.down.stop.prevent=\"navigateOptions('next')\"\n @keydown.up.stop.prevent=\"navigateOptions('prev')\"\n @keydown.enter.stop.prevent=\"selectOption\"\n @keydown.esc.stop.prevent=\"visible = false\"\n @keydown.tab=\"visible = false\"\n @mouseenter=\"inputHovering = true\"\n @mouseleave=\"inputHovering = false\"\n >\n <template v-if=\"$slots.prefix\" #prefix>\n <div\n style=\"\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n \"\n >\n <slot name=\"prefix\"></slot>\n </div>\n </template>\n <template #suffix>\n <el-icon\n v-if=\"iconComponent\"\n v-show=\"!showClose\"\n :class=\"['el-select__caret', 'el-input__icon', iconReverse]\"\n >\n <component :is=\"iconComponent\" />\n </el-icon>\n <el-icon\n v-if=\"showClose && clearIcon\"\n class=\"el-select__caret el-input__icon\"\n @click=\"handleClearClick\"\n >\n <component :is=\"clearIcon\" />\n </el-icon>\n </template>\n </el-input>\n </div>\n </template>\n <template #content>\n <el-select-menu>\n <el-scrollbar\n v-show=\"options.size > 0 && !loading\"\n ref=\"scrollbar\"\n tag=\"ul\"\n wrap-class=\"el-select-dropdown__wrap\"\n view-class=\"el-select-dropdown__list\"\n :class=\"{\n 'is-empty': !allowCreate && query && filteredOptionsCount === 0,\n }\"\n >\n <el-option v-if=\"showNewOption\" :value=\"query\" :created=\"true\" />\n <slot></slot>\n </el-scrollbar>\n <template\n v-if=\"\n emptyText &&\n (!allowCreate || loading || (allowCreate && options.size === 0))\n \"\n >\n <slot v-if=\"$slots.empty\" name=\"empty\"></slot>\n <p v-else class=\"el-select-dropdown__empty\">\n {{ emptyText }}\n </p>\n </template>\n </el-select-menu>\n </template>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n toRefs,\n defineComponent,\n onMounted,\n onBeforeUnmount,\n nextTick,\n reactive,\n provide,\n computed,\n unref,\n} from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useFocus, useLocale } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport {\n addResizeListener,\n removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose, ArrowUp } from '@element-plus/icons-vue'\nimport ElOption from './option.vue'\nimport ElSelectMenu from './select-dropdown.vue'\nimport { useSelect, useSelectStates } from './useSelect'\nimport { selectKey } from './token'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { SelectContext } from './token'\n\nexport default defineComponent({\n name: 'ElSelect',\n componentName: 'ElSelect',\n components: {\n ElInput,\n ElSelectMenu,\n ElOption,\n ElTag,\n ElScrollbar,\n ElTooltip,\n ElIcon,\n },\n directives: { ClickOutside },\n props: {\n name: String,\n id: String,\n modelValue: {\n type: [Array, String, Number, Boolean, Object],\n default: undefined,\n },\n autocomplete: {\n type: String,\n default: 'off',\n },\n automaticDropdown: Boolean,\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n disabled: Boolean,\n clearable: Boolean,\n filterable: Boolean,\n allowCreate: Boolean,\n loading: Boolean,\n popperClass: {\n type: String,\n default: '',\n },\n remote: Boolean,\n loadingText: String,\n noMatchText: String,\n noDataText: String,\n remoteMethod: Function,\n filterMethod: Function,\n multiple: Boolean,\n multipleLimit: {\n type: Number,\n default: 0,\n },\n placeholder: {\n type: String,\n },\n defaultFirstOption: Boolean,\n reserveKeyword: Boolean,\n valueKey: {\n type: String,\n default: 'value',\n },\n collapseTags: Boolean,\n popperAppendToBody: {\n type: Boolean,\n default: true,\n },\n clearIcon: {\n type: [String, Object] as PropType<string | Component>,\n default: CircleClose,\n },\n fitInputWidth: {\n type: Boolean,\n default: false,\n },\n suffixIcon: {\n type: [String, Object] as PropType<string | Component>,\n default: ArrowUp,\n },\n tagType: {\n type: String,\n default: 'info',\n },\n },\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'remove-tag',\n 'clear',\n 'visible-change',\n 'focus',\n 'blur',\n ],\n\n setup(props, ctx) {\n const { t } = useLocale()\n const states = useSelectStates(props)\n const {\n optionsArray,\n selectSize,\n readonly,\n handleResize,\n collapseTagSize,\n debouncedOnInputChange,\n debouncedQueryChange,\n deletePrevTag,\n deleteTag,\n deleteSelected,\n handleOptionSelect,\n scrollToOption,\n setSelected,\n resetInputHeight,\n managePlaceholder,\n showClose,\n selectDisabled,\n iconComponent,\n iconReverse,\n showNewOption,\n emptyText,\n toggleLastOptionHitState,\n resetInputState,\n handleComposition,\n onOptionCreate,\n onOptionDestroy,\n handleMenuEnter,\n handleFocus,\n blur,\n handleBlur,\n handleClearClick,\n handleClose,\n toggleMenu,\n selectOption,\n getValueKey,\n navigateOptions,\n dropMenuVisible,\n\n reference,\n input,\n tooltipRef,\n tags,\n selectWrapper,\n scrollbar,\n queryChange,\n groupQueryChange,\n } = useSelect(props, states, ctx)\n\n const { focus } = useFocus(reference)\n\n const {\n inputWidth,\n selected,\n inputLength,\n filteredOptionsCount,\n visible,\n softFocus,\n selectedLabel,\n hoverIndex,\n query,\n inputHovering,\n currentPlaceholder,\n menuVisibleOnFocus,\n isOnComposition,\n isSilentBlur,\n options,\n cachedOptions,\n optionsCount,\n prefixWidth,\n tagInMultiLine,\n } = toRefs(states)\n\n const wrapperKls = computed(() => {\n const classList = ['el-select']\n const _selectSize = unref(selectSize)\n if (_selectSize) {\n classList.push(`el-select--${_selectSize}`)\n }\n return classList\n })\n\n const selectTagsStyle = computed(() => ({\n maxWidth: `${unref(inputWidth) - 32}px`,\n width: '100%',\n }))\n\n provide(\n selectKey,\n reactive({\n props,\n options,\n optionsArray,\n cachedOptions,\n optionsCount,\n filteredOptionsCount,\n hoverIndex,\n handleOptionSelect,\n onOptionCreate,\n onOptionDestroy,\n selectWrapper,\n selected,\n setSelected,\n queryChange,\n groupQueryChange,\n }) as unknown as SelectContext\n )\n\n onMounted(() => {\n states.cachedPlaceHolder = currentPlaceholder.value =\n props.placeholder || t('el.select.placeholder')\n if (\n props.multiple &&\n Array.isArray(props.modelValue) &&\n props.modelValue.length > 0\n ) {\n currentPlaceholder.value = ''\n }\n addResizeListener(selectWrapper.value as any, handleResize)\n if (reference.value && reference.value.$el) {\n const sizeMap = {\n large: 36,\n default: 32,\n small: 28,\n }\n const input = reference.value.input as HTMLInputElement\n states.initialInputHeight =\n input.getBoundingClientRect().height || sizeMap[selectSize.value]\n }\n if (props.remote && props.multiple) {\n resetInputHeight()\n }\n nextTick(() => {\n if (!reference.value) return\n if (reference.value.$el) {\n inputWidth.value = reference.value.$el.getBoundingClientRect().width\n }\n if (ctx.slots.prefix) {\n const inputChildNodes = reference.value.$el.childNodes\n const input = (Array.from(inputChildNodes) as HTMLElement[]).filter(\n (item) => item.tagName === 'INPUT'\n )[0]\n const prefix = reference.value.$el.querySelector('.el-input__prefix')\n prefixWidth.value = Math.max(\n prefix.getBoundingClientRect().width + 5,\n 30\n )\n if (states.prefixWidth) {\n input.style.paddingLeft = `${Math.max(states.prefixWidth, 30)}px`\n }\n }\n })\n setSelected()\n })\n\n onBeforeUnmount(() => {\n removeResizeListener(selectWrapper.value as any, handleResize)\n })\n\n if (props.multiple && !Array.isArray(props.modelValue)) {\n ctx.emit(UPDATE_MODEL_EVENT, [])\n }\n if (!props.multiple && Array.isArray(props.modelValue)) {\n ctx.emit(UPDATE_MODEL_EVENT, '')\n }\n\n const popperPaneRef = computed(() => {\n return tooltipRef.value?.popperRef?.contentRef\n })\n\n return {\n tagInMultiLine,\n prefixWidth,\n selectSize,\n readonly,\n handleResize,\n collapseTagSize,\n debouncedOnInputChange,\n debouncedQueryChange,\n deletePrevTag,\n deleteTag,\n deleteSelected,\n handleOptionSelect,\n scrollToOption,\n inputWidth,\n selected,\n inputLength,\n filteredOptionsCount,\n visible,\n softFocus,\n selectedLabel,\n hoverIndex,\n query,\n inputHovering,\n currentPlaceholder,\n menuVisibleOnFocus,\n isOnComposition,\n isSilentBlur,\n options,\n resetInputHeight,\n managePlaceholder,\n showClose,\n selectDisabled,\n iconComponent,\n iconReverse,\n showNewOption,\n emptyText,\n toggleLastOptionHitState,\n resetInputState,\n handleComposition,\n handleMenuEnter,\n handleFocus,\n blur,\n handleBlur,\n handleClearClick,\n handleClose,\n toggleMenu,\n selectOption,\n getValueKey,\n navigateOptions,\n dropMenuVisible,\n focus,\n\n reference,\n input,\n tooltipRef,\n popperPaneRef,\n tags,\n selectWrapper,\n scrollbar,\n\n wrapperKls,\n selectTagsStyle,\n }\n },\n})\n</script>\n"],"names":["_createVNode","_createCommentVNode","_withModifiers","_withDirectives","_createBlock"],"mappings":";;;qBAwBa,KAAK;;;;;;;EAiLI;;;;;;;;;;;;;;;IArMjBA;WACK;;;MAGJ;MACQ;;MACR;MACC;MACA;MACA;MACD;MACA;MACA;MACA,UAAU,EAAC;MACV;;MAED;;;;;;;;gBAOM;;gBAEC;;sCAE2B;;;gCAEf,sDAA4C;;;;;qEAK7C,eAAU;;;;iCAGX;4BACJ;;;;;qCAKY;;;qCACJ;;;;;;8BAKX,yCACK;;;;;;;;;;;;;;;+BAOC;;;;;;iDAKN;iCAEM;gEAC2B;;;;8BAI/B;;;;;kCAIE,KAAKC;;uDAEI;;;;;;;;;;gBAKjB;;;;;;;;sBAQG,QAAQ;sBACR,cAAc;sBACd;;;;;;;;;6BASK;;;;;;;;;;;;sBAUL;;sBAEA;sBACA;;;;;;;;YAIF;YACD;;;YAEA;uBACY;;uBAECC,kBAAc;;oBAElB;;YAER,uBAAqB;YACrB;;YAEA;kBACI,iBAAYC;mBACX,EAAE;qBACA;;gCAEY;;;;;;;;;;;;;gCAwBGC;;;oBAElB;;;;;;;;;;eAKK;;;;;;;;;;;;;;;;;+BArB4B;;;;;;;;;;;aA+B1B;;;;;cAKZ;;;;;;;;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"select.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select-v2/src/select.vue"],"sourcesContent":["<template>\n <div\n ref=\"selectRef\"\n v-click-outside:[popperRef]=\"handleClickOutside\"\n :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n class=\"el-select-v2\"\n @click.stop=\"toggleMenu\"\n @mouseenter=\"states.comboBoxHovering = true\"\n @mouseleave=\"states.comboBoxHovering = false\"\n >\n <el-tooltip\n ref=\"popper\"\n v-model:visible=\"dropdownMenuVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-select-v2__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=\"light\"\n placement=\"bottom-start\"\n pure\n transition=\"el-zoom-in-top\"\n trigger=\"click\"\n @show=\"handleMenuEnter\"\n @hide=\"states.inputValue = states.displayInputValue\"\n >\n <template #default>\n <div\n ref=\"selectionRef\"\n class=\"el-select-v2__wrapper\"\n :class=\"{\n 'is-focused': states.isComposing,\n 'is-hovering': states.comboBoxHovering,\n 'is-filterable': filterable,\n 'is-disabled': disabled,\n }\"\n >\n <div v-if=\"$slots.prefix\">\n <slot name=\"prefix\"></slot>\n </div>\n <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n <template v-if=\"collapseTags && modelValue.length > 0\">\n <div class=\"el-select-v2__selected-item\">\n <el-tag\n :closable=\"\n !selectDisabled && !states.cachedOptions[0]?.disable\n \"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, states.cachedOptions[0])\"\n >\n <span\n class=\"el-select-v2__tags-text\"\n :style=\"{\n maxWidth: `${tagMaxWidth}px`,\n }\"\n >{{ states.cachedOptions[0]?.label }}</span\n >\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=\"el-select-v2__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=\"el-select-v2__selected-item\"\n >\n <el-tag\n :key=\"getValueKey(selected)\"\n :closable=\"!selectDisabled && !selected.disabled\"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, selected)\"\n >\n <span\n class=\"el-select-v2__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=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n :style=\"inputWrapperStyle\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n :autocomplete=\"autocomplete\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n autocapitalize=\"off\"\n :aria-expanded=\"expanded\"\n :aria-labelledby=\"label\"\n class=\"el-select-v2__combobox-input\"\n :class=\"[selectSize ? `is-${selectSize}` : '']\"\n :disabled=\"disabled\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </div>\n </div>\n <template v-else>\n <div\n class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n :aria-labelledby=\"label\"\n :aria-expanded=\"expanded\"\n autocapitalize=\"off\"\n :autocomplete=\"autocomplete\"\n class=\"el-select-v2__combobox-input\"\n :disabled=\"disabled\"\n :name=\"name\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </template>\n <span\n v-if=\"shouldShowPlaceholder\"\n :class=\"{\n 'el-select-v2__placeholder': true,\n 'is-transparent':\n states.isComposing ||\n (placeholder && multiple\n ? modelValue.length === 0\n : !hasModelValue),\n }\"\n >\n {{ currentPlaceholder }}\n </span>\n <span class=\"el-select-v2__suffix\">\n <el-icon\n v-if=\"iconComponent\"\n v-show=\"!showClearBtn\"\n :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n >\n <component :is=\"iconComponent\" />\n </el-icon>\n <el-icon\n v-if=\"showClearBtn && clearIcon\"\n class=\"el-select-v2__caret el-input__icon\"\n @click.prevent.stop=\"handleClear\"\n >\n <component :is=\"clearIcon\" />\n </el-icon>\n <el-icon\n v-if=\"validateState && validateIcon\"\n class=\"el-input__icon el-input__validateIcon\"\n >\n <component :is=\"validateIcon\" />\n </el-icon>\n </span>\n </div>\n </template>\n <template #content>\n <el-select-menu\n ref=\"menuRef\"\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=\"el-select-v2__empty\">\n {{ emptyText ? emptyText : '' }}\n </p>\n </slot>\n </template>\n </el-select-menu>\n </template>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n name: 'ElSelectV2',\n components: {\n ElSelectMenu,\n ElTag,\n ElTooltip,\n ElIcon,\n },\n directives: { ClickOutside, ModelText: vModelText },\n props: SelectProps,\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'remove-tag',\n 'clear',\n 'visible-change',\n 'focus',\n 'blur',\n ],\n\n setup(props, { emit }) {\n const API = useSelect(props, emit)\n // TODO, remove the any cast to align the actual API.\n provide(selectV2InjectionKey, {\n props: reactive({\n ...toRefs(props),\n height: API.popupHeight,\n }),\n onSelect: API.onSelect,\n onHover: API.onHover,\n onKeyboardNavigate: API.onKeyboardNavigate,\n onKeyboardSelect: API.onKeyboardSelect,\n } as any)\n\n return API\n },\n})\n</script>\n"],"names":["ElSelectMenu"],"mappings":";;;;;;;;;;;;;AAsQA,aAAe,eAAe,CAAC;AAC/B,EAAE,MAAM,YAAY;EAClB,UAAU,EAAE;kBACVA;IACA,KAAK;IACL;IACA,MAAM;;EAER;EACA,KAAK,EAAE,WAAW;EAClB,KAAK,EAAE;IACL;IACA,YAAY;IACZ,YAAY;IACZ,OAAO;IACP;IACA,OAAO;IACP,MAAM;;EAER;;IAEE,OAAO,CAAC;MACN,KAAK,UAAU,CAAC;QACd,GAAG,MAAM,CAAC,MAAM;QAChB,MAAM,EAAE,GAAG,CAAC,WAAW;OACxB,CAAC;cACM,EAAE,GAAG,CAAC;aACP,KAAK,CAAC,OAAO;MACpB;MACA,gBAAgB,EAAE,GAAG,CAAC;MACtB,CAAC;WACI,GAAG,CAAC;;;;;;"}
1
+ {"version":3,"file":"select.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select-v2/src/select.vue"],"sourcesContent":["<template>\n <div\n ref=\"selectRef\"\n v-click-outside:[popperRef]=\"handleClickOutside\"\n :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n class=\"el-select-v2\"\n @click.stop=\"toggleMenu\"\n @mouseenter=\"states.comboBoxHovering = true\"\n @mouseleave=\"states.comboBoxHovering = false\"\n >\n <el-tooltip\n ref=\"popper\"\n v-model:visible=\"dropdownMenuVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-select-v2__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=\"light\"\n placement=\"bottom-start\"\n pure\n transition=\"el-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=\"el-select-v2__wrapper\"\n :class=\"{\n 'is-focused': states.isComposing,\n 'is-hovering': states.comboBoxHovering,\n 'is-filterable': filterable,\n 'is-disabled': disabled,\n }\"\n >\n <div v-if=\"$slots.prefix\">\n <slot name=\"prefix\"></slot>\n </div>\n <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n <template v-if=\"collapseTags && modelValue.length > 0\">\n <div class=\"el-select-v2__selected-item\">\n <el-tag\n :closable=\"\n !selectDisabled && !states.cachedOptions[0]?.disable\n \"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, states.cachedOptions[0])\"\n >\n <span\n class=\"el-select-v2__tags-text\"\n :style=\"{\n maxWidth: `${tagMaxWidth}px`,\n }\"\n >{{ states.cachedOptions[0]?.label }}</span\n >\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=\"el-select-v2__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=\"el-select-v2__selected-item\"\n >\n <el-tag\n :key=\"getValueKey(selected)\"\n :closable=\"!selectDisabled && !selected.disabled\"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, selected)\"\n >\n <span\n class=\"el-select-v2__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=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n :style=\"inputWrapperStyle\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n :autocomplete=\"autocomplete\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n autocapitalize=\"off\"\n :aria-expanded=\"expanded\"\n :aria-labelledby=\"label\"\n class=\"el-select-v2__combobox-input\"\n :class=\"[selectSize ? `is-${selectSize}` : '']\"\n :disabled=\"disabled\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </div>\n </div>\n <template v-else>\n <div\n class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n :aria-labelledby=\"label\"\n :aria-expanded=\"expanded\"\n autocapitalize=\"off\"\n :autocomplete=\"autocomplete\"\n class=\"el-select-v2__combobox-input\"\n :disabled=\"disabled\"\n :name=\"name\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </template>\n <span\n v-if=\"shouldShowPlaceholder\"\n :class=\"{\n 'el-select-v2__placeholder': true,\n 'is-transparent':\n states.isComposing ||\n (placeholder && multiple\n ? modelValue.length === 0\n : !hasModelValue),\n }\"\n >\n {{ currentPlaceholder }}\n </span>\n <span class=\"el-select-v2__suffix\">\n <el-icon\n v-if=\"iconComponent\"\n v-show=\"!showClearBtn\"\n :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n >\n <component :is=\"iconComponent\" />\n </el-icon>\n <el-icon\n v-if=\"showClearBtn && clearIcon\"\n class=\"el-select-v2__caret el-input__icon\"\n @click.prevent.stop=\"handleClear\"\n >\n <component :is=\"clearIcon\" />\n </el-icon>\n <el-icon\n v-if=\"validateState && validateIcon\"\n class=\"el-input__icon el-input__validateIcon\"\n >\n <component :is=\"validateIcon\" />\n </el-icon>\n </span>\n </div>\n </template>\n <template #content>\n <el-select-menu\n ref=\"menuRef\"\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=\"el-select-v2__empty\">\n {{ emptyText ? emptyText : '' }}\n </p>\n </slot>\n </template>\n </el-select-menu>\n </template>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n name: 'ElSelectV2',\n components: {\n ElSelectMenu,\n ElTag,\n ElTooltip,\n ElIcon,\n },\n directives: { ClickOutside, ModelText: vModelText },\n props: SelectProps,\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'remove-tag',\n 'clear',\n 'visible-change',\n 'focus',\n 'blur',\n ],\n\n setup(props, { emit }) {\n const API = useSelect(props, emit)\n // TODO, remove the any cast to align the actual API.\n provide(selectV2InjectionKey, {\n props: reactive({\n ...toRefs(props),\n height: API.popupHeight,\n }),\n onSelect: API.onSelect,\n onHover: API.onHover,\n onKeyboardNavigate: API.onKeyboardNavigate,\n onKeyboardSelect: API.onKeyboardSelect,\n } as any)\n\n return API\n },\n})\n</script>\n"],"names":["ElSelectMenu"],"mappings":";;;;;;;;;;;;;AAuQA,aAAe,eAAe,CAAC;AAC/B,EAAE,MAAM,YAAY;EAClB,UAAU,EAAE;kBACVA;IACA,KAAK;IACL;IACA,MAAM;;EAER;EACA,KAAK,EAAE,WAAW;EAClB,KAAK,EAAE;IACL;IACA,YAAY;IACZ,YAAY;IACZ,OAAO;IACP;IACA,OAAO;IACP,MAAM;;EAER;;IAEE,OAAO,CAAC;MACN,KAAK,UAAU,CAAC;QACd,GAAG,MAAM,CAAC,MAAM;QAChB,MAAM,EAAE,GAAG,CAAC,WAAW;OACxB,CAAC;cACM,EAAE,GAAG,CAAC;aACP,KAAK,CAAC,OAAO;MACpB;MACA,gBAAgB,EAAE,GAAG,CAAC;MACtB,CAAC;WACI,GAAG,CAAC;;;;;;"}
@@ -45,6 +45,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
45
45
  pure: "",
46
46
  transition: "el-zoom-in-top",
47
47
  trigger: "click",
48
+ persistent: "",
48
49
  onShow: _ctx.handleMenuEnter,
49
50
  onHide: _cache[23] || (_cache[23] = ($event) => _ctx.states.inputValue = _ctx.states.displayInputValue)
50
51
  }, {
@@ -1 +1 @@
1
- {"version":3,"file":"select.vue_vue_type_template_id_13e598a4_lang.mjs","sources":["../../../../../../packages/components/select-v2/src/select.vue?vue&type=template&id=13e598a4&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"selectRef\"\n v-click-outside:[popperRef]=\"handleClickOutside\"\n :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n class=\"el-select-v2\"\n @click.stop=\"toggleMenu\"\n @mouseenter=\"states.comboBoxHovering = true\"\n @mouseleave=\"states.comboBoxHovering = false\"\n >\n <el-tooltip\n ref=\"popper\"\n v-model:visible=\"dropdownMenuVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-select-v2__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=\"light\"\n placement=\"bottom-start\"\n pure\n transition=\"el-zoom-in-top\"\n trigger=\"click\"\n @show=\"handleMenuEnter\"\n @hide=\"states.inputValue = states.displayInputValue\"\n >\n <template #default>\n <div\n ref=\"selectionRef\"\n class=\"el-select-v2__wrapper\"\n :class=\"{\n 'is-focused': states.isComposing,\n 'is-hovering': states.comboBoxHovering,\n 'is-filterable': filterable,\n 'is-disabled': disabled,\n }\"\n >\n <div v-if=\"$slots.prefix\">\n <slot name=\"prefix\"></slot>\n </div>\n <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n <template v-if=\"collapseTags && modelValue.length > 0\">\n <div class=\"el-select-v2__selected-item\">\n <el-tag\n :closable=\"\n !selectDisabled && !states.cachedOptions[0]?.disable\n \"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, states.cachedOptions[0])\"\n >\n <span\n class=\"el-select-v2__tags-text\"\n :style=\"{\n maxWidth: `${tagMaxWidth}px`,\n }\"\n >{{ states.cachedOptions[0]?.label }}</span\n >\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=\"el-select-v2__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=\"el-select-v2__selected-item\"\n >\n <el-tag\n :key=\"getValueKey(selected)\"\n :closable=\"!selectDisabled && !selected.disabled\"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, selected)\"\n >\n <span\n class=\"el-select-v2__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=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n :style=\"inputWrapperStyle\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n :autocomplete=\"autocomplete\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n autocapitalize=\"off\"\n :aria-expanded=\"expanded\"\n :aria-labelledby=\"label\"\n class=\"el-select-v2__combobox-input\"\n :class=\"[selectSize ? `is-${selectSize}` : '']\"\n :disabled=\"disabled\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </div>\n </div>\n <template v-else>\n <div\n class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n :aria-labelledby=\"label\"\n :aria-expanded=\"expanded\"\n autocapitalize=\"off\"\n :autocomplete=\"autocomplete\"\n class=\"el-select-v2__combobox-input\"\n :disabled=\"disabled\"\n :name=\"name\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </template>\n <span\n v-if=\"shouldShowPlaceholder\"\n :class=\"{\n 'el-select-v2__placeholder': true,\n 'is-transparent':\n states.isComposing ||\n (placeholder && multiple\n ? modelValue.length === 0\n : !hasModelValue),\n }\"\n >\n {{ currentPlaceholder }}\n </span>\n <span class=\"el-select-v2__suffix\">\n <el-icon\n v-if=\"iconComponent\"\n v-show=\"!showClearBtn\"\n :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n >\n <component :is=\"iconComponent\" />\n </el-icon>\n <el-icon\n v-if=\"showClearBtn && clearIcon\"\n class=\"el-select-v2__caret el-input__icon\"\n @click.prevent.stop=\"handleClear\"\n >\n <component :is=\"clearIcon\" />\n </el-icon>\n <el-icon\n v-if=\"validateState && validateIcon\"\n class=\"el-input__icon el-input__validateIcon\"\n >\n <component :is=\"validateIcon\" />\n </el-icon>\n </span>\n </div>\n </template>\n <template #content>\n <el-select-menu\n ref=\"menuRef\"\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=\"el-select-v2__empty\">\n {{ emptyText ? emptyText : '' }}\n </p>\n </slot>\n </template>\n </el-select-menu>\n </template>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n name: 'ElSelectV2',\n components: {\n ElSelectMenu,\n ElTag,\n ElTooltip,\n ElIcon,\n },\n directives: { ClickOutside, ModelText: vModelText },\n props: SelectProps,\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'remove-tag',\n 'clear',\n 'visible-change',\n 'focus',\n 'blur',\n ],\n\n setup(props, { emit }) {\n const API = useSelect(props, emit)\n // TODO, remove the any cast to align the actual API.\n provide(selectV2InjectionKey, {\n props: reactive({\n ...toRefs(props),\n height: API.popupHeight,\n }),\n onSelect: API.onSelect,\n onHover: API.onHover,\n onKeyboardNavigate: API.onKeyboardNavigate,\n onKeyboardSelect: API.onKeyboardSelect,\n } as any)\n\n return API\n },\n})\n</script>\n"],"names":["_createVNode","_normalizeStyle","_openBlock","_toDisplayString","_createElementBlock","_withCtx","_normalizeClass","_withDirectives"],"mappings":";;;;;;EAyC+B;;;;EAEZ;;;;0BA2GA;;;kDAsDyB;eAqC3B,KAAK,EAAC;;;;;;;;;;;IA/OnB;IAEC,qFACK;;IAELA,WAAU;;;;MAIT;MACQ;;MACP;MACA;MACA;MACA;MACA;MACA;MACD;MACA,SAAS;MACT,MAAA;MACA;;MAEC;YACI;;;;;;;;;;;;;;gBAcC;;;;6BAEF;;;;;;;;;wBASQ;wBACC,OAAKC;;;;;;;;8CAOAC,WAAO;;;;;yCAGf;;mCAEW;;;;;;8BAKTC;;;;;gCAKG,IAAEC,mBAAG;;;;;;;;wBAST,QAAQ;;;;6BAIHC;;;;0BAIJ;0BACC;;;;;;;;;;;;;;;kBAaL;kBACC;;;;uBAII,EAACC;gCAES;;;;;;;;;;;;;;oBAeZ,qBAAiB,wCAAE,2DAAkB;oBACrC,OAAK;oBACL,OAAK;oBACL,6HAAwC;oBACxC,2DAAmB,qEAAuB;;6BAEnC;;;;;;;;;;mBAOF;;;;;;qCAIN;;;;;;;;sBAUG,EAAE;;;qCAIS;;qCAEE;oCACD;;;;;;oBAMd;oBACD,UAAU;oBACV,MAAK;oBACJ,oCAAgC;;uCAEf;;uEAEV;;;;;;;;;;;;;;;;;oCAYE;;mCAEZC,2BAAe;;;;;4BAInB;;gBAEG;;;;;;;;;;;;;;kBAeE,+DAAiD;;;;;;;;;;aAK5C;;;sBACD;;;oCAGL;;;;;;kCAGuB;;;sBAClB;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"select.vue_vue_type_template_id_13e598a4_lang.mjs","sources":["../../../../../../packages/components/select-v2/src/select.vue?vue&type=template&id=13e598a4&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"selectRef\"\n v-click-outside:[popperRef]=\"handleClickOutside\"\n :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n class=\"el-select-v2\"\n @click.stop=\"toggleMenu\"\n @mouseenter=\"states.comboBoxHovering = true\"\n @mouseleave=\"states.comboBoxHovering = false\"\n >\n <el-tooltip\n ref=\"popper\"\n v-model:visible=\"dropdownMenuVisible\"\n :append-to-body=\"popperAppendToBody\"\n :popper-class=\"`el-select-v2__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=\"light\"\n placement=\"bottom-start\"\n pure\n transition=\"el-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=\"el-select-v2__wrapper\"\n :class=\"{\n 'is-focused': states.isComposing,\n 'is-hovering': states.comboBoxHovering,\n 'is-filterable': filterable,\n 'is-disabled': disabled,\n }\"\n >\n <div v-if=\"$slots.prefix\">\n <slot name=\"prefix\"></slot>\n </div>\n <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n <template v-if=\"collapseTags && modelValue.length > 0\">\n <div class=\"el-select-v2__selected-item\">\n <el-tag\n :closable=\"\n !selectDisabled && !states.cachedOptions[0]?.disable\n \"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, states.cachedOptions[0])\"\n >\n <span\n class=\"el-select-v2__tags-text\"\n :style=\"{\n maxWidth: `${tagMaxWidth}px`,\n }\"\n >{{ states.cachedOptions[0]?.label }}</span\n >\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=\"el-select-v2__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=\"el-select-v2__selected-item\"\n >\n <el-tag\n :key=\"getValueKey(selected)\"\n :closable=\"!selectDisabled && !selected.disabled\"\n :size=\"collapseTagSize\"\n type=\"info\"\n disable-transitions\n @close=\"deleteTag($event, selected)\"\n >\n <span\n class=\"el-select-v2__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=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n :style=\"inputWrapperStyle\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n :autocomplete=\"autocomplete\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n autocapitalize=\"off\"\n :aria-expanded=\"expanded\"\n :aria-labelledby=\"label\"\n class=\"el-select-v2__combobox-input\"\n :class=\"[selectSize ? `is-${selectSize}` : '']\"\n :disabled=\"disabled\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </div>\n </div>\n <template v-else>\n <div\n class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n >\n <input\n :id=\"id\"\n ref=\"inputRef\"\n v-model-text=\"states.displayInputValue\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n :aria-labelledby=\"label\"\n :aria-expanded=\"expanded\"\n autocapitalize=\"off\"\n :autocomplete=\"autocomplete\"\n class=\"el-select-v2__combobox-input\"\n :disabled=\"disabled\"\n :name=\"name\"\n role=\"combobox\"\n :readonly=\"!filterable\"\n spellcheck=\"false\"\n type=\"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=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n v-text=\"states.displayInputValue\"\n >\n </span>\n </template>\n <span\n v-if=\"shouldShowPlaceholder\"\n :class=\"{\n 'el-select-v2__placeholder': true,\n 'is-transparent':\n states.isComposing ||\n (placeholder && multiple\n ? modelValue.length === 0\n : !hasModelValue),\n }\"\n >\n {{ currentPlaceholder }}\n </span>\n <span class=\"el-select-v2__suffix\">\n <el-icon\n v-if=\"iconComponent\"\n v-show=\"!showClearBtn\"\n :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n >\n <component :is=\"iconComponent\" />\n </el-icon>\n <el-icon\n v-if=\"showClearBtn && clearIcon\"\n class=\"el-select-v2__caret el-input__icon\"\n @click.prevent.stop=\"handleClear\"\n >\n <component :is=\"clearIcon\" />\n </el-icon>\n <el-icon\n v-if=\"validateState && validateIcon\"\n class=\"el-input__icon el-input__validateIcon\"\n >\n <component :is=\"validateIcon\" />\n </el-icon>\n </span>\n </div>\n </template>\n <template #content>\n <el-select-menu\n ref=\"menuRef\"\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=\"el-select-v2__empty\">\n {{ emptyText ? emptyText : '' }}\n </p>\n </slot>\n </template>\n </el-select-menu>\n </template>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n name: 'ElSelectV2',\n components: {\n ElSelectMenu,\n ElTag,\n ElTooltip,\n ElIcon,\n },\n directives: { ClickOutside, ModelText: vModelText },\n props: SelectProps,\n emits: [\n UPDATE_MODEL_EVENT,\n CHANGE_EVENT,\n 'remove-tag',\n 'clear',\n 'visible-change',\n 'focus',\n 'blur',\n ],\n\n setup(props, { emit }) {\n const API = useSelect(props, emit)\n // TODO, remove the any cast to align the actual API.\n provide(selectV2InjectionKey, {\n props: reactive({\n ...toRefs(props),\n height: API.popupHeight,\n }),\n onSelect: API.onSelect,\n onHover: API.onHover,\n onKeyboardNavigate: API.onKeyboardNavigate,\n onKeyboardSelect: API.onKeyboardSelect,\n } as any)\n\n return API\n },\n})\n</script>\n"],"names":["_createVNode","_normalizeStyle","_openBlock","_toDisplayString","_createElementBlock","_withCtx","_normalizeClass","_withDirectives"],"mappings":";;;;;;EA0C+B;;;;EAEZ;;;;0BA2GA;;;kDAsDyB;eAqC3B,KAAK,EAAC;;;;;;;;;;;IAhPnB;IAEC,qFACK;;IAELA,WAAU;;;;MAIT;MACQ;;MACP;MACA;MACA;MACA;MACA;MACA;MACD;MACA,SAAS;MACT;MACA,YAAW;MACX;;MAEC;YACI;;;;;;;;;;;;;;gBAcC;;;;6BAEF;;;;;;;;;wBASQ;wBACC,OAAKC;;;;;;;;8CAOAC,WAAO;;;;;yCAGf;;mCAEW;;;;;;8BAKTC;;;;;gCAKG,IAAEC,mBAAG;;;;;;;;wBAST,QAAQ;;;;6BAIHC;;;;0BAIJ;0BACC;;;;;;;;;;;;;;;kBAaL;kBACC;;;;uBAII,EAACC;gCAES;;;;;;;;;;;;;;oBAeZ,qBAAiB,wCAAE,2DAAkB;oBACrC,OAAK;oBACL,OAAK;oBACL,6HAAwC;oBACxC,2DAAmB,qEAAuB;;6BAEnC;;;;;;;;;;mBAOF;;;;;;qCAIN;;;;;;;;sBAUG,EAAE;;;qCAIS;;qCAEE;oCACD;;;;;;oBAMd;oBACD,UAAU;oBACV,MAAK;oBACJ,oCAAgC;;uCAEf;;uEAEV;;;;;;;;;;;;;;;;;oCAYE;;mCAEZC,2BAAe;;;;;4BAInB;;gBAEG;;;;;;;;;;;;;;kBAeE,+DAAiD;;;;;;;;;;aAK5C;;;sBACD;;;oCAGL;;;;;;kCAGuB;;;sBAClB;;;;;;;;;;;;;;;;"}
@@ -1,7 +1,7 @@
1
1
  import { withInstall, withNoopInstall } from '../../utils/with-install.mjs';
2
- import './src/skeleton2.mjs';
2
+ import './src/skeleton.mjs';
3
3
  import './src/skeleton-item2.mjs';
4
- export { skeletonProps } from './src/skeleton.mjs';
4
+ export { skeletonProps } from './src/skeleton2.mjs';
5
5
  export { skeletonItemProps } from './src/skeleton-item.mjs';
6
6
  import script from './src/skeleton.vue_vue_type_script_lang.mjs';
7
7
  import script$1 from './src/skeleton-item.vue_vue_type_script_lang.mjs';
@@ -1,26 +1,7 @@
1
- import { buildProps } from '../../../utils/props.mjs';
1
+ import script from './skeleton.vue_vue_type_script_lang.mjs';
2
+ export { default } from './skeleton.vue_vue_type_script_lang.mjs';
3
+ import { render } from './skeleton.vue_vue_type_template_id_26fa9225_lang.mjs';
2
4
 
3
- const skeletonProps = buildProps({
4
- animated: {
5
- type: Boolean,
6
- default: false
7
- },
8
- count: {
9
- type: Number,
10
- default: 1
11
- },
12
- rows: {
13
- type: Number,
14
- default: 3
15
- },
16
- loading: {
17
- type: Boolean,
18
- default: true
19
- },
20
- throttle: {
21
- type: Number
22
- }
23
- });
24
-
25
- export { skeletonProps };
5
+ script.render = render;
6
+ script.__file = "packages/components/skeleton/src/skeleton.vue";
26
7
  //# sourceMappingURL=skeleton.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"skeleton.mjs","sources":["../../../../../../packages/components/skeleton/src/skeleton.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport type Skeleton from './skeleton.vue'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const skeletonProps = buildProps({\n animated: {\n type: Boolean,\n default: false,\n },\n count: {\n type: Number,\n default: 1,\n },\n rows: {\n type: Number,\n default: 3,\n },\n loading: {\n type: Boolean,\n default: true,\n },\n throttle: {\n type: Number,\n },\n} as const)\nexport type SkeletonProps = ExtractPropTypes<typeof skeletonProps>\n\nexport type SkeletonInstance = InstanceType<typeof Skeleton>\n"],"names":[],"mappings":";;AACY,MAAC,aAAa,GAAG,UAAU,CAAC;AACxC,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,CAAC;;;;"}
1
+ {"version":3,"file":"skeleton.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
@@ -1,7 +1,7 @@
1
1
  import { defineComponent, computed } from 'vue';
2
2
  import '../../../hooks/index.mjs';
3
3
  import './skeleton-item2.mjs';
4
- import { skeletonProps } from './skeleton.mjs';
4
+ import { skeletonProps } from './skeleton2.mjs';
5
5
  import script$1 from './skeleton-item.vue_vue_type_script_lang.mjs';
6
6
  import { useThrottleRender } from '../../../hooks/use-throttle-render/index.mjs';
7
7
 
@@ -1,7 +1,26 @@
1
- import script from './skeleton.vue_vue_type_script_lang.mjs';
2
- export { default } from './skeleton.vue_vue_type_script_lang.mjs';
3
- import { render } from './skeleton.vue_vue_type_template_id_26fa9225_lang.mjs';
1
+ import { buildProps } from '../../../utils/props.mjs';
4
2
 
5
- script.render = render;
6
- script.__file = "packages/components/skeleton/src/skeleton.vue";
3
+ const skeletonProps = buildProps({
4
+ animated: {
5
+ type: Boolean,
6
+ default: false
7
+ },
8
+ count: {
9
+ type: Number,
10
+ default: 1
11
+ },
12
+ rows: {
13
+ type: Number,
14
+ default: 3
15
+ },
16
+ loading: {
17
+ type: Boolean,
18
+ default: true
19
+ },
20
+ throttle: {
21
+ type: Number
22
+ }
23
+ });
24
+
25
+ export { skeletonProps };
7
26
  //# sourceMappingURL=skeleton2.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"skeleton2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
1
+ {"version":3,"file":"skeleton2.mjs","sources":["../../../../../../packages/components/skeleton/src/skeleton.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport type Skeleton from './skeleton.vue'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const skeletonProps = buildProps({\n animated: {\n type: Boolean,\n default: false,\n },\n count: {\n type: Number,\n default: 1,\n },\n rows: {\n type: Number,\n default: 3,\n },\n loading: {\n type: Boolean,\n default: true,\n },\n throttle: {\n type: Number,\n },\n} as const)\nexport type SkeletonProps = ExtractPropTypes<typeof skeletonProps>\n\nexport type SkeletonInstance = InstanceType<typeof Skeleton>\n"],"names":[],"mappings":";;AACY,MAAC,aAAa,GAAG,UAAU,CAAC;AACxC,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,CAAC;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"button.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue"],"sourcesContent":["<template>\n <div\n ref=\"button\"\n class=\"el-slider__button-wrapper\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n :style=\"wrapperStyle\"\n tabindex=\"0\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n @mousedown=\"onButtonDown\"\n @touchstart=\"onButtonDown\"\n @focus=\"handleMouseEnter\"\n @blur=\"handleMouseLeave\"\n @keydown.left=\"onLeftKeyDown\"\n @keydown.right=\"onRightKeyDown\"\n @keydown.down.prevent=\"onLeftKeyDown\"\n @keydown.up.prevent=\"onRightKeyDown\"\n >\n <el-tooltip\n ref=\"tooltip\"\n v-model=\"tooltipVisible\"\n placement=\"top\"\n :stop-popper-mouse-event=\"false\"\n :popper-class=\"tooltipClass\"\n :disabled=\"!showTooltip\"\n manual\n >\n <template #content>\n <span>{{ formatValue }}</span>\n </template>\n <div\n class=\"el-slider__button\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n ></div>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n name: 'ElSliderButton',\n\n components: {\n ElTooltip,\n },\n\n props: {\n modelValue: {\n type: Number,\n default: 0,\n },\n vertical: {\n type: Boolean,\n default: false,\n },\n tooltipClass: {\n type: String,\n default: '',\n },\n },\n\n emits: [UPDATE_MODEL_EVENT],\n\n setup(props, { emit }) {\n const initData = reactive({\n hovering: false,\n dragging: false,\n isClick: false,\n startX: 0,\n currentX: 0,\n startY: 0,\n currentY: 0,\n startPosition: 0,\n newPosition: 0,\n oldValue: props.modelValue,\n })\n\n const {\n tooltip,\n showTooltip,\n tooltipVisible,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n } = useSliderButton(props, initData, emit)\n\n const { hovering, dragging } = toRefs(initData)\n\n return {\n tooltip,\n tooltipVisible,\n showTooltip,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n\n hovering,\n dragging,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;AA0CA,aAAe,eAAe;;AAE9B,EAAE,UAAU;IACR,SAAS;;EAEX,KAAK,EAAE;IACL;;;KAGC;IACD,QAAQ,EAAE;MACR,IAAI,EAAE;MACN,OAAO,EAAE;KACV;IACD;MACE,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,EAAE;KACZ;;OAEE,EAAE,CAAC;OACH,CAAC,KAAK,EAAE,EAAE;IACb;;;MAGE,OAAO,EAAE,KAAK;;MAEd,WAAW;MACX,MAAM,EAAE,CAAC;MACT,QAAQ,EAAE,CAAC;MACX,aAAa,EAAE;MACf,WAAW,EAAE,CAAC;MACd,QAAQ;MACR,CAAC;UACG;MACJ,OAAO;MACP,WAAW;MACX,cAAc;MACd,YAAY;;;MAGZ;MACA;MACA;MACA,cAAc;MACd,WAAW;QACT;UACE,EAAE,QAAQ,EAAE;WACX;MACL,OAAO;MACP;MACA,WAAW;MACX;MACA,WAAW;;MAEX,gBAAgB;;MAEhB;MACA;MACA,WAAW;MACX,QAAQ;MACR,QAAQ;MACR;;;;;;"}
1
+ {"version":3,"file":"button.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue"],"sourcesContent":["<template>\n <div\n ref=\"button\"\n class=\"el-slider__button-wrapper\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n :style=\"wrapperStyle\"\n tabindex=\"0\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n @mousedown=\"onButtonDown\"\n @touchstart=\"onButtonDown\"\n @focus=\"handleMouseEnter\"\n @blur=\"handleMouseLeave\"\n @keydown.left=\"onLeftKeyDown\"\n @keydown.right=\"onRightKeyDown\"\n @keydown.down.prevent=\"onLeftKeyDown\"\n @keydown.up.prevent=\"onRightKeyDown\"\n >\n <el-tooltip\n ref=\"tooltip\"\n v-model=\"tooltipVisible\"\n placement=\"top\"\n :stop-popper-mouse-event=\"false\"\n :popper-class=\"tooltipClass\"\n :disabled=\"!showTooltip\"\n manual\n persistent\n >\n <template #content>\n <span>{{ formatValue }}</span>\n </template>\n <div\n class=\"el-slider__button\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n ></div>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n name: 'ElSliderButton',\n\n components: {\n ElTooltip,\n },\n\n props: {\n modelValue: {\n type: Number,\n default: 0,\n },\n vertical: {\n type: Boolean,\n default: false,\n },\n tooltipClass: {\n type: String,\n default: '',\n },\n },\n\n emits: [UPDATE_MODEL_EVENT],\n\n setup(props, { emit }) {\n const initData = reactive({\n hovering: false,\n dragging: false,\n isClick: false,\n startX: 0,\n currentX: 0,\n startY: 0,\n currentY: 0,\n startPosition: 0,\n newPosition: 0,\n oldValue: props.modelValue,\n })\n\n const {\n tooltip,\n showTooltip,\n tooltipVisible,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n } = useSliderButton(props, initData, emit)\n\n const { hovering, dragging } = toRefs(initData)\n\n return {\n tooltip,\n tooltipVisible,\n showTooltip,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n\n hovering,\n dragging,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;AA2CA,aAAe,eAAe;;AAE9B,EAAE,UAAU;IACR,SAAS;;EAEX,KAAK,EAAE;IACL;;;KAGC;IACD,QAAQ,EAAE;MACR,IAAI,EAAE;MACN,OAAO,EAAE;KACV;IACD;MACE,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,EAAE;KACZ;;OAEE,EAAE,CAAC;OACH,CAAC,KAAK,EAAE,EAAE;IACb;;;MAGE,OAAO,EAAE,KAAK;;MAEd,WAAW;MACX,MAAM,EAAE,CAAC;MACT,QAAQ,EAAE,CAAC;MACX,aAAa,EAAE;MACf,WAAW,EAAE,CAAC;MACd,QAAQ;MACR,CAAC;UACG;MACJ,OAAO;MACP,WAAW;MACX,cAAc;MACd,YAAY;;;MAGZ;MACA;MACA;MACA,cAAc;MACd,WAAW;QACT;UACE,EAAE,QAAQ,EAAE;WACX;MACL,OAAO;MACP;MACA,WAAW;MACX;MACA,WAAW;;MAEX,gBAAgB;;MAEhB;MACA;MACA,WAAW;MACX,QAAQ;MACR,QAAQ;MACR;;;;;;"}
@@ -28,7 +28,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
28
28
  "stop-popper-mouse-event": false,
29
29
  "popper-class": _ctx.tooltipClass,
30
30
  disabled: !_ctx.showTooltip,
31
- manual: ""
31
+ manual: "",
32
+ persistent: ""
32
33
  }, {
33
34
  content: withCtx(() => [
34
35
  createElementVNode("span", null, toDisplayString(_ctx.formatValue), 1)
@@ -1 +1 @@
1
- {"version":3,"file":"button.vue_vue_type_template_id_9cd3e794_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue?vue&type=template&id=9cd3e794&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"button\"\n class=\"el-slider__button-wrapper\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n :style=\"wrapperStyle\"\n tabindex=\"0\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n @mousedown=\"onButtonDown\"\n @touchstart=\"onButtonDown\"\n @focus=\"handleMouseEnter\"\n @blur=\"handleMouseLeave\"\n @keydown.left=\"onLeftKeyDown\"\n @keydown.right=\"onRightKeyDown\"\n @keydown.down.prevent=\"onLeftKeyDown\"\n @keydown.up.prevent=\"onRightKeyDown\"\n >\n <el-tooltip\n ref=\"tooltip\"\n v-model=\"tooltipVisible\"\n placement=\"top\"\n :stop-popper-mouse-event=\"false\"\n :popper-class=\"tooltipClass\"\n :disabled=\"!showTooltip\"\n manual\n >\n <template #content>\n <span>{{ formatValue }}</span>\n </template>\n <div\n class=\"el-slider__button\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n ></div>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n name: 'ElSliderButton',\n\n components: {\n ElTooltip,\n },\n\n props: {\n modelValue: {\n type: Number,\n default: 0,\n },\n vertical: {\n type: Boolean,\n default: false,\n },\n tooltipClass: {\n type: String,\n default: '',\n },\n },\n\n emits: [UPDATE_MODEL_EVENT],\n\n setup(props, { emit }) {\n const initData = reactive({\n hovering: false,\n dragging: false,\n isClick: false,\n startX: 0,\n currentX: 0,\n startY: 0,\n currentY: 0,\n startPosition: 0,\n newPosition: 0,\n oldValue: props.modelValue,\n })\n\n const {\n tooltip,\n showTooltip,\n tooltipVisible,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n } = useSliderButton(props, initData, emit)\n\n const { hovering, dragging } = toRefs(initData)\n\n return {\n tooltip,\n tooltipVisible,\n showTooltip,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n\n hovering,\n dragging,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;IAEI,KAAI;IACJ;IAEC,uBAAO,iBAAY;IACpB;IACC;IACA,YAAU;IACV,qDAAW;IACX,qGAAwB;IACxB;0GACsB;aACf;sDAAO;;;;;;;MAMb;;;MAEA;MACC,2BAAyB;MACzB;;MAED;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"button.vue_vue_type_template_id_9cd3e794_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue?vue&type=template&id=9cd3e794&lang.js"],"sourcesContent":["<template>\n <div\n ref=\"button\"\n class=\"el-slider__button-wrapper\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n :style=\"wrapperStyle\"\n tabindex=\"0\"\n @mouseenter=\"handleMouseEnter\"\n @mouseleave=\"handleMouseLeave\"\n @mousedown=\"onButtonDown\"\n @touchstart=\"onButtonDown\"\n @focus=\"handleMouseEnter\"\n @blur=\"handleMouseLeave\"\n @keydown.left=\"onLeftKeyDown\"\n @keydown.right=\"onRightKeyDown\"\n @keydown.down.prevent=\"onLeftKeyDown\"\n @keydown.up.prevent=\"onRightKeyDown\"\n >\n <el-tooltip\n ref=\"tooltip\"\n v-model=\"tooltipVisible\"\n placement=\"top\"\n :stop-popper-mouse-event=\"false\"\n :popper-class=\"tooltipClass\"\n :disabled=\"!showTooltip\"\n manual\n persistent\n >\n <template #content>\n <span>{{ formatValue }}</span>\n </template>\n <div\n class=\"el-slider__button\"\n :class=\"{ hover: hovering, dragging: dragging }\"\n ></div>\n </el-tooltip>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n name: 'ElSliderButton',\n\n components: {\n ElTooltip,\n },\n\n props: {\n modelValue: {\n type: Number,\n default: 0,\n },\n vertical: {\n type: Boolean,\n default: false,\n },\n tooltipClass: {\n type: String,\n default: '',\n },\n },\n\n emits: [UPDATE_MODEL_EVENT],\n\n setup(props, { emit }) {\n const initData = reactive({\n hovering: false,\n dragging: false,\n isClick: false,\n startX: 0,\n currentX: 0,\n startY: 0,\n currentY: 0,\n startPosition: 0,\n newPosition: 0,\n oldValue: props.modelValue,\n })\n\n const {\n tooltip,\n showTooltip,\n tooltipVisible,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n } = useSliderButton(props, initData, emit)\n\n const { hovering, dragging } = toRefs(initData)\n\n return {\n tooltip,\n tooltipVisible,\n showTooltip,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onLeftKeyDown,\n onRightKeyDown,\n setPosition,\n\n hovering,\n dragging,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;IAEI,KAAI;IACJ;IAEC,uBAAO,iBAAY;IACpB;IACC;IACA,YAAU;IACV,qDAAW;IACX,qGAAwB;IACxB;0GACsB;aACf;sDAAO;;;;;;;MAMb;;;MAEA;MACC,2BAAyB;MACzB;MACA;;MAED;;;;;;;;;;;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"filter-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltip\"\n v-model:visible=\"tooltipVisible\"\n :offset=\"0\"\n :placement=\"placement\"\n :show-arrow=\"false\"\n :stop-popper-mouse-event=\"false\"\n append-to-body\n effect=\"light\"\n pure\n popper-class=\"el-table-filter\"\n >\n <template #content>\n <div v-if=\"multiple\">\n <div class=\"el-table-filter__content\">\n <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n <el-checkbox-group\n v-model=\"filteredValue\"\n class=\"el-table-filter__checkbox-group\"\n >\n <el-checkbox\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :label=\"filter.value\"\n >\n {{ filter.text }}\n </el-checkbox>\n </el-checkbox-group>\n </el-scrollbar>\n </div>\n <div class=\"el-table-filter__bottom\">\n <button\n :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n :disabled=\"filteredValue.length === 0\"\n type=\"button\"\n @click=\"handleConfirm\"\n >\n {{ t('el.table.confirmFilter') }}\n </button>\n <button type=\"button\" @click=\"handleReset\">\n {{ t('el.table.resetFilter') }}\n </button>\n </div>\n </div>\n <ul v-else class=\"el-table-filter__list\">\n <li\n :class=\"{\n 'is-active': filterValue === undefined || filterValue === null,\n }\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(null)\"\n >\n {{ t('el.table.clearFilter') }}\n </li>\n <li\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :class=\"{ 'is-active': isActive(filter) }\"\n :label=\"filter.value\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(filter.value)\"\n >\n {{ filter.text }}\n </li>\n </ul>\n </template>\n <template #default>\n <span\n v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n class=\"el-table__column-filter-trigger el-none-outline\"\n @click=\"showFilterPanel\"\n >\n <el-icon>\n <arrow-up v-if=\"column.filterOpened\" />\n <arrow-down v-else />\n </el-icon>\n </span>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n name: 'ElTableFilterPanel',\n components: {\n ElCheckbox,\n ElCheckboxGroup,\n ElScrollbar,\n ElTooltip,\n ElIcon,\n ArrowDown,\n ArrowUp,\n },\n directives: { ClickOutside },\n props: {\n placement: {\n type: String as PropType<Placement>,\n default: 'bottom-start',\n },\n store: {\n type: Object as PropType<Store<unknown>>,\n },\n column: {\n type: Object as PropType<TableColumnCtx<unknown>>,\n },\n upDataColumn: {\n type: Function,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n const { t } = useLocale()\n const parent = instance.parent as TableHeader\n if (!parent.filterPanels.value[props.column.id]) {\n parent.filterPanels.value[props.column.id] = instance\n }\n const tooltipVisible = ref(false)\n const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n const filters = computed(() => {\n return props.column && props.column.filters\n })\n const filterValue = computed({\n get: () => (props.column.filteredValue || [])[0],\n set: (value: string) => {\n if (filteredValue.value) {\n if (typeof value !== 'undefined' && value !== null) {\n filteredValue.value.splice(0, 1, value)\n } else {\n filteredValue.value.splice(0, 1)\n }\n }\n },\n })\n const filteredValue: WritableComputedRef<unknown[]> = computed({\n get() {\n if (props.column) {\n return props.column.filteredValue || []\n }\n return []\n },\n set(value: unknown[]) {\n if (props.column) {\n props.upDataColumn('filteredValue', value)\n }\n },\n })\n const multiple = computed(() => {\n if (props.column) {\n return props.column.filterMultiple\n }\n return true\n })\n const isActive = (filter) => {\n return filter.value === filterValue.value\n }\n const hidden = () => {\n tooltipVisible.value = false\n }\n const showFilterPanel = (e: MouseEvent) => {\n e.stopPropagation()\n tooltipVisible.value = !tooltipVisible.value\n }\n const hideFilterPanel = () => {\n tooltipVisible.value = false\n }\n const handleConfirm = () => {\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleReset = () => {\n filteredValue.value = []\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleSelect = (_filterValue?: string) => {\n filterValue.value = _filterValue\n if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n confirmFilter(filteredValue.value)\n } else {\n confirmFilter([])\n }\n hidden()\n }\n const confirmFilter = (filteredValue: unknown[]) => {\n props.store.commit('filterChange', {\n column: props.column,\n values: filteredValue,\n })\n props.store.updateAllSelected()\n }\n watch(\n tooltipVisible,\n (value) => {\n // todo\n if (props.column) {\n props.upDataColumn('filterOpened', value)\n }\n },\n {\n immediate: true,\n }\n )\n\n const popperPaneRef = computed(() => {\n return tooltip.value?.popperRef?.contentRef\n })\n\n return {\n tooltipVisible,\n multiple,\n filteredValue,\n filterValue,\n filters,\n handleConfirm,\n handleReset,\n handleSelect,\n isActive,\n t,\n showFilterPanel,\n hideFilterPanel,\n popperPaneRef,\n tooltip,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;AA0FA,QAAQ,aAAa,iBAAiB,EAAE,GAAG,UAAU,CAAC;AACtD,aAAe,gBAAgB;;AAE/B,EAAE,UAAU,EAAE;AACd,IAAI,UAAU;AACd,IAAI,eAAe;AACnB,IAAI,WAAW;;AAEf,IAAI,MAAM;;AAEV,IAAI,OAAO;GACR;EACD,UAAU,EAAE;OACP,EAAE;IACL,SAAS,EAAE;MACT,IAAI,EAAE;MACN,OAAO;KACR;IACD,KAAK,EAAE;MACL,IAAI;;IAEN,MAAM,EAAE;MACN;KACD;gBACW;MACV,IAAI,EAAE,QAAQ;KACf;;OAEE,CAAC,KAAK,EAAE;IACX;IACA,MAAM,EAAE;UACF,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;IAC/B;MACE,MAAM,CAAC;;IAET;;IAEA,MAAM;MACJ,OAAO,MAAM,MAAM,IAAI,KAAK,CAAC;KAC9B,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,QAAQ,CAAC;SACxB,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,IAAI,EAAE,GAAG;MAC/C,GAAG,EAAE,CAAC,KAAK,KAAK;;UAEZ,IAAI,OAAO,UAAU;YACnB,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,CAAC;WACzC;0BACe,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;;;OAGtC;MACD,CAAC;uBACgB,GAAG;;YAEd,KAAK,CAAC,MAAM,EAAE;UAChB,OAAO;;;;MAIX;;UAEI,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;SAC5C;;;;UAIC,KAAK,CAAC;;OAET;aACM,IAAI,CAAC;;;MAGZ;KACD;IACD,MAAM,MAAM,GAAG,MAAM;MACnB,cAAc,CAAC;;;MAGf,CAAC,CAAC;;KAEH,CAAC;UACI,kBAAkB,MAAM;;KAE7B,CAAC;UACI,aAAa,SAAS;;MAE1B,MAAM,EAAE,CAAC;MACT;UACI,WAAW,GAAG,MAAM;;MAExB,aAAa,CAAC,cAAc;MAC5B,MAAM,EAAE,CAAC;;IAEX,MAAM,YAAY,IAAI;MACpB,WAAW,CAAC,KAAK,GAAG,YAAY,CAAC;MACjC,IAAI;;OAEH,MAAM;QACL,aAAa,CAAC,EAAE,EAAE;OACnB;MACD,MAAM;;IAER,MAAM,aAAa,GAAG,CAAC,cAAc,KAAK;MACxC,KAAK,CAAC,KAAK,CAAC,MAAM;cACV,OAAO,CAAC,MAAM;QACpB,MAAM,EAAE,cAAc;QACtB,CAAC;WACE,CAAC,KAAK,CAAC;MACZ;SACG,CAAC;;QAEF,KAAK,CAAC,YAAY,CAAC,gBAAgB,KAAK,CAAC,CAAC;OAC3C;;iBAEU,IAAI;MACf,CAAC;UACG,aAAa,GAAG,QAAQ,CAAC;;MAE7B;MACA,CAAC;WACI;;cAEG;mBACK;;MAEb;MACA;iBACW;MACX;;;MAGA,eAAe;MACf,eAAe;;;KAGhB,CAAC;;;;;;"}
1
+ {"version":3,"file":"filter-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltip\"\n v-model:visible=\"tooltipVisible\"\n :offset=\"0\"\n :placement=\"placement\"\n :show-arrow=\"false\"\n :stop-popper-mouse-event=\"false\"\n append-to-body\n effect=\"light\"\n pure\n popper-class=\"el-table-filter\"\n persistent\n >\n <template #content>\n <div v-if=\"multiple\">\n <div class=\"el-table-filter__content\">\n <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n <el-checkbox-group\n v-model=\"filteredValue\"\n class=\"el-table-filter__checkbox-group\"\n >\n <el-checkbox\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :label=\"filter.value\"\n >\n {{ filter.text }}\n </el-checkbox>\n </el-checkbox-group>\n </el-scrollbar>\n </div>\n <div class=\"el-table-filter__bottom\">\n <button\n :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n :disabled=\"filteredValue.length === 0\"\n type=\"button\"\n @click=\"handleConfirm\"\n >\n {{ t('el.table.confirmFilter') }}\n </button>\n <button type=\"button\" @click=\"handleReset\">\n {{ t('el.table.resetFilter') }}\n </button>\n </div>\n </div>\n <ul v-else class=\"el-table-filter__list\">\n <li\n :class=\"{\n 'is-active': filterValue === undefined || filterValue === null,\n }\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(null)\"\n >\n {{ t('el.table.clearFilter') }}\n </li>\n <li\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :class=\"{ 'is-active': isActive(filter) }\"\n :label=\"filter.value\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(filter.value)\"\n >\n {{ filter.text }}\n </li>\n </ul>\n </template>\n <template #default>\n <span\n v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n class=\"el-table__column-filter-trigger el-none-outline\"\n @click=\"showFilterPanel\"\n >\n <el-icon>\n <arrow-up v-if=\"column.filterOpened\" />\n <arrow-down v-else />\n </el-icon>\n </span>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n name: 'ElTableFilterPanel',\n components: {\n ElCheckbox,\n ElCheckboxGroup,\n ElScrollbar,\n ElTooltip,\n ElIcon,\n ArrowDown,\n ArrowUp,\n },\n directives: { ClickOutside },\n props: {\n placement: {\n type: String as PropType<Placement>,\n default: 'bottom-start',\n },\n store: {\n type: Object as PropType<Store<unknown>>,\n },\n column: {\n type: Object as PropType<TableColumnCtx<unknown>>,\n },\n upDataColumn: {\n type: Function,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n const { t } = useLocale()\n const parent = instance.parent as TableHeader\n if (!parent.filterPanels.value[props.column.id]) {\n parent.filterPanels.value[props.column.id] = instance\n }\n const tooltipVisible = ref(false)\n const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n const filters = computed(() => {\n return props.column && props.column.filters\n })\n const filterValue = computed({\n get: () => (props.column.filteredValue || [])[0],\n set: (value: string) => {\n if (filteredValue.value) {\n if (typeof value !== 'undefined' && value !== null) {\n filteredValue.value.splice(0, 1, value)\n } else {\n filteredValue.value.splice(0, 1)\n }\n }\n },\n })\n const filteredValue: WritableComputedRef<unknown[]> = computed({\n get() {\n if (props.column) {\n return props.column.filteredValue || []\n }\n return []\n },\n set(value: unknown[]) {\n if (props.column) {\n props.upDataColumn('filteredValue', value)\n }\n },\n })\n const multiple = computed(() => {\n if (props.column) {\n return props.column.filterMultiple\n }\n return true\n })\n const isActive = (filter) => {\n return filter.value === filterValue.value\n }\n const hidden = () => {\n tooltipVisible.value = false\n }\n const showFilterPanel = (e: MouseEvent) => {\n e.stopPropagation()\n tooltipVisible.value = !tooltipVisible.value\n }\n const hideFilterPanel = () => {\n tooltipVisible.value = false\n }\n const handleConfirm = () => {\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleReset = () => {\n filteredValue.value = []\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleSelect = (_filterValue?: string) => {\n filterValue.value = _filterValue\n if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n confirmFilter(filteredValue.value)\n } else {\n confirmFilter([])\n }\n hidden()\n }\n const confirmFilter = (filteredValue: unknown[]) => {\n props.store.commit('filterChange', {\n column: props.column,\n values: filteredValue,\n })\n props.store.updateAllSelected()\n }\n watch(\n tooltipVisible,\n (value) => {\n // todo\n if (props.column) {\n props.upDataColumn('filterOpened', value)\n }\n },\n {\n immediate: true,\n }\n )\n\n const popperPaneRef = computed(() => {\n return tooltip.value?.popperRef?.contentRef\n })\n\n return {\n tooltipVisible,\n multiple,\n filteredValue,\n filterValue,\n filters,\n handleConfirm,\n handleReset,\n handleSelect,\n isActive,\n t,\n showFilterPanel,\n hideFilterPanel,\n popperPaneRef,\n tooltip,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;AA2FA,QAAQ,aAAa,iBAAiB,EAAE,GAAG,UAAU,CAAC;AACtD,aAAe,gBAAgB;;AAE/B,EAAE,UAAU,EAAE;AACd,IAAI,UAAU;AACd,IAAI,eAAe;AACnB,IAAI,WAAW;;AAEf,IAAI,MAAM;;AAEV,IAAI,OAAO;GACR;EACD,UAAU,EAAE;OACP,EAAE;IACL,SAAS,EAAE;MACT,IAAI,EAAE;MACN,OAAO;KACR;IACD,KAAK,EAAE;MACL,IAAI;;IAEN,MAAM,EAAE;MACN;KACD;gBACW;MACV,IAAI,EAAE,QAAQ;KACf;;OAEE,CAAC,KAAK,EAAE;IACX;IACA,MAAM,EAAE;UACF,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;IAC/B;MACE,MAAM,CAAC;;IAET;;IAEA,MAAM;MACJ,OAAO,MAAM,MAAM,IAAI,KAAK,CAAC;KAC9B,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,QAAQ,CAAC;SACxB,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,IAAI,EAAE,GAAG;MAC/C,GAAG,EAAE,CAAC,KAAK,KAAK;;UAEZ,IAAI,OAAO,UAAU;YACnB,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,CAAC;WACzC;0BACe,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;;;OAGtC;MACD,CAAC;uBACgB,GAAG;;YAEd,KAAK,CAAC,MAAM,EAAE;UAChB,OAAO;;;;MAIX;;UAEI,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;SAC5C;;;;UAIC,KAAK,CAAC;;OAET;aACM,IAAI,CAAC;;;MAGZ;KACD;IACD,MAAM,MAAM,GAAG,MAAM;MACnB,cAAc,CAAC;;;MAGf,CAAC,CAAC;;KAEH,CAAC;UACI,kBAAkB,MAAM;;KAE7B,CAAC;UACI,aAAa,SAAS;;MAE1B,MAAM,EAAE,CAAC;MACT;UACI,WAAW,GAAG,MAAM;;MAExB,aAAa,CAAC,cAAc;MAC5B,MAAM,EAAE,CAAC;;IAEX,MAAM,YAAY,IAAI;MACpB,WAAW,CAAC,KAAK,GAAG,YAAY,CAAC;MACjC,IAAI;;OAEH,MAAM;QACL,aAAa,CAAC,EAAE,EAAE;OACnB;MACD,MAAM;;IAER,MAAM,aAAa,GAAG,CAAC,cAAc,KAAK;MACxC,KAAK,CAAC,KAAK,CAAC,MAAM;cACV,OAAO,CAAC,MAAM;QACpB,MAAM,EAAE,cAAc;QACtB,CAAC;WACE,CAAC,KAAK,CAAC;MACZ;SACG,CAAC;;QAEF,KAAK,CAAC,YAAY,CAAC,gBAAgB,KAAK,CAAC,CAAC;OAC3C;;iBAEU,IAAI;MACf,CAAC;UACG,aAAa,GAAG,QAAQ,CAAC;;MAE7B;MACA,CAAC;WACI;;cAEG;mBACK;;MAEb;MACA;iBACW;MACX;;;MAGA,eAAe;MACf,eAAe;;;KAGhB,CAAC;;;;;;"}
@@ -29,7 +29,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
29
29
  "append-to-body": "",
30
30
  effect: "light",
31
31
  pure: "",
32
- "popper-class": "el-table-filter"
32
+ "popper-class": "el-table-filter",
33
+ persistent: ""
33
34
  }, {
34
35
  content: withCtx(() => [
35
36
  _ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_1, [
@@ -1 +1 @@
1
- {"version":3,"file":"filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue?vue&type=template&id=fde1c940&lang.js"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltip\"\n v-model:visible=\"tooltipVisible\"\n :offset=\"0\"\n :placement=\"placement\"\n :show-arrow=\"false\"\n :stop-popper-mouse-event=\"false\"\n append-to-body\n effect=\"light\"\n pure\n popper-class=\"el-table-filter\"\n >\n <template #content>\n <div v-if=\"multiple\">\n <div class=\"el-table-filter__content\">\n <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n <el-checkbox-group\n v-model=\"filteredValue\"\n class=\"el-table-filter__checkbox-group\"\n >\n <el-checkbox\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :label=\"filter.value\"\n >\n {{ filter.text }}\n </el-checkbox>\n </el-checkbox-group>\n </el-scrollbar>\n </div>\n <div class=\"el-table-filter__bottom\">\n <button\n :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n :disabled=\"filteredValue.length === 0\"\n type=\"button\"\n @click=\"handleConfirm\"\n >\n {{ t('el.table.confirmFilter') }}\n </button>\n <button type=\"button\" @click=\"handleReset\">\n {{ t('el.table.resetFilter') }}\n </button>\n </div>\n </div>\n <ul v-else class=\"el-table-filter__list\">\n <li\n :class=\"{\n 'is-active': filterValue === undefined || filterValue === null,\n }\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(null)\"\n >\n {{ t('el.table.clearFilter') }}\n </li>\n <li\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :class=\"{ 'is-active': isActive(filter) }\"\n :label=\"filter.value\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(filter.value)\"\n >\n {{ filter.text }}\n </li>\n </ul>\n </template>\n <template #default>\n <span\n v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n class=\"el-table__column-filter-trigger el-none-outline\"\n @click=\"showFilterPanel\"\n >\n <el-icon>\n <arrow-up v-if=\"column.filterOpened\" />\n <arrow-down v-else />\n </el-icon>\n </span>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n name: 'ElTableFilterPanel',\n components: {\n ElCheckbox,\n ElCheckboxGroup,\n ElScrollbar,\n ElTooltip,\n ElIcon,\n ArrowDown,\n ArrowUp,\n },\n directives: { ClickOutside },\n props: {\n placement: {\n type: String as PropType<Placement>,\n default: 'bottom-start',\n },\n store: {\n type: Object as PropType<Store<unknown>>,\n },\n column: {\n type: Object as PropType<TableColumnCtx<unknown>>,\n },\n upDataColumn: {\n type: Function,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n const { t } = useLocale()\n const parent = instance.parent as TableHeader\n if (!parent.filterPanels.value[props.column.id]) {\n parent.filterPanels.value[props.column.id] = instance\n }\n const tooltipVisible = ref(false)\n const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n const filters = computed(() => {\n return props.column && props.column.filters\n })\n const filterValue = computed({\n get: () => (props.column.filteredValue || [])[0],\n set: (value: string) => {\n if (filteredValue.value) {\n if (typeof value !== 'undefined' && value !== null) {\n filteredValue.value.splice(0, 1, value)\n } else {\n filteredValue.value.splice(0, 1)\n }\n }\n },\n })\n const filteredValue: WritableComputedRef<unknown[]> = computed({\n get() {\n if (props.column) {\n return props.column.filteredValue || []\n }\n return []\n },\n set(value: unknown[]) {\n if (props.column) {\n props.upDataColumn('filteredValue', value)\n }\n },\n })\n const multiple = computed(() => {\n if (props.column) {\n return props.column.filterMultiple\n }\n return true\n })\n const isActive = (filter) => {\n return filter.value === filterValue.value\n }\n const hidden = () => {\n tooltipVisible.value = false\n }\n const showFilterPanel = (e: MouseEvent) => {\n e.stopPropagation()\n tooltipVisible.value = !tooltipVisible.value\n }\n const hideFilterPanel = () => {\n tooltipVisible.value = false\n }\n const handleConfirm = () => {\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleReset = () => {\n filteredValue.value = []\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleSelect = (_filterValue?: string) => {\n filterValue.value = _filterValue\n if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n confirmFilter(filteredValue.value)\n } else {\n confirmFilter([])\n }\n hidden()\n }\n const confirmFilter = (filteredValue: unknown[]) => {\n props.store.commit('filterChange', {\n column: props.column,\n values: filteredValue,\n })\n props.store.updateAllSelected()\n }\n watch(\n tooltipVisible,\n (value) => {\n // todo\n if (props.column) {\n props.upDataColumn('filterOpened', value)\n }\n },\n {\n immediate: true,\n }\n )\n\n const popperPaneRef = computed(() => {\n return tooltip.value?.popperRef?.contentRef\n })\n\n return {\n tooltipVisible,\n multiple,\n filteredValue,\n filterValue,\n filters,\n handleConfirm,\n handleReset,\n handleSelect,\n isActive,\n t,\n showFilterPanel,\n hideFilterPanel,\n popperPaneRef,\n tooltip,\n }\n },\n})\n</script>\n"],"names":["_openBlock"],"mappings":";;;;qBAea,KAAK,EAAC;;;;;EA8BF;;;;;;;;;;;;;;wBA5Cf;IACE;IACQ,SAAS;;IAChB;IACA;IACA;IACA;IACD;;IAEA;;;qBAIE;;;;kEAE4B;;;;;oBAGpB,OAAMA;;;;6CAEN;;;;;;;;;;;;;;;;;YAUN;;;;gBAII;iEACQ;iCAEL;;;;iCAGA;;;yBAIT;;kBAEU;;;;;;mCAQR;gBAEG;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue?vue&type=template&id=fde1c940&lang.js"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltip\"\n v-model:visible=\"tooltipVisible\"\n :offset=\"0\"\n :placement=\"placement\"\n :show-arrow=\"false\"\n :stop-popper-mouse-event=\"false\"\n append-to-body\n effect=\"light\"\n pure\n popper-class=\"el-table-filter\"\n persistent\n >\n <template #content>\n <div v-if=\"multiple\">\n <div class=\"el-table-filter__content\">\n <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n <el-checkbox-group\n v-model=\"filteredValue\"\n class=\"el-table-filter__checkbox-group\"\n >\n <el-checkbox\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :label=\"filter.value\"\n >\n {{ filter.text }}\n </el-checkbox>\n </el-checkbox-group>\n </el-scrollbar>\n </div>\n <div class=\"el-table-filter__bottom\">\n <button\n :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n :disabled=\"filteredValue.length === 0\"\n type=\"button\"\n @click=\"handleConfirm\"\n >\n {{ t('el.table.confirmFilter') }}\n </button>\n <button type=\"button\" @click=\"handleReset\">\n {{ t('el.table.resetFilter') }}\n </button>\n </div>\n </div>\n <ul v-else class=\"el-table-filter__list\">\n <li\n :class=\"{\n 'is-active': filterValue === undefined || filterValue === null,\n }\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(null)\"\n >\n {{ t('el.table.clearFilter') }}\n </li>\n <li\n v-for=\"filter in filters\"\n :key=\"filter.value\"\n :class=\"{ 'is-active': isActive(filter) }\"\n :label=\"filter.value\"\n class=\"el-table-filter__list-item\"\n @click=\"handleSelect(filter.value)\"\n >\n {{ filter.text }}\n </li>\n </ul>\n </template>\n <template #default>\n <span\n v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n class=\"el-table__column-filter-trigger el-none-outline\"\n @click=\"showFilterPanel\"\n >\n <el-icon>\n <arrow-up v-if=\"column.filterOpened\" />\n <arrow-down v-else />\n </el-icon>\n </span>\n </template>\n </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n name: 'ElTableFilterPanel',\n components: {\n ElCheckbox,\n ElCheckboxGroup,\n ElScrollbar,\n ElTooltip,\n ElIcon,\n ArrowDown,\n ArrowUp,\n },\n directives: { ClickOutside },\n props: {\n placement: {\n type: String as PropType<Placement>,\n default: 'bottom-start',\n },\n store: {\n type: Object as PropType<Store<unknown>>,\n },\n column: {\n type: Object as PropType<TableColumnCtx<unknown>>,\n },\n upDataColumn: {\n type: Function,\n },\n },\n setup(props) {\n const instance = getCurrentInstance()\n const { t } = useLocale()\n const parent = instance.parent as TableHeader\n if (!parent.filterPanels.value[props.column.id]) {\n parent.filterPanels.value[props.column.id] = instance\n }\n const tooltipVisible = ref(false)\n const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n const filters = computed(() => {\n return props.column && props.column.filters\n })\n const filterValue = computed({\n get: () => (props.column.filteredValue || [])[0],\n set: (value: string) => {\n if (filteredValue.value) {\n if (typeof value !== 'undefined' && value !== null) {\n filteredValue.value.splice(0, 1, value)\n } else {\n filteredValue.value.splice(0, 1)\n }\n }\n },\n })\n const filteredValue: WritableComputedRef<unknown[]> = computed({\n get() {\n if (props.column) {\n return props.column.filteredValue || []\n }\n return []\n },\n set(value: unknown[]) {\n if (props.column) {\n props.upDataColumn('filteredValue', value)\n }\n },\n })\n const multiple = computed(() => {\n if (props.column) {\n return props.column.filterMultiple\n }\n return true\n })\n const isActive = (filter) => {\n return filter.value === filterValue.value\n }\n const hidden = () => {\n tooltipVisible.value = false\n }\n const showFilterPanel = (e: MouseEvent) => {\n e.stopPropagation()\n tooltipVisible.value = !tooltipVisible.value\n }\n const hideFilterPanel = () => {\n tooltipVisible.value = false\n }\n const handleConfirm = () => {\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleReset = () => {\n filteredValue.value = []\n confirmFilter(filteredValue.value)\n hidden()\n }\n const handleSelect = (_filterValue?: string) => {\n filterValue.value = _filterValue\n if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n confirmFilter(filteredValue.value)\n } else {\n confirmFilter([])\n }\n hidden()\n }\n const confirmFilter = (filteredValue: unknown[]) => {\n props.store.commit('filterChange', {\n column: props.column,\n values: filteredValue,\n })\n props.store.updateAllSelected()\n }\n watch(\n tooltipVisible,\n (value) => {\n // todo\n if (props.column) {\n props.upDataColumn('filterOpened', value)\n }\n },\n {\n immediate: true,\n }\n )\n\n const popperPaneRef = computed(() => {\n return tooltip.value?.popperRef?.contentRef\n })\n\n return {\n tooltipVisible,\n multiple,\n filteredValue,\n filterValue,\n filters,\n handleConfirm,\n handleReset,\n handleSelect,\n isActive,\n t,\n showFilterPanel,\n hideFilterPanel,\n popperPaneRef,\n tooltip,\n }\n },\n})\n</script>\n"],"names":["_openBlock"],"mappings":";;;;qBAgBa,KAAK,EAAC;;;;;EA8BF;;;;;;;;;;;;;;wBA7Cf;IACE;IACQ,SAAS;;IAChB;IACA;IACA;IACA;IACD;IACA;;IAEA;;;qBAIE;;;;kEAE4B;;;;;oBAGpB,OAAMA;;;;6CAEN;;;;;;;;;;;;;;;;;YAUN;;;;gBAII;iEACQ;iCAEL;;;;iCAGA;;;yBAIT;;kBAEU;;;;;;mCAQR;gBAEG;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -41,11 +41,15 @@ const valueEquals = function(a, b) {
41
41
  return false;
42
42
  };
43
43
  const parser = function(date, format, lang) {
44
- const day = isEmpty(format) ? dayjs(date).locale(lang) : dayjs(date, format).locale(lang);
44
+ const day = isEmpty(format) || format === "x" ? dayjs(date).locale(lang) : dayjs(date, format).locale(lang);
45
45
  return day.isValid() ? day : void 0;
46
46
  };
47
47
  const formatter = function(date, format, lang) {
48
- return isEmpty(format) ? date : dayjs(date).locale(lang).format(format);
48
+ if (isEmpty(format))
49
+ return date;
50
+ if (format === "x")
51
+ return +date;
52
+ return dayjs(date).locale(lang).format(format);
49
53
  };
50
54
  var script = defineComponent({
51
55
  name: "Picker",