use-content.js 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var lodashUnified = require('lodash-unified');
  5. var constants = require('../constants.js');
  6. var utils = require('../utils.js');
  7. var index = require('../../../../hooks/use-popper/index.js');
  8. const DEFAULT_ARROW_OFFSET = 0;
  9. const usePopperContent = (props) => {
  10. const { popperInstanceRef, contentRef, triggerRef, role } = vue.inject(constants.POPPER_INJECTION_KEY, void 0);
  11. const arrowRef = vue.ref();
  12. const arrowOffset = vue.ref();
  13. const eventListenerModifier = vue.computed(() => {
  14. return {
  15. name: "eventListeners",
  16. enabled: !!props.visible
  17. };
  18. });
  19. const arrowModifier = vue.computed(() => {
  20. var _a;
  21. const arrowEl = vue.unref(arrowRef);
  22. const offset = (_a = vue.unref(arrowOffset)) != null ? _a : DEFAULT_ARROW_OFFSET;
  23. return {
  24. name: "arrow",
  25. enabled: !lodashUnified.isUndefined(arrowEl),
  26. options: {
  27. element: arrowEl,
  28. padding: offset
  29. }
  30. };
  31. });
  32. const options = vue.computed(() => {
  33. return {
  34. onFirstUpdate: () => {
  35. update();
  36. },
  37. ...utils.buildPopperOptions(props, [
  38. vue.unref(arrowModifier),
  39. vue.unref(eventListenerModifier)
  40. ])
  41. };
  42. });
  43. const computedReference = vue.computed(() => utils.unwrapMeasurableEl(props.referenceEl) || vue.unref(triggerRef));
  44. const { attributes, state, styles, update, forceUpdate, instanceRef } = index.usePopper(computedReference, contentRef, options);
  45. vue.watch(instanceRef, (instance) => popperInstanceRef.value = instance);
  46. vue.onMounted(() => {
  47. vue.watch(() => {
  48. var _a;
  49. return (_a = vue.unref(computedReference)) == null ? void 0 : _a.getBoundingClientRect();
  50. }, () => {
  51. update();
  52. });
  53. });
  54. return {
  55. attributes,
  56. arrowRef,
  57. contentRef,
  58. instanceRef,
  59. state,
  60. styles,
  61. role,
  62. forceUpdate,
  63. update
  64. };
  65. };
  66. exports.usePopperContent = usePopperContent;
  67. //# sourceMappingURL=use-content.js.map