@element-plus/nightly 0.0.20260307 → 0.0.20260309
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.
- package/attributes.json +1 -1
- package/dist/index.css +1 -1
- package/dist/index.full.js +366 -264
- package/dist/index.full.min.js +9 -9
- package/dist/index.full.min.js.map +1 -1
- package/dist/index.full.min.mjs +8 -8
- package/dist/index.full.min.mjs.map +1 -1
- package/dist/index.full.mjs +366 -264
- package/dist/locale/af.js +1 -1
- package/dist/locale/af.min.js +1 -1
- package/dist/locale/af.min.mjs +1 -1
- package/dist/locale/af.mjs +1 -1
- package/dist/locale/ar-eg.js +1 -1
- package/dist/locale/ar-eg.min.js +1 -1
- package/dist/locale/ar-eg.min.mjs +1 -1
- package/dist/locale/ar-eg.mjs +1 -1
- package/dist/locale/ar.js +1 -1
- package/dist/locale/ar.min.js +1 -1
- package/dist/locale/ar.min.mjs +1 -1
- package/dist/locale/ar.mjs +1 -1
- package/dist/locale/az.js +1 -1
- package/dist/locale/az.min.js +1 -1
- package/dist/locale/az.min.mjs +1 -1
- package/dist/locale/az.mjs +1 -1
- package/dist/locale/bg.js +1 -1
- package/dist/locale/bg.min.js +1 -1
- package/dist/locale/bg.min.mjs +1 -1
- package/dist/locale/bg.mjs +1 -1
- package/dist/locale/bn.js +1 -1
- package/dist/locale/bn.min.js +1 -1
- package/dist/locale/bn.min.mjs +1 -1
- package/dist/locale/bn.mjs +1 -1
- package/dist/locale/ca.js +1 -1
- package/dist/locale/ca.min.js +1 -1
- package/dist/locale/ca.min.mjs +1 -1
- package/dist/locale/ca.mjs +1 -1
- package/dist/locale/ckb.js +1 -1
- package/dist/locale/ckb.min.js +1 -1
- package/dist/locale/ckb.min.mjs +1 -1
- package/dist/locale/ckb.mjs +1 -1
- package/dist/locale/cs.js +1 -1
- package/dist/locale/cs.min.js +1 -1
- package/dist/locale/cs.min.mjs +1 -1
- package/dist/locale/cs.mjs +1 -1
- package/dist/locale/da.js +1 -1
- package/dist/locale/da.min.js +1 -1
- package/dist/locale/da.min.mjs +1 -1
- package/dist/locale/da.mjs +1 -1
- package/dist/locale/de.js +1 -1
- package/dist/locale/de.min.js +1 -1
- package/dist/locale/de.min.mjs +1 -1
- package/dist/locale/de.mjs +1 -1
- package/dist/locale/el.js +1 -1
- package/dist/locale/el.min.js +1 -1
- package/dist/locale/el.min.mjs +1 -1
- package/dist/locale/el.mjs +1 -1
- package/dist/locale/en.js +1 -1
- package/dist/locale/en.min.js +1 -1
- package/dist/locale/en.min.mjs +1 -1
- package/dist/locale/en.mjs +1 -1
- package/dist/locale/eo.js +1 -1
- package/dist/locale/eo.min.js +1 -1
- package/dist/locale/eo.min.mjs +1 -1
- package/dist/locale/eo.mjs +1 -1
- package/dist/locale/es.js +1 -1
- package/dist/locale/es.min.js +1 -1
- package/dist/locale/es.min.mjs +1 -1
- package/dist/locale/es.mjs +1 -1
- package/dist/locale/et.js +1 -1
- package/dist/locale/et.min.js +1 -1
- package/dist/locale/et.min.mjs +1 -1
- package/dist/locale/et.mjs +1 -1
- package/dist/locale/eu.js +1 -1
- package/dist/locale/eu.min.js +1 -1
- package/dist/locale/eu.min.mjs +1 -1
- package/dist/locale/eu.mjs +1 -1
- package/dist/locale/fa.js +1 -1
- package/dist/locale/fa.min.js +1 -1
- package/dist/locale/fa.min.mjs +1 -1
- package/dist/locale/fa.mjs +1 -1
- package/dist/locale/fi.js +1 -1
- package/dist/locale/fi.min.js +1 -1
- package/dist/locale/fi.min.mjs +1 -1
- package/dist/locale/fi.mjs +1 -1
- package/dist/locale/fr.js +1 -1
- package/dist/locale/fr.min.js +1 -1
- package/dist/locale/fr.min.mjs +1 -1
- package/dist/locale/fr.mjs +1 -1
- package/dist/locale/he.js +1 -1
- package/dist/locale/he.min.js +1 -1
- package/dist/locale/he.min.mjs +1 -1
- package/dist/locale/he.mjs +1 -1
- package/dist/locale/hi.js +1 -1
- package/dist/locale/hi.min.js +1 -1
- package/dist/locale/hi.min.mjs +1 -1
- package/dist/locale/hi.mjs +1 -1
- package/dist/locale/hr.js +1 -1
- package/dist/locale/hr.min.js +1 -1
- package/dist/locale/hr.min.mjs +1 -1
- package/dist/locale/hr.mjs +1 -1
- package/dist/locale/hu.js +1 -1
- package/dist/locale/hu.min.js +1 -1
- package/dist/locale/hu.min.mjs +1 -1
- package/dist/locale/hu.mjs +1 -1
- package/dist/locale/hy-am.js +1 -1
- package/dist/locale/hy-am.min.js +1 -1
- package/dist/locale/hy-am.min.mjs +1 -1
- package/dist/locale/hy-am.mjs +1 -1
- package/dist/locale/id.js +1 -1
- package/dist/locale/id.min.js +1 -1
- package/dist/locale/id.min.mjs +1 -1
- package/dist/locale/id.mjs +1 -1
- package/dist/locale/it.js +1 -1
- package/dist/locale/it.min.js +1 -1
- package/dist/locale/it.min.mjs +1 -1
- package/dist/locale/it.mjs +1 -1
- package/dist/locale/ja.js +1 -1
- package/dist/locale/ja.min.js +1 -1
- package/dist/locale/ja.min.mjs +1 -1
- package/dist/locale/ja.mjs +1 -1
- package/dist/locale/kk.js +1 -1
- package/dist/locale/kk.min.js +1 -1
- package/dist/locale/kk.min.mjs +1 -1
- package/dist/locale/kk.mjs +1 -1
- package/dist/locale/km.js +1 -1
- package/dist/locale/km.min.js +1 -1
- package/dist/locale/km.min.mjs +1 -1
- package/dist/locale/km.mjs +1 -1
- package/dist/locale/ko.js +1 -1
- package/dist/locale/ko.min.js +1 -1
- package/dist/locale/ko.min.mjs +1 -1
- package/dist/locale/ko.mjs +1 -1
- package/dist/locale/ku.js +1 -1
- package/dist/locale/ku.min.js +1 -1
- package/dist/locale/ku.min.mjs +1 -1
- package/dist/locale/ku.mjs +1 -1
- package/dist/locale/ky.js +1 -1
- package/dist/locale/ky.min.js +1 -1
- package/dist/locale/ky.min.mjs +1 -1
- package/dist/locale/ky.mjs +1 -1
- package/dist/locale/lo.js +1 -1
- package/dist/locale/lo.min.js +1 -1
- package/dist/locale/lo.min.mjs +1 -1
- package/dist/locale/lo.mjs +1 -1
- package/dist/locale/lt.js +1 -1
- package/dist/locale/lt.min.js +1 -1
- package/dist/locale/lt.min.mjs +1 -1
- package/dist/locale/lt.mjs +1 -1
- package/dist/locale/lv.js +1 -1
- package/dist/locale/lv.min.js +1 -1
- package/dist/locale/lv.min.mjs +1 -1
- package/dist/locale/lv.mjs +1 -1
- package/dist/locale/mg.js +1 -1
- package/dist/locale/mg.min.js +1 -1
- package/dist/locale/mg.min.mjs +1 -1
- package/dist/locale/mg.mjs +1 -1
- package/dist/locale/mn.js +1 -1
- package/dist/locale/mn.min.js +1 -1
- package/dist/locale/mn.min.mjs +1 -1
- package/dist/locale/mn.mjs +1 -1
- package/dist/locale/ms.js +1 -1
- package/dist/locale/ms.min.js +1 -1
- package/dist/locale/ms.min.mjs +1 -1
- package/dist/locale/ms.mjs +1 -1
- package/dist/locale/my.js +1 -1
- package/dist/locale/my.min.js +1 -1
- package/dist/locale/my.min.mjs +1 -1
- package/dist/locale/my.mjs +1 -1
- package/dist/locale/nb-no.js +1 -1
- package/dist/locale/nb-no.min.js +1 -1
- package/dist/locale/nb-no.min.mjs +1 -1
- package/dist/locale/nb-no.mjs +1 -1
- package/dist/locale/nl.js +1 -1
- package/dist/locale/nl.min.js +1 -1
- package/dist/locale/nl.min.mjs +1 -1
- package/dist/locale/nl.mjs +1 -1
- package/dist/locale/no.js +1 -1
- package/dist/locale/no.min.js +1 -1
- package/dist/locale/no.min.mjs +1 -1
- package/dist/locale/no.mjs +1 -1
- package/dist/locale/pa.js +1 -1
- package/dist/locale/pa.min.js +1 -1
- package/dist/locale/pa.min.mjs +1 -1
- package/dist/locale/pa.mjs +1 -1
- package/dist/locale/pl.js +1 -1
- package/dist/locale/pl.min.js +1 -1
- package/dist/locale/pl.min.mjs +1 -1
- package/dist/locale/pl.mjs +1 -1
- package/dist/locale/pt-br.js +1 -1
- package/dist/locale/pt-br.min.js +1 -1
- package/dist/locale/pt-br.min.mjs +1 -1
- package/dist/locale/pt-br.mjs +1 -1
- package/dist/locale/pt.js +1 -1
- package/dist/locale/pt.min.js +1 -1
- package/dist/locale/pt.min.mjs +1 -1
- package/dist/locale/pt.mjs +1 -1
- package/dist/locale/ro.js +1 -1
- package/dist/locale/ro.min.js +1 -1
- package/dist/locale/ro.min.mjs +1 -1
- package/dist/locale/ro.mjs +1 -1
- package/dist/locale/ru.js +1 -1
- package/dist/locale/ru.min.js +1 -1
- package/dist/locale/ru.min.mjs +1 -1
- package/dist/locale/ru.mjs +1 -1
- package/dist/locale/sk.js +1 -1
- package/dist/locale/sk.min.js +1 -1
- package/dist/locale/sk.min.mjs +1 -1
- package/dist/locale/sk.mjs +1 -1
- package/dist/locale/sl.js +1 -1
- package/dist/locale/sl.min.js +1 -1
- package/dist/locale/sl.min.mjs +1 -1
- package/dist/locale/sl.mjs +1 -1
- package/dist/locale/sr.js +1 -1
- package/dist/locale/sr.min.js +1 -1
- package/dist/locale/sr.min.mjs +1 -1
- package/dist/locale/sr.mjs +1 -1
- package/dist/locale/sv.js +1 -1
- package/dist/locale/sv.min.js +1 -1
- package/dist/locale/sv.min.mjs +1 -1
- package/dist/locale/sv.mjs +1 -1
- package/dist/locale/sw.js +1 -1
- package/dist/locale/sw.min.js +1 -1
- package/dist/locale/sw.min.mjs +1 -1
- package/dist/locale/sw.mjs +1 -1
- package/dist/locale/ta.js +1 -1
- package/dist/locale/ta.min.js +1 -1
- package/dist/locale/ta.min.mjs +1 -1
- package/dist/locale/ta.mjs +1 -1
- package/dist/locale/te.js +1 -1
- package/dist/locale/te.min.js +1 -1
- package/dist/locale/te.min.mjs +1 -1
- package/dist/locale/te.mjs +1 -1
- package/dist/locale/th.js +1 -1
- package/dist/locale/th.min.js +1 -1
- package/dist/locale/th.min.mjs +1 -1
- package/dist/locale/th.mjs +1 -1
- package/dist/locale/tk.js +1 -1
- package/dist/locale/tk.min.js +1 -1
- package/dist/locale/tk.min.mjs +1 -1
- package/dist/locale/tk.mjs +1 -1
- package/dist/locale/tr.js +1 -1
- package/dist/locale/tr.min.js +1 -1
- package/dist/locale/tr.min.mjs +1 -1
- package/dist/locale/tr.mjs +1 -1
- package/dist/locale/ug-cn.js +1 -1
- package/dist/locale/ug-cn.min.js +1 -1
- package/dist/locale/ug-cn.min.mjs +1 -1
- package/dist/locale/ug-cn.mjs +1 -1
- package/dist/locale/uk.js +1 -1
- package/dist/locale/uk.min.js +1 -1
- package/dist/locale/uk.min.mjs +1 -1
- package/dist/locale/uk.mjs +1 -1
- package/dist/locale/uz-uz.js +1 -1
- package/dist/locale/uz-uz.min.js +1 -1
- package/dist/locale/uz-uz.min.mjs +1 -1
- package/dist/locale/uz-uz.mjs +1 -1
- package/dist/locale/vi.js +1 -1
- package/dist/locale/vi.min.js +1 -1
- package/dist/locale/vi.min.mjs +1 -1
- package/dist/locale/vi.mjs +1 -1
- package/dist/locale/zh-cn.js +1 -1
- package/dist/locale/zh-cn.min.js +1 -1
- package/dist/locale/zh-cn.min.mjs +1 -1
- package/dist/locale/zh-cn.mjs +1 -1
- package/dist/locale/zh-hk.js +1 -1
- package/dist/locale/zh-hk.min.js +1 -1
- package/dist/locale/zh-hk.min.mjs +1 -1
- package/dist/locale/zh-hk.mjs +1 -1
- package/dist/locale/zh-mo.js +1 -1
- package/dist/locale/zh-mo.min.js +1 -1
- package/dist/locale/zh-mo.min.mjs +1 -1
- package/dist/locale/zh-mo.mjs +1 -1
- package/dist/locale/zh-tw.js +1 -1
- package/dist/locale/zh-tw.min.js +1 -1
- package/dist/locale/zh-tw.min.mjs +1 -1
- package/dist/locale/zh-tw.mjs +1 -1
- package/es/components/button/src/button.vue.d.ts +1 -1
- package/es/components/color-picker/src/color-picker.d.ts +1 -1
- package/es/components/color-picker-panel/src/color-picker-panel.d.ts +1 -1
- package/es/components/config-provider/src/hooks/use-global-config.d.ts +1 -1
- package/es/components/slider/src/composables/index.d.ts +1 -1
- package/es/components/slider/src/composables/use-marks.mjs +16 -2
- package/es/components/slider/src/composables/use-marks.mjs.map +1 -1
- package/es/components/slider/src/composables/use-slider-button.mjs +57 -15
- package/es/components/slider/src/composables/use-slider-button.mjs.map +1 -1
- package/es/components/slider/src/composables/use-stops.mjs +2 -2
- package/es/components/slider/src/composables/use-stops.mjs.map +1 -1
- package/es/components/slider/src/constants.d.ts +2 -0
- package/es/components/slider/src/constants.mjs.map +1 -1
- package/es/components/slider/src/slider.d.ts +1 -1
- package/es/components/slider/src/slider.mjs +1 -1
- package/es/components/slider/src/slider.mjs.map +1 -1
- package/es/components/slider/src/slider.vue.d.ts +3 -3
- package/es/components/slider/src/slider.vue_vue_type_script_setup_true_lang.mjs +14 -5
- package/es/components/slider/src/slider.vue_vue_type_script_setup_true_lang.mjs.map +1 -1
- package/es/components/slider/src/slider2.mjs.map +1 -1
- package/es/components/tooltip/src/tooltip.vue_vue_type_script_setup_true_lang.mjs +1 -0
- package/es/components/tooltip/src/tooltip.vue_vue_type_script_setup_true_lang.mjs.map +1 -1
- package/es/components/tooltip/src/tooltip2.mjs.map +1 -1
- package/es/version.mjs +1 -1
- package/es/version.mjs.map +1 -1
- package/lib/components/button/src/button.vue.d.ts +1 -1
- package/lib/components/color-picker/src/color-picker.d.ts +1 -1
- package/lib/components/color-picker-panel/src/color-picker-panel.d.ts +1 -1
- package/lib/components/config-provider/src/hooks/use-global-config.d.ts +1 -1
- package/lib/components/slider/src/composables/index.d.ts +1 -1
- package/lib/components/slider/src/composables/use-marks.js +15 -1
- package/lib/components/slider/src/composables/use-marks.js.map +1 -1
- package/lib/components/slider/src/composables/use-slider-button.js +57 -15
- package/lib/components/slider/src/composables/use-slider-button.js.map +1 -1
- package/lib/components/slider/src/composables/use-stops.js +2 -2
- package/lib/components/slider/src/composables/use-stops.js.map +1 -1
- package/lib/components/slider/src/constants.d.ts +2 -0
- package/lib/components/slider/src/constants.js.map +1 -1
- package/lib/components/slider/src/slider.d.ts +1 -1
- package/lib/components/slider/src/slider.js +1 -1
- package/lib/components/slider/src/slider.js.map +1 -1
- package/lib/components/slider/src/slider.vue.d.ts +3 -3
- package/lib/components/slider/src/slider.vue_vue_type_script_setup_true_lang.js +14 -5
- package/lib/components/slider/src/slider.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/lib/components/slider/src/slider2.js.map +1 -1
- package/lib/components/tooltip/src/tooltip.vue_vue_type_script_setup_true_lang.js +1 -0
- package/lib/components/tooltip/src/tooltip.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/lib/components/tooltip/src/tooltip2.js.map +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/package.json +2 -2
- package/theme-chalk/el-tag.css +1 -1
- package/theme-chalk/index.css +1 -1
- package/theme-chalk/src/tag.scss +4 -1
- package/web-types.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.vue_vue_type_script_setup_true_lang.mjs","names":["range","showInput","vertical","tooltipClass","placement","min","max","showStops","step","showInputControls"],"sources":["../../../../../../packages/components/slider/src/slider.vue"],"sourcesContent":["<template>\n <div\n :id=\"range ? inputId : undefined\"\n ref=\"sliderWrapper\"\n :class=\"sliderKls\"\n :role=\"range ? 'group' : undefined\"\n :aria-label=\"range && !isLabeledByFormItem ? groupLabel : undefined\"\n :aria-labelledby=\"\n range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n >\n <div\n ref=\"slider\"\n :class=\"[\n ns.e('runway'),\n { 'show-input': showInput && !range },\n ns.is('disabled', sliderDisabled),\n ]\"\n :style=\"runwayStyle\"\n @mousedown=\"onSliderDown\"\n @touchstart.passive=\"onSliderDown\"\n >\n <div :class=\"ns.e('bar')\" :style=\"barStyle\" />\n <slider-button\n :id=\"!range ? inputId : undefined\"\n ref=\"firstButton\"\n :model-value=\"firstValue\"\n :vertical=\"vertical\"\n :tooltip-class=\"tooltipClass\"\n :placement=\"placement\"\n role=\"slider\"\n :aria-label=\"\n range || !isLabeledByFormItem ? firstButtonLabel : undefined\n \"\n :aria-labelledby=\"\n !range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n :aria-valuemin=\"min\"\n :aria-valuemax=\"range ? secondValue : max\"\n :aria-valuenow=\"firstValue\"\n :aria-valuetext=\"firstValueText\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-disabled=\"sliderDisabled\"\n @update:model-value=\"setFirstValue\"\n />\n <slider-button\n v-if=\"range\"\n ref=\"secondButton\"\n :model-value=\"secondValue\"\n :vertical=\"vertical\"\n :tooltip-class=\"tooltipClass\"\n :placement=\"placement\"\n role=\"slider\"\n :aria-label=\"secondButtonLabel\"\n :aria-valuemin=\"firstValue\"\n :aria-valuemax=\"max\"\n :aria-valuenow=\"secondValue\"\n :aria-valuetext=\"secondValueText\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-disabled=\"sliderDisabled\"\n @update:model-value=\"setSecondValue\"\n />\n <div v-if=\"showStops\">\n <div\n v-for=\"(item, key) in stops\"\n :key=\"key\"\n :class=\"ns.e('stop')\"\n :style=\"getStopStyle(item)\"\n />\n </div>\n <template v-if=\"markList.length > 0\">\n <div>\n <div\n v-for=\"(item, key) in markList\"\n :key=\"key\"\n :style=\"getStopStyle(item.position)\"\n :class=\"[ns.e('stop'), ns.e('marks-stop')]\"\n />\n </div>\n <div :class=\"ns.e('marks')\">\n <slider-marker\n v-for=\"(item, key) in markList\"\n :key=\"key\"\n :mark=\"item.mark\"\n :style=\"getStopStyle(item.position)\"\n @mousedown.stop=\"onSliderMarkerDown(item.position)\"\n />\n </div>\n </template>\n </div>\n <el-input-number\n v-if=\"showInput && !range\"\n ref=\"input\"\n :model-value=\"firstValue\"\n :class=\"ns.e('input')\"\n :step=\"step\"\n :disabled=\"sliderDisabled\"\n :controls=\"showInputControls\"\n :min=\"min\"\n :max=\"max\"\n :precision=\"precision\"\n :size=\"sliderInputSize\"\n @update:model-value=\"setFirstValue\"\n @change=\"emitChange\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, reactive, toRefs } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport ElInputNumber from '@element-plus/components/input-number'\nimport { useFormItemInputId, useFormSize } from '@element-plus/components/form'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { sliderContextKey } from './constants'\nimport { sliderEmits, sliderProps } from './slider'\nimport SliderButton from './button.vue'\nimport SliderMarker from './marker'\nimport {\n useLifecycle,\n useMarks,\n useSlide,\n useStops,\n useWatch,\n} from './composables'\n\nimport type { SliderInitData } from './slider'\n\ndefineOptions({\n name: 'ElSlider',\n})\n\nconst props = defineProps(sliderProps)\nconst emit = defineEmits(sliderEmits)\n\nconst ns = useNamespace('slider')\nconst { t } = useLocale()\n\nconst initData = reactive<SliderInitData>({\n firstValue: 0,\n secondValue: 0,\n oldValue: 0,\n dragging: false,\n sliderSize: 1,\n})\n\nconst {\n elFormItem,\n slider,\n firstButton,\n secondButton,\n sliderDisabled,\n minValue,\n maxValue,\n runwayStyle,\n barStyle,\n resetSize,\n emitChange,\n onSliderWrapperPrevent,\n onSliderClick,\n onSliderDown,\n onSliderMarkerDown,\n setFirstValue,\n setSecondValue,\n} = useSlide(props, initData, emit)\n\nconst { stops, getStopStyle } = useStops(props, initData, minValue, maxValue)\n\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n formItemContext: elFormItem,\n})\n\nconst sliderWrapperSize = useFormSize()\nconst sliderInputSize = computed(\n () => props.inputSize || sliderWrapperSize.value\n)\n\nconst groupLabel = computed<string>(() => {\n return (\n props.ariaLabel ||\n t('el.slider.defaultLabel', {\n min: props.min,\n max: props.max,\n })\n )\n})\n\nconst firstButtonLabel = computed<string>(() => {\n if (props.range) {\n return props.rangeStartLabel || t('el.slider.defaultRangeStartLabel')\n } else {\n return groupLabel.value\n }\n})\n\nconst firstValueText = computed<string>(() => {\n return props.formatValueText\n ? props.formatValueText(firstValue.value)\n : `${firstValue.value}`\n})\n\nconst secondButtonLabel = computed<string>(() => {\n return props.rangeEndLabel || t('el.slider.defaultRangeEndLabel')\n})\n\nconst secondValueText = computed<string>(() => {\n return props.formatValueText\n ? props.formatValueText(secondValue.value)\n : `${secondValue.value}`\n})\n\nconst sliderKls = computed(() => [\n ns.b(),\n ns.m(sliderWrapperSize.value),\n ns.is('vertical', props.vertical),\n { [ns.m('with-input')]: props.showInput },\n])\n\nconst markList = useMarks(props)\n\nuseWatch(props, initData, minValue, maxValue, emit, elFormItem!)\n\nconst precision = computed(() => {\n const precisions = [props.min, props.max, props.step].map((item) => {\n const decimal = `${item}`.split('.')[1]\n return decimal ? decimal.length : 0\n })\n return Math.max.apply(null, precisions)\n})\n\nconst { sliderWrapper } = useLifecycle(props, initData, resetSize)\n\nconst { firstValue, secondValue, sliderSize } = toRefs(initData)\n\nconst updateDragging = (val: boolean) => {\n initData.dragging = val\n}\n\nuseEventListener(sliderWrapper, 'touchstart', onSliderWrapperPrevent, {\n passive: false,\n})\nuseEventListener(sliderWrapper, 'touchmove', onSliderWrapperPrevent, {\n passive: false,\n})\n\nprovide(sliderContextKey, {\n ...toRefs(props),\n sliderSize,\n disabled: sliderDisabled,\n precision,\n emitChange,\n resetSize,\n updateDragging,\n})\n\ndefineExpose({\n onSliderClick,\n})\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"slider.vue_vue_type_script_setup_true_lang.mjs","names":["range","vertical","tooltipClass","placement","min","max","showStops","showInputControls"],"sources":["../../../../../../packages/components/slider/src/slider.vue"],"sourcesContent":["<template>\n <div\n :id=\"range ? inputId : undefined\"\n ref=\"sliderWrapper\"\n :class=\"sliderKls\"\n :role=\"range ? 'group' : undefined\"\n :aria-label=\"range && !isLabeledByFormItem ? groupLabel : undefined\"\n :aria-labelledby=\"\n range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n >\n <div\n ref=\"slider\"\n :class=\"[\n ns.e('runway'),\n { 'show-input': renderInput },\n ns.is('disabled', sliderDisabled),\n ]\"\n :style=\"runwayStyle\"\n @mousedown=\"onSliderDown\"\n @touchstart.passive=\"onSliderDown\"\n >\n <div :class=\"ns.e('bar')\" :style=\"barStyle\" />\n <slider-button\n :id=\"!range ? inputId : undefined\"\n ref=\"firstButton\"\n :model-value=\"firstValue\"\n :vertical=\"vertical\"\n :tooltip-class=\"tooltipClass\"\n :placement=\"placement\"\n role=\"slider\"\n :aria-label=\"\n range || !isLabeledByFormItem ? firstButtonLabel : undefined\n \"\n :aria-labelledby=\"\n !range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n :aria-valuemin=\"min\"\n :aria-valuemax=\"range ? secondValue : max\"\n :aria-valuenow=\"firstValue\"\n :aria-valuetext=\"firstValueText\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-disabled=\"sliderDisabled\"\n @update:model-value=\"setFirstValue\"\n />\n <slider-button\n v-if=\"range\"\n ref=\"secondButton\"\n :model-value=\"secondValue\"\n :vertical=\"vertical\"\n :tooltip-class=\"tooltipClass\"\n :placement=\"placement\"\n role=\"slider\"\n :aria-label=\"secondButtonLabel\"\n :aria-valuemin=\"firstValue\"\n :aria-valuemax=\"max\"\n :aria-valuenow=\"secondValue\"\n :aria-valuetext=\"secondValueText\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-disabled=\"sliderDisabled\"\n @update:model-value=\"setSecondValue\"\n />\n <div v-if=\"showStops\">\n <div\n v-for=\"(item, key) in stops\"\n :key=\"key\"\n :class=\"ns.e('stop')\"\n :style=\"getStopStyle(item)\"\n />\n </div>\n <template v-if=\"markList.length > 0\">\n <div>\n <div\n v-for=\"(item, key) in markList\"\n :key=\"key\"\n :style=\"getStopStyle(item.position)\"\n :class=\"[ns.e('stop'), ns.e('marks-stop')]\"\n />\n </div>\n <div :class=\"ns.e('marks')\">\n <slider-marker\n v-for=\"(item, key) in markList\"\n :key=\"key\"\n :mark=\"item.mark\"\n :style=\"getStopStyle(item.position)\"\n @mousedown.stop=\"onSliderMarkerDown(item.position)\"\n />\n </div>\n </template>\n </div>\n <el-input-number\n v-if=\"renderInput\"\n ref=\"input\"\n :model-value=\"firstValue\"\n :class=\"ns.e('input')\"\n :step=\"sliderInputStep\"\n :disabled=\"sliderDisabled\"\n :controls=\"showInputControls\"\n :min=\"min\"\n :max=\"max\"\n :precision=\"precision\"\n :size=\"sliderInputSize\"\n @update:model-value=\"setFirstValue\"\n @change=\"emitChange\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, reactive, toRefs } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport ElInputNumber from '@element-plus/components/input-number'\nimport { useFormItemInputId, useFormSize } from '@element-plus/components/form'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { sliderContextKey } from './constants'\nimport { sliderEmits, sliderProps } from './slider'\nimport SliderButton from './button.vue'\nimport SliderMarker from './marker'\nimport {\n useLifecycle,\n useMarks,\n useSlide,\n useStops,\n useWatch,\n} from './composables'\nimport { isNumber } from '@element-plus/utils'\n\nimport type { SliderInitData } from './slider'\n\ndefineOptions({\n name: 'ElSlider',\n})\n\nconst props = defineProps(sliderProps)\nconst emit = defineEmits(sliderEmits)\n\nconst ns = useNamespace('slider')\nconst { t } = useLocale()\n\nconst initData = reactive<SliderInitData>({\n firstValue: 0,\n secondValue: 0,\n oldValue: 0,\n dragging: false,\n sliderSize: 1,\n})\n\nconst {\n elFormItem,\n slider,\n firstButton,\n secondButton,\n sliderDisabled,\n minValue,\n maxValue,\n runwayStyle,\n barStyle,\n resetSize,\n emitChange,\n onSliderWrapperPrevent,\n onSliderClick,\n onSliderDown,\n onSliderMarkerDown,\n setFirstValue,\n setSecondValue,\n} = useSlide(props, initData, emit)\n\nconst { stops, getStopStyle } = useStops(props, initData, minValue, maxValue)\n\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n formItemContext: elFormItem,\n})\n\nconst sliderWrapperSize = useFormSize()\nconst sliderInputSize = computed(\n () => props.inputSize || sliderWrapperSize.value\n)\n\nconst renderInput = computed(() => {\n return props.showInput && !props.range && props.step !== 'mark'\n})\n\nconst groupLabel = computed<string>(() => {\n return (\n props.ariaLabel ||\n t('el.slider.defaultLabel', {\n min: props.min,\n max: props.max,\n })\n )\n})\n\nconst firstButtonLabel = computed<string>(() => {\n if (props.range) {\n return props.rangeStartLabel || t('el.slider.defaultRangeStartLabel')\n } else {\n return groupLabel.value\n }\n})\n\nconst firstValueText = computed<string>(() => {\n return props.formatValueText\n ? props.formatValueText(firstValue.value)\n : `${firstValue.value}`\n})\n\nconst secondButtonLabel = computed<string>(() => {\n return props.rangeEndLabel || t('el.slider.defaultRangeEndLabel')\n})\n\nconst secondValueText = computed<string>(() => {\n return props.formatValueText\n ? props.formatValueText(secondValue.value)\n : `${secondValue.value}`\n})\n\nconst sliderKls = computed(() => [\n ns.b(),\n ns.m(sliderWrapperSize.value),\n ns.is('vertical', props.vertical),\n { [ns.m('with-input')]: renderInput.value },\n])\n\nconst markList = useMarks(props)\n\nuseWatch(props, initData, minValue, maxValue, emit, elFormItem!)\n\nconst sliderInputStep = computed(() => {\n return isNumber(props.step) ? props.step : 1\n})\n\nconst precision = computed(() => {\n const stepValue = isNumber(props.step) ? props.step : 1\n const precisions = [props.min, props.max, stepValue].map((item) => {\n const decimal = `${item}`.split('.')[1]\n return decimal ? decimal.length : 0\n })\n return Math.max.apply(null, precisions)\n})\n\nconst { sliderWrapper } = useLifecycle(props, initData, resetSize)\n\nconst { firstValue, secondValue, sliderSize } = toRefs(initData)\n\nconst updateDragging = (val: boolean) => {\n initData.dragging = val\n}\n\nuseEventListener(sliderWrapper, 'touchstart', onSliderWrapperPrevent, {\n passive: false,\n})\nuseEventListener(sliderWrapper, 'touchmove', onSliderWrapperPrevent, {\n passive: false,\n})\n\nprovide(sliderContextKey, {\n ...toRefs(props),\n sliderSize,\n disabled: sliderDisabled,\n precision,\n markList,\n emitChange,\n resetSize,\n updateDragging,\n})\n\ndefineExpose({\n onSliderClick,\n})\n</script>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider2.mjs","names":[],"sources":["../../../../../../packages/components/slider/src/slider.vue"],"sourcesContent":["<template>\n <div\n :id=\"range ? inputId : undefined\"\n ref=\"sliderWrapper\"\n :class=\"sliderKls\"\n :role=\"range ? 'group' : undefined\"\n :aria-label=\"range && !isLabeledByFormItem ? groupLabel : undefined\"\n :aria-labelledby=\"\n range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n >\n <div\n ref=\"slider\"\n :class=\"[\n ns.e('runway'),\n { 'show-input':
|
|
1
|
+
{"version":3,"file":"slider2.mjs","names":[],"sources":["../../../../../../packages/components/slider/src/slider.vue"],"sourcesContent":["<template>\n <div\n :id=\"range ? inputId : undefined\"\n ref=\"sliderWrapper\"\n :class=\"sliderKls\"\n :role=\"range ? 'group' : undefined\"\n :aria-label=\"range && !isLabeledByFormItem ? groupLabel : undefined\"\n :aria-labelledby=\"\n range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n >\n <div\n ref=\"slider\"\n :class=\"[\n ns.e('runway'),\n { 'show-input': renderInput },\n ns.is('disabled', sliderDisabled),\n ]\"\n :style=\"runwayStyle\"\n @mousedown=\"onSliderDown\"\n @touchstart.passive=\"onSliderDown\"\n >\n <div :class=\"ns.e('bar')\" :style=\"barStyle\" />\n <slider-button\n :id=\"!range ? inputId : undefined\"\n ref=\"firstButton\"\n :model-value=\"firstValue\"\n :vertical=\"vertical\"\n :tooltip-class=\"tooltipClass\"\n :placement=\"placement\"\n role=\"slider\"\n :aria-label=\"\n range || !isLabeledByFormItem ? firstButtonLabel : undefined\n \"\n :aria-labelledby=\"\n !range && isLabeledByFormItem ? elFormItem?.labelId : undefined\n \"\n :aria-valuemin=\"min\"\n :aria-valuemax=\"range ? secondValue : max\"\n :aria-valuenow=\"firstValue\"\n :aria-valuetext=\"firstValueText\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-disabled=\"sliderDisabled\"\n @update:model-value=\"setFirstValue\"\n />\n <slider-button\n v-if=\"range\"\n ref=\"secondButton\"\n :model-value=\"secondValue\"\n :vertical=\"vertical\"\n :tooltip-class=\"tooltipClass\"\n :placement=\"placement\"\n role=\"slider\"\n :aria-label=\"secondButtonLabel\"\n :aria-valuemin=\"firstValue\"\n :aria-valuemax=\"max\"\n :aria-valuenow=\"secondValue\"\n :aria-valuetext=\"secondValueText\"\n :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n :aria-disabled=\"sliderDisabled\"\n @update:model-value=\"setSecondValue\"\n />\n <div v-if=\"showStops\">\n <div\n v-for=\"(item, key) in stops\"\n :key=\"key\"\n :class=\"ns.e('stop')\"\n :style=\"getStopStyle(item)\"\n />\n </div>\n <template v-if=\"markList.length > 0\">\n <div>\n <div\n v-for=\"(item, key) in markList\"\n :key=\"key\"\n :style=\"getStopStyle(item.position)\"\n :class=\"[ns.e('stop'), ns.e('marks-stop')]\"\n />\n </div>\n <div :class=\"ns.e('marks')\">\n <slider-marker\n v-for=\"(item, key) in markList\"\n :key=\"key\"\n :mark=\"item.mark\"\n :style=\"getStopStyle(item.position)\"\n @mousedown.stop=\"onSliderMarkerDown(item.position)\"\n />\n </div>\n </template>\n </div>\n <el-input-number\n v-if=\"renderInput\"\n ref=\"input\"\n :model-value=\"firstValue\"\n :class=\"ns.e('input')\"\n :step=\"sliderInputStep\"\n :disabled=\"sliderDisabled\"\n :controls=\"showInputControls\"\n :min=\"min\"\n :max=\"max\"\n :precision=\"precision\"\n :size=\"sliderInputSize\"\n @update:model-value=\"setFirstValue\"\n @change=\"emitChange\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, reactive, toRefs } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport ElInputNumber from '@element-plus/components/input-number'\nimport { useFormItemInputId, useFormSize } from '@element-plus/components/form'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { sliderContextKey } from './constants'\nimport { sliderEmits, sliderProps } from './slider'\nimport SliderButton from './button.vue'\nimport SliderMarker from './marker'\nimport {\n useLifecycle,\n useMarks,\n useSlide,\n useStops,\n useWatch,\n} from './composables'\nimport { isNumber } from '@element-plus/utils'\n\nimport type { SliderInitData } from './slider'\n\ndefineOptions({\n name: 'ElSlider',\n})\n\nconst props = defineProps(sliderProps)\nconst emit = defineEmits(sliderEmits)\n\nconst ns = useNamespace('slider')\nconst { t } = useLocale()\n\nconst initData = reactive<SliderInitData>({\n firstValue: 0,\n secondValue: 0,\n oldValue: 0,\n dragging: false,\n sliderSize: 1,\n})\n\nconst {\n elFormItem,\n slider,\n firstButton,\n secondButton,\n sliderDisabled,\n minValue,\n maxValue,\n runwayStyle,\n barStyle,\n resetSize,\n emitChange,\n onSliderWrapperPrevent,\n onSliderClick,\n onSliderDown,\n onSliderMarkerDown,\n setFirstValue,\n setSecondValue,\n} = useSlide(props, initData, emit)\n\nconst { stops, getStopStyle } = useStops(props, initData, minValue, maxValue)\n\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n formItemContext: elFormItem,\n})\n\nconst sliderWrapperSize = useFormSize()\nconst sliderInputSize = computed(\n () => props.inputSize || sliderWrapperSize.value\n)\n\nconst renderInput = computed(() => {\n return props.showInput && !props.range && props.step !== 'mark'\n})\n\nconst groupLabel = computed<string>(() => {\n return (\n props.ariaLabel ||\n t('el.slider.defaultLabel', {\n min: props.min,\n max: props.max,\n })\n )\n})\n\nconst firstButtonLabel = computed<string>(() => {\n if (props.range) {\n return props.rangeStartLabel || t('el.slider.defaultRangeStartLabel')\n } else {\n return groupLabel.value\n }\n})\n\nconst firstValueText = computed<string>(() => {\n return props.formatValueText\n ? props.formatValueText(firstValue.value)\n : `${firstValue.value}`\n})\n\nconst secondButtonLabel = computed<string>(() => {\n return props.rangeEndLabel || t('el.slider.defaultRangeEndLabel')\n})\n\nconst secondValueText = computed<string>(() => {\n return props.formatValueText\n ? props.formatValueText(secondValue.value)\n : `${secondValue.value}`\n})\n\nconst sliderKls = computed(() => [\n ns.b(),\n ns.m(sliderWrapperSize.value),\n ns.is('vertical', props.vertical),\n { [ns.m('with-input')]: renderInput.value },\n])\n\nconst markList = useMarks(props)\n\nuseWatch(props, initData, minValue, maxValue, emit, elFormItem!)\n\nconst sliderInputStep = computed(() => {\n return isNumber(props.step) ? props.step : 1\n})\n\nconst precision = computed(() => {\n const stepValue = isNumber(props.step) ? props.step : 1\n const precisions = [props.min, props.max, stepValue].map((item) => {\n const decimal = `${item}`.split('.')[1]\n return decimal ? decimal.length : 0\n })\n return Math.max.apply(null, precisions)\n})\n\nconst { sliderWrapper } = useLifecycle(props, initData, resetSize)\n\nconst { firstValue, secondValue, sliderSize } = toRefs(initData)\n\nconst updateDragging = (val: boolean) => {\n initData.dragging = val\n}\n\nuseEventListener(sliderWrapper, 'touchstart', onSliderWrapperPrevent, {\n passive: false,\n})\nuseEventListener(sliderWrapper, 'touchmove', onSliderWrapperPrevent, {\n passive: false,\n})\n\nprovide(sliderContextKey, {\n ...toRefs(props),\n sliderSize,\n disabled: sliderDisabled,\n precision,\n markList,\n emitChange,\n resetSize,\n updateDragging,\n})\n\ndefineExpose({\n onSliderClick,\n})\n</script>\n"],"mappings":""}
|
|
@@ -75,6 +75,7 @@ var tooltip_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
|
|
|
75
75
|
});
|
|
76
76
|
watch(() => props.disabled, (disabled) => {
|
|
77
77
|
if (disabled && open.value) open.value = false;
|
|
78
|
+
if (!disabled && isBoolean(props.visible)) open.value = props.visible;
|
|
78
79
|
});
|
|
79
80
|
const isFocusInsideContent = (event) => {
|
|
80
81
|
return contentRef.value?.isFocusInsideContent(event);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n <el-popper ref=\"popperRef\" :role=\"role\">\n <el-tooltip-trigger\n :disabled=\"disabled\"\n :trigger=\"trigger\"\n :trigger-keys=\"triggerKeys\"\n :virtual-ref=\"virtualRef\"\n :virtual-triggering=\"virtualTriggering\"\n :focus-on-target=\"focusOnTarget\"\n >\n <slot v-if=\"$slots.default\" />\n </el-tooltip-trigger>\n <el-tooltip-content\n ref=\"contentRef\"\n :aria-label=\"ariaLabel\"\n :boundaries-padding=\"boundariesPadding\"\n :content=\"content\"\n :disabled=\"disabled\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :fallback-placements=\"fallbackPlacements\"\n :hide-after=\"hideAfter\"\n :gpu-acceleration=\"gpuAcceleration\"\n :offset=\"offset\"\n :persistent=\"persistent\"\n :popper-class=\"kls\"\n :popper-style=\"popperStyle\"\n :placement=\"placement\"\n :popper-options=\"popperOptions\"\n :arrow-offset=\"arrowOffset\"\n :pure=\"pure\"\n :raw-content=\"rawContent\"\n :reference-el=\"referenceEl\"\n :trigger-target-el=\"triggerTargetEl\"\n :show-after=\"showAfter\"\n :strategy=\"strategy\"\n :teleported=\"teleported\"\n :transition=\"transition\"\n :virtual-triggering=\"virtualTriggering\"\n :z-index=\"zIndex\"\n :append-to=\"appendTo\"\n :loop=\"loop\"\n >\n <slot name=\"content\">\n <span v-if=\"rawContent\" v-html=\"content\" />\n <span v-else>{{ content }}</span>\n </slot>\n <el-popper-arrow v-if=\"showArrow\" />\n </el-tooltip-content>\n </el-popper>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n onBeforeUnmount,\n onDeactivated,\n provide,\n readonly,\n ref,\n toRef,\n unref,\n watch,\n} from 'vue'\nimport {\n ElPopper,\n ElPopperArrow,\n popperArrowPropsDefaults,\n} from '@element-plus/components/popper'\nimport { isBoolean } from '@element-plus/utils'\nimport {\n useDelayedToggle,\n useId,\n useNamespace,\n usePopperContainer,\n} from '@element-plus/hooks'\nimport { TOOLTIP_INJECTION_KEY } from './constants'\nimport { tooltipEmits, useTooltipModelToggle } from './tooltip'\nimport ElTooltipTrigger from './trigger.vue'\nimport ElTooltipContent from './content.vue'\nimport { useTooltipContentPropsDefaults } from './content'\nimport { useTooltipTriggerPropsDefaults } from './trigger'\n\nimport type { Mutable } from '@element-plus/utils'\nimport type { TooltipContentInstance } from './content'\nimport type { UseTooltipProps } from './tooltip'\nimport type { PopperInstance } from '@element-plus/components/popper'\n\ndefineOptions({\n name: 'ElTooltip',\n})\n\nconst props = withDefaults(defineProps<UseTooltipProps>(), {\n role: 'tooltip',\n ...useTooltipContentPropsDefaults,\n ...useTooltipTriggerPropsDefaults,\n ...popperArrowPropsDefaults,\n showArrow: true,\n})\nconst emit = defineEmits(tooltipEmits as Mutable<typeof tooltipEmits>)\n\nusePopperContainer()\n\nconst ns = useNamespace('tooltip')\nconst id = useId()\nconst popperRef = ref<PopperInstance>()\nconst contentRef = ref<TooltipContentInstance>()\n\nconst updatePopper = () => {\n const popperComponent = unref(popperRef)\n if (popperComponent) {\n popperComponent.popperInstanceRef?.update()\n }\n}\nconst open = ref(false)\nconst toggleReason = ref<Event>()\n\nconst { show, hide, hasUpdateHandler } = useTooltipModelToggle({\n indicator: open,\n toggleReason,\n})\n\nconst { onOpen, onClose } = useDelayedToggle({\n showAfter: toRef(props, 'showAfter'),\n hideAfter: toRef(props, 'hideAfter'),\n autoClose: toRef(props, 'autoClose'),\n open: show,\n close: hide,\n})\n\nconst controlled = computed(\n () => isBoolean(props.visible) && !hasUpdateHandler.value\n)\n\nconst kls = computed(() => {\n return [ns.b(), props.popperClass!]\n})\n\nprovide(TOOLTIP_INJECTION_KEY, {\n controlled,\n id,\n open: readonly(open),\n trigger: toRef(props, 'trigger'),\n onOpen,\n onClose,\n onToggle: (event?: Event) => {\n if (unref(open)) {\n onClose(event)\n } else {\n onOpen(event)\n }\n },\n onShow: () => {\n emit('show', toggleReason.value)\n },\n onHide: () => {\n emit('hide', toggleReason.value)\n },\n onBeforeShow: () => {\n emit('before-show', toggleReason.value)\n },\n onBeforeHide: () => {\n emit('before-hide', toggleReason.value)\n },\n updatePopper,\n})\n\nwatch(\n () => props.disabled,\n (disabled) => {\n if (disabled && open.value) {\n open.value = false\n }\n }\n)\n\nconst isFocusInsideContent = (event?: FocusEvent) => {\n return contentRef.value?.isFocusInsideContent(event)\n}\n\nonDeactivated(() => open.value && hide())\n\nonBeforeUnmount(() => {\n toggleReason.value = undefined\n})\n\ndefineExpose({\n /**\n * @description el-popper component instance\n */\n popperRef,\n /**\n * @description el-tooltip-content component instance\n */\n contentRef,\n /**\n * @description validate current focus event is trigger inside el-tooltip-content\n */\n isFocusInsideContent,\n /**\n * @description update el-popper component instance\n */\n updatePopper,\n /**\n * @description expose onOpen function to mange el-tooltip open state\n */\n onOpen,\n /**\n * @description expose onClose function to manage el-tooltip close state\n */\n onClose,\n /**\n * @description expose hide function\n */\n hide,\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EA4FA,MAAM,QAAQ;EAOd,MAAM,OAAO;AAEb,sBAAmB;EAEnB,MAAM,KAAK,aAAa,UAAS;EACjC,MAAM,KAAK,OAAM;EACjB,MAAM,YAAY,KAAoB;EACtC,MAAM,aAAa,KAA4B;EAE/C,MAAM,qBAAqB;GACzB,MAAM,kBAAkB,MAAM,UAAS;AACvC,OAAI,gBACF,iBAAgB,mBAAmB,QAAO;;EAG9C,MAAM,OAAO,IAAI,MAAK;EACtB,MAAM,eAAe,KAAW;EAEhC,MAAM,EAAE,MAAM,MAAM,qBAAqB,sBAAsB;GAC7D,WAAW;GACX;GACD,CAAA;EAED,MAAM,EAAE,QAAQ,YAAY,iBAAiB;GAC3C,WAAW,MAAM,OAAO,YAAY;GACpC,WAAW,MAAM,OAAO,YAAY;GACpC,WAAW,MAAM,OAAO,YAAY;GACpC,MAAM;GACN,OAAO;GACR,CAAA;EAED,MAAM,aAAa,eACX,UAAU,MAAM,QAAQ,IAAI,CAAC,iBAAiB,MACtD;EAEA,MAAM,MAAM,eAAe;AACzB,UAAO,CAAC,GAAG,GAAG,EAAE,MAAM,YAAY;IACnC;AAED,UAAQ,uBAAuB;GAC7B;GACA;GACA,MAAM,SAAS,KAAK;GACpB,SAAS,MAAM,OAAO,UAAU;GAChC;GACA;GACA,WAAW,UAAkB;AAC3B,QAAI,MAAM,KAAK,CACb,SAAQ,MAAK;QAEb,QAAO,MAAK;;GAGhB,cAAc;AACZ,SAAK,QAAQ,aAAa,MAAK;;GAEjC,cAAc;AACZ,SAAK,QAAQ,aAAa,MAAK;;GAEjC,oBAAoB;AAClB,SAAK,eAAe,aAAa,MAAK;;GAExC,oBAAoB;AAClB,SAAK,eAAe,aAAa,MAAK;;GAExC;GACD,CAAA;AAED,cACQ,MAAM,WACX,aAAa;AACZ,OAAI,YAAY,KAAK,MACnB,MAAK,QAAQ;
|
|
1
|
+
{"version":3,"file":"tooltip.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n <el-popper ref=\"popperRef\" :role=\"role\">\n <el-tooltip-trigger\n :disabled=\"disabled\"\n :trigger=\"trigger\"\n :trigger-keys=\"triggerKeys\"\n :virtual-ref=\"virtualRef\"\n :virtual-triggering=\"virtualTriggering\"\n :focus-on-target=\"focusOnTarget\"\n >\n <slot v-if=\"$slots.default\" />\n </el-tooltip-trigger>\n <el-tooltip-content\n ref=\"contentRef\"\n :aria-label=\"ariaLabel\"\n :boundaries-padding=\"boundariesPadding\"\n :content=\"content\"\n :disabled=\"disabled\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :fallback-placements=\"fallbackPlacements\"\n :hide-after=\"hideAfter\"\n :gpu-acceleration=\"gpuAcceleration\"\n :offset=\"offset\"\n :persistent=\"persistent\"\n :popper-class=\"kls\"\n :popper-style=\"popperStyle\"\n :placement=\"placement\"\n :popper-options=\"popperOptions\"\n :arrow-offset=\"arrowOffset\"\n :pure=\"pure\"\n :raw-content=\"rawContent\"\n :reference-el=\"referenceEl\"\n :trigger-target-el=\"triggerTargetEl\"\n :show-after=\"showAfter\"\n :strategy=\"strategy\"\n :teleported=\"teleported\"\n :transition=\"transition\"\n :virtual-triggering=\"virtualTriggering\"\n :z-index=\"zIndex\"\n :append-to=\"appendTo\"\n :loop=\"loop\"\n >\n <slot name=\"content\">\n <span v-if=\"rawContent\" v-html=\"content\" />\n <span v-else>{{ content }}</span>\n </slot>\n <el-popper-arrow v-if=\"showArrow\" />\n </el-tooltip-content>\n </el-popper>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n onBeforeUnmount,\n onDeactivated,\n provide,\n readonly,\n ref,\n toRef,\n unref,\n watch,\n} from 'vue'\nimport {\n ElPopper,\n ElPopperArrow,\n popperArrowPropsDefaults,\n} from '@element-plus/components/popper'\nimport { isBoolean } from '@element-plus/utils'\nimport {\n useDelayedToggle,\n useId,\n useNamespace,\n usePopperContainer,\n} from '@element-plus/hooks'\nimport { TOOLTIP_INJECTION_KEY } from './constants'\nimport { tooltipEmits, useTooltipModelToggle } from './tooltip'\nimport ElTooltipTrigger from './trigger.vue'\nimport ElTooltipContent from './content.vue'\nimport { useTooltipContentPropsDefaults } from './content'\nimport { useTooltipTriggerPropsDefaults } from './trigger'\n\nimport type { Mutable } from '@element-plus/utils'\nimport type { TooltipContentInstance } from './content'\nimport type { UseTooltipProps } from './tooltip'\nimport type { PopperInstance } from '@element-plus/components/popper'\n\ndefineOptions({\n name: 'ElTooltip',\n})\n\nconst props = withDefaults(defineProps<UseTooltipProps>(), {\n role: 'tooltip',\n ...useTooltipContentPropsDefaults,\n ...useTooltipTriggerPropsDefaults,\n ...popperArrowPropsDefaults,\n showArrow: true,\n})\nconst emit = defineEmits(tooltipEmits as Mutable<typeof tooltipEmits>)\n\nusePopperContainer()\n\nconst ns = useNamespace('tooltip')\nconst id = useId()\nconst popperRef = ref<PopperInstance>()\nconst contentRef = ref<TooltipContentInstance>()\n\nconst updatePopper = () => {\n const popperComponent = unref(popperRef)\n if (popperComponent) {\n popperComponent.popperInstanceRef?.update()\n }\n}\nconst open = ref(false)\nconst toggleReason = ref<Event>()\n\nconst { show, hide, hasUpdateHandler } = useTooltipModelToggle({\n indicator: open,\n toggleReason,\n})\n\nconst { onOpen, onClose } = useDelayedToggle({\n showAfter: toRef(props, 'showAfter'),\n hideAfter: toRef(props, 'hideAfter'),\n autoClose: toRef(props, 'autoClose'),\n open: show,\n close: hide,\n})\n\nconst controlled = computed(\n () => isBoolean(props.visible) && !hasUpdateHandler.value\n)\n\nconst kls = computed(() => {\n return [ns.b(), props.popperClass!]\n})\n\nprovide(TOOLTIP_INJECTION_KEY, {\n controlled,\n id,\n open: readonly(open),\n trigger: toRef(props, 'trigger'),\n onOpen,\n onClose,\n onToggle: (event?: Event) => {\n if (unref(open)) {\n onClose(event)\n } else {\n onOpen(event)\n }\n },\n onShow: () => {\n emit('show', toggleReason.value)\n },\n onHide: () => {\n emit('hide', toggleReason.value)\n },\n onBeforeShow: () => {\n emit('before-show', toggleReason.value)\n },\n onBeforeHide: () => {\n emit('before-hide', toggleReason.value)\n },\n updatePopper,\n})\n\nwatch(\n () => props.disabled,\n (disabled) => {\n if (disabled && open.value) {\n open.value = false\n }\n if (!disabled && isBoolean(props.visible)) {\n open.value = props.visible\n }\n }\n)\n\nconst isFocusInsideContent = (event?: FocusEvent) => {\n return contentRef.value?.isFocusInsideContent(event)\n}\n\nonDeactivated(() => open.value && hide())\n\nonBeforeUnmount(() => {\n toggleReason.value = undefined\n})\n\ndefineExpose({\n /**\n * @description el-popper component instance\n */\n popperRef,\n /**\n * @description el-tooltip-content component instance\n */\n contentRef,\n /**\n * @description validate current focus event is trigger inside el-tooltip-content\n */\n isFocusInsideContent,\n /**\n * @description update el-popper component instance\n */\n updatePopper,\n /**\n * @description expose onOpen function to mange el-tooltip open state\n */\n onOpen,\n /**\n * @description expose onClose function to manage el-tooltip close state\n */\n onClose,\n /**\n * @description expose hide function\n */\n hide,\n})\n</script>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip2.mjs","names":[],"sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n <el-popper ref=\"popperRef\" :role=\"role\">\n <el-tooltip-trigger\n :disabled=\"disabled\"\n :trigger=\"trigger\"\n :trigger-keys=\"triggerKeys\"\n :virtual-ref=\"virtualRef\"\n :virtual-triggering=\"virtualTriggering\"\n :focus-on-target=\"focusOnTarget\"\n >\n <slot v-if=\"$slots.default\" />\n </el-tooltip-trigger>\n <el-tooltip-content\n ref=\"contentRef\"\n :aria-label=\"ariaLabel\"\n :boundaries-padding=\"boundariesPadding\"\n :content=\"content\"\n :disabled=\"disabled\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :fallback-placements=\"fallbackPlacements\"\n :hide-after=\"hideAfter\"\n :gpu-acceleration=\"gpuAcceleration\"\n :offset=\"offset\"\n :persistent=\"persistent\"\n :popper-class=\"kls\"\n :popper-style=\"popperStyle\"\n :placement=\"placement\"\n :popper-options=\"popperOptions\"\n :arrow-offset=\"arrowOffset\"\n :pure=\"pure\"\n :raw-content=\"rawContent\"\n :reference-el=\"referenceEl\"\n :trigger-target-el=\"triggerTargetEl\"\n :show-after=\"showAfter\"\n :strategy=\"strategy\"\n :teleported=\"teleported\"\n :transition=\"transition\"\n :virtual-triggering=\"virtualTriggering\"\n :z-index=\"zIndex\"\n :append-to=\"appendTo\"\n :loop=\"loop\"\n >\n <slot name=\"content\">\n <span v-if=\"rawContent\" v-html=\"content\" />\n <span v-else>{{ content }}</span>\n </slot>\n <el-popper-arrow v-if=\"showArrow\" />\n </el-tooltip-content>\n </el-popper>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n onBeforeUnmount,\n onDeactivated,\n provide,\n readonly,\n ref,\n toRef,\n unref,\n watch,\n} from 'vue'\nimport {\n ElPopper,\n ElPopperArrow,\n popperArrowPropsDefaults,\n} from '@element-plus/components/popper'\nimport { isBoolean } from '@element-plus/utils'\nimport {\n useDelayedToggle,\n useId,\n useNamespace,\n usePopperContainer,\n} from '@element-plus/hooks'\nimport { TOOLTIP_INJECTION_KEY } from './constants'\nimport { tooltipEmits, useTooltipModelToggle } from './tooltip'\nimport ElTooltipTrigger from './trigger.vue'\nimport ElTooltipContent from './content.vue'\nimport { useTooltipContentPropsDefaults } from './content'\nimport { useTooltipTriggerPropsDefaults } from './trigger'\n\nimport type { Mutable } from '@element-plus/utils'\nimport type { TooltipContentInstance } from './content'\nimport type { UseTooltipProps } from './tooltip'\nimport type { PopperInstance } from '@element-plus/components/popper'\n\ndefineOptions({\n name: 'ElTooltip',\n})\n\nconst props = withDefaults(defineProps<UseTooltipProps>(), {\n role: 'tooltip',\n ...useTooltipContentPropsDefaults,\n ...useTooltipTriggerPropsDefaults,\n ...popperArrowPropsDefaults,\n showArrow: true,\n})\nconst emit = defineEmits(tooltipEmits as Mutable<typeof tooltipEmits>)\n\nusePopperContainer()\n\nconst ns = useNamespace('tooltip')\nconst id = useId()\nconst popperRef = ref<PopperInstance>()\nconst contentRef = ref<TooltipContentInstance>()\n\nconst updatePopper = () => {\n const popperComponent = unref(popperRef)\n if (popperComponent) {\n popperComponent.popperInstanceRef?.update()\n }\n}\nconst open = ref(false)\nconst toggleReason = ref<Event>()\n\nconst { show, hide, hasUpdateHandler } = useTooltipModelToggle({\n indicator: open,\n toggleReason,\n})\n\nconst { onOpen, onClose } = useDelayedToggle({\n showAfter: toRef(props, 'showAfter'),\n hideAfter: toRef(props, 'hideAfter'),\n autoClose: toRef(props, 'autoClose'),\n open: show,\n close: hide,\n})\n\nconst controlled = computed(\n () => isBoolean(props.visible) && !hasUpdateHandler.value\n)\n\nconst kls = computed(() => {\n return [ns.b(), props.popperClass!]\n})\n\nprovide(TOOLTIP_INJECTION_KEY, {\n controlled,\n id,\n open: readonly(open),\n trigger: toRef(props, 'trigger'),\n onOpen,\n onClose,\n onToggle: (event?: Event) => {\n if (unref(open)) {\n onClose(event)\n } else {\n onOpen(event)\n }\n },\n onShow: () => {\n emit('show', toggleReason.value)\n },\n onHide: () => {\n emit('hide', toggleReason.value)\n },\n onBeforeShow: () => {\n emit('before-show', toggleReason.value)\n },\n onBeforeHide: () => {\n emit('before-hide', toggleReason.value)\n },\n updatePopper,\n})\n\nwatch(\n () => props.disabled,\n (disabled) => {\n if (disabled && open.value) {\n open.value = false\n }\n }\n)\n\nconst isFocusInsideContent = (event?: FocusEvent) => {\n return contentRef.value?.isFocusInsideContent(event)\n}\n\nonDeactivated(() => open.value && hide())\n\nonBeforeUnmount(() => {\n toggleReason.value = undefined\n})\n\ndefineExpose({\n /**\n * @description el-popper component instance\n */\n popperRef,\n /**\n * @description el-tooltip-content component instance\n */\n contentRef,\n /**\n * @description validate current focus event is trigger inside el-tooltip-content\n */\n isFocusInsideContent,\n /**\n * @description update el-popper component instance\n */\n updatePopper,\n /**\n * @description expose onOpen function to mange el-tooltip open state\n */\n onOpen,\n /**\n * @description expose onClose function to manage el-tooltip close state\n */\n onClose,\n /**\n * @description expose hide function\n */\n hide,\n})\n</script>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"tooltip2.mjs","names":[],"sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n <el-popper ref=\"popperRef\" :role=\"role\">\n <el-tooltip-trigger\n :disabled=\"disabled\"\n :trigger=\"trigger\"\n :trigger-keys=\"triggerKeys\"\n :virtual-ref=\"virtualRef\"\n :virtual-triggering=\"virtualTriggering\"\n :focus-on-target=\"focusOnTarget\"\n >\n <slot v-if=\"$slots.default\" />\n </el-tooltip-trigger>\n <el-tooltip-content\n ref=\"contentRef\"\n :aria-label=\"ariaLabel\"\n :boundaries-padding=\"boundariesPadding\"\n :content=\"content\"\n :disabled=\"disabled\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :fallback-placements=\"fallbackPlacements\"\n :hide-after=\"hideAfter\"\n :gpu-acceleration=\"gpuAcceleration\"\n :offset=\"offset\"\n :persistent=\"persistent\"\n :popper-class=\"kls\"\n :popper-style=\"popperStyle\"\n :placement=\"placement\"\n :popper-options=\"popperOptions\"\n :arrow-offset=\"arrowOffset\"\n :pure=\"pure\"\n :raw-content=\"rawContent\"\n :reference-el=\"referenceEl\"\n :trigger-target-el=\"triggerTargetEl\"\n :show-after=\"showAfter\"\n :strategy=\"strategy\"\n :teleported=\"teleported\"\n :transition=\"transition\"\n :virtual-triggering=\"virtualTriggering\"\n :z-index=\"zIndex\"\n :append-to=\"appendTo\"\n :loop=\"loop\"\n >\n <slot name=\"content\">\n <span v-if=\"rawContent\" v-html=\"content\" />\n <span v-else>{{ content }}</span>\n </slot>\n <el-popper-arrow v-if=\"showArrow\" />\n </el-tooltip-content>\n </el-popper>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n onBeforeUnmount,\n onDeactivated,\n provide,\n readonly,\n ref,\n toRef,\n unref,\n watch,\n} from 'vue'\nimport {\n ElPopper,\n ElPopperArrow,\n popperArrowPropsDefaults,\n} from '@element-plus/components/popper'\nimport { isBoolean } from '@element-plus/utils'\nimport {\n useDelayedToggle,\n useId,\n useNamespace,\n usePopperContainer,\n} from '@element-plus/hooks'\nimport { TOOLTIP_INJECTION_KEY } from './constants'\nimport { tooltipEmits, useTooltipModelToggle } from './tooltip'\nimport ElTooltipTrigger from './trigger.vue'\nimport ElTooltipContent from './content.vue'\nimport { useTooltipContentPropsDefaults } from './content'\nimport { useTooltipTriggerPropsDefaults } from './trigger'\n\nimport type { Mutable } from '@element-plus/utils'\nimport type { TooltipContentInstance } from './content'\nimport type { UseTooltipProps } from './tooltip'\nimport type { PopperInstance } from '@element-plus/components/popper'\n\ndefineOptions({\n name: 'ElTooltip',\n})\n\nconst props = withDefaults(defineProps<UseTooltipProps>(), {\n role: 'tooltip',\n ...useTooltipContentPropsDefaults,\n ...useTooltipTriggerPropsDefaults,\n ...popperArrowPropsDefaults,\n showArrow: true,\n})\nconst emit = defineEmits(tooltipEmits as Mutable<typeof tooltipEmits>)\n\nusePopperContainer()\n\nconst ns = useNamespace('tooltip')\nconst id = useId()\nconst popperRef = ref<PopperInstance>()\nconst contentRef = ref<TooltipContentInstance>()\n\nconst updatePopper = () => {\n const popperComponent = unref(popperRef)\n if (popperComponent) {\n popperComponent.popperInstanceRef?.update()\n }\n}\nconst open = ref(false)\nconst toggleReason = ref<Event>()\n\nconst { show, hide, hasUpdateHandler } = useTooltipModelToggle({\n indicator: open,\n toggleReason,\n})\n\nconst { onOpen, onClose } = useDelayedToggle({\n showAfter: toRef(props, 'showAfter'),\n hideAfter: toRef(props, 'hideAfter'),\n autoClose: toRef(props, 'autoClose'),\n open: show,\n close: hide,\n})\n\nconst controlled = computed(\n () => isBoolean(props.visible) && !hasUpdateHandler.value\n)\n\nconst kls = computed(() => {\n return [ns.b(), props.popperClass!]\n})\n\nprovide(TOOLTIP_INJECTION_KEY, {\n controlled,\n id,\n open: readonly(open),\n trigger: toRef(props, 'trigger'),\n onOpen,\n onClose,\n onToggle: (event?: Event) => {\n if (unref(open)) {\n onClose(event)\n } else {\n onOpen(event)\n }\n },\n onShow: () => {\n emit('show', toggleReason.value)\n },\n onHide: () => {\n emit('hide', toggleReason.value)\n },\n onBeforeShow: () => {\n emit('before-show', toggleReason.value)\n },\n onBeforeHide: () => {\n emit('before-hide', toggleReason.value)\n },\n updatePopper,\n})\n\nwatch(\n () => props.disabled,\n (disabled) => {\n if (disabled && open.value) {\n open.value = false\n }\n if (!disabled && isBoolean(props.visible)) {\n open.value = props.visible\n }\n }\n)\n\nconst isFocusInsideContent = (event?: FocusEvent) => {\n return contentRef.value?.isFocusInsideContent(event)\n}\n\nonDeactivated(() => open.value && hide())\n\nonBeforeUnmount(() => {\n toggleReason.value = undefined\n})\n\ndefineExpose({\n /**\n * @description el-popper component instance\n */\n popperRef,\n /**\n * @description el-tooltip-content component instance\n */\n contentRef,\n /**\n * @description validate current focus event is trigger inside el-tooltip-content\n */\n isFocusInsideContent,\n /**\n * @description update el-popper component instance\n */\n updatePopper,\n /**\n * @description expose onOpen function to mange el-tooltip open state\n */\n onOpen,\n /**\n * @description expose onClose function to manage el-tooltip close state\n */\n onClose,\n /**\n * @description expose hide function\n */\n hide,\n})\n</script>\n"],"mappings":""}
|
package/es/version.mjs
CHANGED
package/es/version.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.mjs","names":[],"sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.
|
|
1
|
+
{"version":3,"file":"version.mjs","names":[],"sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20260309'\n"],"mappings":";AAAA,MAAa,UAAU"}
|
|
@@ -26,7 +26,7 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
|
|
|
26
26
|
}>, {
|
|
27
27
|
/** @description button html element */ref: vue.Ref<HTMLButtonElement | undefined>; /** @description button size */
|
|
28
28
|
size: vue.ComputedRef<"" | "default" | "small" | "large">; /** @description button type */
|
|
29
|
-
type: vue.ComputedRef<"" | "
|
|
29
|
+
type: vue.ComputedRef<"default" | "" | "info" | "primary" | "success" | "warning" | "text" | "danger">; /** @description button disabled */
|
|
30
30
|
disabled: vue.ComputedRef<boolean>; /** @description whether adding space */
|
|
31
31
|
shouldAddSpace: vue.ComputedRef<boolean>;
|
|
32
32
|
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
@@ -86,7 +86,7 @@ declare const colorPickerProps: {
|
|
|
86
86
|
readonly id: StringConstructor;
|
|
87
87
|
readonly showAlpha: BooleanConstructor;
|
|
88
88
|
readonly colorFormat: {
|
|
89
|
-
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv") | (() => ColorFormats) | ((new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv") | (() => ColorFormats))[], unknown, unknown>>;
|
|
89
|
+
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv" | "cmyk") | (() => ColorFormats) | ((new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv" | "cmyk") | (() => ColorFormats))[], unknown, unknown>>;
|
|
90
90
|
readonly required: false;
|
|
91
91
|
readonly validator: ((val: unknown) => boolean) | undefined;
|
|
92
92
|
__epPropKey: true;
|
|
@@ -45,7 +45,7 @@ declare const colorPickerPanelProps: {
|
|
|
45
45
|
readonly border: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
46
46
|
readonly showAlpha: BooleanConstructor;
|
|
47
47
|
readonly colorFormat: {
|
|
48
|
-
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv") | (() => ColorFormats) | ((new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv") | (() => ColorFormats))[], unknown, unknown>>;
|
|
48
|
+
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv" | "cmyk") | (() => ColorFormats) | ((new (...args: any[]) => "name" | "rgb" | "prgb" | "hex" | "hex3" | "hex4" | "hex6" | "hex8" | "hsl" | "hsv" | "cmyk") | (() => ColorFormats))[], unknown, unknown>>;
|
|
49
49
|
readonly required: false;
|
|
50
50
|
readonly validator: ((val: unknown) => boolean) | undefined;
|
|
51
51
|
__epPropKey: true;
|
|
@@ -35,7 +35,7 @@ declare function useGlobalComponentSettings(block: string, sizeFallback?: MaybeR
|
|
|
35
35
|
currentZIndex: vue.ComputedRef<number>;
|
|
36
36
|
nextZIndex: () => number;
|
|
37
37
|
};
|
|
38
|
-
size: vue.ComputedRef<"" | "
|
|
38
|
+
size: vue.ComputedRef<"default" | "" | "small" | "large">;
|
|
39
39
|
};
|
|
40
40
|
declare const provideGlobalConfig: (config: MaybeRef<ConfigProviderContext>, app?: App, global?: boolean) => vue.ComputedRef<Partial<ConfigProviderProps>> | undefined;
|
|
41
41
|
//#endregion
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { useLifecycle } from "./use-lifecycle.js";
|
|
2
1
|
import { Mark, useMarks } from "./use-marks.js";
|
|
2
|
+
import { useLifecycle } from "./use-lifecycle.js";
|
|
3
3
|
import { useSlide } from "./use-slide.js";
|
|
4
4
|
import { useSliderButton } from "./use-slider-button.js";
|
|
5
5
|
import { useStops } from "./use-stops.js";
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
2
2
|
const require_runtime = require('../../../../_virtual/_rolldown/runtime.js');
|
|
3
|
+
const require_error = require('../../../../utils/error.js');
|
|
3
4
|
let vue = require("vue");
|
|
4
5
|
|
|
5
6
|
//#region ../../packages/components/slider/src/composables/use-marks.ts
|
|
6
7
|
const useMarks = (props) => {
|
|
7
|
-
|
|
8
|
+
const markList = (0, vue.computed)(() => {
|
|
8
9
|
if (!props.marks) return [];
|
|
9
10
|
return Object.keys(props.marks).map(Number.parseFloat).sort((a, b) => a - b).filter((point) => point <= props.max && point >= props.min).map((point) => ({
|
|
10
11
|
point,
|
|
@@ -12,6 +13,19 @@ const useMarks = (props) => {
|
|
|
12
13
|
mark: props.marks[point]
|
|
13
14
|
}));
|
|
14
15
|
});
|
|
16
|
+
(0, vue.watchEffect)(() => {
|
|
17
|
+
if (props.step === "mark" && !props.marks) require_error.debugWarn("ElSlider", "marks prop must be provided when step is mark");
|
|
18
|
+
if (props.marks) {
|
|
19
|
+
const keys = Object.keys(props.marks);
|
|
20
|
+
const validPoints = markList.value.map((m) => m.point);
|
|
21
|
+
const invalidKeys = keys.filter((key) => {
|
|
22
|
+
const parsed = Number.parseFloat(key);
|
|
23
|
+
return Number.isNaN(parsed) || !validPoints.includes(parsed);
|
|
24
|
+
});
|
|
25
|
+
if (invalidKeys.length > 0) require_error.debugWarn("ElSlider", `Some marks keys are invalid (not a number or out of [min, max]): [${invalidKeys.map((k) => `'${k}'`).join(", ")}] and will be ignored.`);
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
return markList;
|
|
15
29
|
};
|
|
16
30
|
|
|
17
31
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-marks.js","names":[],"sources":["../../../../../../../packages/components/slider/src/composables/use-marks.ts"],"sourcesContent":["import { computed } from 'vue'\n\nimport type { SliderProps } from '../slider'\nimport type { SliderMarkerProps } from '../marker'\n\nexport interface Mark extends SliderMarkerProps {\n point: number\n position: number\n}\n\nexport const useMarks = (props: SliderProps) => {\n
|
|
1
|
+
{"version":3,"file":"use-marks.js","names":[],"sources":["../../../../../../../packages/components/slider/src/composables/use-marks.ts"],"sourcesContent":["import { computed, watchEffect } from 'vue'\nimport { debugWarn } from '@element-plus/utils'\n\nimport type { SliderProps } from '../slider'\nimport type { SliderMarkerProps } from '../marker'\n\nexport interface Mark extends SliderMarkerProps {\n point: number\n position: number\n}\n\nexport const useMarks = (props: SliderProps) => {\n const markList = computed(() => {\n if (!props.marks) {\n return []\n }\n const marksKeys = Object.keys(props.marks)\n return marksKeys\n .map(Number.parseFloat)\n .sort((a, b) => a - b)\n .filter((point) => point <= props.max && point >= props.min)\n .map(\n (point): Mark => ({\n point,\n position: ((point - props.min) * 100) / (props.max - props.min),\n mark: props.marks![point],\n })\n )\n })\n\n watchEffect(() => {\n if (props.step === 'mark' && !props.marks) {\n debugWarn('ElSlider', 'marks prop must be provided when step is mark')\n }\n if (props.marks) {\n const keys = Object.keys(props.marks)\n const validPoints = markList.value.map((m) => m.point)\n const invalidKeys = keys.filter((key) => {\n const parsed = Number.parseFloat(key)\n return Number.isNaN(parsed) || !validPoints.includes(parsed)\n })\n if (invalidKeys.length > 0) {\n debugWarn(\n 'ElSlider',\n `Some marks keys are invalid (not a number or out of [min, max]): [${invalidKeys.map((k) => `'${k}'`).join(', ')}] and will be ignored.`\n )\n }\n }\n })\n\n return markList\n}\n"],"mappings":";;;;;;AAWA,MAAa,YAAY,UAAuB;CAC9C,MAAM,mCAA0B;AAC9B,MAAI,CAAC,MAAM,MACT,QAAO,EAAE;AAGX,SADkB,OAAO,KAAK,MAAM,MAAM,CAEvC,IAAI,OAAO,WAAW,CACtB,MAAM,GAAG,MAAM,IAAI,EAAE,CACrB,QAAQ,UAAU,SAAS,MAAM,OAAO,SAAS,MAAM,IAAI,CAC3D,KACE,WAAiB;GAChB;GACA,WAAY,QAAQ,MAAM,OAAO,OAAQ,MAAM,MAAM,MAAM;GAC3D,MAAM,MAAM,MAAO;GACpB,EACF;GACH;AAEF,4BAAkB;AAChB,MAAI,MAAM,SAAS,UAAU,CAAC,MAAM,MAClC,yBAAU,YAAY,gDAAgD;AAExE,MAAI,MAAM,OAAO;GACf,MAAM,OAAO,OAAO,KAAK,MAAM,MAAM;GACrC,MAAM,cAAc,SAAS,MAAM,KAAK,MAAM,EAAE,MAAM;GACtD,MAAM,cAAc,KAAK,QAAQ,QAAQ;IACvC,MAAM,SAAS,OAAO,WAAW,IAAI;AACrC,WAAO,OAAO,MAAM,OAAO,IAAI,CAAC,YAAY,SAAS,OAAO;KAC5D;AACF,OAAI,YAAY,SAAS,EACvB,yBACE,YACA,qEAAqE,YAAY,KAAK,MAAM,IAAI,EAAE,GAAG,CAAC,KAAK,KAAK,CAAC,wBAClH;;GAGL;AAEF,QAAO"}
|
|
@@ -3,6 +3,7 @@ const require_runtime = require('../../../../_virtual/_rolldown/runtime.js');
|
|
|
3
3
|
const require_aria = require('../../../../constants/aria.js');
|
|
4
4
|
const require_event = require('../../../../constants/event.js');
|
|
5
5
|
const require_event$1 = require('../../../../utils/dom/event.js');
|
|
6
|
+
const require_types = require('../../../../utils/types.js');
|
|
6
7
|
const require_constants = require('../constants.js');
|
|
7
8
|
let _vueuse_core = require("@vueuse/core");
|
|
8
9
|
let lodash_unified = require("lodash-unified");
|
|
@@ -30,7 +31,7 @@ const useTooltip = (props, formatTooltip, showTooltip) => {
|
|
|
30
31
|
};
|
|
31
32
|
};
|
|
32
33
|
const useSliderButton = (props, initData, emit) => {
|
|
33
|
-
const { disabled, min, max, step, showTooltip, persistent, precision, sliderSize, formatTooltip, emitChange, resetSize, updateDragging } = (0, vue.inject)(require_constants.sliderContextKey);
|
|
34
|
+
const { disabled, min, max, step, showTooltip, persistent, precision, sliderSize, formatTooltip, emitChange, resetSize, updateDragging, markList } = (0, vue.inject)(require_constants.sliderContextKey);
|
|
34
35
|
const { tooltip, tooltipVisible, formatValue, displayTooltip, hideTooltip } = useTooltip(props, formatTooltip, showTooltip);
|
|
35
36
|
const button = (0, vue.ref)();
|
|
36
37
|
const currentPosition = (0, vue.computed)(() => {
|
|
@@ -39,6 +40,9 @@ const useSliderButton = (props, initData, emit) => {
|
|
|
39
40
|
const wrapperStyle = (0, vue.computed)(() => {
|
|
40
41
|
return props.vertical ? { bottom: currentPosition.value } : { left: currentPosition.value };
|
|
41
42
|
});
|
|
43
|
+
const shouldMoveToMark = (0, vue.computed)(() => {
|
|
44
|
+
return step.value === "mark" && markList.value.length > 0;
|
|
45
|
+
});
|
|
42
46
|
const handleMouseEnter = () => {
|
|
43
47
|
initData.hovering = true;
|
|
44
48
|
displayTooltip();
|
|
@@ -64,17 +68,49 @@ const useSliderButton = (props, initData, emit) => {
|
|
|
64
68
|
setPosition(initData.newPosition);
|
|
65
69
|
emitChange();
|
|
66
70
|
};
|
|
71
|
+
const moveToMark = (amount) => {
|
|
72
|
+
if (disabled.value || !markList.value.length) return;
|
|
73
|
+
const current = props.modelValue;
|
|
74
|
+
const epsilon = Number.EPSILON;
|
|
75
|
+
const stride = Math.abs(amount);
|
|
76
|
+
let target;
|
|
77
|
+
if (amount > 0) {
|
|
78
|
+
const startIndex = markList.value.findIndex((m) => m.point > current + epsilon);
|
|
79
|
+
if (startIndex !== -1) {
|
|
80
|
+
const targetIndex = Math.min(startIndex + stride - 1, markList.value.length - 1);
|
|
81
|
+
target = markList.value[targetIndex].point;
|
|
82
|
+
}
|
|
83
|
+
} else {
|
|
84
|
+
let startIndex = -1;
|
|
85
|
+
for (let i = markList.value.length - 1; i >= 0; i--) if (markList.value[i].point < current - epsilon) {
|
|
86
|
+
startIndex = i;
|
|
87
|
+
break;
|
|
88
|
+
}
|
|
89
|
+
if (startIndex !== -1) {
|
|
90
|
+
const targetIndex = Math.max(startIndex - (stride - 1), 0);
|
|
91
|
+
target = markList.value[targetIndex].point;
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
if (target !== void 0 && target !== current) {
|
|
95
|
+
setPosition((target - min.value) / (max.value - min.value) * 100);
|
|
96
|
+
emitChange();
|
|
97
|
+
}
|
|
98
|
+
};
|
|
67
99
|
const onLeftKeyDown = () => {
|
|
68
|
-
|
|
100
|
+
if (shouldMoveToMark.value) moveToMark(-1);
|
|
101
|
+
else if (require_types.isNumber(step.value)) incrementPosition(-step.value);
|
|
69
102
|
};
|
|
70
103
|
const onRightKeyDown = () => {
|
|
71
|
-
|
|
104
|
+
if (shouldMoveToMark.value) moveToMark(1);
|
|
105
|
+
else if (require_types.isNumber(step.value)) incrementPosition(step.value);
|
|
72
106
|
};
|
|
73
107
|
const onPageDownKeyDown = () => {
|
|
74
|
-
|
|
108
|
+
if (shouldMoveToMark.value) moveToMark(-4);
|
|
109
|
+
else if (require_types.isNumber(step.value)) incrementPosition(-step.value * 4);
|
|
75
110
|
};
|
|
76
111
|
const onPageUpKeyDown = () => {
|
|
77
|
-
|
|
112
|
+
if (shouldMoveToMark.value) moveToMark(4);
|
|
113
|
+
else if (require_types.isNumber(step.value)) incrementPosition(step.value * 4);
|
|
78
114
|
};
|
|
79
115
|
const onHomeKeyDown = () => {
|
|
80
116
|
if (disabled.value) return;
|
|
@@ -176,17 +212,23 @@ const useSliderButton = (props, initData, emit) => {
|
|
|
176
212
|
const setPosition = async (newPosition) => {
|
|
177
213
|
if (newPosition === null || Number.isNaN(+newPosition)) return;
|
|
178
214
|
newPosition = (0, lodash_unified.clamp)(newPosition, 0, 100);
|
|
179
|
-
const fullSteps = Math.floor((max.value - min.value) / step.value);
|
|
180
|
-
const fullRangePercentage = fullSteps * step.value / (max.value - min.value) * 100;
|
|
181
|
-
const threshold = fullRangePercentage + (100 - fullRangePercentage) / 2;
|
|
182
215
|
let value;
|
|
183
|
-
if (
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
216
|
+
if (step.value === "mark") if (markList.value.length === 0) value = newPosition <= 50 ? min.value : max.value;
|
|
217
|
+
else value = markList.value.reduce((prev, curr) => {
|
|
218
|
+
return Math.abs(curr.position - newPosition) < Math.abs(prev.position - newPosition) ? curr : prev;
|
|
219
|
+
}).point;
|
|
220
|
+
else {
|
|
221
|
+
const fullSteps = Math.floor((max.value - min.value) / step.value);
|
|
222
|
+
const fullRangePercentage = fullSteps * step.value / (max.value - min.value) * 100;
|
|
223
|
+
const threshold = fullRangePercentage + (100 - fullRangePercentage) / 2;
|
|
224
|
+
if (newPosition < fullRangePercentage) {
|
|
225
|
+
const valueBetween = fullRangePercentage / fullSteps;
|
|
226
|
+
const steps = Math.round(newPosition / valueBetween);
|
|
227
|
+
value = min.value + steps * step.value;
|
|
228
|
+
} else if (newPosition < threshold) value = min.value + fullSteps * step.value;
|
|
229
|
+
else value = max.value;
|
|
230
|
+
value = Number.parseFloat(value.toFixed(precision.value));
|
|
231
|
+
}
|
|
190
232
|
if (value !== props.modelValue) emit(require_event.UPDATE_MODEL_EVENT, value);
|
|
191
233
|
if (!initData.dragging && props.modelValue !== initData.oldValue) initData.oldValue = props.modelValue;
|
|
192
234
|
await (0, vue.nextTick)();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-slider-button.js","names":["sliderContextKey","getEventCode","EVENT_CODE","UPDATE_MODEL_EVENT"],"sources":["../../../../../../../packages/components/slider/src/composables/use-slider-button.ts"],"sourcesContent":["import { computed, inject, nextTick, ref, watch } from 'vue'\nimport { clamp, debounce } from 'lodash-unified'\nimport { useEventListener } from '@vueuse/core'\nimport { EVENT_CODE, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { getEventCode } from '@element-plus/utils'\nimport { sliderContextKey } from '../constants'\n\nimport type { CSSProperties, ComputedRef, Ref, SetupContext } from 'vue'\nimport type { SliderProps } from '../slider'\nimport type {\n SliderButtonEmits,\n SliderButtonInitData,\n SliderButtonProps,\n} from '../button'\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\n\nconst useTooltip = (\n props: SliderButtonProps,\n formatTooltip: Ref<SliderProps['formatTooltip']>,\n showTooltip: Ref<SliderProps['showTooltip']>\n) => {\n const tooltip = ref<TooltipInstance>()\n\n const tooltipVisible = ref(false)\n\n const enableFormat = computed(() => {\n return formatTooltip.value instanceof Function\n })\n\n const formatValue = computed(() => {\n return (\n (enableFormat.value && formatTooltip.value!(props.modelValue)) ||\n props.modelValue\n )\n })\n\n const displayTooltip = debounce(() => {\n showTooltip.value && (tooltipVisible.value = true)\n }, 50)\n\n const hideTooltip = debounce(() => {\n showTooltip.value && (tooltipVisible.value = false)\n }, 50)\n\n return {\n tooltip,\n tooltipVisible,\n formatValue,\n displayTooltip,\n hideTooltip,\n }\n}\n\nexport const useSliderButton = (\n props: SliderButtonProps,\n initData: SliderButtonInitData,\n emit: SetupContext<SliderButtonEmits>['emit']\n) => {\n const {\n disabled,\n min,\n max,\n step,\n showTooltip,\n persistent,\n precision,\n sliderSize,\n formatTooltip,\n emitChange,\n resetSize,\n updateDragging,\n } = inject(sliderContextKey)!\n\n const { tooltip, tooltipVisible, formatValue, displayTooltip, hideTooltip } =\n useTooltip(props, formatTooltip!, showTooltip)\n\n const button = ref<HTMLDivElement>()\n\n const currentPosition = computed(() => {\n return `${\n ((props.modelValue - min.value) / (max.value - min.value)) * 100\n }%`\n })\n\n const wrapperStyle: ComputedRef<CSSProperties> = computed(() => {\n return props.vertical\n ? { bottom: currentPosition.value }\n : { left: currentPosition.value }\n })\n\n const handleMouseEnter = () => {\n initData.hovering = true\n displayTooltip()\n }\n\n const handleMouseLeave = () => {\n initData.hovering = false\n if (!initData.dragging) {\n hideTooltip()\n }\n }\n\n const onButtonDown = (event: MouseEvent | TouchEvent) => {\n if (disabled.value) return\n event.preventDefault()\n onDragStart(event)\n window.addEventListener('mousemove', onDragging)\n window.addEventListener('touchmove', onDragging)\n window.addEventListener('mouseup', onDragEnd)\n window.addEventListener('touchend', onDragEnd)\n window.addEventListener('contextmenu', onDragEnd)\n button.value!.focus()\n }\n\n const incrementPosition = (amount: number) => {\n if (disabled.value) return\n initData.newPosition =\n Number.parseFloat(currentPosition.value) +\n (amount / (max.value - min.value)) * 100\n setPosition(initData.newPosition)\n emitChange()\n }\n\n const onLeftKeyDown = () => {\n incrementPosition(-step.value)\n }\n\n const onRightKeyDown = () => {\n incrementPosition(step.value)\n }\n\n const onPageDownKeyDown = () => {\n incrementPosition(-step.value * 4)\n }\n\n const onPageUpKeyDown = () => {\n incrementPosition(step.value * 4)\n }\n\n const onHomeKeyDown = () => {\n if (disabled.value) return\n setPosition(0)\n emitChange()\n }\n\n const onEndKeyDown = () => {\n if (disabled.value) return\n setPosition(100)\n emitChange()\n }\n\n const onKeyDown = (event: KeyboardEvent) => {\n const code = getEventCode(event)\n let isPreventDefault = true\n\n switch (code) {\n case EVENT_CODE.left:\n case EVENT_CODE.down:\n onLeftKeyDown()\n break\n case EVENT_CODE.right:\n case EVENT_CODE.up:\n onRightKeyDown()\n break\n case EVENT_CODE.home:\n onHomeKeyDown()\n break\n case EVENT_CODE.end:\n onEndKeyDown()\n break\n case EVENT_CODE.pageDown:\n onPageDownKeyDown()\n break\n case EVENT_CODE.pageUp:\n onPageUpKeyDown()\n break\n default:\n isPreventDefault = false\n break\n }\n\n isPreventDefault && event.preventDefault()\n }\n\n const getClientXY = (event: MouseEvent | TouchEvent) => {\n let clientX: number\n let clientY: number\n if (event.type.startsWith('touch')) {\n clientY = (event as TouchEvent).touches[0].clientY\n clientX = (event as TouchEvent).touches[0].clientX\n } else {\n clientY = (event as MouseEvent).clientY\n clientX = (event as MouseEvent).clientX\n }\n return {\n clientX,\n clientY,\n }\n }\n\n const onDragStart = (event: MouseEvent | TouchEvent) => {\n initData.dragging = true\n initData.isClick = true\n const { clientX, clientY } = getClientXY(event)\n if (props.vertical) {\n initData.startY = clientY\n } else {\n initData.startX = clientX\n }\n initData.startPosition = Number.parseFloat(currentPosition.value)\n initData.newPosition = initData.startPosition\n }\n\n const onDragging = (event: MouseEvent | TouchEvent) => {\n if (initData.dragging) {\n initData.isClick = false\n displayTooltip()\n resetSize()\n let diff: number\n const { clientX, clientY } = getClientXY(event)\n if (props.vertical) {\n initData.currentY = clientY\n diff = ((initData.startY - initData.currentY) / sliderSize.value) * 100\n } else {\n initData.currentX = clientX\n diff = ((initData.currentX - initData.startX) / sliderSize.value) * 100\n }\n initData.newPosition = initData.startPosition + diff\n setPosition(initData.newPosition)\n }\n }\n\n const onDragEnd = () => {\n if (initData.dragging) {\n /*\n * 防止在 mouseup 后立即触发 click,导致滑块有几率产生一小段位移\n * 不使用 preventDefault 是因为 mouseup 和 click 没有注册在同一个 DOM 上\n */\n setTimeout(() => {\n initData.dragging = false\n if (!initData.hovering) {\n hideTooltip()\n }\n if (!initData.isClick) {\n setPosition(initData.newPosition)\n }\n emitChange()\n }, 0)\n window.removeEventListener('mousemove', onDragging)\n window.removeEventListener('touchmove', onDragging)\n window.removeEventListener('mouseup', onDragEnd)\n window.removeEventListener('touchend', onDragEnd)\n window.removeEventListener('contextmenu', onDragEnd)\n }\n }\n\n const setPosition = async (newPosition: number) => {\n if (newPosition === null || Number.isNaN(+newPosition)) return\n\n newPosition = clamp(newPosition, 0, 100)\n const fullSteps = Math.floor((max.value - min.value) / step.value)\n const fullRangePercentage =\n ((fullSteps * step.value) / (max.value - min.value)) * 100\n const threshold = fullRangePercentage + (100 - fullRangePercentage) / 2\n let value\n if (newPosition < fullRangePercentage) {\n const valueBetween = fullRangePercentage / fullSteps\n const steps = Math.round(newPosition / valueBetween)\n value = min.value + steps * step.value\n } else if (newPosition < threshold) {\n value = min.value + fullSteps * step.value\n } else {\n value = max.value\n }\n value = Number.parseFloat(value.toFixed(precision.value))\n\n if (value !== props.modelValue) {\n emit(UPDATE_MODEL_EVENT, value)\n }\n\n if (!initData.dragging && props.modelValue !== initData.oldValue) {\n initData.oldValue = props.modelValue\n }\n\n await nextTick()\n initData.dragging && displayTooltip()\n tooltip.value!.updatePopper()\n }\n\n watch(\n () => initData.dragging,\n (val) => {\n updateDragging(val)\n }\n )\n\n useEventListener(button, 'touchstart', onButtonDown, { passive: false })\n\n return {\n disabled,\n button,\n tooltip,\n tooltipVisible,\n showTooltip,\n persistent,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onKeyDown,\n setPosition,\n }\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAM,cACJ,OACA,eACA,gBACG;CACH,MAAM,wBAAgC;CAEtC,MAAM,8BAAqB,MAAM;CAEjC,MAAM,uCAA8B;AAClC,SAAO,cAAc,iBAAiB;GACtC;AAiBF,QAAO;EACL;EACA;EACA,qCAlBiC;AACjC,UACG,aAAa,SAAS,cAAc,MAAO,MAAM,WAAW,IAC7D,MAAM;IAER;EAcA,mDAZoC;AACpC,eAAY,UAAU,eAAe,QAAQ;KAC5C,GAAG;EAWJ,gDATiC;AACjC,eAAY,UAAU,eAAe,QAAQ;KAC5C,GAAG;EAQL;;AAGH,MAAa,mBACX,OACA,UACA,SACG;CACH,MAAM,EACJ,UACA,KACA,KACA,MACA,aACA,YACA,WACA,YACA,eACA,YACA,WACA,mCACSA,mCAAiB;CAE5B,MAAM,EAAE,SAAS,gBAAgB,aAAa,gBAAgB,gBAC5D,WAAW,OAAO,eAAgB,YAAY;CAEhD,MAAM,uBAA8B;CAEpC,MAAM,0CAAiC;AACrC,SAAO,IACH,MAAM,aAAa,IAAI,UAAU,IAAI,QAAQ,IAAI,SAAU,IAC9D;GACD;CAEF,MAAM,uCAA0D;AAC9D,SAAO,MAAM,WACT,EAAE,QAAQ,gBAAgB,OAAO,GACjC,EAAE,MAAM,gBAAgB,OAAO;GACnC;CAEF,MAAM,yBAAyB;AAC7B,WAAS,WAAW;AACpB,kBAAgB;;CAGlB,MAAM,yBAAyB;AAC7B,WAAS,WAAW;AACpB,MAAI,CAAC,SAAS,SACZ,cAAa;;CAIjB,MAAM,gBAAgB,UAAmC;AACvD,MAAI,SAAS,MAAO;AACpB,QAAM,gBAAgB;AACtB,cAAY,MAAM;AAClB,SAAO,iBAAiB,aAAa,WAAW;AAChD,SAAO,iBAAiB,aAAa,WAAW;AAChD,SAAO,iBAAiB,WAAW,UAAU;AAC7C,SAAO,iBAAiB,YAAY,UAAU;AAC9C,SAAO,iBAAiB,eAAe,UAAU;AACjD,SAAO,MAAO,OAAO;;CAGvB,MAAM,qBAAqB,WAAmB;AAC5C,MAAI,SAAS,MAAO;AACpB,WAAS,cACP,OAAO,WAAW,gBAAgB,MAAM,GACvC,UAAU,IAAI,QAAQ,IAAI,SAAU;AACvC,cAAY,SAAS,YAAY;AACjC,cAAY;;CAGd,MAAM,sBAAsB;AAC1B,oBAAkB,CAAC,KAAK,MAAM;;CAGhC,MAAM,uBAAuB;AAC3B,oBAAkB,KAAK,MAAM;;CAG/B,MAAM,0BAA0B;AAC9B,oBAAkB,CAAC,KAAK,QAAQ,EAAE;;CAGpC,MAAM,wBAAwB;AAC5B,oBAAkB,KAAK,QAAQ,EAAE;;CAGnC,MAAM,sBAAsB;AAC1B,MAAI,SAAS,MAAO;AACpB,cAAY,EAAE;AACd,cAAY;;CAGd,MAAM,qBAAqB;AACzB,MAAI,SAAS,MAAO;AACpB,cAAY,IAAI;AAChB,cAAY;;CAGd,MAAM,aAAa,UAAyB;EAC1C,MAAM,OAAOC,6BAAa,MAAM;EAChC,IAAI,mBAAmB;AAEvB,UAAQ,MAAR;GACE,KAAKC,wBAAW;GAChB,KAAKA,wBAAW;AACd,mBAAe;AACf;GACF,KAAKA,wBAAW;GAChB,KAAKA,wBAAW;AACd,oBAAgB;AAChB;GACF,KAAKA,wBAAW;AACd,mBAAe;AACf;GACF,KAAKA,wBAAW;AACd,kBAAc;AACd;GACF,KAAKA,wBAAW;AACd,uBAAmB;AACnB;GACF,KAAKA,wBAAW;AACd,qBAAiB;AACjB;GACF;AACE,uBAAmB;AACnB;;AAGJ,sBAAoB,MAAM,gBAAgB;;CAG5C,MAAM,eAAe,UAAmC;EACtD,IAAI;EACJ,IAAI;AACJ,MAAI,MAAM,KAAK,WAAW,QAAQ,EAAE;AAClC,aAAW,MAAqB,QAAQ,GAAG;AAC3C,aAAW,MAAqB,QAAQ,GAAG;SACtC;AACL,aAAW,MAAqB;AAChC,aAAW,MAAqB;;AAElC,SAAO;GACL;GACA;GACD;;CAGH,MAAM,eAAe,UAAmC;AACtD,WAAS,WAAW;AACpB,WAAS,UAAU;EACnB,MAAM,EAAE,SAAS,YAAY,YAAY,MAAM;AAC/C,MAAI,MAAM,SACR,UAAS,SAAS;MAElB,UAAS,SAAS;AAEpB,WAAS,gBAAgB,OAAO,WAAW,gBAAgB,MAAM;AACjE,WAAS,cAAc,SAAS;;CAGlC,MAAM,cAAc,UAAmC;AACrD,MAAI,SAAS,UAAU;AACrB,YAAS,UAAU;AACnB,mBAAgB;AAChB,cAAW;GACX,IAAI;GACJ,MAAM,EAAE,SAAS,YAAY,YAAY,MAAM;AAC/C,OAAI,MAAM,UAAU;AAClB,aAAS,WAAW;AACpB,YAAS,SAAS,SAAS,SAAS,YAAY,WAAW,QAAS;UAC/D;AACL,aAAS,WAAW;AACpB,YAAS,SAAS,WAAW,SAAS,UAAU,WAAW,QAAS;;AAEtE,YAAS,cAAc,SAAS,gBAAgB;AAChD,eAAY,SAAS,YAAY;;;CAIrC,MAAM,kBAAkB;AACtB,MAAI,SAAS,UAAU;AAKrB,oBAAiB;AACf,aAAS,WAAW;AACpB,QAAI,CAAC,SAAS,SACZ,cAAa;AAEf,QAAI,CAAC,SAAS,QACZ,aAAY,SAAS,YAAY;AAEnC,gBAAY;MACX,EAAE;AACL,UAAO,oBAAoB,aAAa,WAAW;AACnD,UAAO,oBAAoB,aAAa,WAAW;AACnD,UAAO,oBAAoB,WAAW,UAAU;AAChD,UAAO,oBAAoB,YAAY,UAAU;AACjD,UAAO,oBAAoB,eAAe,UAAU;;;CAIxD,MAAM,cAAc,OAAO,gBAAwB;AACjD,MAAI,gBAAgB,QAAQ,OAAO,MAAM,CAAC,YAAY,CAAE;AAExD,0CAAoB,aAAa,GAAG,IAAI;EACxC,MAAM,YAAY,KAAK,OAAO,IAAI,QAAQ,IAAI,SAAS,KAAK,MAAM;EAClE,MAAM,sBACF,YAAY,KAAK,SAAU,IAAI,QAAQ,IAAI,SAAU;EACzD,MAAM,YAAY,uBAAuB,MAAM,uBAAuB;EACtE,IAAI;AACJ,MAAI,cAAc,qBAAqB;GACrC,MAAM,eAAe,sBAAsB;GAC3C,MAAM,QAAQ,KAAK,MAAM,cAAc,aAAa;AACpD,WAAQ,IAAI,QAAQ,QAAQ,KAAK;aACxB,cAAc,UACvB,SAAQ,IAAI,QAAQ,YAAY,KAAK;MAErC,SAAQ,IAAI;AAEd,UAAQ,OAAO,WAAW,MAAM,QAAQ,UAAU,MAAM,CAAC;AAEzD,MAAI,UAAU,MAAM,WAClB,MAAKC,kCAAoB,MAAM;AAGjC,MAAI,CAAC,SAAS,YAAY,MAAM,eAAe,SAAS,SACtD,UAAS,WAAW,MAAM;AAG5B,2BAAgB;AAChB,WAAS,YAAY,gBAAgB;AACrC,UAAQ,MAAO,cAAc;;AAG/B,sBACQ,SAAS,WACd,QAAQ;AACP,iBAAe,IAAI;GAEtB;AAED,oCAAiB,QAAQ,cAAc,cAAc,EAAE,SAAS,OAAO,CAAC;AAExE,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD"}
|
|
1
|
+
{"version":3,"file":"use-slider-button.js","names":["sliderContextKey","isNumber","getEventCode","EVENT_CODE","UPDATE_MODEL_EVENT"],"sources":["../../../../../../../packages/components/slider/src/composables/use-slider-button.ts"],"sourcesContent":["import { computed, inject, nextTick, ref, watch } from 'vue'\nimport { clamp, debounce } from 'lodash-unified'\nimport { useEventListener } from '@vueuse/core'\nimport { EVENT_CODE, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { getEventCode, isNumber } from '@element-plus/utils'\nimport { sliderContextKey } from '../constants'\n\nimport type { CSSProperties, ComputedRef, Ref, SetupContext } from 'vue'\nimport type { SliderProps } from '../slider'\nimport type {\n SliderButtonEmits,\n SliderButtonInitData,\n SliderButtonProps,\n} from '../button'\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\n\nconst useTooltip = (\n props: SliderButtonProps,\n formatTooltip: Ref<SliderProps['formatTooltip']>,\n showTooltip: Ref<SliderProps['showTooltip']>\n) => {\n const tooltip = ref<TooltipInstance>()\n\n const tooltipVisible = ref(false)\n\n const enableFormat = computed(() => {\n return formatTooltip.value instanceof Function\n })\n\n const formatValue = computed(() => {\n return (\n (enableFormat.value && formatTooltip.value!(props.modelValue)) ||\n props.modelValue\n )\n })\n\n const displayTooltip = debounce(() => {\n showTooltip.value && (tooltipVisible.value = true)\n }, 50)\n\n const hideTooltip = debounce(() => {\n showTooltip.value && (tooltipVisible.value = false)\n }, 50)\n\n return {\n tooltip,\n tooltipVisible,\n formatValue,\n displayTooltip,\n hideTooltip,\n }\n}\n\nexport const useSliderButton = (\n props: SliderButtonProps,\n initData: SliderButtonInitData,\n emit: SetupContext<SliderButtonEmits>['emit']\n) => {\n const {\n disabled,\n min,\n max,\n step,\n showTooltip,\n persistent,\n precision,\n sliderSize,\n formatTooltip,\n emitChange,\n resetSize,\n updateDragging,\n markList,\n } = inject(sliderContextKey)!\n\n const { tooltip, tooltipVisible, formatValue, displayTooltip, hideTooltip } =\n useTooltip(props, formatTooltip!, showTooltip)\n\n const button = ref<HTMLDivElement>()\n\n const currentPosition = computed(() => {\n return `${\n ((props.modelValue - min.value) / (max.value - min.value)) * 100\n }%`\n })\n\n const wrapperStyle: ComputedRef<CSSProperties> = computed(() => {\n return props.vertical\n ? { bottom: currentPosition.value }\n : { left: currentPosition.value }\n })\n\n const shouldMoveToMark = computed(() => {\n return step.value === 'mark' && markList.value.length > 0\n })\n\n const handleMouseEnter = () => {\n initData.hovering = true\n displayTooltip()\n }\n\n const handleMouseLeave = () => {\n initData.hovering = false\n if (!initData.dragging) {\n hideTooltip()\n }\n }\n\n const onButtonDown = (event: MouseEvent | TouchEvent) => {\n if (disabled.value) return\n event.preventDefault()\n onDragStart(event)\n window.addEventListener('mousemove', onDragging)\n window.addEventListener('touchmove', onDragging)\n window.addEventListener('mouseup', onDragEnd)\n window.addEventListener('touchend', onDragEnd)\n window.addEventListener('contextmenu', onDragEnd)\n button.value!.focus()\n }\n\n const incrementPosition = (amount: number) => {\n if (disabled.value) return\n initData.newPosition =\n Number.parseFloat(currentPosition.value) +\n (amount / (max.value - min.value)) * 100\n setPosition(initData.newPosition)\n emitChange()\n }\n\n const moveToMark = (amount: number) => {\n if (disabled.value || !markList.value.length) return\n\n const current = props.modelValue\n const epsilon = Number.EPSILON\n const stride = Math.abs(amount)\n let target: number | undefined\n\n if (amount > 0) {\n const startIndex = markList.value.findIndex(\n (m) => m.point > current + epsilon\n )\n if (startIndex !== -1) {\n const targetIndex = Math.min(\n startIndex + stride - 1,\n markList.value.length - 1\n )\n target = markList.value[targetIndex].point\n }\n } else {\n let startIndex = -1\n for (let i = markList.value.length - 1; i >= 0; i--) {\n if (markList.value[i].point < current - epsilon) {\n startIndex = i\n break\n }\n }\n\n if (startIndex !== -1) {\n const targetIndex = Math.max(startIndex - (stride - 1), 0)\n target = markList.value[targetIndex].point\n }\n }\n\n if (target !== undefined && target !== current) {\n const newPos = ((target - min.value) / (max.value - min.value)) * 100\n setPosition(newPos)\n emitChange()\n }\n }\n\n const onLeftKeyDown = () => {\n if (shouldMoveToMark.value) {\n moveToMark(-1)\n } else if (isNumber(step.value)) {\n incrementPosition(-step.value)\n }\n }\n\n const onRightKeyDown = () => {\n if (shouldMoveToMark.value) {\n moveToMark(1)\n } else if (isNumber(step.value)) {\n incrementPosition(step.value)\n }\n }\n\n const onPageDownKeyDown = () => {\n if (shouldMoveToMark.value) {\n moveToMark(-4)\n } else if (isNumber(step.value)) {\n incrementPosition(-step.value * 4)\n }\n }\n\n const onPageUpKeyDown = () => {\n if (shouldMoveToMark.value) {\n moveToMark(4)\n } else if (isNumber(step.value)) {\n incrementPosition(step.value * 4)\n }\n }\n\n const onHomeKeyDown = () => {\n if (disabled.value) return\n setPosition(0)\n emitChange()\n }\n\n const onEndKeyDown = () => {\n if (disabled.value) return\n setPosition(100)\n emitChange()\n }\n\n const onKeyDown = (event: KeyboardEvent) => {\n const code = getEventCode(event)\n let isPreventDefault = true\n\n switch (code) {\n case EVENT_CODE.left:\n case EVENT_CODE.down:\n onLeftKeyDown()\n break\n case EVENT_CODE.right:\n case EVENT_CODE.up:\n onRightKeyDown()\n break\n case EVENT_CODE.home:\n onHomeKeyDown()\n break\n case EVENT_CODE.end:\n onEndKeyDown()\n break\n case EVENT_CODE.pageDown:\n onPageDownKeyDown()\n break\n case EVENT_CODE.pageUp:\n onPageUpKeyDown()\n break\n default:\n isPreventDefault = false\n break\n }\n\n isPreventDefault && event.preventDefault()\n }\n\n const getClientXY = (event: MouseEvent | TouchEvent) => {\n let clientX: number\n let clientY: number\n if (event.type.startsWith('touch')) {\n clientY = (event as TouchEvent).touches[0].clientY\n clientX = (event as TouchEvent).touches[0].clientX\n } else {\n clientY = (event as MouseEvent).clientY\n clientX = (event as MouseEvent).clientX\n }\n return {\n clientX,\n clientY,\n }\n }\n\n const onDragStart = (event: MouseEvent | TouchEvent) => {\n initData.dragging = true\n initData.isClick = true\n const { clientX, clientY } = getClientXY(event)\n if (props.vertical) {\n initData.startY = clientY\n } else {\n initData.startX = clientX\n }\n initData.startPosition = Number.parseFloat(currentPosition.value)\n initData.newPosition = initData.startPosition\n }\n\n const onDragging = (event: MouseEvent | TouchEvent) => {\n if (initData.dragging) {\n initData.isClick = false\n displayTooltip()\n resetSize()\n let diff: number\n const { clientX, clientY } = getClientXY(event)\n if (props.vertical) {\n initData.currentY = clientY\n diff = ((initData.startY - initData.currentY) / sliderSize.value) * 100\n } else {\n initData.currentX = clientX\n diff = ((initData.currentX - initData.startX) / sliderSize.value) * 100\n }\n initData.newPosition = initData.startPosition + diff\n setPosition(initData.newPosition)\n }\n }\n\n const onDragEnd = () => {\n if (initData.dragging) {\n /*\n * 防止在 mouseup 后立即触发 click,导致滑块有几率产生一小段位移\n * 不使用 preventDefault 是因为 mouseup 和 click 没有注册在同一个 DOM 上\n */\n setTimeout(() => {\n initData.dragging = false\n if (!initData.hovering) {\n hideTooltip()\n }\n if (!initData.isClick) {\n setPosition(initData.newPosition)\n }\n emitChange()\n }, 0)\n window.removeEventListener('mousemove', onDragging)\n window.removeEventListener('touchmove', onDragging)\n window.removeEventListener('mouseup', onDragEnd)\n window.removeEventListener('touchend', onDragEnd)\n window.removeEventListener('contextmenu', onDragEnd)\n }\n }\n\n const setPosition = async (newPosition: number) => {\n if (newPosition === null || Number.isNaN(+newPosition)) return\n\n newPosition = clamp(newPosition, 0, 100)\n let value: number\n\n if (step.value === 'mark') {\n if (markList.value.length === 0) {\n value = newPosition <= 50 ? min.value : max.value\n } else {\n const closestMark = markList.value.reduce((prev, curr) => {\n return Math.abs(curr.position - newPosition) <\n Math.abs(prev.position - newPosition)\n ? curr\n : prev\n })\n value = closestMark.point\n }\n } else {\n const fullSteps = Math.floor((max.value - min.value) / step.value)\n const fullRangePercentage =\n ((fullSteps * step.value) / (max.value - min.value)) * 100\n const threshold = fullRangePercentage + (100 - fullRangePercentage) / 2\n if (newPosition < fullRangePercentage) {\n const valueBetween = fullRangePercentage / fullSteps\n const steps = Math.round(newPosition / valueBetween)\n value = min.value + steps * step.value\n } else if (newPosition < threshold) {\n value = min.value + fullSteps * step.value\n } else {\n value = max.value\n }\n value = Number.parseFloat(value.toFixed(precision.value))\n }\n\n if (value !== props.modelValue) {\n emit(UPDATE_MODEL_EVENT, value)\n }\n\n if (!initData.dragging && props.modelValue !== initData.oldValue) {\n initData.oldValue = props.modelValue\n }\n\n await nextTick()\n initData.dragging && displayTooltip()\n tooltip.value!.updatePopper()\n }\n\n watch(\n () => initData.dragging,\n (val) => {\n updateDragging(val)\n }\n )\n\n useEventListener(button, 'touchstart', onButtonDown, { passive: false })\n\n return {\n disabled,\n button,\n tooltip,\n tooltipVisible,\n showTooltip,\n persistent,\n wrapperStyle,\n formatValue,\n handleMouseEnter,\n handleMouseLeave,\n onButtonDown,\n onKeyDown,\n setPosition,\n }\n}\n"],"mappings":"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"}
|
|
@@ -7,8 +7,8 @@ let vue = require("vue");
|
|
|
7
7
|
const useStops = (props, initData, minValue, maxValue) => {
|
|
8
8
|
const stops = (0, vue.computed)(() => {
|
|
9
9
|
if (!props.showStops || props.min > props.max) return [];
|
|
10
|
-
if (props.step === 0) {
|
|
11
|
-
require_error.debugWarn("ElSlider", "step should not be 0.");
|
|
10
|
+
if (props.step === "mark" || props.step === 0) {
|
|
11
|
+
if (props.step === 0) require_error.debugWarn("ElSlider", "step should not be 0.");
|
|
12
12
|
return [];
|
|
13
13
|
}
|
|
14
14
|
const stopCount = Math.ceil((props.max - props.min) / props.step);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-stops.js","names":[],"sources":["../../../../../../../packages/components/slider/src/composables/use-stops.ts"],"sourcesContent":["import { computed } from 'vue'\nimport { debugWarn } from '@element-plus/utils'\n\nimport type { CSSProperties, ComputedRef } from 'vue'\nimport type { SliderInitData, SliderProps } from '../slider'\n\ntype Stops = {\n stops: ComputedRef<number[]>\n getStopStyle: (position: number) => CSSProperties\n}\n\nexport const useStops = (\n props: SliderProps,\n initData: SliderInitData,\n minValue: ComputedRef<number>,\n maxValue: ComputedRef<number>\n): Stops => {\n const stops = computed(() => {\n if (!props.showStops || props.min > props.max) return []\n if (props.step === 0) {\n debugWarn('ElSlider', 'step should not be 0.')\n return []\n }\n\n const stopCount = Math.ceil((props.max - props.min) / props.step)\n const stepWidth = (100 * props.step) / (props.max - props.min)\n const result = Array.from<number>({ length: stopCount - 1 }).map(\n (_, index) => (index + 1) * stepWidth\n )\n\n if (props.range) {\n return result.filter((step) => {\n return (\n step <\n (100 * (minValue.value - props.min)) / (props.max - props.min) ||\n step > (100 * (maxValue.value - props.min)) / (props.max - props.min)\n )\n })\n } else {\n return result.filter(\n (step) =>\n step >\n (100 * (initData.firstValue - props.min)) / (props.max - props.min)\n )\n }\n })\n\n const getStopStyle = (position: number): CSSProperties => {\n return props.vertical\n ? { bottom: `${position}%` }\n : { left: `${position}%` }\n }\n\n return {\n stops,\n getStopStyle,\n }\n}\n"],"mappings":";;;;;;AAWA,MAAa,YACX,OACA,UACA,UACA,aACU;CACV,MAAM,gCAAuB;AAC3B,MAAI,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,IAAK,QAAO,EAAE;AACxD,MAAI,MAAM,SAAS,GAAG;
|
|
1
|
+
{"version":3,"file":"use-stops.js","names":[],"sources":["../../../../../../../packages/components/slider/src/composables/use-stops.ts"],"sourcesContent":["import { computed } from 'vue'\nimport { debugWarn } from '@element-plus/utils'\n\nimport type { CSSProperties, ComputedRef } from 'vue'\nimport type { SliderInitData, SliderProps } from '../slider'\n\ntype Stops = {\n stops: ComputedRef<number[]>\n getStopStyle: (position: number) => CSSProperties\n}\n\nexport const useStops = (\n props: SliderProps,\n initData: SliderInitData,\n minValue: ComputedRef<number>,\n maxValue: ComputedRef<number>\n): Stops => {\n const stops = computed(() => {\n if (!props.showStops || props.min > props.max) return []\n if (props.step === 'mark' || props.step === 0) {\n if (props.step === 0) debugWarn('ElSlider', 'step should not be 0.')\n return []\n }\n\n const stopCount = Math.ceil((props.max - props.min) / props.step)\n const stepWidth = (100 * props.step) / (props.max - props.min)\n const result = Array.from<number>({ length: stopCount - 1 }).map(\n (_, index) => (index + 1) * stepWidth\n )\n\n if (props.range) {\n return result.filter((step) => {\n return (\n step <\n (100 * (minValue.value - props.min)) / (props.max - props.min) ||\n step > (100 * (maxValue.value - props.min)) / (props.max - props.min)\n )\n })\n } else {\n return result.filter(\n (step) =>\n step >\n (100 * (initData.firstValue - props.min)) / (props.max - props.min)\n )\n }\n })\n\n const getStopStyle = (position: number): CSSProperties => {\n return props.vertical\n ? { bottom: `${position}%` }\n : { left: `${position}%` }\n }\n\n return {\n stops,\n getStopStyle,\n }\n}\n"],"mappings":";;;;;;AAWA,MAAa,YACX,OACA,UACA,UACA,aACU;CACV,MAAM,gCAAuB;AAC3B,MAAI,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,IAAK,QAAO,EAAE;AACxD,MAAI,MAAM,SAAS,UAAU,MAAM,SAAS,GAAG;AAC7C,OAAI,MAAM,SAAS,EAAG,yBAAU,YAAY,wBAAwB;AACpE,UAAO,EAAE;;EAGX,MAAM,YAAY,KAAK,MAAM,MAAM,MAAM,MAAM,OAAO,MAAM,KAAK;EACjE,MAAM,YAAa,MAAM,MAAM,QAAS,MAAM,MAAM,MAAM;EAC1D,MAAM,SAAS,MAAM,KAAa,EAAE,QAAQ,YAAY,GAAG,CAAC,CAAC,KAC1D,GAAG,WAAW,QAAQ,KAAK,UAC7B;AAED,MAAI,MAAM,MACR,QAAO,OAAO,QAAQ,SAAS;AAC7B,UACE,OACG,OAAO,SAAS,QAAQ,MAAM,QAAS,MAAM,MAAM,MAAM,QAC5D,OAAQ,OAAO,SAAS,QAAQ,MAAM,QAAS,MAAM,MAAM,MAAM;IAEnE;MAEF,QAAO,OAAO,QACX,SACC,OACC,OAAO,SAAS,aAAa,MAAM,QAAS,MAAM,MAAM,MAAM,KAClE;GAEH;CAEF,MAAM,gBAAgB,aAAoC;AACxD,SAAO,MAAM,WACT,EAAE,QAAQ,GAAG,SAAS,IAAI,GAC1B,EAAE,MAAM,GAAG,SAAS,IAAI;;AAG9B,QAAO;EACL;EACA;EACD"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { SliderProps } from "./slider.js";
|
|
2
|
+
import { Mark } from "./composables/use-marks.js";
|
|
2
3
|
import { ComputedRef, InjectionKey, Ref, ToRefs } from "vue";
|
|
3
4
|
|
|
4
5
|
//#region ../../packages/components/slider/src/constants.d.ts
|
|
@@ -9,6 +10,7 @@ interface SliderContext extends ToRefs<SliderProps> {
|
|
|
9
10
|
resetSize: () => void;
|
|
10
11
|
updateDragging: (val: boolean) => void;
|
|
11
12
|
disabled: ComputedRef<boolean>;
|
|
13
|
+
markList: ComputedRef<Mark[]>;
|
|
12
14
|
}
|
|
13
15
|
declare const sliderContextKey: InjectionKey<SliderContext>;
|
|
14
16
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","names":[],"sources":["../../../../../../packages/components/slider/src/constants.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref, ToRefs } from 'vue'\nimport type { SliderProps } from './slider'\n\nexport interface SliderContext extends ToRefs<SliderProps> {\n precision: ComputedRef<number>\n sliderSize: Ref<number>\n emitChange: () => void\n resetSize: () => void\n updateDragging: (val: boolean) => void\n disabled: ComputedRef<boolean>\n}\n\nexport const sliderContextKey: InjectionKey<SliderContext> =\n Symbol('sliderContextKey')\n"],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"constants.js","names":[],"sources":["../../../../../../packages/components/slider/src/constants.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref, ToRefs } from 'vue'\nimport type { SliderProps } from './slider'\nimport type { Mark } from './composables/use-marks'\n\nexport interface SliderContext extends ToRefs<SliderProps> {\n precision: ComputedRef<number>\n sliderSize: Ref<number>\n emitChange: () => void\n resetSize: () => void\n updateDragging: (val: boolean) => void\n disabled: ComputedRef<boolean>\n markList: ComputedRef<Mark[]>\n}\n\nexport const sliderContextKey: InjectionKey<SliderContext> =\n Symbol('sliderContextKey')\n"],"mappings":";;;AAcA,MAAa,mBACX,OAAO,mBAAmB"}
|
|
@@ -22,7 +22,7 @@ declare const sliderProps: {
|
|
|
22
22
|
readonly id: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
|
|
23
23
|
readonly min: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
|
|
24
24
|
readonly max: EpPropFinalized<NumberConstructor, unknown, unknown, 100, boolean>;
|
|
25
|
-
readonly step: EpPropFinalized<
|
|
25
|
+
readonly step: EpPropFinalized<(new (...args: any[]) => number | "mark") | (() => number | "mark") | ((new (...args: any[]) => number | "mark") | (() => number | "mark"))[], unknown, unknown, 1, boolean>;
|
|
26
26
|
readonly showInput: BooleanConstructor;
|
|
27
27
|
readonly showInputControls: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
|
|
28
28
|
readonly size: {
|