button2.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var index$1 = require('../../tooltip/index.js');
  5. var button = require('./button.js');
  6. var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
  7. var useSliderButton = require('./composables/use-slider-button.js');
  8. var index = require('../../../hooks/use-namespace/index.js');
  9. const __default__ = vue.defineComponent({
  10. name: "ElSliderButton"
  11. });
  12. const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  13. ...__default__,
  14. props: button.sliderButtonProps,
  15. emits: button.sliderButtonEmits,
  16. setup(__props, { expose, emit }) {
  17. const props = __props;
  18. const ns = index.useNamespace("slider");
  19. const initData = vue.reactive({
  20. hovering: false,
  21. dragging: false,
  22. isClick: false,
  23. startX: 0,
  24. currentX: 0,
  25. startY: 0,
  26. currentY: 0,
  27. startPosition: 0,
  28. newPosition: 0,
  29. oldValue: props.modelValue
  30. });
  31. const tooltipPersistent = vue.computed(() => !showTooltip.value ? false : persistent.value);
  32. const {
  33. disabled,
  34. button,
  35. tooltip,
  36. showTooltip,
  37. persistent,
  38. tooltipVisible,
  39. wrapperStyle,
  40. formatValue,
  41. handleMouseEnter,
  42. handleMouseLeave,
  43. onButtonDown,
  44. onKeyDown,
  45. setPosition
  46. } = useSliderButton.useSliderButton(props, initData, emit);
  47. const { hovering, dragging } = vue.toRefs(initData);
  48. expose({
  49. onButtonDown,
  50. onKeyDown,
  51. setPosition,
  52. hovering,
  53. dragging
  54. });
  55. return (_ctx, _cache) => {
  56. return vue.openBlock(), vue.createElementBlock("div", {
  57. ref_key: "button",
  58. ref: button,
  59. class: vue.normalizeClass([vue.unref(ns).e("button-wrapper"), { hover: vue.unref(hovering), dragging: vue.unref(dragging) }]),
  60. style: vue.normalizeStyle(vue.unref(wrapperStyle)),
  61. tabindex: vue.unref(disabled) ? -1 : 0,
  62. onMouseenter: vue.unref(handleMouseEnter),
  63. onMouseleave: vue.unref(handleMouseLeave),
  64. onMousedown: vue.unref(onButtonDown),
  65. onFocus: vue.unref(handleMouseEnter),
  66. onBlur: vue.unref(handleMouseLeave),
  67. onKeydown: vue.unref(onKeyDown)
  68. }, [
  69. vue.createVNode(vue.unref(index$1.ElTooltip), {
  70. ref_key: "tooltip",
  71. ref: tooltip,
  72. visible: vue.unref(tooltipVisible),
  73. placement: _ctx.placement,
  74. "fallback-placements": ["top", "bottom", "right", "left"],
  75. "stop-popper-mouse-event": false,
  76. "popper-class": _ctx.tooltipClass,
  77. disabled: !vue.unref(showTooltip),
  78. persistent: vue.unref(tooltipPersistent)
  79. }, {
  80. content: vue.withCtx(() => [
  81. vue.createElementVNode("span", null, vue.toDisplayString(vue.unref(formatValue)), 1)
  82. ]),
  83. default: vue.withCtx(() => [
  84. vue.createElementVNode("div", {
  85. class: vue.normalizeClass([vue.unref(ns).e("button"), { hover: vue.unref(hovering), dragging: vue.unref(dragging) }])
  86. }, null, 2)
  87. ]),
  88. _: 1
  89. }, 8, ["visible", "placement", "popper-class", "disabled", "persistent"])
  90. ], 46, ["tabindex", "onMouseenter", "onMouseleave", "onMousedown", "onFocus", "onBlur", "onKeydown"]);
  91. };
  92. }
  93. });
  94. var SliderButton = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "button.vue"]]);
  95. exports["default"] = SliderButton;
  96. //# sourceMappingURL=button2.js.map