@vuetify/nightly 3.0.0-alpha.3 → 3.0.0-beta.2

package/lib/composables/transition.mjs

@@ -1,4 +1,5 @@
 // Utilities
+import { h, mergeProps, Transition } from 'vue';
 import { propsFactory } from "../util/index.mjs"; // Types
 
 export const makeTransitionProps = propsFactory({
@@ -8,4 +9,23 @@ export const makeTransitionProps = propsFactory({
     validator: val => val !== true
   }
 }, 'transition');
+export const MaybeTransition = (props, _ref) => {
+  var _slots$default;
+
+  let {
+    slots
+  } = _ref;
+  const {
+    transition,
+    ...rest
+  } = props;
+  if (!transition || typeof transition === 'boolean') return (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots);
+  const {
+    component = Transition,
+    ...customProps
+  } = typeof transition === 'object' ? transition : {};
+  return h(component, mergeProps(typeof transition === 'string' ? {
+    name: transition
+  } : customProps, rest), slots);
+};
 //# sourceMappingURL=transition.mjs.map

package/lib/composables/transition.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/composables/transition.ts"],"names":["propsFactory","makeTransitionProps","transition","type","Boolean","String","Object","default","validator","val"],"mappings":"AAAA;SACSA,Y,6BAET;;AAGA,OAAO,MAAMC,mBAAmB,GAAGD,YAAY,CAAC;AAC9CE,EAAAA,UAAU,EAAE;AACVC,IAAAA,IAAI,EAAE,CAACC,OAAD,EAAUC,MAAV,EAAkBC,MAAlB,CADI;AAEVC,IAAAA,OAAO,EAAE,iBAFC;AAGVC,IAAAA,SAAS,EAAEC,GAAG,IAAIA,GAAG,KAAK;AAHhB;AADkC,CAAD,EAM5C,YAN4C,CAAxC","sourcesContent":["// Utilities\nimport { propsFactory } from '@/util'\n\n// Types\nimport type { PropType, TransitionProps } from 'vue'\n\nexport const makeTransitionProps = propsFactory({\n  transition: {\n    type: [Boolean, String, Object] as PropType<string | false | TransitionProps>,\n    default: 'fade-transition',\n    validator: val => val !== true,\n  },\n}, 'transition')\n"],"file":"transition.mjs"}
+{"version":3,"sources":["../../src/composables/transition.ts"],"names":["h","mergeProps","Transition","propsFactory","makeTransitionProps","transition","type","Boolean","String","Object","default","validator","val","MaybeTransition","props","slots","rest","component","customProps","name"],"mappings":"AAAA;AACA,SAASA,CAAT,EAAYC,UAAZ,EAAwBC,UAAxB,QAA0C,KAA1C;SACSC,Y,6BAET;;AAGA,OAAO,MAAMC,mBAAmB,GAAGD,YAAY,CAAC;AAC9CE,EAAAA,UAAU,EAAE;AACVC,IAAAA,IAAI,EAAE,CAACC,OAAD,EAAUC,MAAV,EAAkBC,MAAlB,CADI;AAEVC,IAAAA,OAAO,EAAE,iBAFC;AAGVC,IAAAA,SAAS,EAAEC,GAAG,IAAIA,GAAG,KAAK;AAHhB;AADkC,CAAD,EAM5C,YAN4C,CAAxC;AAYP,OAAO,MAAMC,eAA0D,GAAG,CAACC,KAAD,WAAsB;AAAA;;AAAA,MAAd;AAAEC,IAAAA;AAAF,GAAc;AAC9F,QAAM;AAAEV,IAAAA,UAAF;AAAc,OAAGW;AAAjB,MAA0BF,KAAhC;AAEA,MAAI,CAACT,UAAD,IAAe,OAAOA,UAAP,KAAsB,SAAzC,EAAoD,yBAAOU,KAAK,CAACL,OAAb,qBAAO,oBAAAK,KAAK,CAAZ;AAEpD,QAAM;AAAEE,IAAAA,SAAS,GAAGf,UAAd;AAA0B,OAAGgB;AAA7B,MAA6C,OAAOb,UAAP,KAAsB,QAAtB,GAAiCA,UAAjC,GAA8C,EAAjG;AAEA,SAAOL,CAAC,CACNiB,SADM,EAENhB,UAAU,CAAC,OAAOI,UAAP,KAAsB,QAAtB,GAAiC;AAAEc,IAAAA,IAAI,EAAEd;AAAR,GAAjC,GAAwDa,WAAzD,EAA6EF,IAA7E,CAFJ,EAGND,KAHM,CAAR;AAKD,CAZM","sourcesContent":["// Utilities\nimport { h, mergeProps, Transition } from 'vue'\nimport { propsFactory } from '@/util'\n\n// Types\nimport type { Component, FunctionalComponent, PropType, TransitionProps } from 'vue'\n\nexport const makeTransitionProps = propsFactory({\n  transition: {\n    type: [Boolean, String, Object] as PropType<string | boolean | TransitionProps & { component?: Component }>,\n    default: 'fade-transition',\n    validator: val => val !== true,\n  },\n}, 'transition')\n\ninterface MaybeTransitionProps extends TransitionProps {\n  transition?: string | boolean | TransitionProps & { component?: any }\n}\n\nexport const MaybeTransition: FunctionalComponent<MaybeTransitionProps> = (props, { slots }) => {\n  const { transition, ...rest } = props\n\n  if (!transition || typeof transition === 'boolean') return slots.default?.()\n\n  const { component = Transition, ...customProps } = typeof transition === 'object' ? transition : {}\n\n  return h(\n    component,\n    mergeProps(typeof transition === 'string' ? { name: transition } : customProps as any, rest as any),\n    slots\n  )\n}\n"],"file":"transition.mjs"}

package/lib/composables/validation.mjs

@@ -0,0 +1,119 @@
+// Composables
+import { useForm } from "./form.mjs";
+import { useProxiedModel } from "./proxiedModel.mjs"; // Utilities
+
+import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue';
+import { getCurrentInstanceName, getUid, propsFactory, wrapInArray } from "../util/index.mjs"; // Types
+
+export const makeValidationProps = propsFactory({
+  disabled: Boolean,
+  error: Boolean,
+  errorMessages: {
+    type: [Array, String],
+    default: () => []
+  },
+  maxErrors: {
+    type: [Number, String],
+    default: 1
+  },
+  name: String,
+  readonly: Boolean,
+  rules: {
+    type: Array,
+    default: () => []
+  },
+  modelValue: null
+});
+export function useValidation(props) {
+  let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
+  const model = useProxiedModel(props, 'modelValue');
+  const form = useForm();
+  const internalErrorMessages = ref([]);
+  const isPristine = ref(true);
+  const isDirty = computed(() => wrapInArray(model.value === '' ? null : model.value).length > 0);
+  const isDisabled = computed(() => !!(props.disabled || form != null && form.isDisabled.value));
+  const isReadonly = computed(() => !!(props.readonly || form != null && form.isReadonly.value));
+  const errorMessages = computed(() => {
+    return props.errorMessages.length ? wrapInArray(props.errorMessages) : internalErrorMessages.value;
+  });
+  const isValid = computed(() => {
+    if (props.error || errorMessages.value.length) return false;
+    return isPristine.value ? null : true;
+  });
+  const isValidating = ref(false);
+  const validationClasses = computed(() => {
+    return {
+      [`${name}--error`]: isValid.value === false,
+      [`${name}--dirty`]: isDirty.value,
+      [`${name}--disabled`]: isDisabled.value,
+      [`${name}--readonly`]: isReadonly.value
+    };
+  });
+  const uid = computed(() => {
+    var _props$name;
+
+    return (_props$name = props.name) != null ? _props$name : getUid();
+  });
+  onBeforeMount(() => {
+    form == null ? void 0 : form.register(uid.value, validate, reset, resetValidation, isValid);
+  });
+  onBeforeUnmount(() => {
+    form == null ? void 0 : form.unregister(uid.value);
+  });
+  watch(model, () => {
+    if (model.value != null) validate();
+  });
+
+  function reset() {
+    resetValidation();
+    model.value = null;
+  }
+
+  function resetValidation() {
+    isPristine.value = true;
+    internalErrorMessages.value = [];
+  }
+
+  async function validate() {
+    const results = [];
+    isValidating.value = true;
+
+    for (const rule of props.rules) {
+      if (results.length >= (props.maxErrors || 1)) {
+        break;
+      }
+
+      const handler = typeof rule === 'function' ? rule : () => rule;
+      const result = await handler(model.value);
+      if (result === true) continue;
+
+      if (typeof result !== 'string') {
+        // eslint-disable-next-line no-console
+        console.warn(`${result} is not a valid value. Rule functions must return boolean true or a string.`);
+        continue;
+      }
+
+      results.push(result);
+    }
+
+    internalErrorMessages.value = results;
+    isValidating.value = false;
+    isPristine.value = false;
+    return internalErrorMessages.value;
+  }
+
+  return {
+    errorMessages,
+    isDirty,
+    isDisabled,
+    isReadonly,
+    isPristine,
+    isValid,
+    isValidating,
+    reset,
+    resetValidation,
+    validate,
+    validationClasses
+  };
+}
+//# sourceMappingURL=validation.mjs.map

package/lib/composables/validation.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/composables/validation.ts"],"names":["useForm","useProxiedModel","computed","onBeforeMount","onBeforeUnmount","ref","watch","getCurrentInstanceName","getUid","propsFactory","wrapInArray","makeValidationProps","disabled","Boolean","error","errorMessages","type","Array","String","default","maxErrors","Number","name","readonly","rules","modelValue","useValidation","props","model","form","internalErrorMessages","isPristine","isDirty","value","length","isDisabled","isReadonly","isValid","isValidating","validationClasses","uid","register","validate","reset","resetValidation","unregister","results","rule","handler","result","console","warn","push"],"mappings":"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","sourcesContent":["// Composables\nimport { useForm } from '@/composables/form'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'\nimport { getCurrentInstanceName, getUid, propsFactory, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type ValidationResult = string | true\nexport type ValidationRule =\n  | ValidationResult\n  | PromiseLike<ValidationResult>\n  | ((value: any) => ValidationResult)\n  | ((value: any) => PromiseLike<ValidationResult>)\n\nexport interface ValidationProps {\n  disabled: boolean\n  error: boolean\n  errorMessages: string | string[]\n  maxErrors: string | number\n  name: string | undefined\n  readonly: boolean\n  rules: ValidationRule[]\n  modelValue: any\n  'onUpdate:modelValue': ((val: any) => void) | undefined\n}\n\nexport const makeValidationProps = propsFactory({\n  disabled: Boolean,\n  error: Boolean,\n  errorMessages: {\n    type: [Array, String] as PropType<string | string[]>,\n    default: () => ([]),\n  },\n  maxErrors: {\n    type: [Number, String],\n    default: 1,\n  },\n  name: String,\n  readonly: Boolean,\n  rules: {\n    type: Array as PropType<ValidationRule[]>,\n    default: () => ([]),\n  },\n  modelValue: null,\n})\n\nexport function useValidation (\n  props: ValidationProps,\n  name = getCurrentInstanceName(),\n) {\n  const model = useProxiedModel(props, 'modelValue')\n  const form = useForm()\n  const internalErrorMessages = ref<string[]>([])\n  const isPristine = ref(true)\n  const isDirty = computed(() => wrapInArray(model.value === '' ? null : model.value).length > 0)\n  const isDisabled = computed(() => !!(props.disabled || form?.isDisabled.value))\n  const isReadonly = computed(() => !!(props.readonly || form?.isReadonly.value))\n  const errorMessages = computed(() => {\n    return props.errorMessages.length\n      ? wrapInArray(props.errorMessages)\n      : internalErrorMessages.value\n  })\n  const isValid = computed(() => {\n    if (props.error || errorMessages.value.length) return false\n\n    return isPristine.value ? null : true\n  })\n  const isValidating = ref(false)\n  const validationClasses = computed(() => {\n    return {\n      [`${name}--error`]: isValid.value === false,\n      [`${name}--dirty`]: isDirty.value,\n      [`${name}--disabled`]: isDisabled.value,\n      [`${name}--readonly`]: isReadonly.value,\n    }\n  })\n\n  const uid = computed(() => props.name ?? getUid())\n\n  onBeforeMount(() => {\n    form?.register(uid.value, validate, reset, resetValidation, isValid)\n  })\n\n  onBeforeUnmount(() => {\n    form?.unregister(uid.value)\n  })\n\n  watch(model, () => {\n    if (model.value != null) validate()\n  })\n\n  function reset () {\n    resetValidation()\n    model.value = null\n  }\n\n  function resetValidation () {\n    isPristine.value = true\n    internalErrorMessages.value = []\n  }\n\n  async function validate () {\n    const results = []\n\n    isValidating.value = true\n\n    for (const rule of props.rules) {\n      if (results.length >= (props.maxErrors || 1)) {\n        break\n      }\n\n      const handler = typeof rule === 'function' ? rule : () => rule\n      const result = await handler(model.value)\n\n      if (result === true) continue\n\n      if (typeof result !== 'string') {\n        // eslint-disable-next-line no-console\n        console.warn(`${result} is not a valid value. Rule functions must return boolean true or a string.`)\n\n        continue\n      }\n\n      results.push(result)\n    }\n\n    internalErrorMessages.value = results\n    isValidating.value = false\n    isPristine.value = false\n\n    return internalErrorMessages.value\n  }\n\n  return {\n    errorMessages,\n    isDirty,\n    isDisabled,\n    isReadonly,\n    isPristine,\n    isValid,\n    isValidating,\n    reset,\n    resetValidation,\n    validate,\n    validationClasses,\n  }\n}\n"],"file":"validation.mjs"}

package/lib/composables/variant.mjs

@@ -0,0 +1,50 @@
+import { createVNode as _createVNode, Fragment as _Fragment } from "vue";
+// Composables
+import { useColor } from "./color.mjs"; // Utilities
+
+import { computed, unref } from 'vue';
+import { getCurrentInstanceName, propsFactory } from "../util/index.mjs"; // Types
+
+export const allowedVariants = ['outlined', 'plain', 'text', 'contained', 'contained-flat', 'contained-text'];
+export function genOverlays(isClickable, name) {
+  return _createVNode(_Fragment, null, [isClickable && _createVNode("div", {
+    "class": `${name}__overlay`
+  }, null), _createVNode("div", {
+    "class": `${name}__underlay`
+  }, null)]);
+}
+export const makeVariantProps = propsFactory({
+  color: String,
+  variant: {
+    type: String,
+    default: 'contained',
+    validator: v => allowedVariants.includes(v)
+  }
+}, 'variant');
+export function useVariant(props) {
+  let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
+  const variantClasses = computed(() => {
+    const {
+      variant
+    } = unref(props);
+    return `${name}--variant-${variant}`;
+  });
+  const {
+    colorClasses,
+    colorStyles
+  } = useColor(computed(() => {
+    const {
+      variant,
+      color
+    } = unref(props);
+    return {
+      [['contained', 'contained-flat'].includes(variant) ? 'background' : 'text']: color
+    };
+  }));
+  return {
+    colorClasses,
+    colorStyles,
+    variantClasses
+  };
+}
+//# sourceMappingURL=variant.mjs.map

package/lib/composables/variant.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/composables/variant.tsx"],"names":["useColor","computed","unref","getCurrentInstanceName","propsFactory","allowedVariants","genOverlays","isClickable","name","makeVariantProps","color","String","variant","type","default","validator","v","includes","useVariant","props","variantClasses","colorClasses","colorStyles"],"mappings":";AAAA;SACSA,Q,uBAET;;AACA,SAASC,QAAT,EAAmBC,KAAnB,QAAgC,KAAhC;SACSC,sB,EAAwBC,Y,6BAEjC;;AAIA,OAAO,MAAMC,eAAe,GAAG,CAC7B,UAD6B,EAE7B,OAF6B,EAG7B,MAH6B,EAI7B,WAJ6B,EAK7B,gBAL6B,EAM7B,gBAN6B,CAAxB;AAgBP,OAAO,SAASC,WAAT,CAAsBC,WAAtB,EAA4CC,IAA5C,EAA0D;AAC/D,wCAEMD,WAAW;AAAA,aAAiB,GAAEC,IAAK;AAAxB,UAFjB;AAAA,aAIiB,GAAEA,IAAK;AAJxB;AAOD;AAED,OAAO,MAAMC,gBAAgB,GAAGL,YAAY,CAAC;AAC3CM,EAAAA,KAAK,EAAEC,MADoC;AAE3CC,EAAAA,OAAO,EAAE;AACPC,IAAAA,IAAI,EAAEF,MADC;AAEPG,IAAAA,OAAO,EAAE,WAFF;AAGPC,IAAAA,SAAS,EAAGC,CAAD,IAAYX,eAAe,CAACY,QAAhB,CAAyBD,CAAzB;AAHhB;AAFkC,CAAD,EAOzC,SAPyC,CAArC;AASP,OAAO,SAASE,UAAT,CACLC,KADK,EAGL;AAAA,MADAX,IACA,uEADOL,sBAAsB,EAC7B;AACA,QAAMiB,cAAc,GAAGnB,QAAQ,CAAC,MAAM;AACpC,UAAM;AAAEW,MAAAA;AAAF,QAAcV,KAAK,CAACiB,KAAD,CAAzB;AACA,WAAQ,GAAEX,IAAK,aAAYI,OAAQ,EAAnC;AACD,GAH8B,CAA/B;AAKA,QAAM;AAAES,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MAAgCtB,QAAQ,CAACC,QAAQ,CAAC,MAAM;AAC5D,UAAM;AAAEW,MAAAA,OAAF;AAAWF,MAAAA;AAAX,QAAqBR,KAAK,CAACiB,KAAD,CAAhC;AACA,WAAO;AACL,OAAC,CAAC,WAAD,EAAc,gBAAd,EAAgCF,QAAhC,CAAyCL,OAAzC,IAAoD,YAApD,GAAmE,MAApE,GAA6EF;AADxE,KAAP;AAGD,GALsD,CAAT,CAA9C;AAOA,SAAO;AAAEW,IAAAA,YAAF;AAAgBC,IAAAA,WAAhB;AAA6BF,IAAAA;AAA7B,GAAP;AACD","sourcesContent":["// Composables\nimport { useColor } from '@/composables/color'\n\n// Utilities\nimport { computed, unref } from 'vue'\nimport { getCurrentInstanceName, propsFactory } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { MaybeRef } from '@/util'\n\nexport const allowedVariants = [\n  'outlined',\n  'plain',\n  'text',\n  'contained',\n  'contained-flat',\n  'contained-text',\n] as const\n\nexport type Variant = typeof allowedVariants[number]\n\nexport interface VariantProps {\n  color?: string\n  variant: Variant\n}\n\nexport function genOverlays (isClickable: boolean, name: string) {\n  return (\n    <>\n      { isClickable && <div class={`${name}__overlay`} /> }\n\n      <div class={`${name}__underlay`} />\n    </>\n  )\n}\n\nexport const makeVariantProps = propsFactory({\n  color: String,\n  variant: {\n    type: String as PropType<Variant>,\n    default: 'contained',\n    validator: (v: any) => allowedVariants.includes(v),\n  },\n}, 'variant')\n\nexport function useVariant (\n  props: MaybeRef<VariantProps>,\n  name = getCurrentInstanceName(),\n) {\n  const variantClasses = computed(() => {\n    const { variant } = unref(props)\n    return `${name}--variant-${variant}`\n  })\n\n  const { colorClasses, colorStyles } = useColor(computed(() => {\n    const { variant, color } = unref(props)\n    return {\n      [['contained', 'contained-flat'].includes(variant) ? 'background' : 'text']: color,\n    }\n  }))\n\n  return { colorClasses, colorStyles, variantClasses }\n}\n"],"file":"variant.mjs"}

package/lib/directives/click-outside/index.mjs

@@ -14,7 +14,7 @@ function checkEvent(e, el, binding) {
   // our target is the shadowroot parent container, and if it is, ignore.
 
   const root = attachedRoot(el);
-  if (root instanceof ShadowRoot && root.host === e.target) return false; // Check if additional elements were passed to be included in check
+  if (typeof ShadowRoot !== 'undefined' && root instanceof ShadowRoot && root.host === e.target) return false; // Check if additional elements were passed to be included in check
   // (click must be outside all included elements, if any)
 
   const elements = (typeof binding.value === 'object' && binding.value.include || (() => []))(); // Add the root element for the component this directive was defined on
@@ -26,7 +26,7 @@ function checkEvent(e, el, binding) {
   // Note that, because we're in the capture phase, this callback will occur before
   // the bubbling click event on any outside elements.
 
-  return !elements.some(el => el.contains(e.target));
+  return !elements.some(el => el == null ? void 0 : el.contains(e.target));
 }
 
 function checkIsActive(e, binding) {
@@ -43,9 +43,9 @@ function directive(e, el, binding) {
 
 function handleShadow(el, callback) {
   const root = attachedRoot(el);
-  callback(document.body);
+  callback(document);
 
-  if (root instanceof ShadowRoot) {
+  if (typeof ShadowRoot !== 'undefined' && root instanceof ShadowRoot) {
     callback(root);
   }
 }
@@ -67,21 +67,33 @@ export const ClickOutside = {
       app.addEventListener('click', onClick, true);
       app.addEventListener('mousedown', onMousedown, true);
     });
-    el._clickOutside = {
-      lastMousedownWasOutside: true,
+
+    if (!el._clickOutside) {
+      el._clickOutside = {
+        lastMousedownWasOutside: true
+      };
+    }
+
+    el._clickOutside[binding.instance.$.uid] = {
       onClick,
       onMousedown
     };
   },
 
-  unmounted(el) {
+  unmounted(el, binding) {
     if (!el._clickOutside) return;
     handleShadow(el, app => {
-      if (!app || !el._clickOutside) return;
-      app.removeEventListener('click', el._clickOutside.onClick, true);
-      app.removeEventListener('mousedown', el._clickOutside.onMousedown, true);
+      var _el$_clickOutside;
+
+      if (!app || !((_el$_clickOutside = el._clickOutside) != null && _el$_clickOutside[binding.instance.$.uid])) return;
+      const {
+        onClick,
+        onMousedown
+      } = el._clickOutside[binding.instance.$.uid];
+      app.removeEventListener('click', onClick, true);
+      app.removeEventListener('mousedown', onMousedown, true);
     });
-    delete el._clickOutside;
+    delete el._clickOutside[binding.instance.$.uid];
   }
 
 };

package/lib/directives/click-outside/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/directives/click-outside/index.ts"],"names":["attachedRoot","defaultConditional","checkEvent","e","el","binding","checkIsActive","root","ShadowRoot","host","target","elements","value","include","push","some","contains","isActive","closeConditional","directive","handler","_clickOutside","lastMousedownWasOutside","setTimeout","handleShadow","callback","document","body","ClickOutside","mounted","onClick","onMousedown","app","addEventListener","unmounted","removeEventListener"],"mappings":"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","sourcesContent":["import { attachedRoot } from '@/util'\nimport type { DirectiveBinding } from 'vue'\n\ninterface ClickOutsideBindingArgs {\n  handler: (e: Event) => void\n  closeConditional?: (e: Event) => boolean\n  include?: () => HTMLElement[]\n}\n\ninterface ClickOutsideDirectiveBinding extends DirectiveBinding {\n  value: ((e: Event) => void) | ClickOutsideBindingArgs\n}\n\nfunction defaultConditional () {\n  return true\n}\n\nfunction checkEvent (e: PointerEvent, el: HTMLElement, binding: ClickOutsideDirectiveBinding): boolean {\n  // The include element callbacks below can be expensive\n  // so we should avoid calling them when we're not active.\n  // Explicitly check for false to allow fallback compatibility\n  // with non-toggleable components\n  if (!e || checkIsActive(e, binding) === false) return false\n\n  // If we're clicking inside the shadowroot, then the app root doesn't get the same\n  // level of introspection as to _what_ we're clicking. We want to check to see if\n  // our target is the shadowroot parent container, and if it is, ignore.\n  const root = attachedRoot(el)\n  if (root instanceof ShadowRoot && root.host === e.target) return false\n\n  // Check if additional elements were passed to be included in check\n  // (click must be outside all included elements, if any)\n  const elements = ((typeof binding.value === 'object' && binding.value.include) || (() => []))()\n  // Add the root element for the component this directive was defined on\n  elements.push(el)\n\n  // Check if it's a click outside our elements, and then if our callback returns true.\n  // Non-toggleable components should take action in their callback and return falsy.\n  // Toggleable can return true if it wants to deactivate.\n  // Note that, because we're in the capture phase, this callback will occur before\n  // the bubbling click event on any outside elements.\n  return !elements.some(el => el.contains(e.target as Node))\n}\n\nfunction checkIsActive (e: PointerEvent, binding: ClickOutsideDirectiveBinding): boolean | void {\n  const isActive = (typeof binding.value === 'object' && binding.value.closeConditional) || defaultConditional\n\n  return isActive(e)\n}\n\nfunction directive (e: PointerEvent, el: HTMLElement, binding: ClickOutsideDirectiveBinding) {\n  const handler = typeof binding.value === 'function' ? binding.value : binding.value.handler\n\n  el._clickOutside!.lastMousedownWasOutside && checkEvent(e, el, binding) && setTimeout(() => {\n    checkIsActive(e, binding) && handler && handler(e)\n  }, 0)\n}\n\nfunction handleShadow (el: HTMLElement, callback: Function): void {\n  const root = attachedRoot(el)\n\n  callback(document.body)\n\n  if (root instanceof ShadowRoot) {\n    callback(root)\n  }\n}\n\nexport const ClickOutside = {\n  // [data-app] may not be found\n  // if using bind, inserted makes\n  // sure that the root element is\n  // available, iOS does not support\n  // clicks on body\n  mounted (el: HTMLElement, binding: ClickOutsideDirectiveBinding) {\n    const onClick = (e: Event) => directive(e as PointerEvent, el, binding)\n    const onMousedown = (e: Event) => {\n      el._clickOutside!.lastMousedownWasOutside = checkEvent(e as PointerEvent, el, binding)\n    }\n\n    handleShadow(el, (app: HTMLElement) => {\n      app.addEventListener('click', onClick, true)\n      app.addEventListener('mousedown', onMousedown, true)\n    })\n\n    el._clickOutside = {\n      lastMousedownWasOutside: true,\n      onClick,\n      onMousedown,\n    }\n  },\n\n  unmounted (el: HTMLElement) {\n    if (!el._clickOutside) return\n\n    handleShadow(el, (app: HTMLElement) => {\n      if (!app || !el._clickOutside) return\n      app.removeEventListener('click', el._clickOutside.onClick, true)\n      app.removeEventListener('mousedown', el._clickOutside.onMousedown, true)\n    })\n\n    delete el._clickOutside\n  },\n}\n\nexport default ClickOutside\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/directives/click-outside/index.ts"],"names":["attachedRoot","defaultConditional","checkEvent","e","el","binding","checkIsActive","root","ShadowRoot","host","target","elements","value","include","push","some","contains","isActive","closeConditional","directive","handler","_clickOutside","lastMousedownWasOutside","setTimeout","handleShadow","callback","document","ClickOutside","mounted","onClick","onMousedown","app","addEventListener","instance","$","uid","unmounted","removeEventListener"],"mappings":"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","sourcesContent":["import { attachedRoot } from '@/util'\nimport type { DirectiveBinding } from 'vue'\n\ninterface ClickOutsideBindingArgs {\n  handler: (e: MouseEvent) => void\n  closeConditional?: (e: Event) => boolean\n  include?: () => HTMLElement[]\n}\n\ninterface ClickOutsideDirectiveBinding extends DirectiveBinding {\n  value: ((e: MouseEvent) => void) | ClickOutsideBindingArgs\n}\n\nfunction defaultConditional () {\n  return true\n}\n\nfunction checkEvent (e: MouseEvent, el: HTMLElement, binding: ClickOutsideDirectiveBinding): boolean {\n  // The include element callbacks below can be expensive\n  // so we should avoid calling them when we're not active.\n  // Explicitly check for false to allow fallback compatibility\n  // with non-toggleable components\n  if (!e || checkIsActive(e, binding) === false) return false\n\n  // If we're clicking inside the shadowroot, then the app root doesn't get the same\n  // level of introspection as to _what_ we're clicking. We want to check to see if\n  // our target is the shadowroot parent container, and if it is, ignore.\n  const root = attachedRoot(el)\n  if (\n    typeof ShadowRoot !== 'undefined' &&\n    root instanceof ShadowRoot &&\n    root.host === e.target\n  ) return false\n\n  // Check if additional elements were passed to be included in check\n  // (click must be outside all included elements, if any)\n  const elements = ((typeof binding.value === 'object' && binding.value.include) || (() => []))()\n  // Add the root element for the component this directive was defined on\n  elements.push(el)\n\n  // Check if it's a click outside our elements, and then if our callback returns true.\n  // Non-toggleable components should take action in their callback and return falsy.\n  // Toggleable can return true if it wants to deactivate.\n  // Note that, because we're in the capture phase, this callback will occur before\n  // the bubbling click event on any outside elements.\n  return !elements.some(el => el?.contains(e.target as Node))\n}\n\nfunction checkIsActive (e: MouseEvent, binding: ClickOutsideDirectiveBinding): boolean | void {\n  const isActive = (typeof binding.value === 'object' && binding.value.closeConditional) || defaultConditional\n\n  return isActive(e)\n}\n\nfunction directive (e: MouseEvent, el: HTMLElement, binding: ClickOutsideDirectiveBinding) {\n  const handler = typeof binding.value === 'function' ? binding.value : binding.value.handler\n\n  el._clickOutside!.lastMousedownWasOutside && checkEvent(e, el, binding) && setTimeout(() => {\n    checkIsActive(e, binding) && handler && handler(e)\n  }, 0)\n}\n\nfunction handleShadow (el: HTMLElement, callback: Function): void {\n  const root = attachedRoot(el)\n\n  callback(document)\n\n  if (typeof ShadowRoot !== 'undefined' && root instanceof ShadowRoot) {\n    callback(root)\n  }\n}\n\nexport const ClickOutside = {\n  // [data-app] may not be found\n  // if using bind, inserted makes\n  // sure that the root element is\n  // available, iOS does not support\n  // clicks on body\n  mounted (el: HTMLElement, binding: ClickOutsideDirectiveBinding) {\n    const onClick = (e: Event) => directive(e as MouseEvent, el, binding)\n    const onMousedown = (e: Event) => {\n      el._clickOutside!.lastMousedownWasOutside = checkEvent(e as MouseEvent, el, binding)\n    }\n\n    handleShadow(el, (app: HTMLElement) => {\n      app.addEventListener('click', onClick, true)\n      app.addEventListener('mousedown', onMousedown, true)\n    })\n\n    if (!el._clickOutside) {\n      el._clickOutside = {\n        lastMousedownWasOutside: true,\n      }\n    }\n\n    el._clickOutside[binding.instance!.$.uid] = {\n      onClick,\n      onMousedown,\n    }\n  },\n\n  unmounted (el: HTMLElement, binding: ClickOutsideDirectiveBinding) {\n    if (!el._clickOutside) return\n\n    handleShadow(el, (app: HTMLElement) => {\n      if (!app || !el._clickOutside?.[binding.instance!.$.uid]) return\n\n      const { onClick, onMousedown } = el._clickOutside[binding.instance!.$.uid]!\n\n      app.removeEventListener('click', onClick, true)\n      app.removeEventListener('mousedown', onMousedown, true)\n    })\n\n    delete el._clickOutside[binding.instance!.$.uid]\n  },\n}\n\nexport default ClickOutside\n"],"file":"index.mjs"}

package/lib/directives/color/index.mjs

@@ -32,7 +32,7 @@ function setBorderColor(el, color, currentTheme, modifiers) {
 }
 
 function setGradientColor(el, gradient, currentTheme) {
-  el.style.backgroundImage = "linear-gradient(".concat(parseGradient(gradient, colors, currentTheme), ")");
+  el.style.backgroundImage = `linear-gradient(${parseGradient(gradient, colors, currentTheme)})`;
 }
 
 function updateColor(el, binding, node) {

package/lib/directives/color/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/directives/color/index.ts"],"names":["classToHex","isCssColor","parseGradient","colors","setTextColor","el","color","currentTheme","cssColor","style","caretColor","setBackgroundColor","backgroundColor","borderColor","setBorderColor","modifiers","Object","keys","length","top","borderTopColor","right","borderRightColor","bottom","borderBottomColor","left","borderLeftColor","setGradientColor","gradient","backgroundImage","updateColor","binding","node","context","$vuetify","theme","arg","undefined","value","update","oldValue","Color","bind"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/* eslint-disable */\n\n// Utilities\nimport {\n  classToHex,\n  isCssColor,\n  parseGradient,\n} from '../../util/colorUtils'\nimport colors from '../../util/colors'\n\n// Types\nimport { VuetifyThemeVariant } from 'types/services/theme'\nimport { VNode, VNodeDirective } from 'vue'\n\ninterface BorderModifiers {\n  top?: Boolean\n  right?: Boolean\n  bottom?: Boolean\n  left?: Boolean\n}\n\nfunction setTextColor (\n  el: HTMLElement,\n  color: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n) {\n  const cssColor = !isCssColor(color) ? classToHex(color, colors, currentTheme) : color\n\n  el.style.color = cssColor\n  el.style.caretColor = cssColor\n}\n\nfunction setBackgroundColor (\n  el: HTMLElement,\n  color: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n) {\n  const cssColor = !isCssColor(color) ? classToHex(color, colors, currentTheme) : color\n\n  el.style.backgroundColor = cssColor\n  el.style.borderColor = cssColor\n}\n\nfunction setBorderColor (\n  el: HTMLElement,\n  color: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n  modifiers?: BorderModifiers,\n) {\n  const cssColor = !isCssColor(color) ? classToHex(color, colors, currentTheme) : color\n\n  if (!modifiers || !Object.keys(modifiers).length) {\n    el.style.borderColor = cssColor\n    return\n  }\n\n  if (modifiers.top) el.style.borderTopColor = cssColor\n  if (modifiers.right) el.style.borderRightColor = cssColor\n  if (modifiers.bottom) el.style.borderBottomColor = cssColor\n  if (modifiers.left) el.style.borderLeftColor = cssColor\n}\n\nfunction setGradientColor (\n  el: HTMLElement,\n  gradient: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n) {\n  el.style.backgroundImage = `linear-gradient(${\n    parseGradient(gradient, colors, currentTheme)\n  })`\n}\n\nfunction updateColor (\n  el: HTMLElement,\n  binding: VNodeDirective,\n  node: VNode\n) {\n  const currentTheme = node.context!.$vuetify.theme.currentTheme\n\n  if (binding.arg === undefined) {\n    setBackgroundColor(el, binding.value, currentTheme)\n  } else if (binding.arg === 'text') {\n    setTextColor(el, binding.value, currentTheme)\n  } else if (binding.arg === 'border') {\n    setBorderColor(el, binding.value, currentTheme, binding.modifiers)\n  } else if (binding.arg === 'gradient') {\n    setGradientColor(el, binding.value, currentTheme)\n  }\n}\n\nfunction update (\n  el: HTMLElement,\n  binding: VNodeDirective,\n  node: VNode\n) {\n  if (binding.value === binding.oldValue) return\n\n  updateColor(el, binding, node)\n}\n\nexport const Color = {\n  bind: updateColor,\n  update,\n}\n\nexport default Color\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/directives/color/index.ts"],"names":["classToHex","isCssColor","parseGradient","colors","setTextColor","el","color","currentTheme","cssColor","style","caretColor","setBackgroundColor","backgroundColor","borderColor","setBorderColor","modifiers","Object","keys","length","top","borderTopColor","right","borderRightColor","bottom","borderBottomColor","left","borderLeftColor","setGradientColor","gradient","backgroundImage","updateColor","binding","node","context","$vuetify","theme","arg","undefined","value","update","oldValue","Color","bind"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/* eslint-disable */\n\n// Utilities\nimport {\n  classToHex,\n  isCssColor,\n  parseGradient,\n} from '../../util/colorUtils'\nimport colors from '../../util/colors'\n\n// Types\nimport { VuetifyThemeVariant } from 'types/services/theme'\nimport { VNode, VNodeDirective } from 'vue'\n\ninterface BorderModifiers {\n  top?: Boolean\n  right?: Boolean\n  bottom?: Boolean\n  left?: Boolean\n}\n\nfunction setTextColor (\n  el: HTMLElement,\n  color: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n) {\n  const cssColor = !isCssColor(color) ? classToHex(color, colors, currentTheme) : color\n\n  el.style.color = cssColor\n  el.style.caretColor = cssColor\n}\n\nfunction setBackgroundColor (\n  el: HTMLElement,\n  color: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n) {\n  const cssColor = !isCssColor(color) ? classToHex(color, colors, currentTheme) : color\n\n  el.style.backgroundColor = cssColor\n  el.style.borderColor = cssColor\n}\n\nfunction setBorderColor (\n  el: HTMLElement,\n  color: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n  modifiers?: BorderModifiers,\n) {\n  const cssColor = !isCssColor(color) ? classToHex(color, colors, currentTheme) : color\n\n  if (!modifiers || !Object.keys(modifiers).length) {\n    el.style.borderColor = cssColor\n    return\n  }\n\n  if (modifiers.top) el.style.borderTopColor = cssColor\n  if (modifiers.right) el.style.borderRightColor = cssColor\n  if (modifiers.bottom) el.style.borderBottomColor = cssColor\n  if (modifiers.left) el.style.borderLeftColor = cssColor\n}\n\nfunction setGradientColor (\n  el: HTMLElement,\n  gradient: string,\n  currentTheme: Partial<VuetifyThemeVariant>,\n) {\n  el.style.backgroundImage = `linear-gradient(${\n    parseGradient(gradient, colors, currentTheme)\n  })`\n}\n\nfunction updateColor (\n  el: HTMLElement,\n  binding: VNodeDirective,\n  node: VNode\n) {\n  const currentTheme = node.context!.$vuetify.theme.currentTheme\n\n  if (binding.arg === undefined) {\n    setBackgroundColor(el, binding.value, currentTheme)\n  } else if (binding.arg === 'text') {\n    setTextColor(el, binding.value, currentTheme)\n  } else if (binding.arg === 'border') {\n    setBorderColor(el, binding.value, currentTheme, binding.modifiers)\n  } else if (binding.arg === 'gradient') {\n    setGradientColor(el, binding.value, currentTheme)\n  }\n}\n\nfunction update (\n  el: HTMLElement,\n  binding: VNodeDirective,\n  node: VNode\n) {\n  if (binding.value === binding.oldValue) return\n\n  updateColor(el, binding, node)\n}\n\nexport const Color = {\n  bind: updateColor,\n  update,\n}\n\nexport default Color\n"],"file":"index.mjs"}

package/lib/directives/index.d.ts

@@ -0,0 +1,58 @@
+import { DirectiveBinding, ObjectDirective } from 'vue';
+
+interface ClickOutsideBindingArgs {
+    handler: (e: MouseEvent) => void;
+    closeConditional?: (e: Event) => boolean;
+    include?: () => HTMLElement[];
+}
+interface ClickOutsideDirectiveBinding extends DirectiveBinding {
+    value: ((e: MouseEvent) => void) | ClickOutsideBindingArgs;
+}
+declare const ClickOutside: {
+    mounted(el: HTMLElement, binding: ClickOutsideDirectiveBinding): void;
+    unmounted(el: HTMLElement, binding: ClickOutsideDirectiveBinding): void;
+};
+
+declare const Intersect: ObjectDirective<HTMLElement>;
+
+declare const Mutate: ObjectDirective<HTMLElement>;
+
+interface ResizeDirectiveBinding extends Omit<DirectiveBinding, 'modifiers'> {
+    value: () => void;
+    modifiers?: {
+        active?: boolean;
+        quiet?: boolean;
+    };
+}
+declare function mounted$1(el: HTMLElement, binding: ResizeDirectiveBinding): void;
+declare function unmounted$1(el: HTMLElement, binding: ResizeDirectiveBinding): void;
+declare const Resize: {
+    mounted: typeof mounted$1;
+    unmounted: typeof unmounted$1;
+};
+
+declare const Ripple: ObjectDirective;
+
+interface ScrollDirectiveBinding extends Omit<DirectiveBinding, 'modifiers'> {
+    value: EventListener | {
+        handler: EventListener;
+        options?: AddEventListenerOptions;
+    } | EventListenerObject & {
+        options?: AddEventListenerOptions;
+    };
+    modifiers?: {
+        self?: boolean;
+    };
+}
+declare function mounted(el: HTMLElement, binding: ScrollDirectiveBinding): void;
+declare function unmounted(el: HTMLElement, binding: ScrollDirectiveBinding): void;
+declare function updated(el: HTMLElement, binding: ScrollDirectiveBinding): void;
+declare const Scroll: {
+    mounted: typeof mounted;
+    unmounted: typeof unmounted;
+    updated: typeof updated;
+};
+
+declare const Touch: ObjectDirective;
+
+export { ClickOutside, Intersect, Mutate, Resize, Ripple, Scroll, Touch };

package/lib/directives/index.mjs

@@ -1,7 +1,7 @@
 export { ClickOutside } from "./click-outside/index.mjs"; // export { Color } from './color'
 
-export { Intersect } from "./intersect/index.mjs"; // export { Mutate } from './mutate'
-
+export { Intersect } from "./intersect/index.mjs";
+export { Mutate } from "./mutate/index.mjs";
 export { Resize } from "./resize/index.mjs";
 export { Ripple } from "./ripple/index.mjs";
 export { Scroll } from "./scroll/index.mjs";

package/lib/directives/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/directives/index.ts"],"names":["ClickOutside","Intersect","Resize","Ripple","Scroll","Touch"],"mappings":"SAASA,Y,qCACT;;SACSC,S,iCACT;;SACSC,M;SACAC,M;SACAC,M;SACAC,K","sourcesContent":["export { ClickOutside } from './click-outside'\n// export { Color } from './color'\nexport { Intersect } from './intersect'\n// export { Mutate } from './mutate'\nexport { Resize } from './resize'\nexport { Ripple } from './ripple'\nexport { Scroll } from './scroll'\nexport { Touch } from './touch'\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../src/directives/index.ts"],"names":["ClickOutside","Intersect","Mutate","Resize","Ripple","Scroll","Touch"],"mappings":"SAASA,Y,qCACT;;SACSC,S;SACAC,M;SACAC,M;SACAC,M;SACAC,M;SACAC,K","sourcesContent":["export { ClickOutside } from './click-outside'\n// export { Color } from './color'\nexport { Intersect } from './intersect'\nexport { Mutate } from './mutate'\nexport { Resize } from './resize'\nexport { Ripple } from './ripple'\nexport { Scroll } from './scroll'\nexport { Touch } from './touch'\n"],"file":"index.mjs"}

package/lib/directives/intersect/index.mjs

@@ -1,5 +1,8 @@
-// Types
+// Utils
+import { SUPPORTS_INTERSECTION } from "../../util/index.mjs"; // Types
+
 function mounted(el, binding) {
+  if (!SUPPORTS_INTERSECTION) return;
   const modifiers = binding.modifiers || {};
   const value = binding.value;
   const {
@@ -9,36 +12,40 @@ function mounted(el, binding) {
     handler: value,
     options: {}
   };
-  const observer = new IntersectionObserver((entries = [], observer) => {
-    /* istanbul ignore if */
-    if (!el._observe) return; // Just in case, should never fire
-    // If is not quiet or has already been
+  const observer = new IntersectionObserver(function () {
+    var _el$_observe;
+
+    let entries = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    let observer = arguments.length > 1 ? arguments[1] : undefined;
+
+    const _observe = (_el$_observe = el._observe) == null ? void 0 : _el$_observe[binding.instance.$.uid];
+
+    if (!_observe) return; // Just in case, should never fire
+
+    const isIntersecting = entries.some(entry => entry.isIntersecting); // If is not quiet or has already been
     // initted, invoke the user callback
 
-    if (handler && (!modifiers.quiet || el._observe.init)) {
-      const isIntersecting = Boolean(entries.find(entry => entry.isIntersecting));
+    if (handler && (!modifiers.quiet || _observe.init) && (!modifiers.once || isIntersecting || _observe.init)) {
       handler(isIntersecting, entries, observer);
-    } // If has already been initted and
-    // has the once modifier, unbind
-
+    }
 
-    if (el._observe.init && modifiers.once) unmounted(el); // Otherwise, mark the observer as initted
-    else el._observe.init = true;
+    if (isIntersecting && modifiers.once) unmounted(el, binding);else _observe.init = true;
   }, options);
-  el._observe = {
+  el._observe = Object(el._observe);
+  el._observe[binding.instance.$.uid] = {
     init: false,
     observer
   };
   observer.observe(el);
 }
 
-function unmounted(el) {
-  /* istanbul ignore if */
-  if (!el._observe) return;
-
-  el._observe.observer.unobserve(el);
+function unmounted(el, binding) {
+  var _el$_observe2;
 
-  delete el._observe;
+  const observe = (_el$_observe2 = el._observe) == null ? void 0 : _el$_observe2[binding.instance.$.uid];
+  if (!observe) return;
+  observe.observer.unobserve(el);
+  delete el._observe[binding.instance.$.uid];
 }
 
 export const Intersect = {

package/lib/directives/intersect/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/directives/intersect/index.ts"],"names":["mounted","el","binding","modifiers","value","handler","options","observer","IntersectionObserver","entries","_observe","quiet","init","isIntersecting","Boolean","find","entry","once","unmounted","observe","unobserve","Intersect"],"mappings":"AAAA;AAoBA,SAASA,OAAT,CAAkBC,EAAlB,EAAmCC,OAAnC,EAAqE;AACnE,QAAMC,SAAS,GAAGD,OAAO,CAACC,SAAR,IAAqB,EAAvC;AACA,QAAMC,KAAK,GAAGF,OAAO,CAACE,KAAtB;AACA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAAuB,OAAOF,KAAP,KAAiB,QAAjB,GACzBA,KADyB,GAEzB;AAAEC,IAAAA,OAAO,EAAED,KAAX;AAAkBE,IAAAA,OAAO,EAAE;AAA3B,GAFJ;AAIA,QAAMC,QAAQ,GAAG,IAAIC,oBAAJ,CAAyB,CACxCC,OAAoC,GAAG,EADC,EAExCF,QAFwC,KAGrC;AACH;AACA,QAAI,CAACN,EAAE,CAACS,QAAR,EAAkB,OAFf,CAEsB;AAEzB;AACA;;AACA,QACEL,OAAO,KACL,CAACF,SAAS,CAACQ,KAAX,IACAV,EAAE,CAACS,QAAH,CAAYE,IAFP,CADT,EAKE;AACA,YAAMC,cAAc,GAAGC,OAAO,CAACL,OAAO,CAACM,IAAR,CAAaC,KAAK,IAAIA,KAAK,CAACH,cAA5B,CAAD,CAA9B;AAEAR,MAAAA,OAAO,CAACQ,cAAD,EAAiBJ,OAAjB,EAA0BF,QAA1B,CAAP;AACD,KAfE,CAiBH;AACA;;;AACA,QAAIN,EAAE,CAACS,QAAH,CAAYE,IAAZ,IAAoBT,SAAS,CAACc,IAAlC,EAAwCC,SAAS,CAACjB,EAAD,CAAT,CAAxC,CACA;AADA,SAEMA,EAAE,CAACS,QAAH,CAAYE,IAAZ,GAAmB,IAApB;AACN,GAzBgB,EAyBdN,OAzBc,CAAjB;AA2BAL,EAAAA,EAAE,CAACS,QAAH,GAAc;AAAEE,IAAAA,IAAI,EAAE,KAAR;AAAeL,IAAAA;AAAf,GAAd;AAEAA,EAAAA,QAAQ,CAACY,OAAT,CAAiBlB,EAAjB;AACD;;AAED,SAASiB,SAAT,CAAoBjB,EAApB,EAAqC;AACnC;AACA,MAAI,CAACA,EAAE,CAACS,QAAR,EAAkB;;AAElBT,EAAAA,EAAE,CAACS,QAAH,CAAYH,QAAZ,CAAqBa,SAArB,CAA+BnB,EAA/B;;AACA,SAAOA,EAAE,CAACS,QAAV;AACD;;AAED,OAAO,MAAMW,SAAuC,GAAG;AACrDrB,EAAAA,OADqD;AAErDkB,EAAAA;AAFqD,CAAhD;AAKP,eAAeG,SAAf","sourcesContent":["// Types\nimport type {\n  DirectiveBinding,\n  ObjectDirective,\n} from 'vue'\n\ntype ObserveHandler = (\n  isIntersecting: boolean,\n  entries: IntersectionObserverEntry[],\n  observer: IntersectionObserver,\n) => void\n\nexport interface ObserveDirectiveBinding extends Omit<DirectiveBinding, 'modifiers'> {\n  value: ObserveHandler | { handler: ObserveHandler, options?: IntersectionObserverInit }\n  modifiers: {\n    once?: boolean\n    quiet?: boolean\n  }\n}\n\nfunction mounted (el: HTMLElement, binding: ObserveDirectiveBinding) {\n  const modifiers = binding.modifiers || {}\n  const value = binding.value\n  const { handler, options } = typeof value === 'object'\n    ? value\n    : { handler: value, options: {} }\n\n  const observer = new IntersectionObserver((\n    entries: IntersectionObserverEntry[] = [],\n    observer: IntersectionObserver\n  ) => {\n    /* istanbul ignore if */\n    if (!el._observe) return // Just in case, should never fire\n\n    // If is not quiet or has already been\n    // initted, invoke the user callback\n    if (\n      handler && (\n        !modifiers.quiet ||\n        el._observe.init\n      )\n    ) {\n      const isIntersecting = Boolean(entries.find(entry => entry.isIntersecting))\n\n      handler(isIntersecting, entries, observer)\n    }\n\n    // If has already been initted and\n    // has the once modifier, unbind\n    if (el._observe.init && modifiers.once) unmounted(el)\n    // Otherwise, mark the observer as initted\n    else (el._observe.init = true)\n  }, options)\n\n  el._observe = { init: false, observer }\n\n  observer.observe(el)\n}\n\nfunction unmounted (el: HTMLElement) {\n  /* istanbul ignore if */\n  if (!el._observe) return\n\n  el._observe.observer.unobserve(el)\n  delete el._observe\n}\n\nexport const Intersect: ObjectDirective<HTMLElement> = {\n  mounted,\n  unmounted,\n}\n\nexport default Intersect\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/directives/intersect/index.ts"],"names":["SUPPORTS_INTERSECTION","mounted","el","binding","modifiers","value","handler","options","observer","IntersectionObserver","entries","_observe","instance","$","uid","isIntersecting","some","entry","quiet","init","once","unmounted","Object","observe","unobserve","Intersect"],"mappings":"AAAA;SACSA,qB,gCAET;;AAoBA,SAASC,OAAT,CAAkBC,EAAlB,EAAmCC,OAAnC,EAAqE;AACnE,MAAI,CAACH,qBAAL,EAA4B;AAE5B,QAAMI,SAAS,GAAGD,OAAO,CAACC,SAAR,IAAqB,EAAvC;AACA,QAAMC,KAAK,GAAGF,OAAO,CAACE,KAAtB;AACA,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAAuB,OAAOF,KAAP,KAAiB,QAAjB,GACzBA,KADyB,GAEzB;AAAEC,IAAAA,OAAO,EAAED,KAAX;AAAkBE,IAAAA,OAAO,EAAE;AAA3B,GAFJ;AAIA,QAAMC,QAAQ,GAAG,IAAIC,oBAAJ,CAAyB,YAGrC;AAAA;;AAAA,QAFHC,OAEG,uEAFoC,EAEpC;AAAA,QADHF,QACG;;AACH,UAAMG,QAAQ,mBAAGT,EAAE,CAACS,QAAN,qBAAG,aAAcR,OAAO,CAACS,QAAR,CAAkBC,CAAlB,CAAoBC,GAAlC,CAAjB;;AACA,QAAI,CAACH,QAAL,EAAe,OAFZ,CAEmB;;AAEtB,UAAMI,cAAc,GAAGL,OAAO,CAACM,IAAR,CAAaC,KAAK,IAAIA,KAAK,CAACF,cAA5B,CAAvB,CAJG,CAMH;AACA;;AACA,QACET,OAAO,KACL,CAACF,SAAS,CAACc,KAAX,IACAP,QAAQ,CAACQ,IAFJ,CAAP,KAIE,CAACf,SAAS,CAACgB,IAAX,IACAL,cADA,IAEAJ,QAAQ,CAACQ,IANX,CADF,EASE;AACAb,MAAAA,OAAO,CAACS,cAAD,EAAiBL,OAAjB,EAA0BF,QAA1B,CAAP;AACD;;AAED,QAAIO,cAAc,IAAIX,SAAS,CAACgB,IAAhC,EAAsCC,SAAS,CAACnB,EAAD,EAAKC,OAAL,CAAT,CAAtC,KACKQ,QAAQ,CAACQ,IAAT,GAAgB,IAAhB;AACN,GA1BgB,EA0BdZ,OA1Bc,CAAjB;AA4BAL,EAAAA,EAAE,CAACS,QAAH,GAAcW,MAAM,CAACpB,EAAE,CAACS,QAAJ,CAApB;AACAT,EAAAA,EAAE,CAACS,QAAH,CAAaR,OAAO,CAACS,QAAR,CAAkBC,CAAlB,CAAoBC,GAAjC,IAAwC;AAAEK,IAAAA,IAAI,EAAE,KAAR;AAAeX,IAAAA;AAAf,GAAxC;AAEAA,EAAAA,QAAQ,CAACe,OAAT,CAAiBrB,EAAjB;AACD;;AAED,SAASmB,SAAT,CAAoBnB,EAApB,EAAqCC,OAArC,EAAuE;AAAA;;AACrE,QAAMoB,OAAO,oBAAGrB,EAAE,CAACS,QAAN,qBAAG,cAAcR,OAAO,CAACS,QAAR,CAAkBC,CAAlB,CAAoBC,GAAlC,CAAhB;AACA,MAAI,CAACS,OAAL,EAAc;AAEdA,EAAAA,OAAO,CAACf,QAAR,CAAiBgB,SAAjB,CAA2BtB,EAA3B;AACA,SAAOA,EAAE,CAACS,QAAH,CAAaR,OAAO,CAACS,QAAR,CAAkBC,CAAlB,CAAoBC,GAAjC,CAAP;AACD;;AAED,OAAO,MAAMW,SAAuC,GAAG;AACrDxB,EAAAA,OADqD;AAErDoB,EAAAA;AAFqD,CAAhD;AAKP,eAAeI,SAAf","sourcesContent":["// Utils\nimport { SUPPORTS_INTERSECTION } from '@/util'\n\n// Types\nimport type {\n  DirectiveBinding,\n  ObjectDirective,\n} from 'vue'\n\ntype ObserveHandler = (\n  isIntersecting: boolean,\n  entries: IntersectionObserverEntry[],\n  observer: IntersectionObserver,\n) => void\n\nexport interface ObserveDirectiveBinding extends Omit<DirectiveBinding, 'modifiers' | 'value'> {\n  value?: ObserveHandler | { handler: ObserveHandler, options?: IntersectionObserverInit }\n  modifiers: {\n    once?: boolean\n    quiet?: boolean\n  }\n}\n\nfunction mounted (el: HTMLElement, binding: ObserveDirectiveBinding) {\n  if (!SUPPORTS_INTERSECTION) return\n\n  const modifiers = binding.modifiers || {}\n  const value = binding.value\n  const { handler, options } = typeof value === 'object'\n    ? value\n    : { handler: value, options: {} }\n\n  const observer = new IntersectionObserver((\n    entries: IntersectionObserverEntry[] = [],\n    observer: IntersectionObserver\n  ) => {\n    const _observe = el._observe?.[binding.instance!.$.uid]\n    if (!_observe) return // Just in case, should never fire\n\n    const isIntersecting = entries.some(entry => entry.isIntersecting)\n\n    // If is not quiet or has already been\n    // initted, invoke the user callback\n    if (\n      handler && (\n        !modifiers.quiet ||\n        _observe.init\n      ) && (\n        !modifiers.once ||\n        isIntersecting ||\n        _observe.init\n      )\n    ) {\n      handler(isIntersecting, entries, observer)\n    }\n\n    if (isIntersecting && modifiers.once) unmounted(el, binding)\n    else _observe.init = true\n  }, options)\n\n  el._observe = Object(el._observe)\n  el._observe![binding.instance!.$.uid] = { init: false, observer }\n\n  observer.observe(el)\n}\n\nfunction unmounted (el: HTMLElement, binding: ObserveDirectiveBinding) {\n  const observe = el._observe?.[binding.instance!.$.uid]\n  if (!observe) return\n\n  observe.observer.unobserve(el)\n  delete el._observe![binding.instance!.$.uid]\n}\n\nexport const Intersect: ObjectDirective<HTMLElement> = {\n  mounted,\n  unmounted,\n}\n\nexport default Intersect\n"],"file":"index.mjs"}