v-click-outside-x.esm.js 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
  2. function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
  3. function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
  4. function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
  5. import pkg from '../package.json';
  6. var version = pkg.version;
  7. /**
  8. * @typedef {import("../types/index.d.ts")} VClickOutsidePlugin
  9. */
  10. var CLICK = 'click';
  11. var captureInstances = Object.create(null);
  12. var nonCaptureInstances = Object.create(null);
  13. var captureEventHandlers = Object.create(null);
  14. var nonCaptureEventHandlers = Object.create(null);
  15. var instancesList = [captureInstances, nonCaptureInstances];
  16. /**
  17. * The common event handler for bot capture and non-capture events.
  18. *
  19. * @param {!object} context - The event context.
  20. * @param {!object} instances - The capture or non-capture registered instances.
  21. * @param {Event} event - The event object.
  22. * @param {string} arg - The event type.
  23. * @returns {undefined} Default.
  24. */
  25. var commonHandler = function onCommonEvent(context, instances, event, arg) {
  26. var target = event.target;
  27. var itemIteratee = function itemIteratee(item) {
  28. var el = item.el;
  29. if (el !== target && !el.contains(target)) {
  30. var binding = item.binding;
  31. if (binding.modifiers.stop) {
  32. event.stopPropagation();
  33. }
  34. if (binding.modifiers.prevent) {
  35. event.preventDefault();
  36. }
  37. binding.value.call(context, event);
  38. }
  39. };
  40. instances[arg].forEach(itemIteratee);
  41. };
  42. /**
  43. * Get the correct event handler: Capture or non-capture.
  44. *
  45. * @param {boolean} useCapture - Indicate which handler to use; 'true' to use
  46. * capture handler or 'false' for non-capture.
  47. * @param {string} arg - The event type.
  48. * @returns {Function} - The event handler.
  49. */
  50. var getEventHandler = function getEventHandler(useCapture, arg) {
  51. if (useCapture) {
  52. if (captureEventHandlers[arg]) {
  53. return captureEventHandlers[arg];
  54. }
  55. /**
  56. * Event handler for capture events.
  57. *
  58. * @param {Event} event - The event object.
  59. */
  60. captureEventHandlers[arg] = function onCaptureEvent(event) {
  61. commonHandler(this, captureInstances, event, arg);
  62. };
  63. return captureEventHandlers[arg];
  64. }
  65. if (nonCaptureEventHandlers[arg]) {
  66. return nonCaptureEventHandlers[arg];
  67. }
  68. /**
  69. * Event handler for non-capture events.
  70. *
  71. * @param {Event} event - The event object.
  72. */
  73. nonCaptureEventHandlers[arg] = function onNonCaptureEvent(event) {
  74. commonHandler(this, nonCaptureInstances, event, arg);
  75. };
  76. return nonCaptureEventHandlers[arg];
  77. };
  78. /**
  79. * The directive definition.
  80. * {@link https://vuejs.org/v2/guide/custom-directive.html|Custom directive}.
  81. *
  82. * @type {VClickOutsidePlugin.directive}
  83. * @property {!object} $captureInstances - Registered capture instances.
  84. * @property {!object} $nonCaptureInstances - Registered non-capture instances.
  85. * @property {Function} $_onCaptureEvent - Event handler for capture events.
  86. * @property {Function} $_onNonCaptureEvent - Event handler for non-capture events.
  87. * @property {Function} bind - Called only once, when the directive is first
  88. * bound to the element.
  89. * @property {Function} unbind - Called only once, when the directive is unbound
  90. * from the element.
  91. * @property {string} version - The version number of this release.
  92. */
  93. export var directive = Object.defineProperties({}, {
  94. $captureInstances: {
  95. value: captureInstances
  96. },
  97. $nonCaptureInstances: {
  98. value: nonCaptureInstances
  99. },
  100. $captureEventHandlers: {
  101. value: captureEventHandlers
  102. },
  103. $nonCaptureEventHandlers: {
  104. value: nonCaptureEventHandlers
  105. },
  106. bind: {
  107. value: function bind(el, binding) {
  108. if (typeof binding.value !== 'function') {
  109. throw new TypeError('Binding value must be a function.');
  110. }
  111. var arg = binding.arg || CLICK;
  112. var normalisedBinding = _objectSpread(_objectSpread({}, binding), {
  113. arg: arg,
  114. modifiers: _objectSpread(_objectSpread({}, {
  115. capture: false,
  116. prevent: false,
  117. stop: false
  118. }), binding.modifiers)
  119. });
  120. var useCapture = normalisedBinding.modifiers.capture;
  121. var instances = useCapture ? captureInstances : nonCaptureInstances;
  122. if (!Array.isArray(instances[arg])) {
  123. instances[arg] = [];
  124. }
  125. if (instances[arg].push({
  126. el: el,
  127. binding: normalisedBinding
  128. }) === 1) {
  129. /* istanbul ignore next */
  130. if ((typeof document === "undefined" ? "undefined" : _typeof(document)) === 'object' && document) {
  131. document.addEventListener(arg, getEventHandler(useCapture, arg), useCapture);
  132. }
  133. }
  134. }
  135. },
  136. unbind: {
  137. value: function unbind(el) {
  138. var compareElements = function compareElements(item) {
  139. return item.el !== el;
  140. };
  141. var instancesIteratee = function instancesIteratee(instances) {
  142. var instanceKeys = Object.keys(instances);
  143. if (instanceKeys.length) {
  144. var useCapture = instances === captureInstances;
  145. var keysIteratee = function keysIteratee(eventName) {
  146. var newInstance = instances[eventName].filter(compareElements);
  147. if (newInstance.length) {
  148. instances[eventName] = newInstance;
  149. } else {
  150. /* istanbul ignore next */
  151. if ((typeof document === "undefined" ? "undefined" : _typeof(document)) === 'object' && document) {
  152. document.removeEventListener(eventName, getEventHandler(useCapture, eventName), useCapture);
  153. }
  154. delete instances[eventName];
  155. }
  156. };
  157. instanceKeys.forEach(keysIteratee);
  158. }
  159. };
  160. instancesList.forEach(instancesIteratee);
  161. }
  162. },
  163. /* Note: This needs to be manually updated to match package.json. */
  164. version: {
  165. enumerable: true,
  166. value: version
  167. }
  168. });
  169. /**
  170. * A Vue.js plugin should expose an install method. The method will be called
  171. * with the Vue constructor as the first argument, along with possible options.
  172. * {@link https://vuejs.org/v2/guide/plugins.html#Writing-a-Plugin|Writing a plugin}.
  173. *
  174. * @type {VClickOutsidePlugin.install}
  175. * @param {import("vue")} Vue - The Vue constructor.
  176. */
  177. export function install(Vue) {
  178. Vue.directive('click-outside', directive);
  179. }
  180. //# sourceMappingURL=v-click-outside-x.esm.js.map