npm - vue-datocms - Versions diffs - 4.0.1 → 4.0.3 - Mend

vue-datocms 4.0.1 → 4.0.3

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.

Files changed (5) hide show

package/README.md CHANGED Viewed

@@ -1,8 +1,8 @@
 # vue-datocms
-![MIT](https://img.shields.io/npm/l/vue-datocms?style=for-the-badge) ![NPM](https://img.shields.io/npm/v/vue-datocms?style=for-the-badge) [![Build Status](https://img.shields.io/github/workflow/status/datocms/vue-datocms/Node.js%20CI?style=for-the-badge)](https://github.com/datocms/vue-datocms/actions/workflows/node.js.yml)
+![MIT](https://img.shields.io/npm/l/vue-datocms?style=for-the-badge) ![NPM](https://img.shields.io/npm/v/vue-datocms?style=for-the-badge) [![Build Status](https://img.shields.io/github/actions/workflow/status/datocms/vue-datocms/node.js.yml?branch=master&style=for-the-badge)](https://github.com/datocms/vue-datocms/actions/workflows/node.js.yml)
-A set of components and utilities to work faster with [DatoCMS](https://www.datocms.com/) in Vue.js environments. Integrates seamlessy with [DatoCMS's GraphQL Content Delivery API](https://www.datocms.com/docs/content-delivery-api).
+A set of components and utilities to work faster with [DatoCMS](https://www.datocms.com/) in Vue.js environments. Integrates seamlessly with [DatoCMS's GraphQL Content Delivery API](https://www.datocms.com/docs/content-delivery-api).
 - Works with Vue 3 and Vue 2;
 - TypeScript ready;
@@ -43,9 +43,11 @@ Helpers:
 ## Installation
 ```
+# First, install Vue
+npm install vue
+# Then install vue-datocms
 npm install vue-datocms
 ```
 ## Development
 This repository contains a number of examples. You can use them to locally test your changes to the package:

package/dist/index.cjs.js CHANGED Viewed

@@ -50,6 +50,22 @@ const useInView = ({ threshold, rootMargin }) => {
   return { inView, elRef };
 };
+var __defProp$4 = Object.defineProperty;
+var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$4 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$4.call(b, prop))
+      __defNormalProp$4(a, prop, b[prop]);
+  if (__getOwnPropSymbols$4)
+    for (var prop of __getOwnPropSymbols$4(b)) {
+      if (__propIsEnum$4.call(b, prop))
+        __defNormalProp$4(a, prop, b[prop]);
+    }
+  return a;
+};
 const Source = vueDemi.defineComponent({
   props: {
     srcset: {
@@ -63,23 +79,36 @@ const Source = vueDemi.defineComponent({
     }
   },
   setup({ srcset, sizes, type }) {
-    return () => vueDemi.h("source", {
-      ...vueDemi.isVue2 && {
-        attrs: {
-          srcset,
-          sizes,
-          type
-        }
-      },
-      ...vueDemi.isVue3 && {
+    return () => vueDemi.h("source", __spreadValues$4(__spreadValues$4({}, vueDemi.isVue2 && {
+      attrs: {
         srcset,
         sizes,
         type
       }
-    });
+    }), vueDemi.isVue3 && {
+      srcset,
+      sizes,
+      type
+    }));
   }
 });
+var __defProp$3 = Object.defineProperty;
+var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$3 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$3.call(b, prop))
+      __defNormalProp$3(a, prop, b[prop]);
+  if (__getOwnPropSymbols$3)
+    for (var prop of __getOwnPropSymbols$3(b)) {
+      if (__propIsEnum$3.call(b, prop))
+        __defNormalProp$3(a, prop, b[prop]);
+    }
+  return a;
+};
 const universalBtoa = (str) => isSsr() ? Buffer.from(str.toString(), "binary").toString("base64") : window.btoa(str);
 const Sizer = vueDemi.defineComponent({
   props: {
@@ -102,27 +131,43 @@ const Sizer = vueDemi.defineComponent({
   },
   setup({ sizerClass, sizerStyle, width, height, explicitWidth }) {
     const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}"></svg>`;
-    return () => vueDemi.h("img", {
+    return () => vueDemi.h("img", __spreadValues$3(__spreadValues$3({
       class: sizerClass,
-      style: {
+      style: __spreadValues$3({
         display: "block",
-        width: explicitWidth ? `${width}px` : "100%",
-        ...sizerStyle
-      },
-      ...vueDemi.isVue2 && {
-        attrs: {
-          src: `data:image/svg+xml;base64,${universalBtoa(svg)}`,
-          role: "presentation"
-        }
-      },
-      ...vueDemi.isVue3 && {
+        width: explicitWidth ? `${width}px` : "100%"
+      }, sizerStyle)
+    }, vueDemi.isVue2 && {
+      attrs: {
         src: `data:image/svg+xml;base64,${universalBtoa(svg)}`,
         role: "presentation"
       }
-    });
+    }), vueDemi.isVue3 && {
+      src: `data:image/svg+xml;base64,${universalBtoa(svg)}`,
+      role: "presentation"
+    }));
   }
 });
+var __defProp$2 = Object.defineProperty;
+var __defProps$2 = Object.defineProperties;
+var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$2.call(b, prop))
+      __defNormalProp$2(a, prop, b[prop]);
+  if (__getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(b)) {
+      if (__propIsEnum$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 const escape = (s) => {
   s = "" + s;
   s = s.replace(/&/g, "&amp;");
@@ -318,6 +363,7 @@ const Image = vueDemi.defineComponent({
     };
   },
   render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
     const addImage = imageAddStrategy({
       lazyLoad: this.computedLazyLoad,
       inView: this.inView,
@@ -328,34 +374,29 @@ const Image = vueDemi.defineComponent({
       inView: this.inView,
       loaded: this.loaded
     });
-    const webpSource = this.data.webpSrcSet && vueDemi.h(Source, {
-      ...vueDemi.isVue2 && {
-        props: {
-          srcset: this.data.webpSrcSet,
-          sizes: this.sizes ?? this.data.sizes ?? void 0,
-          type: "image/webp"
-        }
-      },
-      ...vueDemi.isVue3 && {
+    const webpSource = this.data.webpSrcSet && vueDemi.h(Source, __spreadValues$2(__spreadValues$2({}, vueDemi.isVue2 && {
+      props: {
         srcset: this.data.webpSrcSet,
-        sizes: this.sizes ?? this.data.sizes ?? void 0,
+        sizes: (_b = (_a = this.sizes) != null ? _a : this.data.sizes) != null ? _b : void 0,
         type: "image/webp"
       }
-    });
-    const regularSource = this.data.srcSet && vueDemi.h(Source, {
-      ...vueDemi.isVue2 && {
-        props: {
-          srcset: this.data.srcSet ?? buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
-          sizes: this.sizes ?? this.data.sizes ?? void 0
-        }
-      },
-      ...vueDemi.isVue3 && {
-        srcset: this.data.srcSet ?? buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
-        sizes: this.sizes ?? this.data.sizes ?? void 0
+    }), vueDemi.isVue3 && {
+      srcset: this.data.webpSrcSet,
+      sizes: (_d = (_c = this.sizes) != null ? _c : this.data.sizes) != null ? _d : void 0,
+      type: "image/webp"
+    }));
+    const regularSource = this.data.srcSet && vueDemi.h(Source, __spreadValues$2(__spreadValues$2({}, vueDemi.isVue2 && {
+      props: {
+        srcset: (_e = this.data.srcSet) != null ? _e : buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
+        sizes: (_g = (_f = this.sizes) != null ? _f : this.data.sizes) != null ? _g : void 0
       }
-    });
+    }), vueDemi.isVue3 && {
+      srcset: (_h = this.data.srcSet) != null ? _h : buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
+      sizes: (_j = (_i = this.sizes) != null ? _i : this.data.sizes) != null ? _j : void 0
+    }));
     const transition = typeof this.fadeInDuration === "undefined" || this.fadeInDuration > 0 ? `opacity ${this.fadeInDuration || 500}ms ${this.fadeInDuration || 500}ms` : void 0;
     const placeholder = this.usePlaceholder && (this.data.bgColor || this.data.base64) ? vueDemi.h("div", {
+      "aria-hidden": "true",
       style: {
         backgroundImage: this.data.base64 ? `url(${this.data.base64})` : null,
         backgroundColor: this.data.bgColor,
@@ -372,34 +413,29 @@ const Image = vueDemi.defineComponent({
       }
     }) : null;
     const { width, aspectRatio } = this.data;
-    const height = this.data.height ?? (aspectRatio ? width / aspectRatio : 0);
-    const sizer = this.layout !== "fill" ? vueDemi.h(Sizer, {
-      ...vueDemi.isVue2 && {
-        props: {
-          sizerClass: this.pictureClass,
-          sizerStyle: this.pictureStyle,
-          width,
-          height,
-          explicitWidth: this.explicitWidth
-        }
-      },
-      ...vueDemi.isVue3 && {
+    const height = (_k = this.data.height) != null ? _k : aspectRatio ? width / aspectRatio : 0;
+    const sizer = this.layout !== "fill" ? vueDemi.h(Sizer, __spreadValues$2(__spreadValues$2({}, vueDemi.isVue2 && {
+      props: {
         sizerClass: this.pictureClass,
         sizerStyle: this.pictureStyle,
         width,
         height,
         explicitWidth: this.explicitWidth
       }
-    }) : null;
+    }), vueDemi.isVue3 && {
+      sizerClass: this.pictureClass,
+      sizerStyle: this.pictureStyle,
+      width,
+      height,
+      explicitWidth: this.explicitWidth
+    })) : null;
     return vueDemi.h(
       "div",
       {
-        style: {
+        style: __spreadValues$2(__spreadValues$2({
           display: this.explicitWidth ? "inline-block" : "block",
-          overflow: "hidden",
-          ...this.layout === "fill" ? absolutePositioning : this.layout === "intrinsic" ? { position: "relative", width: "100%", maxWidth: `${width}px` } : this.layout === "fixed" ? { position: "relative", width: `${width}px` } : { position: "relative" },
-          ...this.rootStyle
-        },
+          overflow: "hidden"
+        }, this.layout === "fill" ? absolutePositioning : this.layout === "intrinsic" ? { position: "relative", width: "100%", maxWidth: `${width}px` } : this.layout === "fixed" ? { position: "relative", width: `${width}px` } : { position: "relative" }), this.rootStyle),
         ref: "elRef"
       },
       [
@@ -408,68 +444,36 @@ const Image = vueDemi.defineComponent({
         addImage && vueDemi.h("picture", null, [
           webpSource,
           regularSource,
-          this.data.src && vueDemi.h("img", {
-            ...vueDemi.isVue2 && {
-              attrs: {
-                src: this.data.src,
-                alt: this.data.alt,
-                title: this.data.title,
-                fetchpriority: this.priority ? "high" : void 0
-              },
-              on: {
-                load: this.handleLoad
-              }
-            },
-            ...vueDemi.isVue3 && {
+          this.data.src && vueDemi.h("img", __spreadProps$2(__spreadValues$2(__spreadValues$2({}, vueDemi.isVue2 && {
+            attrs: {
               src: this.data.src,
               alt: this.data.alt,
               title: this.data.title,
-              fetchpriority: this.priority ? "high" : void 0,
-              onLoad: this.handleLoad
+              fetchpriority: this.priority ? "high" : void 0
             },
+            on: {
+              load: this.handleLoad
+            }
+          }), vueDemi.isVue3 && {
+            src: this.data.src,
+            alt: this.data.alt,
+            title: this.data.title,
+            fetchpriority: this.priority ? "high" : void 0,
+            onLoad: this.handleLoad
+          }), {
             ref: "imageRef",
             class: this.pictureClass,
-            style: {
+            style: __spreadValues$2(__spreadProps$2(__spreadValues$2({
               opacity: showImage ? 1 : 0,
-              transition,
-              ...absolutePositioning,
+              transition
+            }, absolutePositioning), {
               objectFit: this.objectFit,
-              objectPosition: this.objectPosition,
-              ...this.pictureStyle
-            }
-          })
+              objectPosition: this.objectPosition
+            }), this.pictureStyle)
+          }))
         ]),
-        vueDemi.h("noscript", {
-          ...vueDemi.isVue2 && {
-            domProps: {
-              innerHTML: tag("picture", {}, [
-                this.data.webpSrcSet && tag("source", {
-                  srcset: this.data.webpSrcSet,
-                  sizes: this.data.sizes,
-                  type: "image/webp"
-                }),
-                this.data.srcSet && tag("source", {
-                  srcset: this.data.srcSet,
-                  sizes: this.data.sizes
-                }),
-                tag("img", {
-                  src: this.data.src,
-                  alt: this.data.alt,
-                  title: this.data.title,
-                  class: this.pictureClass,
-                  style: toCss({
-                    ...absolutePositioning,
-                    objectFit: this.objectFit,
-                    objectPosition: this.objectPosition,
-                    ...this.pictureStyle
-                  }),
-                  loading: this.computedLazyLoad ? "lazy" : void 0,
-                  fetchpriority: this.priority ? "high" : void 0
-                })
-              ])
-            }
-          },
-          ...vueDemi.isVue3 && {
+        vueDemi.h("noscript", __spreadValues$2(__spreadValues$2({}, vueDemi.isVue2 && {
+          domProps: {
             innerHTML: tag("picture", {}, [
               this.data.webpSrcSet && tag("source", {
                 srcset: this.data.webpSrcSet,
@@ -485,13 +489,37 @@ const Image = vueDemi.defineComponent({
                 alt: this.data.alt,
                 title: this.data.title,
                 class: this.pictureClass,
-                style: toCss({ ...this.pictureStyle, ...absolutePositioning }),
+                style: toCss(__spreadValues$2(__spreadProps$2(__spreadValues$2({}, absolutePositioning), {
+                  objectFit: this.objectFit,
+                  objectPosition: this.objectPosition
+                }), this.pictureStyle)),
                 loading: this.computedLazyLoad ? "lazy" : void 0,
                 fetchpriority: this.priority ? "high" : void 0
               })
             ])
           }
-        })
+        }), vueDemi.isVue3 && {
+          innerHTML: tag("picture", {}, [
+            this.data.webpSrcSet && tag("source", {
+              srcset: this.data.webpSrcSet,
+              sizes: this.data.sizes,
+              type: "image/webp"
+            }),
+            this.data.srcSet && tag("source", {
+              srcset: this.data.srcSet,
+              sizes: this.data.sizes
+            }),
+            tag("img", {
+              src: this.data.src,
+              alt: this.data.alt,
+              title: this.data.title,
+              class: this.pictureClass,
+              style: toCss(__spreadValues$2(__spreadValues$2({}, this.pictureStyle), absolutePositioning)),
+              loading: this.computedLazyLoad ? "lazy" : void 0,
+              fetchpriority: this.priority ? "high" : void 0
+            })
+          ])
+        }))
       ]
     );
   }
@@ -663,15 +691,66 @@ const DatocmsStructuredTextPlugin = {
   }
 };
-const useQuerySubscription = ({ enabled = true, initialData, query, token, ...other }) => {
+var __defProp$1 = Object.defineProperty;
+var __defProps$1 = Object.defineProperties;
+var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$1.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __async$1 = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+const useQuerySubscription = (_a) => {
+  var _b = _a, { enabled = true, initialData, query, token } = _b, other = __objRest(_b, ["enabled", "initialData", "query", "token"]);
   const error = vueDemi.ref(null);
   const data = vueDemi.ref(vueDemi.unref(initialData) || null);
   const status = vueDemi.ref(vueDemi.unref(enabled) ? "connecting" : "closed");
   const subscribeToQueryOptions = other;
-  vueDemi.watchEffect(async (onCleanup) => {
+  vueDemi.watchEffect((onCleanup) => __async$1(void 0, null, function* () {
     if (query && token && vueDemi.unref(enabled)) {
-      const unsubscribe = await datocmsListen.subscribeToQuery({
-        ...subscribeToQueryOptions,
+      const unsubscribe = yield datocmsListen.subscribeToQuery(__spreadProps$1(__spreadValues$1({}, subscribeToQueryOptions), {
         query,
         token,
         onStatusChange: (connectionStatus) => {
@@ -685,13 +764,33 @@ const useQuerySubscription = ({ enabled = true, initialData, query, token, ...ot
           data.value = null;
           error.value = errorData;
         }
-      });
+      }));
       onCleanup(unsubscribe);
     }
-  });
+  }));
   return { data, status, error };
 };
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 const highlightPieces = (textWithHighlightMarker) => {
   return textWithHighlightMarker.split(/\[h\](.+?)\[\/h\]/g).map((text, index) => ({
     text,
@@ -699,10 +798,11 @@ const highlightPieces = (textWithHighlightMarker) => {
   }));
 };
 function useSiteSearch(config) {
+  var _a, _b, _c;
   const state = vueDemi.reactive({
-    query: config.initialState?.query || "",
-    page: config.initialState?.page || 0,
-    locale: config.initialState?.locale
+    query: ((_a = config.initialState) == null ? void 0 : _a.query) || "",
+    page: ((_b = config.initialState) == null ? void 0 : _b.page) || 0,
+    locale: (_c = config.initialState) == null ? void 0 : _c.locale
   });
   const error = vueDemi.ref();
   const response = vueDemi.reactive({
@@ -713,7 +813,7 @@ function useSiteSearch(config) {
   const resultsPerPage = config.resultsPerPage || 8;
   vueDemi.watchEffect((onCleanup) => {
     let isCancelled = false;
-    const run = async () => {
+    const run = () => __async(this, null, function* () {
       try {
         if (!state.query) {
           response.data = [];
@@ -734,7 +834,7 @@ function useSiteSearch(config) {
         if (config.fuzzySearch) {
           request.fuzzy = "true";
         }
-        const results = await config.client.searchResults.rawList(request);
+        const results = yield config.client.searchResults.rawList(request);
         if (!isCancelled) {
           response.data = results.data;
           response.meta.total_count = results.meta.total_count;
@@ -749,7 +849,7 @@ function useSiteSearch(config) {
           error.value = "Unknown error!";
         }
       }
-    };
+    });
     run();
     onCleanup(() => {
       isCancelled = true;
@@ -781,6 +881,25 @@ function useSiteSearch(config) {
   };
 }
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const toHead = (...args) => {
   const tags = [].concat(...args);
   const titleTag = tags && tags.find((t) => t.tag === "title");
@@ -788,16 +907,20 @@ const toHead = (...args) => {
   const linkTags = tags ? tags.filter((t) => t.tag === "link") : [];
   return {
     title: titleTag && titleTag.content,
-    meta: metaTags.map((tag) => ({
-      ...tag.attributes,
-      hid: tag.attributes?.name || tag.attributes?.property,
-      vmid: tag.attributes?.name || tag.attributes?.property
-    })),
-    link: linkTags.map((tag) => ({
-      ...tag.attributes,
-      hid: tag.attributes?.name || `${tag.attributes?.rel}-${tag.attributes?.sizes}`,
-      vmid: tag.attributes?.name || `${tag.attributes?.rel}-${tag.attributes?.sizes}`
-    }))
+    meta: metaTags.map((tag) => {
+      var _a, _b, _c, _d;
+      return __spreadProps(__spreadValues({}, tag.attributes), {
+        hid: ((_a = tag.attributes) == null ? void 0 : _a.name) || ((_b = tag.attributes) == null ? void 0 : _b.property),
+        vmid: ((_c = tag.attributes) == null ? void 0 : _c.name) || ((_d = tag.attributes) == null ? void 0 : _d.property)
+      });
+    }),
+    link: linkTags.map((tag) => {
+      var _a, _b, _c, _d, _e, _f;
+      return __spreadProps(__spreadValues({}, tag.attributes), {
+        hid: ((_a = tag.attributes) == null ? void 0 : _a.name) || `${(_b = tag.attributes) == null ? void 0 : _b.rel}-${(_c = tag.attributes) == null ? void 0 : _c.sizes}`,
+        vmid: ((_d = tag.attributes) == null ? void 0 : _d.name) || `${(_e = tag.attributes) == null ? void 0 : _e.rel}-${(_f = tag.attributes) == null ? void 0 : _f.sizes}`
+      });
+    })
   };
 };

package/dist/index.d.ts CHANGED Viewed

@@ -387,7 +387,7 @@ declare type EnabledQueryListenerOptions<QueryResult, QueryVariables> = {
 } & SubscribeToQueryOptions<QueryResult, QueryVariables>;
 declare type DisabledQueryListenerOptions<QueryResult, QueryVariables> = {
     /** Whether the subscription has to be performed or not */
-    enabled: false | Ref<boolean>;
+    enabled: false | Ref<false>;
     /** The initial data to use while the initial request is being performed */
     initialData?: QueryResult;
 } & Partial<SubscribeToQueryOptions<QueryResult, QueryVariables>>;

package/dist/index.esm.mjs CHANGED Viewed

@@ -44,6 +44,22 @@ const useInView = ({ threshold, rootMargin }) => {
   return { inView, elRef };
 };
+var __defProp$4 = Object.defineProperty;
+var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$4 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$4.call(b, prop))
+      __defNormalProp$4(a, prop, b[prop]);
+  if (__getOwnPropSymbols$4)
+    for (var prop of __getOwnPropSymbols$4(b)) {
+      if (__propIsEnum$4.call(b, prop))
+        __defNormalProp$4(a, prop, b[prop]);
+    }
+  return a;
+};
 const Source = defineComponent({
   props: {
     srcset: {
@@ -57,23 +73,36 @@ const Source = defineComponent({
     }
   },
   setup({ srcset, sizes, type }) {
-    return () => h("source", {
-      ...isVue2 && {
-        attrs: {
-          srcset,
-          sizes,
-          type
-        }
-      },
-      ...isVue3 && {
+    return () => h("source", __spreadValues$4(__spreadValues$4({}, isVue2 && {
+      attrs: {
         srcset,
         sizes,
         type
       }
-    });
+    }), isVue3 && {
+      srcset,
+      sizes,
+      type
+    }));
   }
 });
+var __defProp$3 = Object.defineProperty;
+var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$3 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$3.call(b, prop))
+      __defNormalProp$3(a, prop, b[prop]);
+  if (__getOwnPropSymbols$3)
+    for (var prop of __getOwnPropSymbols$3(b)) {
+      if (__propIsEnum$3.call(b, prop))
+        __defNormalProp$3(a, prop, b[prop]);
+    }
+  return a;
+};
 const universalBtoa = (str) => isSsr() ? Buffer.from(str.toString(), "binary").toString("base64") : window.btoa(str);
 const Sizer = defineComponent({
   props: {
@@ -96,27 +125,43 @@ const Sizer = defineComponent({
   },
   setup({ sizerClass, sizerStyle, width, height, explicitWidth }) {
     const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}"></svg>`;
-    return () => h("img", {
+    return () => h("img", __spreadValues$3(__spreadValues$3({
       class: sizerClass,
-      style: {
+      style: __spreadValues$3({
         display: "block",
-        width: explicitWidth ? `${width}px` : "100%",
-        ...sizerStyle
-      },
-      ...isVue2 && {
-        attrs: {
-          src: `data:image/svg+xml;base64,${universalBtoa(svg)}`,
-          role: "presentation"
-        }
-      },
-      ...isVue3 && {
+        width: explicitWidth ? `${width}px` : "100%"
+      }, sizerStyle)
+    }, isVue2 && {
+      attrs: {
         src: `data:image/svg+xml;base64,${universalBtoa(svg)}`,
         role: "presentation"
       }
-    });
+    }), isVue3 && {
+      src: `data:image/svg+xml;base64,${universalBtoa(svg)}`,
+      role: "presentation"
+    }));
   }
 });
+var __defProp$2 = Object.defineProperty;
+var __defProps$2 = Object.defineProperties;
+var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$2.call(b, prop))
+      __defNormalProp$2(a, prop, b[prop]);
+  if (__getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(b)) {
+      if (__propIsEnum$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 const escape = (s) => {
   s = "" + s;
   s = s.replace(/&/g, "&amp;");
@@ -312,6 +357,7 @@ const Image = defineComponent({
     };
   },
   render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
     const addImage = imageAddStrategy({
       lazyLoad: this.computedLazyLoad,
       inView: this.inView,
@@ -322,34 +368,29 @@ const Image = defineComponent({
       inView: this.inView,
       loaded: this.loaded
     });
-    const webpSource = this.data.webpSrcSet && h(Source, {
-      ...isVue2 && {
-        props: {
-          srcset: this.data.webpSrcSet,
-          sizes: this.sizes ?? this.data.sizes ?? void 0,
-          type: "image/webp"
-        }
-      },
-      ...isVue3 && {
+    const webpSource = this.data.webpSrcSet && h(Source, __spreadValues$2(__spreadValues$2({}, isVue2 && {
+      props: {
         srcset: this.data.webpSrcSet,
-        sizes: this.sizes ?? this.data.sizes ?? void 0,
+        sizes: (_b = (_a = this.sizes) != null ? _a : this.data.sizes) != null ? _b : void 0,
         type: "image/webp"
       }
-    });
-    const regularSource = this.data.srcSet && h(Source, {
-      ...isVue2 && {
-        props: {
-          srcset: this.data.srcSet ?? buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
-          sizes: this.sizes ?? this.data.sizes ?? void 0
-        }
-      },
-      ...isVue3 && {
-        srcset: this.data.srcSet ?? buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
-        sizes: this.sizes ?? this.data.sizes ?? void 0
+    }), isVue3 && {
+      srcset: this.data.webpSrcSet,
+      sizes: (_d = (_c = this.sizes) != null ? _c : this.data.sizes) != null ? _d : void 0,
+      type: "image/webp"
+    }));
+    const regularSource = this.data.srcSet && h(Source, __spreadValues$2(__spreadValues$2({}, isVue2 && {
+      props: {
+        srcset: (_e = this.data.srcSet) != null ? _e : buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
+        sizes: (_g = (_f = this.sizes) != null ? _f : this.data.sizes) != null ? _g : void 0
       }
-    });
+    }), isVue3 && {
+      srcset: (_h = this.data.srcSet) != null ? _h : buildSrcSet(this.data.src, this.data.width, this.srcSetCandidates),
+      sizes: (_j = (_i = this.sizes) != null ? _i : this.data.sizes) != null ? _j : void 0
+    }));
     const transition = typeof this.fadeInDuration === "undefined" || this.fadeInDuration > 0 ? `opacity ${this.fadeInDuration || 500}ms ${this.fadeInDuration || 500}ms` : void 0;
     const placeholder = this.usePlaceholder && (this.data.bgColor || this.data.base64) ? h("div", {
+      "aria-hidden": "true",
       style: {
         backgroundImage: this.data.base64 ? `url(${this.data.base64})` : null,
         backgroundColor: this.data.bgColor,
@@ -366,34 +407,29 @@ const Image = defineComponent({
       }
     }) : null;
     const { width, aspectRatio } = this.data;
-    const height = this.data.height ?? (aspectRatio ? width / aspectRatio : 0);
-    const sizer = this.layout !== "fill" ? h(Sizer, {
-      ...isVue2 && {
-        props: {
-          sizerClass: this.pictureClass,
-          sizerStyle: this.pictureStyle,
-          width,
-          height,
-          explicitWidth: this.explicitWidth
-        }
-      },
-      ...isVue3 && {
+    const height = (_k = this.data.height) != null ? _k : aspectRatio ? width / aspectRatio : 0;
+    const sizer = this.layout !== "fill" ? h(Sizer, __spreadValues$2(__spreadValues$2({}, isVue2 && {
+      props: {
         sizerClass: this.pictureClass,
         sizerStyle: this.pictureStyle,
         width,
         height,
         explicitWidth: this.explicitWidth
       }
-    }) : null;
+    }), isVue3 && {
+      sizerClass: this.pictureClass,
+      sizerStyle: this.pictureStyle,
+      width,
+      height,
+      explicitWidth: this.explicitWidth
+    })) : null;
     return h(
       "div",
       {
-        style: {
+        style: __spreadValues$2(__spreadValues$2({
           display: this.explicitWidth ? "inline-block" : "block",
-          overflow: "hidden",
-          ...this.layout === "fill" ? absolutePositioning : this.layout === "intrinsic" ? { position: "relative", width: "100%", maxWidth: `${width}px` } : this.layout === "fixed" ? { position: "relative", width: `${width}px` } : { position: "relative" },
-          ...this.rootStyle
-        },
+          overflow: "hidden"
+        }, this.layout === "fill" ? absolutePositioning : this.layout === "intrinsic" ? { position: "relative", width: "100%", maxWidth: `${width}px` } : this.layout === "fixed" ? { position: "relative", width: `${width}px` } : { position: "relative" }), this.rootStyle),
         ref: "elRef"
       },
       [
@@ -402,68 +438,36 @@ const Image = defineComponent({
         addImage && h("picture", null, [
           webpSource,
           regularSource,
-          this.data.src && h("img", {
-            ...isVue2 && {
-              attrs: {
-                src: this.data.src,
-                alt: this.data.alt,
-                title: this.data.title,
-                fetchpriority: this.priority ? "high" : void 0
-              },
-              on: {
-                load: this.handleLoad
-              }
-            },
-            ...isVue3 && {
+          this.data.src && h("img", __spreadProps$2(__spreadValues$2(__spreadValues$2({}, isVue2 && {
+            attrs: {
               src: this.data.src,
               alt: this.data.alt,
               title: this.data.title,
-              fetchpriority: this.priority ? "high" : void 0,
-              onLoad: this.handleLoad
+              fetchpriority: this.priority ? "high" : void 0
             },
+            on: {
+              load: this.handleLoad
+            }
+          }), isVue3 && {
+            src: this.data.src,
+            alt: this.data.alt,
+            title: this.data.title,
+            fetchpriority: this.priority ? "high" : void 0,
+            onLoad: this.handleLoad
+          }), {
             ref: "imageRef",
             class: this.pictureClass,
-            style: {
+            style: __spreadValues$2(__spreadProps$2(__spreadValues$2({
               opacity: showImage ? 1 : 0,
-              transition,
-              ...absolutePositioning,
+              transition
+            }, absolutePositioning), {
               objectFit: this.objectFit,
-              objectPosition: this.objectPosition,
-              ...this.pictureStyle
-            }
-          })
+              objectPosition: this.objectPosition
+            }), this.pictureStyle)
+          }))
         ]),
-        h("noscript", {
-          ...isVue2 && {
-            domProps: {
-              innerHTML: tag("picture", {}, [
-                this.data.webpSrcSet && tag("source", {
-                  srcset: this.data.webpSrcSet,
-                  sizes: this.data.sizes,
-                  type: "image/webp"
-                }),
-                this.data.srcSet && tag("source", {
-                  srcset: this.data.srcSet,
-                  sizes: this.data.sizes
-                }),
-                tag("img", {
-                  src: this.data.src,
-                  alt: this.data.alt,
-                  title: this.data.title,
-                  class: this.pictureClass,
-                  style: toCss({
-                    ...absolutePositioning,
-                    objectFit: this.objectFit,
-                    objectPosition: this.objectPosition,
-                    ...this.pictureStyle
-                  }),
-                  loading: this.computedLazyLoad ? "lazy" : void 0,
-                  fetchpriority: this.priority ? "high" : void 0
-                })
-              ])
-            }
-          },
-          ...isVue3 && {
+        h("noscript", __spreadValues$2(__spreadValues$2({}, isVue2 && {
+          domProps: {
             innerHTML: tag("picture", {}, [
               this.data.webpSrcSet && tag("source", {
                 srcset: this.data.webpSrcSet,
@@ -479,13 +483,37 @@ const Image = defineComponent({
                 alt: this.data.alt,
                 title: this.data.title,
                 class: this.pictureClass,
-                style: toCss({ ...this.pictureStyle, ...absolutePositioning }),
+                style: toCss(__spreadValues$2(__spreadProps$2(__spreadValues$2({}, absolutePositioning), {
+                  objectFit: this.objectFit,
+                  objectPosition: this.objectPosition
+                }), this.pictureStyle)),
                 loading: this.computedLazyLoad ? "lazy" : void 0,
                 fetchpriority: this.priority ? "high" : void 0
               })
             ])
           }
-        })
+        }), isVue3 && {
+          innerHTML: tag("picture", {}, [
+            this.data.webpSrcSet && tag("source", {
+              srcset: this.data.webpSrcSet,
+              sizes: this.data.sizes,
+              type: "image/webp"
+            }),
+            this.data.srcSet && tag("source", {
+              srcset: this.data.srcSet,
+              sizes: this.data.sizes
+            }),
+            tag("img", {
+              src: this.data.src,
+              alt: this.data.alt,
+              title: this.data.title,
+              class: this.pictureClass,
+              style: toCss(__spreadValues$2(__spreadValues$2({}, this.pictureStyle), absolutePositioning)),
+              loading: this.computedLazyLoad ? "lazy" : void 0,
+              fetchpriority: this.priority ? "high" : void 0
+            })
+          ])
+        }))
       ]
     );
   }
@@ -657,15 +685,66 @@ const DatocmsStructuredTextPlugin = {
   }
 };
-const useQuerySubscription = ({ enabled = true, initialData, query, token, ...other }) => {
+var __defProp$1 = Object.defineProperty;
+var __defProps$1 = Object.defineProperties;
+var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$1.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __async$1 = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+const useQuerySubscription = (_a) => {
+  var _b = _a, { enabled = true, initialData, query, token } = _b, other = __objRest(_b, ["enabled", "initialData", "query", "token"]);
   const error = ref(null);
   const data = ref(unref(initialData) || null);
   const status = ref(unref(enabled) ? "connecting" : "closed");
   const subscribeToQueryOptions = other;
-  watchEffect(async (onCleanup) => {
+  watchEffect((onCleanup) => __async$1(void 0, null, function* () {
     if (query && token && unref(enabled)) {
-      const unsubscribe = await subscribeToQuery({
-        ...subscribeToQueryOptions,
+      const unsubscribe = yield subscribeToQuery(__spreadProps$1(__spreadValues$1({}, subscribeToQueryOptions), {
         query,
         token,
         onStatusChange: (connectionStatus) => {
@@ -679,13 +758,33 @@ const useQuerySubscription = ({ enabled = true, initialData, query, token, ...ot
           data.value = null;
           error.value = errorData;
         }
-      });
+      }));
       onCleanup(unsubscribe);
     }
-  });
+  }));
   return { data, status, error };
 };
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 const highlightPieces = (textWithHighlightMarker) => {
   return textWithHighlightMarker.split(/\[h\](.+?)\[\/h\]/g).map((text, index) => ({
     text,
@@ -693,10 +792,11 @@ const highlightPieces = (textWithHighlightMarker) => {
   }));
 };
 function useSiteSearch(config) {
+  var _a, _b, _c;
   const state = reactive({
-    query: config.initialState?.query || "",
-    page: config.initialState?.page || 0,
-    locale: config.initialState?.locale
+    query: ((_a = config.initialState) == null ? void 0 : _a.query) || "",
+    page: ((_b = config.initialState) == null ? void 0 : _b.page) || 0,
+    locale: (_c = config.initialState) == null ? void 0 : _c.locale
   });
   const error = ref();
   const response = reactive({
@@ -707,7 +807,7 @@ function useSiteSearch(config) {
   const resultsPerPage = config.resultsPerPage || 8;
   watchEffect((onCleanup) => {
     let isCancelled = false;
-    const run = async () => {
+    const run = () => __async(this, null, function* () {
       try {
         if (!state.query) {
           response.data = [];
@@ -728,7 +828,7 @@ function useSiteSearch(config) {
         if (config.fuzzySearch) {
           request.fuzzy = "true";
         }
-        const results = await config.client.searchResults.rawList(request);
+        const results = yield config.client.searchResults.rawList(request);
         if (!isCancelled) {
           response.data = results.data;
           response.meta.total_count = results.meta.total_count;
@@ -743,7 +843,7 @@ function useSiteSearch(config) {
           error.value = "Unknown error!";
         }
       }
-    };
+    });
     run();
     onCleanup(() => {
       isCancelled = true;
@@ -775,6 +875,25 @@ function useSiteSearch(config) {
   };
 }
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const toHead = (...args) => {
   const tags = [].concat(...args);
   const titleTag = tags && tags.find((t) => t.tag === "title");
@@ -782,16 +901,20 @@ const toHead = (...args) => {
   const linkTags = tags ? tags.filter((t) => t.tag === "link") : [];
   return {
     title: titleTag && titleTag.content,
-    meta: metaTags.map((tag) => ({
-      ...tag.attributes,
-      hid: tag.attributes?.name || tag.attributes?.property,
-      vmid: tag.attributes?.name || tag.attributes?.property
-    })),
-    link: linkTags.map((tag) => ({
-      ...tag.attributes,
-      hid: tag.attributes?.name || `${tag.attributes?.rel}-${tag.attributes?.sizes}`,
-      vmid: tag.attributes?.name || `${tag.attributes?.rel}-${tag.attributes?.sizes}`
-    }))
+    meta: metaTags.map((tag) => {
+      var _a, _b, _c, _d;
+      return __spreadProps(__spreadValues({}, tag.attributes), {
+        hid: ((_a = tag.attributes) == null ? void 0 : _a.name) || ((_b = tag.attributes) == null ? void 0 : _b.property),
+        vmid: ((_c = tag.attributes) == null ? void 0 : _c.name) || ((_d = tag.attributes) == null ? void 0 : _d.property)
+      });
+    }),
+    link: linkTags.map((tag) => {
+      var _a, _b, _c, _d, _e, _f;
+      return __spreadProps(__spreadValues({}, tag.attributes), {
+        hid: ((_a = tag.attributes) == null ? void 0 : _a.name) || `${(_b = tag.attributes) == null ? void 0 : _b.rel}-${(_c = tag.attributes) == null ? void 0 : _c.sizes}`,
+        vmid: ((_d = tag.attributes) == null ? void 0 : _d.name) || `${(_e = tag.attributes) == null ? void 0 : _e.rel}-${(_f = tag.attributes) == null ? void 0 : _f.sizes}`
+      });
+    })
   };
 };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "vue-datocms",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "description": "A set of components and utilities to work faster with DatoCMS in Vue.js environments",
   "keywords": [
     "datocms",
@@ -46,7 +46,7 @@
   },
   "peerDependencies": {
     "@vue/composition-api": "^1.7.1",
-    "vue": "^2.0.0 || >=3.0.0"
+    "vue": ">= 2.5 < 2.7 || >=3.0.0"
   },
   "peerDependenciesMeta": {
     "@vue/composition-api": {